Skip to content

Commit b44b3ac

Browse files
committed
Merge branch 'main' into feat/upload-db
2 parents 9012b67 + 4d6c416 commit b44b3ac

File tree

5 files changed

+120
-30
lines changed

5 files changed

+120
-30
lines changed

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

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ const dbManager = typeof window !== 'undefined' ? new DbManager() : undefined
2727
export default function AppProvider({ children }: AppProps) {
2828
const [isLoadingUser, setIsLoadingUser] = useState(true)
2929
const [user, setUser] = useState<User>()
30+
const [isSignInDialogOpen, setIsSignInDialogOpen] = useState(false)
3031

3132
const focusRef = useRef<FocusHandle>(null)
3233

@@ -110,6 +111,8 @@ export default function AppProvider({ children }: AppProps) {
110111
isLoadingUser,
111112
signIn,
112113
signOut,
114+
isSignInDialogOpen,
115+
setIsSignInDialogOpen,
113116
focusRef,
114117
isPreview,
115118
dbManager,
@@ -131,6 +134,8 @@ export type AppContextValues = {
131134
isLoadingUser: boolean
132135
signIn: () => Promise<User | undefined>
133136
signOut: () => Promise<void>
137+
isSignInDialogOpen: boolean
138+
setIsSignInDialogOpen: (open: boolean) => void
134139
focusRef: RefObject<FocusHandle>
135140
isPreview: boolean
136141
dbManager?: DbManager

apps/postgres-new/components/chat.tsx

Lines changed: 18 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@ export function getInitialMessages(tables: TablesData): Message[] {
4848
}
4949

5050
export default function Chat() {
51-
const { user, isLoadingUser, focusRef } = useApp()
51+
const { user, isLoadingUser, focusRef, setIsSignInDialogOpen } = useApp()
5252
const [inputFocusState, setInputFocusState] = useState(false)
5353

5454
const {
@@ -323,9 +323,17 @@ export default function Chat() {
323323
animate="show"
324324
>
325325
<SignInButton />
326-
<p className="font-lighter text-center">
326+
<p className="font-lighter text-center">
327327
To prevent abuse we ask you to sign in before chatting with AI.
328328
</p>
329+
<p
330+
className="underline cursor-pointer text-primary/50"
331+
onClick={() => {
332+
setIsSignInDialogOpen(true)
333+
}}
334+
>
335+
Why do I need to sign in?
336+
</p>
329337
</m.div>
330338
)}
331339
</div>
@@ -372,6 +380,14 @@ export default function Chat() {
372380
<p className="font-lighter text-center text-sm">
373381
To prevent abuse we ask you to sign in before chatting with AI.
374382
</p>
383+
<p
384+
className="underline cursor-pointer text-sm text-primary/50"
385+
onClick={() => {
386+
setIsSignInDialogOpen(true)
387+
}}
388+
>
389+
Why do I need to sign in?
390+
</p>
375391
</m.div>
376392
)}
377393
</AnimatePresence>

apps/postgres-new/components/sidebar.tsx

Lines changed: 66 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ import { downloadFile, titleToKebabCase } from '~/lib/util'
3030
import { cn } from '~/lib/utils'
3131
import { useApp } from './app-provider'
3232
import { CodeBlock } from './code-block'
33+
import SignInButton from './sign-in-button'
3334
import ThemeDropdown from './theme-dropdown'
3435
import {
3536
DropdownMenu,
@@ -40,14 +41,45 @@ import {
4041
} from './ui/dropdown-menu'
4142

4243
export default function Sidebar() {
43-
const { user, signOut, focusRef } = useApp()
44+
const { user, signOut, focusRef, isSignInDialogOpen, setIsSignInDialogOpen } = useApp()
4445
let { id: currentDatabaseId } = useParams<{ id: string }>()
4546
const router = useRouter()
4647
const { data: databases, isLoading: isLoadingDatabases } = useDatabasesQuery()
4748
const [showSidebar, setShowSidebar] = useState(true)
4849

4950
return (
5051
<>
52+
<Dialog
53+
open={isSignInDialogOpen}
54+
onOpenChange={(open) => {
55+
setIsSignInDialogOpen(open)
56+
}}
57+
>
58+
<DialogContent className="max-w-2xl">
59+
<DialogHeader>
60+
<DialogTitle>Sign in to create a database</DialogTitle>
61+
<div className="py-2 border-b" />
62+
</DialogHeader>
63+
<h2 className="font-bold">Why do I need to sign in?</h2>
64+
<p>
65+
Even though your Postgres databases run{' '}
66+
<a
67+
className="underline"
68+
href="https://pglite.dev"
69+
target="_blank"
70+
rel="noopener noreferrer"
71+
>
72+
directly in the browser
73+
</a>
74+
, we still need to connect to an API that runs the large language model (required for
75+
all database interactions).
76+
</p>
77+
<p>We ask you to sign in to prevent API abuse.</p>
78+
<div className="flex justify-center items-center my-3">
79+
<SignInButton />
80+
</div>
81+
</DialogContent>
82+
</Dialog>
5183
<AnimatePresence initial={false} mode="popLayout">
5284
{showSidebar && (
5385
<m.div
@@ -83,8 +115,12 @@ export default function Sidebar() {
83115
<m.div layout="position" layoutId="new-database-button">
84116
<Button
85117
onClick={() => {
86-
router.push('/')
87-
focusRef.current?.focus()
118+
if (!user) {
119+
setIsSignInDialogOpen(true)
120+
} else {
121+
router.push('/')
122+
focusRef.current?.focus()
123+
}
88124
}}
89125
className="gap-2"
90126
>
@@ -176,8 +212,12 @@ export default function Sidebar() {
176212
<Button
177213
size={'icon'}
178214
onClick={() => {
179-
router.push('/')
180-
focusRef.current?.focus()
215+
if (!user) {
216+
setIsSignInDialogOpen(true)
217+
} else {
218+
router.push('/')
219+
focusRef.current?.focus()
220+
}
181221
}}
182222
>
183223
<PackagePlus size={14} />
@@ -200,24 +240,26 @@ export default function Sidebar() {
200240
<p>Toggle theme</p>
201241
</TooltipContent>
202242
</Tooltip>
203-
<Tooltip>
204-
<TooltipTrigger asChild>
205-
<m.div layout="position" layoutId="sign-out-button">
206-
<Button
207-
size={'icon'}
208-
variant="secondary"
209-
onClick={async () => {
210-
await signOut()
211-
}}
212-
>
213-
<LogOut size={16} strokeWidth={2} />
214-
</Button>
215-
</m.div>
216-
</TooltipTrigger>
217-
<TooltipContent side="right">
218-
<p>Sign out</p>
219-
</TooltipContent>
220-
</Tooltip>
243+
{user && (
244+
<Tooltip>
245+
<TooltipTrigger asChild>
246+
<m.div layout="position" layoutId="sign-out-button">
247+
<Button
248+
size={'icon'}
249+
variant="secondary"
250+
onClick={async () => {
251+
await signOut()
252+
}}
253+
>
254+
<LogOut size={16} strokeWidth={2} />
255+
</Button>
256+
</m.div>
257+
</TooltipTrigger>
258+
<TooltipContent side="right">
259+
<p>Sign out</p>
260+
</TooltipContent>
261+
</Tooltip>
262+
)}
221263
</div>
222264
</div>
223265
)}
@@ -256,7 +298,7 @@ function DatabaseMenuItem({ database, isActive }: DatabaseMenuItemProps) {
256298
<DialogTitle>Deployments are in Private Alpha</DialogTitle>
257299
<div className="py-2 border-b" />
258300
</DialogHeader>
259-
<h2 className="font-medium">What are deployments?</h2>
301+
<h2 className="font-bold">What are deployments?</h2>
260302
<p>
261303
Deploy your database to a serverless PGlite instance so that it can be accessed outside
262304
the browser using any Postgres client:

apps/postgres-new/components/workspace.tsx

Lines changed: 31 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -125,8 +125,37 @@ export default function Workspace({
125125
</div>
126126
)}
127127
</div>
128-
<div className="w-full h-full flex lg:hidden justify-center items-center p-6 text-center">
129-
Please connect from a laptop or desktop to use postgres.new.
128+
<div className="w-full lg:hidden justify-center items-center p-6 ">
129+
<div className="grid gap-6 mt-4">
130+
<h2 className="text-lg font-bold">Mobile Support Coming Soon</h2>
131+
<p>
132+
<a className="underline" href="https://postgres.new">
133+
postgres.new
134+
</a>{' '}
135+
is in early Alpha and is{' '}
136+
<a className="underline" href="https://supabase.com/blog/postgres-new">
137+
actively being developed
138+
</a>
139+
. We are working on mobile support for{' '}
140+
<a className="underline" href="https://github.com/electric-sql/pglite">
141+
PGlite
142+
</a>{' '}
143+
right now.
144+
</p>
145+
<p>
146+
In the meantime, please check out the video below or visit from a laptop or desktop.
147+
</p>
148+
<div className="video-container">
149+
<iframe
150+
className="w-full min-h-[300px]"
151+
src="https://www.youtube-nocookie.com/embed/ooWaPVvljlU"
152+
title="I gave AI full control over my database (postgres.new)"
153+
allow="accelerometer; autoplay; clipboard-write; encrypted-media; fullscreen; gyroscope; picture-in-picture; web-share"
154+
allowFullScreen
155+
/>
156+
</div>
157+
<p>We appreciate your patience and interest! Stay tuned for updates!</p>
158+
</div>
130159
</div>
131160
</WorkspaceContext.Provider>
132161
)

apps/postgres-new/data/deploy-waitlist/deploy-waitlist-query.ts

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,8 +22,6 @@ export const useIsOnDeployWaitlistQuery = (
2222
.eq('user_id', user.id)
2323
.maybeSingle()
2424

25-
console.log({ waitlistRecord })
26-
2725
if (waitlistError) {
2826
throw waitlistError
2927
}

0 commit comments

Comments
 (0)