Fix the remaining issues.

apps/ui-library/__registry__/index.tsx

@@ -406,7 +406,7 @@ export const Index: Record<string, any> = {
     "platform-kit-nextjs": {
       name: "platform-kit-nextjs",
       type: "registry:block",
-      registryDependencies: ["alert","badge","button","card","chart","command","dialog","drawer","form","hover-card","input","label","popover","select","skeleton","switch","table","toggle","toggle-group","tooltip"],
+      registryDependencies: ["alert","badge","button","card","chart","command","dialog","drawer","input","form","hover-card","label","popover","select","skeleton","switch","table","toggle-group","toggle","tooltip","use-mobile"],
       component: React.lazy(() => import("@/registry/default/platform/platform-kit-nextjs/components/dynamic-form.tsx")),
       source: "",
       files: ["registry/default/platform/platform-kit-nextjs/app/api/ai/sql/route.ts","registry/default/platform/platform-kit-nextjs/app/api/supabase-proxy/[...path]/route.ts","registry/default/platform/platform-kit-nextjs/components/dynamic-form.tsx","registry/default/platform/platform-kit-nextjs/components/logo-supabase.tsx","registry/default/platform/platform-kit-nextjs/components/results-table.tsx","registry/default/platform/platform-kit-nextjs/components/sql-editor.tsx","registry/default/platform/platform-kit-nextjs/components/supabase-manager/auth.tsx","registry/default/platform/platform-kit-nextjs/components/supabase-manager/database.tsx","registry/default/platform/platform-kit-nextjs/components/supabase-manager/index.tsx","registry/default/platform/platform-kit-nextjs/components/supabase-manager/logs.tsx","registry/default/platform/platform-kit-nextjs/components/supabase-manager/secrets.tsx","registry/default/platform/platform-kit-nextjs/components/supabase-manager/storage.tsx","registry/default/platform/platform-kit-nextjs/components/supabase-manager/suggestions.tsx","registry/default/platform/platform-kit-nextjs/components/supabase-manager/users.tsx","registry/default/platform/platform-kit-nextjs/components/users-growth-chart.tsx","registry/default/platform/platform-kit-nextjs/hooks/use-auth.ts","registry/default/platform/platform-kit-nextjs/hooks/use-logs.ts","registry/default/platform/platform-kit-nextjs/hooks/use-run-query.ts","registry/default/platform/platform-kit-nextjs/hooks/use-secrets.ts","registry/default/platform/platform-kit-nextjs/hooks/use-storage.ts","registry/default/platform/platform-kit-nextjs/hooks/use-suggestions.ts","registry/default/platform/platform-kit-nextjs/hooks/use-tables.ts","registry/default/platform/platform-kit-nextjs/hooks/use-user-counts.ts","registry/default/platform/platform-kit-nextjs/lib/logs.ts","registry/default/platform/platform-kit-nextjs/lib/management-api-schema.d.ts","registry/default/platform/platform-kit-nextjs/lib/management-api.ts","registry/default/platform/platform-kit-nextjs/lib/pg-meta/sql.ts","registry/default/platform/platform-kit-nextjs/lib/pg-meta/index.ts","registry/default/platform/platform-kit-nextjs/lib/pg-meta/types.ts","registry/default/platform/platform-kit-nextjs/lib/schemas/auth.ts","registry/default/platform/platform-kit-nextjs/lib/schemas/secrets.ts","registry/default/platform/platform-kit-nextjs/contexts/SheetNavigationContext.tsx"],

apps/ui-library/package.json

@@ -26,7 +26,7 @@
     "@radix-ui/react-checkbox": "*",
     "@radix-ui/react-collapsible": "*",
     "@radix-ui/react-context-menu": "*",
-    "@radix-ui/react-dialog": "^1.0.5",
+    "@radix-ui/react-dialog": "*",
     "@radix-ui/react-dropdown-menu": "*",
     "@radix-ui/react-hover-card": "*",
     "@radix-ui/react-label": "*",

apps/ui-library/public/llms.txt

@@ -31,6 +31,8 @@ Library of components for your project. The components integrate with Supabase a
     - Real-time cursor sharing for collaborative applications
 - [Social Authentication](https://supabase.com/ui/docs/nextjs/social-auth)
     - Social authentication block for Next.js
+- [Platform Kit](https://supabase.com/ui/docs/platform/platform-kit)
+    - The easiest way to build platforms on top of Supabase
 - [Supabase Client Libraries](https://supabase.com/ui/docs/react-router/client)
     - Supabase client for React Router
 - [Current User Avatar](https://supabase.com/ui/docs/react-router/current-user-avatar)

apps/ui-library/public/r/platform-kit-nextjs.json

@@ -5,19 +5,16 @@
   "title": "Platform Kit for Nextjs and Supabase",
   "description": "Platform Kit for Nextjs and Supabase",
   "dependencies": [
-    "@hookform/resolvers",
     "@monaco-editor/react",
     "@tanstack/react-query",
     "@tanstack/react-table",
     "axios",
-    "cmdk",
     "common-tags",
     "openai",
     "openapi-fetch",
-    "react-hook-form",
     "react-markdown",
-    "recharts",
-    "sonner"
+    "zod@^3",
+    "@types/common-tags"
   ],
   "registryDependencies": [
     "alert",
@@ -28,18 +25,19 @@
     "command",
     "dialog",
     "drawer",
+    "input",
     "form",
     "hover-card",
-    "input",
     "label",
     "popover",
     "select",
     "skeleton",
     "switch",
     "table",
-    "toggle",
     "toggle-group",
-    "tooltip"
+    "toggle",
+    "tooltip",
+    "use-mobile"
   ],
   "files": [
     {
@@ -71,7 +69,7 @@
     },
     {
       "path": "registry/default/platform/platform-kit-nextjs/components/sql-editor.tsx",
-      "content": "'use client'\n\nimport { useState, useEffect, useCallback, useMemo } from 'react'\nimport { Editor } from '@monaco-editor/react'\nimport { Button } from '@/registry/default/components/ui/button'\nimport { ResultsTable } from '@/registry/default/platform/platform-kit-nextjs/components/results-table'\nimport { Label } from '@/registry/default/components/ui/label'\nimport { useRunQuery } from '@/registry/default/platform/platform-kit-nextjs/hooks/use-run-query'\nimport {\n  ArrowUp,\n  Loader2,\n  BarChart as BarChartIcon,\n  Wand,\n  FileText,\n  AlertTriangle,\n} from 'lucide-react'\nimport { Input } from '@/registry/default/components/ui/input'\nimport { Skeleton } from '@/registry/default/components/ui/skeleton'\nimport { Popover, PopoverContent, PopoverTrigger } from '@/registry/default/components/ui/popover'\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from '@/registry/default/components/ui/select'\nimport { Bar, BarChart, CartesianGrid, XAxis, YAxis } from 'recharts'\nimport {\n  ChartConfig,\n  ChartContainer,\n  ChartTooltip,\n  ChartTooltipContent,\n} from '@/registry/default/components/ui/chart'\nimport { ToggleGroup, ToggleGroupItem } from '@/registry/default/components/ui/toggle-group'\nimport { Switch } from '@/registry/default/components/ui/switch'\nimport { Alert, AlertDescription, AlertTitle } from '@/registry/default/components/ui/alert'\n\ninterface SqlEditorProps {\n  projectRef: string\n  initialSql?: string\n  queryKey?: any\n  label?: string\n  onResults?: (data: any[] | undefined) => void\n  onRowClick?: (row: any, queryKey?: any) => void\n  hideSql?: boolean\n  readOnly?: boolean\n  runAutomatically?: boolean\n  refetch?: number\n  initialNaturalLanguageMode?: boolean\n  hideChartOption?: boolean\n}\n\nexport function SqlEditor({\n  projectRef,\n  initialSql,\n  queryKey,\n  onResults,\n  onRowClick,\n  label = 'Query your data',\n  hideSql = false,\n  readOnly = false,\n  runAutomatically = false,\n  refetch,\n  initialNaturalLanguageMode = false,\n  hideChartOption = false,\n}: SqlEditorProps) {\n  const [sql, setSql] = useState(initialSql || '')\n  const [isSqlVisible, setIsSqlVisible] = useState(!hideSql)\n  const [isNaturalLanguageMode, setIsNaturalLanguageMode] = useState(\n    process.env.NEXT_PUBLIC_ENABLE_AI_QUERIES === 'true' && initialNaturalLanguageMode\n  )\n  const [naturalLanguageQuery, setNaturalLanguageQuery] = useState('')\n  const { mutate: runQuery, data, isPending, error } = useRunQuery()\n  const [isGeneratingSql, setIsGeneratingSql] = useState(false)\n  const [aiError, setAiError] = useState<string | null>(null)\n  const [isChartVisible, setIsChartVisible] = useState(false)\n  const [xAxisColumn, setXAxisColumn] = useState<string | null>(null)\n  const [yAxisColumn, setYAxisColumn] = useState<string | null>(null)\n\n  const columns = useMemo(() => {\n    if (!data || data.length === 0) return []\n    return Object.keys(data[0])\n  }, [data])\n\n  useEffect(() => {\n    if (initialSql) {\n      setSql(initialSql)\n    }\n  }, [initialSql])\n\n  const handleRunNaturalLanguageQuery = async () => {\n    if (!naturalLanguageQuery) return\n\n    setIsGeneratingSql(true)\n    setAiError(null)\n    try {\n      const response = await fetch('/api/ai/sql', {\n        method: 'POST',\n        headers: {\n          'Content-Type': 'application/json',\n        },\n        body: JSON.stringify({\n          prompt: naturalLanguageQuery,\n          projectRef,\n        }),\n      })\n\n      if (!response.ok) {\n        const errorData = await response.json()\n        throw new Error(errorData.message || 'Failed to generate SQL')\n      }\n\n      const { sql: generatedSql } = await response.json()\n      setSql(generatedSql)\n      runQuery({ projectRef, query: generatedSql, readOnly: true })\n    } catch (error: any) {\n      console.error(error)\n      setAiError(error.message)\n    } finally {\n      setIsGeneratingSql(false)\n    }\n  }\n\n  const handleRunQuery = useCallback(() => {\n    if (sql) {\n      runQuery({ projectRef, query: sql, readOnly: true })\n    }\n  }, [sql, projectRef, runQuery])\n\n  useEffect(() => {\n    setIsSqlVisible(!hideSql)\n  }, [hideSql])\n\n  useEffect(() => {\n    if (runAutomatically && initialSql) {\n      runQuery({ projectRef, query: initialSql, readOnly: true })\n    }\n  }, [runAutomatically, initialSql, projectRef, runQuery])\n\n  useEffect(() => {\n    if (refetch && refetch > 0) {\n      handleRunQuery()\n    }\n  }, [refetch, handleRunQuery])\n\n  useEffect(() => {\n    if (onResults) {\n      onResults(data)\n    }\n  }, [data, onResults])\n\n  useEffect(() => {\n    const noResults = !data || (Array.isArray(data) && data.length === 0)\n    if (noResults && !isSqlVisible && !isNaturalLanguageMode && !readOnly && !isPending) {\n      setIsSqlVisible(true)\n    }\n  }, [data, isSqlVisible, isNaturalLanguageMode])\n\n  const serverErrorMessage = (error as any)?.responseLine truncated
+      "content": "'use client'\n\nimport { Alert, AlertDescription, AlertTitle } from '@/registry/default/components/ui/alert'\nimport { Button } from '@/registry/default/components/ui/button'\nimport {\n  ChartConfig,\n  ChartContainer,\n  ChartTooltip,\n  ChartTooltipContent,\n} from '@/registry/default/components/ui/chart'\nimport { Input } from '@/registry/default/components/ui/input'\nimport { Label } from '@/registry/default/components/ui/label'\nimport { Popover, PopoverContent, PopoverTrigger } from '@/registry/default/components/ui/popover'\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from '@/registry/default/components/ui/select'\nimport { Skeleton } from '@/registry/default/components/ui/skeleton'\nimport { Switch } from '@/registry/default/components/ui/switch'\nimport { ToggleGroup, ToggleGroupItem } from '@/registry/default/components/ui/toggle-group'\nimport { ResultsTable } from '@/registry/default/platform/platform-kit-nextjs/components/results-table'\nimport { useRunQuery } from '@/registry/default/platform/platform-kit-nextjs/hooks/use-run-query'\nimport { Editor } from '@monaco-editor/react'\nimport {\n  AlertTriangle,\n  ArrowUp,\n  BarChart as BarChartIcon,\n  FileText,\n  Loader2,\n  Wand,\n} from 'lucide-react'\nimport { useCallback, useEffect, useMemo, useState } from 'react'\nimport { Bar, BarChart, CartesianGrid, XAxis, YAxis } from 'recharts'\n\ninterface SqlEditorProps {\n  projectRef: string\n  initialSql?: string\n  queryKey?: any\n  label?: string\n  onResults?: (data: any[] | undefined) => void\n  onRowClick?: (row: any, queryKey?: any) => void\n  hideSql?: boolean\n  readOnly?: boolean\n  runAutomatically?: boolean\n  refetch?: number\n  initialNaturalLanguageMode?: boolean\n  hideChartOption?: boolean\n}\n\nexport function SqlEditor({\n  projectRef,\n  initialSql,\n  queryKey,\n  onResults,\n  onRowClick,\n  label = 'Query your data',\n  hideSql = false,\n  readOnly = false,\n  runAutomatically = false,\n  refetch,\n  initialNaturalLanguageMode = false,\n  hideChartOption = false,\n}: SqlEditorProps) {\n  const [sql, setSql] = useState(initialSql || '')\n  const [isSqlVisible, setIsSqlVisible] = useState(!hideSql)\n  const [isNaturalLanguageMode, setIsNaturalLanguageMode] = useState(\n    process.env.NEXT_PUBLIC_ENABLE_AI_QUERIES === 'true' && initialNaturalLanguageMode\n  )\n  const [naturalLanguageQuery, setNaturalLanguageQuery] = useState('')\n  const { mutate: runQuery, data, isPending, error } = useRunQuery()\n  const [isGeneratingSql, setIsGeneratingSql] = useState(false)\n  const [aiError, setAiError] = useState<string | null>(null)\n  const [isChartVisible, setIsChartVisible] = useState(false)\n  const [xAxisColumn, setXAxisColumn] = useState<string | null>(null)\n  const [yAxisColumn, setYAxisColumn] = useState<string | null>(null)\n\n  const columns = useMemo(() => {\n    if (!data || data.length === 0) return []\n    return Object.keys(data[0])\n  }, [data])\n\n  useEffect(() => {\n    if (initialSql) {\n      setSql(initialSql)\n    }\n  }, [initialSql])\n\n  const handleRunNaturalLanguageQuery = async () => {\n    if (!naturalLanguageQuery) return\n\n    setIsGeneratingSql(true)\n    setAiError(null)\n    try {\n      const response = await fetch('/api/ai/sql', {\n        method: 'POST',\n        headers: {\n          'Content-Type': 'application/json',\n        },\n        body: JSON.stringify({\n          prompt: naturalLanguageQuery,\n          projectRef,\n        }),\n      })\n\n      if (!response.ok) {\n        const errorData = await response.json()\n        throw new Error(errorData.message || 'Failed to generate SQL')\n      }\n\n      const { sql: generatedSql } = await response.json()\n      setSql(generatedSql)\n      runQuery({ projectRef, query: generatedSql, readOnly: true })\n    } catch (error: any) {\n      console.error(error)\n      setAiError(error.message)\n    } finally {\n      setIsGeneratingSql(false)\n    }\n  }\n\n  const handleRunQuery = useCallback(() => {\n    if (sql) {\n      runQuery({ projectRef, query: sql, readOnly: true })\n    }\n  }, [sql, projectRef, runQuery])\n\n  useEffect(() => {\n    setIsSqlVisible(!hideSql)\n  }, [hideSql])\n\n  useEffect(() => {\n    if (runAutomatically && initialSql) {\n      runQuery({ projectRef, query: initialSql, readOnly: true })\n    }\n  }, [runAutomatically, initialSql, projectRef, runQuery])\n\n  useEffect(() => {\n    if (refetch && refetch > 0) {\n      handleRunQuery()\n    }\n  }, [refetch, handleRunQuery])\n\n  useEffect(() => {\n    if (onResults) {\n      onResults(data)\n    }\n  }, [data, onResults])\n\n  useEffect(() => {\n    const noResults = !data || (Array.isArray(data) && data.length === 0)\n    if (noResults && !isSqlVisible && !isNaturalLanguageMode && !readOnly && !isPending) {\n      setIsSqlVisible(true)\n    }\n  }, [data, isSqlVisible, isNaturalLanguageMode])\n\n  const serverErrorMessage = (error as any)?.responseLine truncated
       "type": "registry:component"
     },
     {

apps/ui-library/registry.json

@@ -1225,33 +1225,31 @@
         "command",
         "dialog",
         "drawer",
+        "input",
         "form",
         "hover-card",
-        "input",
         "label",
         "popover",
         "select",
         "skeleton",
         "switch",
         "table",
-        "toggle",
         "toggle-group",
-        "tooltip"
+        "toggle",
+        "tooltip",
+        "use-mobile"
       ],
       "dependencies": [
-        "@hookform/resolvers",
         "@monaco-editor/react",
         "@tanstack/react-query",
         "@tanstack/react-table",
         "axios",
-        "cmdk",
         "common-tags",
         "openai",
         "openapi-fetch",
-        "react-hook-form",
         "react-markdown",
-        "recharts",
-        "sonner"
+        "zod@^3",
+        "@types/common-tags"
       ],
       "files": [
         {

pnpm-lock.yaml

@@ -189,7 +189,7 @@ importers:
         version: 15.3.1(@babel/core@7.26.10(supports-color@8.1.1))(@opentelemetry/api@1.9.0)(@playwright/test@1.53.0)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.77.4)
       next-contentlayer2:
         specifier: 0.4.6
-        version: 0.4.6(contentlayer2@0.4.6(esbuild@0.25.2)(markdown-wasm@1.2.0)(supports-color@8.1.1))(esbuild@0.25.2)(markdown-wasm@1.2.0)(next@15.3.1(@babel/core@7.26.10(supports-color@8.1.1))(@opentelemetry/api@1.9.0)(@playwright/test@1.53.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.77.4))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(supports-color@8.1.1)
+        version: 0.4.6(contentlayer2@0.4.6(esbuild@0.25.2)(markdown-wasm@1.2.0)(supports-color@8.1.1))(esbuild@0.25.2)(markdown-wasm@1.2.0)(next@15.3.1(@babel/core@7.26.10(supports-color@8.1.1))(@opentelemetry/api@1.9.0)(@playwright/test@1.53.0)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.77.4))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(supports-color@8.1.1)
       next-themes:
         specifier: ^0.3.0
         version: 0.3.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@@ -1199,7 +1199,7 @@ importers:
         specifier: '*'
         version: 2.1.5(@types/react-dom@18.3.0)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       '@radix-ui/react-dialog':
-        specifier: ^1.0.5
+        specifier: '*'
         version: 1.0.5(@types/react-dom@18.3.0)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       '@radix-ui/react-dropdown-menu':
         specifier: '*'
@@ -1308,7 +1308,7 @@ importers:
         version: 15.3.1(@babel/core@7.26.10(supports-color@8.1.1))(@opentelemetry/api@1.9.0)(@playwright/test@1.53.0)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.77.4)
       next-contentlayer2:
         specifier: 0.4.6
-        version: 0.4.6(contentlayer2@0.4.6(esbuild@0.25.2)(markdown-wasm@1.2.0)(supports-color@8.1.1))(esbuild@0.25.2)(markdown-wasm@1.2.0)(next@15.3.1(@babel/core@7.26.10(supports-color@8.1.1))(@opentelemetry/api@1.9.0)(@playwright/test@1.53.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.77.4))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(supports-color@8.1.1)
+        version: 0.4.6(contentlayer2@0.4.6(esbuild@0.25.2)(markdown-wasm@1.2.0)(supports-color@8.1.1))(esbuild@0.25.2)(markdown-wasm@1.2.0)(next@15.3.1(@babel/core@7.26.10(supports-color@8.1.1))(@opentelemetry/api@1.9.0)(@playwright/test@1.53.0)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.77.4))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(supports-color@8.1.1)
       next-themes:
         specifier: ^0.3.0
         version: 0.3.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@@ -11307,6 +11307,7 @@ packages:
     resolution: {integrity: sha512-t0q23FIpvHDTtnORW+bDJziGsal5uh9RJTJ1fyH8drd4lICOoXhJ5pLMUZ5C0VQei6dNmwTzzoTRgMkO9JgHEQ==}
     peerDependencies:
       eslint: '>= 5'
+    bundledDependencies: []
 
   eslint-plugin-import@2.31.0:
     resolution: {integrity: sha512-ixmkI62Rbc2/w8Vfxyh1jQRTdRTF52VxwRVHl/ykPAmqG+Nb7/kNn+byLP0LxPgI7zWA16Jt82SybJInmMia3A==}
@@ -34974,7 +34975,7 @@ snapshots:
 
   neo-async@2.6.2: {}
 
-  next-contentlayer2@0.4.6(contentlayer2@0.4.6(esbuild@0.25.2)(markdown-wasm@1.2.0)(supports-color@8.1.1))(esbuild@0.25.2)(markdown-wasm@1.2.0)(next@15.3.1(@babel/core@7.26.10(supports-color@8.1.1))(@opentelemetry/api@1.9.0)(@playwright/test@1.53.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.77.4))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(supports-color@8.1.1):
+  next-contentlayer2@0.4.6(contentlayer2@0.4.6(esbuild@0.25.2)(markdown-wasm@1.2.0)(supports-color@8.1.1))(esbuild@0.25.2)(markdown-wasm@1.2.0)(next@15.3.1(@babel/core@7.26.10(supports-color@8.1.1))(@opentelemetry/api@1.9.0)(@playwright/test@1.53.0)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.77.4))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(supports-color@8.1.1):
     dependencies:
       '@contentlayer2/core': 0.4.3(esbuild@0.25.2)(markdown-wasm@1.2.0)(supports-color@8.1.1)
       '@contentlayer2/utils': 0.4.3