* feat: add changelog feature and update site navigation - Introduced a new Changelog page with pagination and detailed entry views. - Added components for displaying changelog entries, pagination, and entry details. - Updated site navigation to include a link to the new Changelog page. - Enhanced localization for changelog-related texts in marketing.json. * refactor: enhance Changelog page layout and entry display - Increased the number of changelog entries displayed per page from 2 to 20 for better visibility. - Improved the layout of the Changelog page by adjusting the container styles and removing unnecessary divs. - Updated the ChangelogEntry component to enhance the visual presentation of entries, including a new date badge with an icon. - Refined the CSS styles for Markdoc headings to improve typography and spacing. * refactor: enhance Changelog page functionality and layout - Increased the number of changelog entries displayed per page from 20 to 50 for improved user experience. - Updated ChangelogEntry component to make the highlight prop optional and refined the layout for better visual clarity. - Adjusted styles in ChangelogHeader and ChangelogPagination components for a more cohesive design. - Removed unnecessary order fields from changelog markdown files to streamline content management. * feat: enhance Changelog entry navigation and data loading - Refactored ChangelogEntry page to load previous and next entries for improved navigation. - Introduced ChangelogNavigation component to facilitate navigation between changelog entries. - Updated ChangelogDetail component to display navigation links and entry details. - Enhanced data fetching logic to retrieve all changelog entries alongside the current entry. - Added localization keys for navigation text in marketing.json. * Update package dependencies and enhance documentation layout - Upgraded various packages including @turbo/gen and turbo to version 2.6.0, and react-hook-form to version 7.66.0. - Updated lucide-react to version 0.552.0 across multiple packages. - Refactored documentation layout components for improved styling and structure. - Removed deprecated loading components and adjusted navigation elements for better user experience. - Added placeholder notes in changelog entries for clarity.
182 lines
5.1 KiB
TypeScript
182 lines
5.1 KiB
TypeScript
import { collection, config, fields } from '@keystatic/core';
|
|
import { Entry } from '@keystatic/core/reader';
|
|
|
|
import { KeystaticStorage } from './keystatic-storage';
|
|
|
|
export const keyStaticConfig = createKeyStaticConfig(
|
|
process.env.NEXT_PUBLIC_KEYSTATIC_CONTENT_PATH ?? '',
|
|
);
|
|
|
|
function getContentField() {
|
|
return fields.markdoc({
|
|
label: 'Content',
|
|
options: {
|
|
link: true,
|
|
blockquote: true,
|
|
bold: true,
|
|
divider: true,
|
|
orderedList: true,
|
|
unorderedList: true,
|
|
strikethrough: true,
|
|
heading: true,
|
|
code: true,
|
|
italic: true,
|
|
image: {
|
|
directory: 'public/site/images',
|
|
publicPath: '/site/images',
|
|
schema: {
|
|
title: fields.text({
|
|
label: 'Caption',
|
|
description: 'The text to display under the image in a caption.',
|
|
}),
|
|
},
|
|
},
|
|
},
|
|
});
|
|
}
|
|
|
|
export type PostEntryProps = Entry<
|
|
(typeof keyStaticConfig)['collections']['posts']
|
|
>;
|
|
|
|
export type DocumentationEntryProps = Entry<
|
|
(typeof keyStaticConfig)['collections']['documentation']
|
|
>;
|
|
|
|
export type ChangelogEntryProps = Entry<
|
|
(typeof keyStaticConfig)['collections']['changelog']
|
|
>;
|
|
|
|
function createKeyStaticConfig(path = '') {
|
|
if (path && !path.endsWith('/')) {
|
|
path += '/';
|
|
}
|
|
|
|
const cloud = {
|
|
project: KeystaticStorage.kind === 'cloud' ? KeystaticStorage.project : '',
|
|
};
|
|
|
|
const collections = getKeystaticCollections(path);
|
|
|
|
return config({
|
|
storage: KeystaticStorage,
|
|
cloud,
|
|
collections,
|
|
});
|
|
}
|
|
|
|
function getKeystaticCollections(path: string) {
|
|
const statusOptions = [
|
|
{ label: 'Draft', value: 'draft' },
|
|
{ label: 'Published', value: 'published' },
|
|
{ label: 'Review', value: 'review' },
|
|
{ label: 'Pending', value: 'pending' },
|
|
];
|
|
|
|
const imageField = fields.image({
|
|
label: 'Image',
|
|
directory: 'public/site/images',
|
|
publicPath: '/site/images',
|
|
});
|
|
|
|
return {
|
|
posts: collection({
|
|
label: 'Posts',
|
|
slugField: 'title',
|
|
path: `${path}posts/*`,
|
|
format: { contentField: 'content' },
|
|
schema: {
|
|
title: fields.slug({ name: { label: 'Title' } }),
|
|
label: fields.text({
|
|
label: 'Label',
|
|
validation: { isRequired: false },
|
|
}),
|
|
image: imageField,
|
|
categories: fields.array(fields.text({ label: 'Category' })),
|
|
tags: fields.array(fields.text({ label: 'Tag' })),
|
|
description: fields.text({ label: 'Description' }),
|
|
publishedAt: fields.date({ label: 'Published At' }),
|
|
parent: fields.relationship({
|
|
label: 'Parent',
|
|
collection: 'posts',
|
|
}),
|
|
language: fields.text({ label: 'Language' }),
|
|
order: fields.number({ label: 'Order' }),
|
|
content: getContentField(),
|
|
status: fields.select({
|
|
defaultValue: 'draft',
|
|
label: 'Status',
|
|
options: statusOptions,
|
|
}),
|
|
},
|
|
}),
|
|
documentation: collection({
|
|
label: 'Documentation',
|
|
slugField: 'title',
|
|
path: `${path}documentation/**`,
|
|
format: { contentField: 'content' },
|
|
schema: {
|
|
title: fields.slug({ name: { label: 'Title' } }),
|
|
label: fields.text({
|
|
label: 'Label',
|
|
validation: { isRequired: false },
|
|
}),
|
|
content: getContentField(),
|
|
image: imageField,
|
|
description: fields.text({ label: 'Description' }),
|
|
publishedAt: fields.date({ label: 'Published At' }),
|
|
order: fields.number({ label: 'Order' }),
|
|
language: fields.text({ label: 'Language' }),
|
|
parent: fields.relationship({
|
|
label: 'Parent',
|
|
collection: 'documentation',
|
|
}),
|
|
categories: fields.array(fields.text({ label: 'Category' })),
|
|
tags: fields.array(fields.text({ label: 'Tag' })),
|
|
status: fields.select({
|
|
defaultValue: 'draft',
|
|
label: 'Status',
|
|
options: statusOptions,
|
|
}),
|
|
collapsible: fields.checkbox({
|
|
label: 'Collapsible',
|
|
defaultValue: false,
|
|
}),
|
|
collapsed: fields.checkbox({
|
|
label: 'Collapsed',
|
|
defaultValue: false,
|
|
}),
|
|
},
|
|
}),
|
|
changelog: collection({
|
|
label: 'Changelog',
|
|
slugField: 'title',
|
|
path: `${path}changelog/*`,
|
|
format: { contentField: 'content' },
|
|
schema: {
|
|
title: fields.slug({ name: { label: 'Title' } }),
|
|
description: fields.text({
|
|
label: 'Description',
|
|
multiline: true,
|
|
}),
|
|
image: imageField,
|
|
categories: fields.array(fields.text({ label: 'Category' })),
|
|
tags: fields.array(fields.text({ label: 'Tag' })),
|
|
publishedAt: fields.date({ label: 'Published At' }),
|
|
parent: fields.relationship({
|
|
label: 'Parent',
|
|
collection: 'changelog',
|
|
}),
|
|
language: fields.text({ label: 'Language' }),
|
|
order: fields.number({ label: 'Order' }),
|
|
content: getContentField(),
|
|
status: fields.select({
|
|
defaultValue: 'draft',
|
|
label: 'Status',
|
|
options: statusOptions,
|
|
}),
|
|
},
|
|
}),
|
|
};
|
|
}
|