8329b1da89
This PR changes the paths that we use for uncategorised pages on the docs site. It also redirects the old paths to the new ones. ``` // BEFORE tldraw.dev/docs/ucg/shapes // AFTER tldraw.dev/docs/shapes ``` I think that this is more intuitive, and will make the links that we share a bit clearer. eg: As a by-product, it fixes some broken links from the introduction page. As a trade-off, this PR makes our pathing system a bit more complicated. But I don't think it's tooooo bad? WDYT? ### Change Type - [x] `documentation` — Changes to the documentation only[^2] [^1]: publishes a `patch` release, for devDependencies use `internal` [^2]: will not publish a new version ### Test Plan 1. Navigate to `/docs/shapes` on the docs site. 2. Make sure that it goes to the Shapes page. 3. Do the same for `/docs/ucg/shapes` ### Release Notes - Documentation: Cleaned up some paths.
97 lines
2.7 KiB
TypeScript
97 lines
2.7 KiB
TypeScript
import { ArticleDetails } from '@/components/ArticleDetails'
|
|
import { ArticleNavLinks } from '@/components/ArticleNavLinks'
|
|
import { Breadcrumb } from '@/components/Breadcrumb'
|
|
import { Mdx } from '@/components/Mdx'
|
|
import { MetaHead } from '@/components/MetaHead'
|
|
import { Sidebar } from '@/components/Sidebar'
|
|
import { Article, ArticleLinks, Category, Section, SidebarContentList } from '@/types/content-types'
|
|
import {
|
|
getArticle,
|
|
getArticleSource,
|
|
getCategory,
|
|
getLinks,
|
|
getSection,
|
|
getSections,
|
|
} from '@/utils/content'
|
|
import { getSidebarContentList } from '@/utils/getSidebarContentList'
|
|
import { GetStaticPaths, GetStaticProps } from 'next'
|
|
import { MDXRemoteSerializeResult } from 'next-mdx-remote'
|
|
import { useTheme } from 'next-themes'
|
|
|
|
export type ArticleProps = {
|
|
type: 'article'
|
|
sidebar: SidebarContentList
|
|
section: Section
|
|
category: Category
|
|
article: Article
|
|
links: ArticleLinks
|
|
mdxSource: MDXRemoteSerializeResult
|
|
}
|
|
|
|
export default function ArticlePage({
|
|
mdxSource,
|
|
section,
|
|
category,
|
|
article,
|
|
links,
|
|
sidebar,
|
|
}: ArticleProps) {
|
|
const theme = useTheme()
|
|
return (
|
|
<>
|
|
<MetaHead title={article.title} description={article.description} hero={article.hero} />
|
|
<div className="layout">
|
|
<Sidebar {...sidebar} />
|
|
<main className={`article ${theme.theme ?? 'light'}`}>
|
|
<Breadcrumb section={section} category={category} />
|
|
<h1>{article.title}</h1>
|
|
<Mdx mdxSource={mdxSource} />
|
|
<ArticleDetails article={article} />
|
|
<ArticleNavLinks links={links} />
|
|
</main>
|
|
</div>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export const getStaticPaths: GetStaticPaths = async () => {
|
|
const sections = await getSections()
|
|
const paths: { params: { sectionId: string; childId: string; articleId: string } }[] = []
|
|
|
|
for (const section of sections) {
|
|
for (const category of section.categories) {
|
|
if (category.id === 'ucg') continue
|
|
for (const articleId of category.articleIds) {
|
|
paths.push({ params: { sectionId: section.id, childId: category.id, articleId } })
|
|
}
|
|
}
|
|
}
|
|
|
|
return { paths, fallback: false }
|
|
}
|
|
|
|
export const getStaticProps: GetStaticProps<ArticleProps> = async (ctx) => {
|
|
const sectionId = ctx.params?.sectionId?.toString() as string
|
|
const categoryId = ctx.params?.childId?.toString() as string
|
|
const articleId = ctx.params?.articleId?.toString()
|
|
if (!articleId) throw Error()
|
|
|
|
const sidebar = await getSidebarContentList({ sectionId, categoryId, articleId })
|
|
const section = await getSection(sectionId)
|
|
const category = await getCategory(sectionId, categoryId)
|
|
const article = await getArticle(articleId)
|
|
const links = await getLinks(articleId)
|
|
const mdxSource = await getArticleSource(articleId)
|
|
|
|
return {
|
|
props: {
|
|
type: 'article',
|
|
article,
|
|
section,
|
|
category,
|
|
sidebar,
|
|
links,
|
|
mdxSource,
|
|
},
|
|
}
|
|
}
|