diff --git a/apps/docs/components/Navigation/NavigationMenu/NavigationMenu.constants.ts b/apps/docs/components/Navigation/NavigationMenu/NavigationMenu.constants.ts index 2afa1d2bf3536..60f771da0bb8d 100644 --- a/apps/docs/components/Navigation/NavigationMenu/NavigationMenu.constants.ts +++ b/apps/docs/components/Navigation/NavigationMenu/NavigationMenu.constants.ts @@ -3123,28 +3123,28 @@ export const self_hosting: NavMenuConstant = { name: 'Add Reverse Proxy with HTTPS', url: '/guides/self-hosting/self-hosted-proxy-https', }, + { name: 'Upgrade to Postgres 17', url: '/guides/self-hosting/postgres-upgrade-17' }, + { name: 'Remove superuser access', url: '/guides/self-hosting/remove-superuser-access' }, { name: 'Update your deployment', url: '/guides/self-hosting/updating' }, { name: 'How-to Guides', items: [ - { name: 'Upgrade to Postgres 17', url: '/guides/self-hosting/postgres-upgrade-17' }, - { name: 'Remove superuser access', url: '/guides/self-hosting/remove-superuser-access' }, { name: 'Run Self-Hosted Functions', url: '/guides/self-hosting/self-hosted-functions' }, { name: 'Configure S3 Storage', url: '/guides/self-hosting/self-hosted-s3' }, - { name: 'Add Custom Email Templates', url: '/guides/self-hosting/custom-email-templates' }, + { name: 'Enable MCP server', url: '/guides/self-hosting/enable-mcp' }, { name: 'Configure Social Login (OAuth)', url: '/guides/self-hosting/self-hosted-oauth' }, { name: 'Configure Phone Login & MFA', url: '/guides/self-hosting/self-hosted-phone-mfa' }, + { name: 'Add Custom Email Templates', url: '/guides/self-hosting/custom-email-templates' }, { name: 'Configure SAML 2.0 SSO', url: '/guides/self-hosting/self-hosted-saml-sso' }, - { name: 'Enable MCP server', url: '/guides/self-hosting/enable-mcp' }, - { - name: 'Build Custom Extensions', - url: '/guides/self-hosting/custom-postgres-extensions', - }, { name: 'Restore Project from Platform', url: '/guides/self-hosting/restore-from-platform', }, { name: 'Copy Storage from Platform', url: '/guides/self-hosting/copy-from-platform-s3' }, + { + name: 'Build Custom Extensions', + url: '/guides/self-hosting/custom-postgres-extensions', + }, ], }, { diff --git a/apps/kb/package.json b/apps/kb/package.json index 109857da3d7f4..4e440f7e8bbe1 100644 --- a/apps/kb/package.json +++ b/apps/kb/package.json @@ -14,6 +14,7 @@ "dependencies": { "@astrojs/react": "^6.0.4", "astro": "^7.2.6", + "lucide-react": "*", "react": "catalog:", "react-dom": "catalog:", "ui": "workspace:*" diff --git a/apps/kb/src/components/Nav.tsx b/apps/kb/src/components/Nav.tsx index 268a5953a1e87..d28f765a059c4 100644 --- a/apps/kb/src/components/Nav.tsx +++ b/apps/kb/src/components/Nav.tsx @@ -30,7 +30,7 @@ const menus = [ ] const triggerClass = - 'h-(--header-height) p-2 border-transparent font-normal rounded-none text-foreground-light hover:text-foreground data-open:text-foreground! border-0 focus-ring focus-visible:text-foreground h-full focus-visible:rounded-sm shadow-none!' + 'h-(--header-height) p-2 bg-transparent border-transparent font-normal rounded-none text-foreground-light hover:text-foreground data-open:text-foreground! border-0 focus-ring focus-visible:text-foreground h-full focus-visible:rounded-sm shadow-none!' // docs gates this at `md:absolute` (its own base component class) because its // nav is hidden entirely below `lg` in favor of a separate mobile menu. kb // doesn't have that split — the nav is always visible — so `absolute` is diff --git a/apps/kb/src/content.config.ts b/apps/kb/src/content.config.ts new file mode 100644 index 0000000000000..92612a16b7949 --- /dev/null +++ b/apps/kb/src/content.config.ts @@ -0,0 +1,18 @@ +import { defineCollection } from 'astro:content' +import { glob } from 'astro/loaders' +import { z } from 'astro/zod' + +// Every entry here is rendered through GuideLayout by +// src/pages/guides/[...slug].astro — dropping a new file in +// src/content/guides doesn't need any per-file layout wiring. +const guides = defineCollection({ + loader: glob({ pattern: '**/*.md', base: './src/content/guides' }), + schema: z.object({ + title: z.string(), + description: z.string().optional(), + topics: z.array(z.string()).optional(), + github_url: z.string().optional(), + }), +}) + +export const collections = { guides } diff --git a/apps/kb/src/content/guides/sample-guide.md b/apps/kb/src/content/guides/sample-guide.md new file mode 100644 index 0000000000000..6a69b4987bc2c --- /dev/null +++ b/apps/kb/src/content/guides/sample-guide.md @@ -0,0 +1,81 @@ +--- +title: 'Markdown elements sample' +description: 'A lorem ipsum sample guide exercising every base Markdown element supported by the guide layout.' +topics: ['example', 'markdown'] +github_url: 'https://github.com/supabase/supabase/discussions/0000000' +--- + +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor +incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis +nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. + +## Heading level 2 + +Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore +eu fugiat nulla pariatur. This paragraph mixes **bold text**, _italic text_, +**_bold italic text_**, ~~strikethrough text~~, and `inline code`. + +### Heading level 3 + +Here's a [link to the Astro docs](https://docs.astro.build/en/basics/layouts/), +followed by an unordered list with a nested list: + +- Excepteur sint occaecat cupidatat non proident +- Sunt in culpa qui officia deserunt mollit anim id est laborum + - Nested item one + - Nested item two +- Curabitur blandit tempus porttitor + +#### Heading level 4 + +And an ordered list with a nested list: + +1. Lorem ipsum dolor sit amet +2. Consectetur adipiscing elit + 1. Nested step one + 2. Nested step two +3. Sed do eiusmod tempor incididunt + +##### Heading level 5 + +> Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, +> consectetur, adipisci velit. +> +> > Nested blockquote: at vero eos et accusamus et iusto odio dignissimos. + +###### Heading level 6 + +A fenced code block with a language tag: + +```js +function add(a, b) { + return a + b +} + +console.log(add(2, 3)) +``` + +And another in a different language: + +```bash +npm install +npm run dev +``` + +A table: + +| Element | Supported | Notes | +| -------- | --------- | ---------------------------- | +| Headings | Yes | h2 through h6 | +| Tables | Yes | via GitHub-flavored Markdown | +| Images | Yes | see below | + +An image: + +![Placeholder image](https://placehold.co/800x400?text=Placeholder+Image) + +--- + +Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium +doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore +veritatis et quasi architecto beatae vitae dicta sunt explicabo. diff --git a/apps/kb/src/layouts/GuideLayout.astro b/apps/kb/src/layouts/GuideLayout.astro new file mode 100644 index 0000000000000..49b82d04b1cf3 --- /dev/null +++ b/apps/kb/src/layouts/GuideLayout.astro @@ -0,0 +1,39 @@ +--- +import { Github } from 'lucide-react' +import { Badge } from 'ui' + +import Layout from './Layout.astro' + +interface Props { + title: string + description?: string + topics?: string[] + github_url?: string +} + +const { title, description, topics = [], github_url } = Astro.props +--- + + +
+

{title}

+ {description &&

{description}

} + { + topics.length > 0 && ( +
+ {topics.map((topic) => {topic})} +
+ ) + } + + { + github_url && ( +

+ + Go to the GitHub discussion + +

+ ) + } +
+
diff --git a/apps/kb/src/layouts/Layout.astro b/apps/kb/src/layouts/Layout.astro index fc04f9e14e599..b49bd21652003 100644 --- a/apps/kb/src/layouts/Layout.astro +++ b/apps/kb/src/layouts/Layout.astro @@ -1,6 +1,13 @@ --- import { Header } from '../components/Header' import '../styles/globals.css' + +interface Props { + title: string + description?: string +} + +const { title, description } = Astro.props --- @@ -9,6 +16,7 @@ import '../styles/globals.css' + {description && }