e19af9af52
Refactored content fetching in the docs and blog pages to use a new 'getDocs' function to improve code reuse. Made minor adjustments to the UI in 'makerkit/page.tsx'. This involved modifying the layout and adding conditionals to tackle optional props. Also added a new textarea component reference in the UI package.
55 lines
1.3 KiB
TypeScript
55 lines
1.3 KiB
TypeScript
import { Cms, createCmsClient } from '@kit/cms';
|
|
|
|
import { DocsNavigation } from '~/(marketing)/docs/_components/docs-navigation';
|
|
import { getDocs } from '~/(marketing)/docs/_lib/server/docs.loader';
|
|
import { createI18nServerInstance } from '~/lib/i18n/i18n.server';
|
|
|
|
async function DocsLayout({ children }: React.PropsWithChildren) {
|
|
const { resolvedLanguage } = await createI18nServerInstance();
|
|
const pages = await getDocs(resolvedLanguage);
|
|
|
|
return (
|
|
<div className={'flex'}>
|
|
<DocsNavigation pages={buildDocumentationTree(pages)} />
|
|
|
|
{children}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default DocsLayout;
|
|
|
|
// we want to place all the children under their parent
|
|
// based on the property parentId
|
|
function buildDocumentationTree(pages: Cms.ContentItem[]) {
|
|
const tree: Cms.ContentItem[] = [];
|
|
const map: Record<string, Cms.ContentItem> = {};
|
|
|
|
pages.forEach((page) => {
|
|
map[page.id] = page;
|
|
});
|
|
|
|
pages.forEach((page) => {
|
|
if (page.parentId) {
|
|
const parent = map[page.parentId];
|
|
|
|
if (!parent) {
|
|
return;
|
|
}
|
|
|
|
if (!parent.children) {
|
|
parent.children = [];
|
|
}
|
|
|
|
parent.children.push(page);
|
|
|
|
// sort children by order
|
|
parent.children.sort((a, b) => a.order - b.order);
|
|
} else {
|
|
tree.push(page);
|
|
}
|
|
});
|
|
|
|
return tree.sort((a, b) => a.order - b.order);
|
|
}
|