diff --git a/apps/postgres-new/app/(main)/db/[id]/page.tsx b/apps/postgres-new/app/(main)/db/[id]/page.tsx index 9f4a2561..cd13c697 100644 --- a/apps/postgres-new/app/(main)/db/[id]/page.tsx +++ b/apps/postgres-new/app/(main)/db/[id]/page.tsx @@ -8,7 +8,7 @@ import Workspace from '~/components/workspace' export default function Page({ params }: { params: { id: string } }) { const databaseId = params.id const router = useRouter() - const { dbManager, liveShare } = useApp() + const { dbManager } = useApp() useEffect(() => { async function run() { @@ -25,12 +25,5 @@ export default function Page({ params }: { params: { id: string } }) { run() }, [dbManager, databaseId, router]) - // Cleanup live shared database when switching databases - useEffect(() => { - if (liveShare.isLiveSharing && liveShare.databaseId !== databaseId) { - liveShare.stop() - } - }, [liveShare, databaseId]) - return } diff --git a/apps/postgres-new/components/chat.tsx b/apps/postgres-new/components/chat.tsx index c6984c0f..e93c9d77 100644 --- a/apps/postgres-new/components/chat.tsx +++ b/apps/postgres-new/components/chat.tsx @@ -26,6 +26,7 @@ import ChatMessage from './chat-message' import SignInButton from './sign-in-button' import { useWorkspace } from './workspace' import { CopyableField } from './copyable-field' +import { Tabs, TabsContent, TabsList, TabsTrigger } from './ui/tabs' export function getInitialMessages(tables: TablesData): Message[] { return [ @@ -244,49 +245,7 @@ export default function Chat() { )} ref={scrollRef} > - {liveShare.isLiveSharing && ( -
-
-
-

Access your in-browser database

-

- Closing the window will stop the Live Share session -

-
- - - {liveShare.clientIp ? ( -

- - - - - - Connected from{' '} - {liveShare.clientIp} - -

- ) : ( -

- - Not connected -

- )} - -
-
- )} + {user ? ( - - What would you like to create? - + <> + + + What would you like to create? + + ) : ( ) } + +function LiveShareOverlay(props: { databaseId: string }) { + const { liveShare } = useApp() + + if (liveShare.isLiveSharing && liveShare.databaseId === props.databaseId) { + return ( +
+
+
+

Access your in-browser database

+

+ Closing the window will stop the Live Share session +

+
+ + + + URI + + + PSQL + + + + + + + + + + + {liveShare.clientIp ? ( +

+ + + + + + Connected from {liveShare.clientIp} + +

+ ) : ( +

+ + No client connected +

+ )} + +
+
+ ) + + return null + } +} diff --git a/apps/postgres-new/components/sidebar.tsx b/apps/postgres-new/components/sidebar.tsx index e56b0af5..3356eb47 100644 --- a/apps/postgres-new/components/sidebar.tsx +++ b/apps/postgres-new/components/sidebar.tsx @@ -53,6 +53,7 @@ export default function Sidebar() { setIsSignInDialogOpen, setIsRenameDialogOpen, isLegacyDomain, + liveShare, } = useApp() let { id: currentDatabaseId } = useParams<{ id: string }>() const router = useRouter() @@ -130,6 +131,9 @@ export default function Sidebar() { if (!user) { setIsSignInDialogOpen(true) } else { + if (liveShare.isLiveSharing) { + liveShare.stop() + } router.push('/') focusRef.current?.focus() } @@ -368,7 +372,7 @@ function DatabaseMenuItem({ database, isActive }: DatabaseMenuItemProps) { )} href={`/db/${database.id}`} > - {isActive && liveShare.isLiveSharing && ( + {liveShare.isLiveSharing && liveShare.databaseId === database.id && ( @@ -540,40 +544,40 @@ type ConnectMenuItemProps = { function LiveShareMenuItem(props: ConnectMenuItemProps) { const { liveShare, user } = useApp() + const router = useRouter() - // Only show the connect menu item on fully loaded dashboard - if (!props.isActive) { - return null - } - - if (!liveShare.isLiveSharing) { + if (liveShare.isLiveSharing && liveShare.databaseId === props.databaseId) { return ( { e.preventDefault() - liveShare.start(props.databaseId) + liveShare.stop() props.setIsPopoverOpen(false) }} > - - Live Share + + Stop sharing ) } return ( { e.preventDefault() - liveShare.stop() + if (liveShare.isLiveSharing) { + liveShare.stop() + } + liveShare.start(props.databaseId) + router.push(`/db/${props.databaseId}`) props.setIsPopoverOpen(false) }} > - - Stop sharing + + Live Share ) } diff --git a/package-lock.json b/package-lock.json index 62ffc6d3..5ff98c04 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14180,6 +14180,126 @@ "type": "github", "url": "https://github.com/sponsors/wooorm" } + }, + "node_modules/@next/swc-darwin-x64": { + "version": "14.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-14.2.3.tgz", + "integrity": "sha512-6adp7waE6P1TYFSXpY366xwsOnEXM+y1kgRpjSRVI2CBDOcbRjsJ67Z6EgKIqWIue52d2q/Mx8g9MszARj8IEA==", + "cpu": [ + "x64" + ], + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-linux-arm64-gnu": { + "version": "14.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-14.2.3.tgz", + "integrity": "sha512-cuzCE/1G0ZSnTAHJPUT1rPgQx1w5tzSX7POXSLaS7w2nIUJUD+e25QoXD/hMfxbsT9rslEXugWypJMILBj/QsA==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-linux-arm64-musl": { + "version": "14.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-14.2.3.tgz", + "integrity": "sha512-0D4/oMM2Y9Ta3nGuCcQN8jjJjmDPYpHX9OJzqk42NZGJocU2MqhBq5tWkJrUQOQY9N+In9xOdymzapM09GeiZw==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-linux-x64-gnu": { + "version": "14.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-14.2.3.tgz", + "integrity": "sha512-ENPiNnBNDInBLyUU5ii8PMQh+4XLr4pG51tOp6aJ9xqFQ2iRI6IH0Ds2yJkAzNV1CfyagcyzPfROMViS2wOZ9w==", + "cpu": [ + "x64" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-linux-x64-musl": { + "version": "14.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-14.2.3.tgz", + "integrity": "sha512-BTAbq0LnCbF5MtoM7I/9UeUu/8ZBY0i8SFjUMCbPDOLv+un67e2JgyN4pmgfXBwy/I+RHu8q+k+MCkDN6P9ViQ==", + "cpu": [ + "x64" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-win32-arm64-msvc": { + "version": "14.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-14.2.3.tgz", + "integrity": "sha512-AEHIw/dhAMLNFJFJIJIyOFDzrzI5bAjI9J26gbO5xhAKHYTZ9Or04BesFPXiAYXDNdrwTP2dQceYA4dL1geu8A==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-win32-ia32-msvc": { + "version": "14.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-14.2.3.tgz", + "integrity": "sha512-vga40n1q6aYb0CLrM+eEmisfKCR45ixQYXuBXxOOmmoV8sYST9k7E3US32FsY+CkkF7NtzdcebiFT4CHuMSyZw==", + "cpu": [ + "ia32" + ], + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 10" + } + }, + "node_modules/@next/swc-win32-x64-msvc": { + "version": "14.2.3", + "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-14.2.3.tgz", + "integrity": "sha512-Q1/zm43RWynxrO7lW4ehciQVj+5ePBhOK+/K2P7pLFX3JaJ/IZVC69SHidrmZSOkqz7ECIOhhy7XhAFG4JYyHA==", + "cpu": [ + "x64" + ], + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 10" + } } } }