diff --git a/.npmrc b/.npmrc index 4c48531..ec3ec6d 100644 --- a/.npmrc +++ b/.npmrc @@ -1,2 +1,3 @@ strict-peer-dependencies=false -enable-pre-post-scripts=true \ No newline at end of file +enable-pre-post-scripts=true +auto-install-peers=true \ No newline at end of file diff --git a/apps/web/.gitignore b/apps/web/.gitignore index fd3dbb5..7319c1a 100644 --- a/apps/web/.gitignore +++ b/apps/web/.gitignore @@ -11,6 +11,7 @@ # next.js /.next/ +.contentlayer /out/ # production diff --git a/apps/web/app/(docs)/docs/[[...slug]]/page.tsx b/apps/web/app/(docs)/docs/[[...slug]]/page.tsx new file mode 100644 index 0000000..857e9d2 --- /dev/null +++ b/apps/web/app/(docs)/docs/[[...slug]]/page.tsx @@ -0,0 +1,100 @@ +import type { Metadata } from 'next' +import { notFound } from 'next/navigation' +import { allDocs } from 'contentlayer/generated' +import { getTableOfContents } from '@/lib/toc' +import { Mdx } from '@/components/mdx-components' +import { DocsPageHeader } from '@/components/page-header' +import { DocsPager } from '@/components/pager' +import { DashboardTableOfContents } from '@/components/toc' + +import '@/app/mdx.css' + +interface DocPageProps { + params: { + slug: string[] + } +} + +// eslint-disable-next-line ts/ban-ts-comment +// @ts-expect-error +async function getDocFromParams(params) { + const slug = params.slug?.join('/') || '' + const doc = allDocs.find((doc: { slugAsParams: any }) => doc.slugAsParams === slug) + + if (!doc) + return null + + return doc +} + +export async function generateMetadata({ + params, +}: DocPageProps): Promise { + const doc = await getDocFromParams(params) + + if (!doc) + return {} + + const url = 'https://openui-dd0.pages.dev/docs' + + const ogUrl = new URL(`${url}/api/og`) + ogUrl.searchParams.set('heading', doc.description ?? doc.title) + ogUrl.searchParams.set('type', 'Documentation') + ogUrl.searchParams.set('mode', 'dark') + + return { + title: doc.title, + description: doc.description, + openGraph: { + title: doc.title, + description: doc.description, + type: 'article', + url: doc.slug, + images: [ + { + url: ogUrl.toString(), + width: 1200, + height: 630, + alt: doc.title, + }, + ], + }, + twitter: { + card: 'summary_large_image', + title: doc.title, + description: doc.description, + images: [ogUrl.toString()], + }, + } +} + +export async function generateStaticParams(): Promise { + return allDocs.map((doc: { slugAsParams: string }) => ({ + slug: doc.slugAsParams.split('/'), + })) +} + +export default async function DocPage({ params }: DocPageProps) { + const doc = await getDocFromParams(params) + + if (!doc) + notFound() + + const toc = await getTableOfContents(doc.body.raw) + + return ( +
+
+ + +
+ +
+
+
+ +
+
+
+ ) +} diff --git a/apps/web/app/(docs)/docs/layout.tsx b/apps/web/app/(docs)/docs/layout.tsx new file mode 100644 index 0000000..ef519e4 --- /dev/null +++ b/apps/web/app/(docs)/docs/layout.tsx @@ -0,0 +1,17 @@ +import { DocsSidebarNav } from '@/components/sidebar-nav' +import { docsConfig } from '@/constants/docs' + +interface DocsLayoutProps { + children: React.ReactNode +} + +export default function DocsLayout({ children }: DocsLayoutProps) { + return ( +
+ + {children} +
+ ) +} diff --git a/apps/web/app/(docs)/layout.tsx b/apps/web/app/(docs)/layout.tsx new file mode 100644 index 0000000..efc583c --- /dev/null +++ b/apps/web/app/(docs)/layout.tsx @@ -0,0 +1,41 @@ +import Link from 'next/link' +import { DocsSearch } from '@/components/docs-search' +import { MainNav } from '@/components/main-nav' +import { DocsSidebarNav } from '@/components/sidebar-nav' +import { docsConfig } from '@/constants/docs' +import { SiteFooter } from '@/components/docs-footer' + +interface DocsLayoutProps { + children: React.ReactNode +} + +export default function DocsLayout({ children }: DocsLayoutProps) { + return ( +
+
+
+ + + +
+
+ +
+ +
+
+
+
{children}
+ +
+ ) +} diff --git a/apps/web/app/blog/page.tsx b/apps/web/app/blog/page.tsx new file mode 100644 index 0000000..b142bda --- /dev/null +++ b/apps/web/app/blog/page.tsx @@ -0,0 +1,7 @@ +export default function BlogPage() { + return ( +
+

Blog

+
+ ) +} diff --git a/apps/web/app/layout.tsx b/apps/web/app/layout.tsx index d8e913a..ad68570 100644 --- a/apps/web/app/layout.tsx +++ b/apps/web/app/layout.tsx @@ -1,7 +1,5 @@ import type { Metadata } from 'next' import './globals.css' -import Menu from '@/components/menu' -import Footer from '@/components/footer' export const metadata: Metadata = { title: 'Open UI', @@ -16,9 +14,9 @@ export default function RootLayout({ return ( - + {children} -