feat: Support config.json file

apps/docs/features/docs/GuidesMdx.template.tsx

@@ -1,4 +1,4 @@
-import { ExternalLink } from 'lucide-react'
+import { ExternalLink, Github } from 'lucide-react'
 import { type ReactNode } from 'react'
 import ReactMarkdown from 'react-markdown'
 
@@ -62,7 +62,7 @@ type GuideTemplateProps =
 
 const GuideTemplate = ({ meta, content, children, editLink, mdxOptions }: GuideTemplateProps) => {
   const hideToc = meta?.hideToc || meta?.hide_table_of_contents
-
+  console.log('GuideMDX.template.tsx', meta)
   return (
     <TocAnchorsProvider>
       <div className={'grid grid-cols-12 relative gap-4'}>
@@ -83,10 +83,24 @@ const GuideTemplate = ({ meta, content, children, editLink, mdxOptions }: GuideT
             <h1 className="mb-0 [&>p]:m-0">
               <ReactMarkdown>{meta?.title || 'Supabase Docs'}</ReactMarkdown>
             </h1>
+            {meta?.referenceLink && (
+              <div className="text-base font-mono text-foreground-light flex items-center gap-2">
+                {meta.referenceLinkLabel}
+                <a
+                  target="_blank"
+                  rel="noreferrer noopener"
+                  className="hover:text-brand-link focus-visible:text-brand-link transition-colors"
+                  href={meta.referenceLink}
+                >
+                  <span className="sr-only">View on GitHub</span>
+                  <Github size={18} />
+                </a>
+              </div>
+            )}
             {meta?.subtitle && (
-              <h2 className="mt-3 text-xl text-foreground-light">
+              <div className="mt-3 text-base text-foreground-light">
                 <ReactMarkdown>{meta.subtitle}</ReactMarkdown>
-              </h2>
+              </div>
             )}
             <hr className="not-prose border-t-0 border-b my-8" />
 

apps/docs/features/ui/guide/GuideHeader.tsx

@@ -9,16 +9,15 @@ interface GuideHeaderProps {
 
 export function GuideHeader({ className }: GuideHeaderProps) {
   const { meta } = useGuide()
-
   return (
     <div className={className}>
       <h1 className="mb-0 [&>p]:m-0">
         <ReactMarkdown>{meta?.title || 'Supabase Docs'}</ReactMarkdown>
       </h1>
       {meta?.subtitle && (
-        <h2 className="mt-3 text-xl text-foreground-light">
+        <p className="mt-3 text-base text-foreground-light">
           <ReactMarkdown>{meta.subtitle}</ReactMarkdown>
-        </h2>
+        </p>
       )}
       <hr className="not-prose border-t-0 border-b my-8" />
     </div>

apps/docs/lib/docs.ts

@@ -29,6 +29,8 @@ export type GuideFrontmatter = {
   /** @deprecated */
   hide_table_of_contents?: boolean
   tocVideo?: string
+  referenceLink?: string
+  referenceLinkLabel?: string
 }
 
 /**

apps/docs/scripts/generate-tsdoc-mdx.ts

@@ -1,10 +1,18 @@
-import { mkdirSync, writeFileSync } from 'fs'
+import { mkdirSync, readFileSync, writeFileSync } from 'fs'
 import { join, dirname, resolve } from 'path'
 import { fileURLToPath } from 'url'
 import { processSpec } from './process-tsdoc.js'
 
 const __dirname = dirname(fileURLToPath(import.meta.url))
 
+const CONFIG_PATH = join(__dirname, '../spec/enrichments/tsdoc_v2/config.json')
+const config: {
+  title?: string
+  subtitle?: string
+  referenceLink?: string
+  referenceLinkLabel?: string
+} = JSON.parse(readFileSync(CONFIG_PATH, 'utf-8'))
+
 function escapeMdxProse(text: string): string {
   // Escape { and } outside code blocks/spans so MDX doesn't treat them as JSX.
   // Match fenced code blocks first (```...```), then inline code (`...`), leave both untouched.
@@ -79,7 +87,18 @@ function generateExamplesBlock(examples: any[]): string[] {
 }
 
 function generateMdx(categories: ReturnType<typeof processSpec>): string {
-  const lines: string[] = ['---', 'title: JavaScript Client library', '---', '', '']
+  const fmVal = (v: string) => `"${v.replace(/"/g, '\\"')}"`
+  const frontmatter = [
+    '---',
+    `title: ${fmVal(config.title ?? 'Reference')}`,
+    ...(config.subtitle ? [`subtitle: ${fmVal(config.subtitle)}`] : []),
+    ...(config.referenceLink ? [`referenceLink: ${fmVal(config.referenceLink)}`] : []),
+    ...(config.referenceLinkLabel ? [`referenceLinkLabel: ${fmVal(config.referenceLinkLabel)}`] : []),
+    '---',
+    '',
+    '',
+  ]
+  const lines: string[] = frontmatter
 
   for (let i = 0; i < categories.length; i++) {
     const { category, definitions } = categories[i]

apps/docs/scripts/process-tsdoc.ts

@@ -216,6 +216,17 @@ const SOURCE_FILES = [
 
 export function processSpec() {
   const specDir = join(__dirname, '../spec/enrichments/tsdoc_v2')
+
+  const config: { ignoreDefinitions?: string[]; categoryOrder?: string[] } = (() => {
+    try {
+      return JSON.parse(readFileSync(join(specDir, 'config.json'), 'utf-8'))
+    } catch {
+      return {}
+    }
+  })()
+  const ignoredNames = new Set(config.ignoreDefinitions ?? [])
+  const categoryOrder = config.categoryOrder ?? []
+
   const roots = SOURCE_FILES.map((f) => JSON.parse(readFileSync(join(specDir, f), 'utf-8')))
 
   // Build a per-file targetMap so IDs from different packages don't collide
@@ -239,6 +250,8 @@ export function processSpec() {
     const remarkTags = blockTags.filter((t) => t.tag === '@remarks')
     const examples = parseExamples(blockTags)
 
+    if (ignoredNames.has(decl.name)) continue
+
     const definition: any = {
       name: decl.name,
       description: contentToMd(decl.comment?.summary ?? []),
@@ -253,10 +266,20 @@ export function processSpec() {
     categoryMap.get(category)!.push(definition)
   }
 
-  const result = Array.from(categoryMap.entries()).map(([category, definitions]) => ({
-    category,
-    definitions,
-  }))
+  const result = Array.from(categoryMap.entries())
+    .map(([category, definitions]) => ({ category, definitions }))
+    .sort((a, b) => {
+      const ai = categoryOrder.indexOf(a.category)
+      const bi = categoryOrder.indexOf(b.category)
+      // Both in order list: sort by position
+      if (ai !== -1 && bi !== -1) return ai - bi
+      // Only a is in list: a goes first
+      if (ai !== -1) return -1
+      // Only b is in list: b goes first
+      if (bi !== -1) return 1
+      // Neither in list: preserve insertion order
+      return 0
+    })
 
   console.log(result)
 

apps/docs/spec/enrichments/tsdoc_v2/config.json

@@ -0,0 +1,16 @@
+{
+    "title":"JavaScript Client library",
+"subtitle": "Use the `supabase-js` package to interact with your Postgres database, listen to database changes, invoke Deno Edge Functions, build login and user management functionality, and manage large files.",
+"referenceLink": "https://github.com/supabase/supabase-js",
+"referenceLinkLabel": "@supabase/supabase-js",
+    "versions": [
+        "v1",
+        "v2"
+    ],
+    "isLatestVersion": true,
+    "version": "v2",
+    "ignoreDefinitions": [
+        "constructor"
+    ],
+    "categoryOrder": [ "Initializing", "Database", "Auth", "Functions", "Realtime", "Storage" ]
+}