Skip to content

Commit b97cd81

Browse files
MildTomatoMildTomato
committed
Merge branch 'main' into feat/themes
2 parents 6aab303 + c9e2e3f commit b97cd81

28 files changed

+1093
-446
lines changed

‎apps/postgres-new/app/db/[id]/page.tsx

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,23 +2,28 @@
22

33
import { useRouter } from 'next/navigation'
44
import { useEffect } from 'react'
5+
import { useApp } from '~/components/app-provider'
56
import Workspace from '~/components/workspace'
6-
import { getDb } from '~/lib/db'
77

88
export default function Page({ params }: { params: { id: string } }) {
99
const databaseId = params.id
1010
const router = useRouter()
11+
const { dbManager } = useApp()
1112

1213
useEffect(() => {
1314
async function run() {
15+
if (!dbManager) {
16+
throw new Error('dbManager is not available')
17+
}
18+
1419
try {
15-
await getDb(databaseId)
20+
await dbManager.getDbInstance(databaseId)
1621
} catch (err) {
1722
router.push('/')
1823
}
1924
}
2025
run()
21-
}, [databaseId, router])
26+
}, [dbManager, databaseId, router])
2227

2328
return <Workspace databaseId={databaseId} visibility="local" />
2429
}

‎apps/postgres-new/app/page.tsx

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,10 @@
33
import { customAlphabet } from 'nanoid'
44
import { useRouter } from 'next/navigation'
55
import { useCallback, useEffect, useMemo } from 'react'
6+
import { useApp } from '~/components/app-provider'
67
import Workspace from '~/components/workspace'
78
import { useDatabaseCreateMutation } from '~/data/databases/database-create-mutation'
89
import { useDatabaseUpdateMutation } from '~/data/databases/database-update-mutation'
9-
import { dbExists, getDb } from '~/lib/db'
1010

1111
// Use a DNS safe alphabet
1212
const nanoid = customAlphabet('0123456789abcdefghijklmnopqrstuvwxyz', 16)
@@ -16,6 +16,7 @@ function uniqueId() {
1616
}
1717

1818
export default function Page() {
19+
const { dbManager } = useApp()
1920
const router = useRouter()
2021

2122
const { mutateAsync: createDatabase } = useDatabaseCreateMutation()
@@ -26,13 +27,17 @@ export default function Page() {
2627
*/
2728
const preloadDb = useCallback(
2829
async (id: string) => {
29-
const exists = await dbExists(id)
30-
if (!exists) {
30+
if (!dbManager) {
31+
throw new Error('dbManager is not available')
32+
}
33+
34+
const database = await dbManager.getDatabase(id)
35+
if (!database) {
3136
await createDatabase({ id, isHidden: true })
32-
await getDb(id)
37+
await dbManager.getDbInstance(id)
3338
}
3439
},
35-
[createDatabase]
40+
[dbManager, createDatabase]
3641
)
3742

3843
// Track the next database ID in local storage

‎apps/postgres-new/components/app-provider.tsx

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,14 +11,18 @@ import {
1111
useCallback,
1212
useContext,
1313
useEffect,
14+
useMemo,
1415
useState,
1516
} from 'react'
16-
import { getRuntimePgVersion } from '~/lib/db'
17+
import { DbManager } from '~/lib/db'
1718
import { useAsyncMemo } from '~/lib/hooks'
1819
import { createClient } from '~/utils/supabase/client'
1920

2021
export type AppProps = PropsWithChildren
2122

23+
// Create a singleton DbManager that isn't exposed to double mounting
24+
const dbManager = typeof window !== 'undefined' ? new DbManager() : undefined
25+
2226
export default function AppProvider({ children }: AppProps) {
2327
const [isLoadingUser, setIsLoadingUser] = useState(true)
2428
const [user, setUser] = useState<User>()
@@ -78,7 +82,13 @@ export default function AppProvider({ children }: AppProps) {
7882

7983
const isPreview = process.env.NEXT_PUBLIC_IS_PREVIEW === 'true'
8084
const pgliteVersion = process.env.NEXT_PUBLIC_PGLITE_VERSION
81-
const { value: pgVersion } = useAsyncMemo(() => getRuntimePgVersion(), [])
85+
const { value: pgVersion } = useAsyncMemo(async () => {
86+
if (!dbManager) {
87+
throw new Error('dbManager is not available')
88+
}
89+
90+
return await dbManager.getRuntimePgVersion()
91+
}, [dbManager])
8292

8393
return (
8494
<AppContext.Provider
@@ -88,6 +98,7 @@ export default function AppProvider({ children }: AppProps) {
8898
signIn,
8999
signOut,
90100
isPreview,
101+
dbManager,
91102
pgliteVersion,
92103
pgVersion,
93104
}}
@@ -103,6 +114,7 @@ export type AppContextValues = {
103114
signIn: () => Promise<User | undefined>
104115
signOut: () => Promise<void>
105116
isPreview: boolean
117+
dbManager?: DbManager
106118
pgliteVersion?: string
107119
pgVersion?: string
108120
}

‎apps/postgres-new/components/code-block.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@ export interface CodeBlockProps {
4646
value?: string
4747
children?: string
4848
renderer?: SyntaxHighlighterProps['renderer']
49+
theme?: 'auto' | 'light' | 'dark'
4950
}
5051

5152
export const CodeBlock = ({
@@ -58,9 +59,10 @@ export const CodeBlock = ({
5859
hideCopy = false,
5960
hideLineNumbers = false,
6061
renderer,
62+
theme = 'auto',
6163
}: CodeBlockProps) => {
6264
const { resolvedTheme } = useTheme()
63-
const isDarkTheme = resolvedTheme?.includes('dark')!
65+
const isDarkTheme = theme === 'auto' ? resolvedTheme?.includes('dark')! : theme === 'dark'
6466
const monokaiTheme = monokaiCustomTheme(isDarkTheme)
6567

6668
const [copied, setCopied] = useState(false)
@@ -121,7 +123,7 @@ export const CodeBlock = ({
121123
// @ts-ignore
122124
style={monokaiTheme}
123125
className={cn(
124-
'code-block border border-surface p-4 w-full !my-0 !bg-surface-100',
126+
'code-block border border-surface p-4 w-full !my-0',
125127
`${!title ? '!rounded-md' : '!rounded-t-none !rounded-b-md'}`,
126128
`${!showLineNumbers ? 'pl-6' : ''}`,
127129
className

‎apps/postgres-new/components/ide.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
'use client'
22

33
import { Editor } from '@monaco-editor/react'
4-
import { deparse, parseQuery, ParseResult } from 'libpg-query/wasm'
4+
import { ParseResult } from 'libpg-query/wasm'
55
import { FileCode, MessageSquareMore, Sprout, Workflow } from 'lucide-react'
66
import { PropsWithChildren, useEffect, useState } from 'react'
77
import { format } from 'sql-formatter'
@@ -60,6 +60,9 @@ export default function IDE({ children, className }: IDEProps) {
6060
})
6161
.filter((sql) => sql !== undefined) ?? []
6262

63+
// Dynamically import (browser-only) to prevent SSR errors
64+
const { deparse, parseQuery } = await import('libpg-query/wasm')
65+
6366
const migrations: string[] = []
6467

6568
for (const sql of sqlExecutions) {

0 commit comments

Comments
 (0)