From 10af3b513d39a85b389fd0e6f2ec36c23aefbaef Mon Sep 17 00:00:00 2001 From: Strider Wilson Date: Mon, 9 Jun 2025 15:31:54 -0400 Subject: [PATCH 1/3] Update look of modal and add use information --- .../DeployChat/components/DeployChatModal.tsx | 521 +++++++++++------- 1 file changed, 326 insertions(+), 195 deletions(-) diff --git a/app/components/header/DeployChat/components/DeployChatModal.tsx b/app/components/header/DeployChat/components/DeployChatModal.tsx index 05571a57..269f9e4e 100644 --- a/app/components/header/DeployChat/components/DeployChatModal.tsx +++ b/app/components/header/DeployChat/components/DeployChatModal.tsx @@ -19,26 +19,38 @@ const DeployChatModal = ({ error, handleDeploy, }: DeployChatModalProps) => { + const handleOverlayClick = (e: React.MouseEvent) => { + if (e.target === e.currentTarget) { + setIsModalOpen(false); + } + }; + return ( <> {isModalOpen && ( -
-
+
+
e.stopPropagation()}> {status === DeployStatus.Succeeded ? ( <> -
Deployment Succeeded
+

+ Deployment Succeeded! 🎉 +

-
+

+ Your application has been successfully deployed. You can now access it at the URL below. +

+
- @@ -47,205 +59,324 @@ const DeployChatModal = ({ ) : ( <> -

Deploy

-
Deploy this chat's app to production.
+

+ Deploy Your Application +

+
+

Deploy your chat application to production using Netlify and Supabase.

+

This process will:

+
    +
  • Create a new Netlify site or update an existing one
  • +
  • Set up your database with Supabase
  • +
  • Configure all necessary environment variables
  • +
  • Deploy your application with production settings
  • +
+
+ +
+

Before you begin:

+

+ You'll need accounts with both Netlify and Supabase to deploy your application. If you haven't already, please sign up using the links below: +

+ +
{deploySettings?.siteURL && ( -
- Existing site: + )} -
- - { - const netlify = { - authToken: e.target.value, - siteId: deploySettings?.netlify?.siteId || '', - createInfo: deploySettings?.netlify?.createInfo || undefined, - }; - setDeploySettings({ - ...deploySettings, - netlify, - }); - }} - /> - - { - const netlify = { - authToken: deploySettings?.netlify?.authToken || '', - siteId: e.target.value, - createInfo: deploySettings?.netlify?.createInfo || undefined, - }; - setDeploySettings({ - ...deploySettings, - netlify, - }); - }} - /> - - { - const createInfo = { - accountSlug: e.target.value, - siteName: deploySettings?.netlify?.createInfo?.siteName || '', - }; - const netlify = { - authToken: deploySettings?.netlify?.authToken || '', - siteId: deploySettings?.netlify?.siteId || '', - createInfo, - }; - setDeploySettings({ - ...deploySettings, - netlify, - }); - }} - /> - - { - const createInfo = { - accountSlug: deploySettings?.netlify?.createInfo?.accountSlug || '', - siteName: e.target.value, - }; - const netlify = { - authToken: deploySettings?.netlify?.authToken || '', - siteId: deploySettings?.netlify?.siteId || '', - createInfo, - }; - setDeploySettings({ - ...deploySettings, - netlify, - }); - }} - /> - - { - const supabase = { - databaseURL: e.target.value, - anonKey: deploySettings?.supabase?.anonKey || '', - serviceRoleKey: deploySettings?.supabase?.serviceRoleKey || '', - postgresURL: deploySettings?.supabase?.postgresURL || '', - }; - setDeploySettings({ - ...deploySettings, - supabase, - }); - }} - /> - - { - const supabase = { - databaseURL: deploySettings?.supabase?.databaseURL || '', - anonKey: e.target.value, - serviceRoleKey: deploySettings?.supabase?.serviceRoleKey || '', - postgresURL: deploySettings?.supabase?.postgresURL || '', - }; - setDeploySettings({ - ...deploySettings, - supabase, - }); - }} - /> - - { - const supabase = { - databaseURL: deploySettings?.supabase?.databaseURL || '', - anonKey: deploySettings?.supabase?.anonKey || '', - serviceRoleKey: e.target.value, - postgresURL: deploySettings?.supabase?.postgresURL || '', - }; - setDeploySettings({ - ...deploySettings, - supabase, - }); - }} - /> - - { - const supabase = { - databaseURL: deploySettings?.supabase?.databaseURL || '', - anonKey: deploySettings?.supabase?.anonKey || '', - serviceRoleKey: deploySettings?.supabase?.serviceRoleKey || '', - postgresURL: e.target.value, - }; - setDeploySettings({ - ...deploySettings, - supabase, - }); - }} - /> -
- -
- {status === DeployStatus.Started && ( -
- +
+
+ +
+

+ Your authentication token from Netlify account settings. Used to authorize deployments. +

- )} + { + const netlify = { + authToken: e.target.value, + siteId: deploySettings?.netlify?.siteId || '', + createInfo: deploySettings?.netlify?.createInfo || undefined, + }; + setDeploySettings({ + ...deploySettings, + netlify, + }); + }} + /> +
- {status === DeployStatus.NotStarted && ( - - )} - +
+ +
+

+ The ID of your existing Netlify site if you want to update an existing deployment. +

+
+ { + const netlify = { + authToken: deploySettings?.netlify?.authToken || '', + siteId: e.target.value, + createInfo: deploySettings?.netlify?.createInfo || undefined, + }; + setDeploySettings({ + ...deploySettings, + netlify, + }); + }} + /> +
+ +
+ +
+

+ Your Netlify account name, required when creating a new site. +

+
+ { + const createInfo = { + accountSlug: e.target.value, + siteName: deploySettings?.netlify?.createInfo?.siteName || '', + }; + const netlify = { + authToken: deploySettings?.netlify?.authToken || '', + siteId: deploySettings?.netlify?.siteId || '', + createInfo, + }; + setDeploySettings({ + ...deploySettings, + netlify, + }); + }} + /> +
+ +
+ +
+

+ The desired name for your new Netlify site. Will be part of your site's URL. +

+
+ { + const createInfo = { + accountSlug: deploySettings?.netlify?.createInfo?.accountSlug || '', + siteName: e.target.value, + }; + const netlify = { + authToken: deploySettings?.netlify?.authToken || '', + siteId: deploySettings?.netlify?.siteId || '', + createInfo, + }; + setDeploySettings({ + ...deploySettings, + netlify, + }); + }} + /> +
+ +
+ +
+

+ The URL of your Supabase project, used to connect to your database. +

+
+ { + const supabase = { + databaseURL: e.target.value, + anonKey: deploySettings?.supabase?.anonKey || '', + serviceRoleKey: deploySettings?.supabase?.serviceRoleKey || '', + postgresURL: deploySettings?.supabase?.postgresURL || '', + }; + setDeploySettings({ + ...deploySettings, + supabase, + }); + }} + /> +
+ +
+ +
+

+ Public API key for client-side database access with restricted permissions. +

+
+ { + const supabase = { + databaseURL: deploySettings?.supabase?.databaseURL || '', + anonKey: e.target.value, + serviceRoleKey: deploySettings?.supabase?.serviceRoleKey || '', + postgresURL: deploySettings?.supabase?.postgresURL || '', + }; + setDeploySettings({ + ...deploySettings, + supabase, + }); + }} + /> +
+ +
+ +
+

+ Admin API key for server-side operations with full database access. +

+
+ { + const supabase = { + databaseURL: deploySettings?.supabase?.databaseURL || '', + anonKey: deploySettings?.supabase?.anonKey || '', + serviceRoleKey: e.target.value, + postgresURL: deploySettings?.supabase?.postgresURL || '', + }; + setDeploySettings({ + ...deploySettings, + supabase, + }); + }} + /> +
+ +
+ +
+

+ Direct connection URL to your Postgres database for advanced operations. +

+
+ { + const supabase = { + databaseURL: deploySettings?.supabase?.databaseURL || '', + anonKey: deploySettings?.supabase?.anonKey || '', + serviceRoleKey: deploySettings?.supabase?.serviceRoleKey || '', + postgresURL: e.target.value, + }; + setDeploySettings({ + ...deploySettings, + supabase, + }); + }} + /> +
- {error &&
{error}
} +
+ {status === DeployStatus.Started ? ( +
+ + Deploying your application... +
+ ) : ( + <> + + + + )} +
+ + {error && ( +
+

Deployment Error

+

{error}

+
+ )} )}
From 7ae7896b8e2889a557d7697f3a4735b37a28a03b Mon Sep 17 00:00:00 2001 From: Strider Wilson Date: Tue, 10 Jun 2025 14:12:08 -0400 Subject: [PATCH 2/3] Update deploy modal to clarify process and update Header buttons --- .../header/DeployChat/DeployChatButton.tsx | 59 +++- .../DeployChat/components/DeployChatModal.tsx | 291 +++++++++--------- .../components/DeploymentSuccessful.tsx | 29 ++ app/components/header/DownloadButton.tsx | 1 + app/components/header/Header.tsx | 4 +- 5 files changed, 224 insertions(+), 160 deletions(-) create mode 100644 app/components/header/DeployChat/components/DeploymentSuccessful.tsx diff --git a/app/components/header/DeployChat/DeployChatButton.tsx b/app/components/header/DeployChat/DeployChatButton.tsx index d91eefec..cc3cea6c 100644 --- a/app/components/header/DeployChat/DeployChatButton.tsx +++ b/app/components/header/DeployChat/DeployChatButton.tsx @@ -6,7 +6,7 @@ import { generateRandomId } from '~/lib/replay/ReplayProtocolClient'; import { workbenchStore } from '~/lib/stores/workbench'; import { chatStore } from '~/lib/stores/chat'; import { database } from '~/lib/persistence/chats'; -import { deployRepository } from '~/lib/replay/Deploy'; +import { deployRepository, downloadRepository } from '~/lib/replay/Deploy'; import DeployChatModal from './components/DeployChatModal'; ReactModal.setAppElement('#root'); @@ -22,14 +22,61 @@ export function DeployChatButton() { const [deploySettings, setDeploySettings] = useState(null); const [error, setError] = useState(null); const [status, setStatus] = useState(DeployStatus.NotStarted); + const [databaseFound, setDatabaseFound] = useState(false); + + const handleCheckDatabase = async () => { + const repositoryId = workbenchStore.repositoryId.get(); + if (!repositoryId) { + toast.error('No repository ID found'); + return; + } + + try { + const repositoryContents = await downloadRepository(repositoryId); + + // Convert base64 to blob + const byteCharacters = atob(repositoryContents); + const byteNumbers = new Array(byteCharacters.length); + for (let i = 0; i < byteCharacters.length; i++) { + byteNumbers[i] = byteCharacters.charCodeAt(i); + } + const byteArray = new Uint8Array(byteNumbers); + const blob = new Blob([byteArray], { type: 'application/zip' }); + + const reader = new FileReader(); + reader.onload = (event) => { + if (!event.target?.result) { + setIsModalOpen(false); + toast.error('Could not read repository contents'); + return; + } + + const zipContents = event.target.result as string; + const directoryToFind = 'supabase'; + + if (zipContents.includes(directoryToFind)) { + setDatabaseFound(true); + } else { + setDatabaseFound(false); + } + }; + + reader.readAsText(blob); + } catch (error) { + setIsModalOpen(false); + console.error('Error downloading repository:', error); + toast.error('Failed to download repository'); + } + }; const handleOpenModal = async () => { const chatId = chatStore.currentChat.get()?.id; if (!chatId) { - toast.error('No chat open'); + toast.error('No chat ID found'); return; } + await handleCheckDatabase(); const existingSettings = await database.getChatDeploySettings(chatId); setIsModalOpen(true); @@ -146,11 +193,10 @@ export function DeployChatButton() { <> ); diff --git a/app/components/header/DeployChat/components/DeployChatModal.tsx b/app/components/header/DeployChat/components/DeployChatModal.tsx index 269f9e4e..172ea525 100644 --- a/app/components/header/DeployChat/components/DeployChatModal.tsx +++ b/app/components/header/DeployChat/components/DeployChatModal.tsx @@ -1,4 +1,5 @@ import { DeployStatus } from '~/components/header/DeployChat/DeployChatButton'; +import DeploymentSuccessful from './DeploymentSuccessful'; interface DeployChatModalProps { isModalOpen: boolean; @@ -8,6 +9,7 @@ interface DeployChatModalProps { setDeploySettings: (settings: any) => void; error: string | null; handleDeploy: () => void; + databaseFound: boolean; } const DeployChatModal = ({ @@ -18,6 +20,7 @@ const DeployChatModal = ({ setDeploySettings, error, handleDeploy, + databaseFound, }: DeployChatModalProps) => { const handleOverlayClick = (e: React.MouseEvent) => { if (e.target === e.currentTarget) { @@ -32,51 +35,31 @@ const DeployChatModal = ({ className="fixed inset-0 bg-black bg-opacity-50 backdrop-blur-sm z-40 flex items-center justify-center" onClick={handleOverlayClick} > -
e.stopPropagation()}> +
e.stopPropagation()}> {status === DeployStatus.Succeeded ? ( - <> -

- Deployment Succeeded! 🎉 -

-
-

- Your application has been successfully deployed. You can now access it at the URL below. -

-
- - - - -
-
- - ) : ( + + ) : ( <>

Deploy Your Application

-

Deploy your chat application to production using Netlify and Supabase.

+

Deploy your chat application to production using Netlify{databaseFound ? ' and Supabase' : ''}.

This process will:

-
    -
  • Create a new Netlify site or update an existing one
  • -
  • Set up your database with Supabase
  • -
  • Configure all necessary environment variables
  • -
  • Deploy your application with production settings
  • -
+
+
    +
  • Create a new Netlify site or update an existing one
  • + {databaseFound &&
  • Set up your database with Supabase
  • } +
  • Configure all necessary environment variables
  • +
  • Deploy your application with production settings
  • +
+

Before you begin:

- You'll need accounts with both Netlify and Supabase to deploy your application. If you haven't already, please sign up using the links below: + You'll need accounts with both Netlify and {databaseFound ? 'Supabase ' : ''}to deploy your application. If you haven't already, please sign up using the links below:

@@ -230,121 +213,125 @@ const DeployChatModal = ({ />
-
- -
-

- The URL of your Supabase project, used to connect to your database. -

-
- { - const supabase = { - databaseURL: e.target.value, - anonKey: deploySettings?.supabase?.anonKey || '', - serviceRoleKey: deploySettings?.supabase?.serviceRoleKey || '', - postgresURL: deploySettings?.supabase?.postgresURL || '', - }; - setDeploySettings({ - ...deploySettings, - supabase, - }); - }} - /> -
+ {databaseFound && ( + <> +
+ +
+

+ The URL of your Supabase project, used to connect to your database. +

+
+ { + const supabase = { + databaseURL: e.target.value, + anonKey: deploySettings?.supabase?.anonKey || '', + serviceRoleKey: deploySettings?.supabase?.serviceRoleKey || '', + postgresURL: deploySettings?.supabase?.postgresURL || '', + }; + setDeploySettings({ + ...deploySettings, + supabase, + }); + }} + /> +
-
- -
-

- Public API key for client-side database access with restricted permissions. -

-
- { - const supabase = { - databaseURL: deploySettings?.supabase?.databaseURL || '', - anonKey: e.target.value, - serviceRoleKey: deploySettings?.supabase?.serviceRoleKey || '', - postgresURL: deploySettings?.supabase?.postgresURL || '', - }; - setDeploySettings({ - ...deploySettings, - supabase, - }); - }} - /> -
+
+ +
+

+ Public API key for client-side database access with restricted permissions. +

+
+ { + const supabase = { + databaseURL: deploySettings?.supabase?.databaseURL || '', + anonKey: e.target.value, + serviceRoleKey: deploySettings?.supabase?.serviceRoleKey || '', + postgresURL: deploySettings?.supabase?.postgresURL || '', + }; + setDeploySettings({ + ...deploySettings, + supabase, + }); + }} + /> +
-
- -
-

- Admin API key for server-side operations with full database access. -

-
- { - const supabase = { - databaseURL: deploySettings?.supabase?.databaseURL || '', - anonKey: deploySettings?.supabase?.anonKey || '', - serviceRoleKey: e.target.value, - postgresURL: deploySettings?.supabase?.postgresURL || '', - }; - setDeploySettings({ - ...deploySettings, - supabase, - }); - }} - /> -
+
+ +
+

+ Admin API key for server-side operations with full database access. +

+
+ { + const supabase = { + databaseURL: deploySettings?.supabase?.databaseURL || '', + anonKey: deploySettings?.supabase?.anonKey || '', + serviceRoleKey: e.target.value, + postgresURL: deploySettings?.supabase?.postgresURL || '', + }; + setDeploySettings({ + ...deploySettings, + supabase, + }); + }} + /> +
-
- -
-

- Direct connection URL to your Postgres database for advanced operations. -

-
- { - const supabase = { - databaseURL: deploySettings?.supabase?.databaseURL || '', - anonKey: deploySettings?.supabase?.anonKey || '', - serviceRoleKey: deploySettings?.supabase?.serviceRoleKey || '', - postgresURL: e.target.value, - }; - setDeploySettings({ - ...deploySettings, - supabase, - }); - }} - /> -
+
+ +
+

+ Direct connection URL to your Postgres database for advanced operations. +

+
+ { + const supabase = { + databaseURL: deploySettings?.supabase?.databaseURL || '', + anonKey: deploySettings?.supabase?.anonKey || '', + serviceRoleKey: deploySettings?.supabase?.serviceRoleKey || '', + postgresURL: e.target.value, + }; + setDeploySettings({ + ...deploySettings, + supabase, + }); + }} + /> +
+ + )}
diff --git a/app/components/header/DeployChat/components/DeploymentSuccessful.tsx b/app/components/header/DeployChat/components/DeploymentSuccessful.tsx new file mode 100644 index 00000000..fa6f7bcb --- /dev/null +++ b/app/components/header/DeployChat/components/DeploymentSuccessful.tsx @@ -0,0 +1,29 @@ +const DeploymentSuccessful = ({ deploySettings, setIsModalOpen }: { deploySettings: any, setIsModalOpen: (isOpen: boolean) => void }) => { + return ( + <> +

+ Deployment Succeeded! 🎉 +

+
+

+ Your application has been successfully deployed. You can now access it at the URL below. +

+
+ + + + +
+
+ + ); +}; + +export default DeploymentSuccessful; diff --git a/app/components/header/DownloadButton.tsx b/app/components/header/DownloadButton.tsx index a2bc727a..22a23b3c 100644 --- a/app/components/header/DownloadButton.tsx +++ b/app/components/header/DownloadButton.tsx @@ -51,6 +51,7 @@ export function DownloadButton() { onClick={handleDownload} >
+ Download Repo ); diff --git a/app/components/header/Header.tsx b/app/components/header/Header.tsx index 1d004407..c0b33596 100644 --- a/app/components/header/Header.tsx +++ b/app/components/header/Header.tsx @@ -45,10 +45,10 @@ export function Header() { {chatStarted && ( <> - + {() => } - + {() => } From 5e0be4c26db6b048d71aa693e9198d65dac47038 Mon Sep 17 00:00:00 2001 From: Strider Wilson Date: Tue, 10 Jun 2025 14:13:14 -0400 Subject: [PATCH 3/3] lint --- .../header/DeployChat/DeployChatButton.tsx | 2 +- .../DeployChat/components/DeployChatModal.tsx | 256 +++++++++--------- .../components/DeploymentSuccessful.tsx | 56 ++-- 3 files changed, 163 insertions(+), 151 deletions(-) diff --git a/app/components/header/DeployChat/DeployChatButton.tsx b/app/components/header/DeployChat/DeployChatButton.tsx index cc3cea6c..336f8977 100644 --- a/app/components/header/DeployChat/DeployChatButton.tsx +++ b/app/components/header/DeployChat/DeployChatButton.tsx @@ -53,7 +53,7 @@ export function DeployChatButton() { const zipContents = event.target.result as string; const directoryToFind = 'supabase'; - + if (zipContents.includes(directoryToFind)) { setDatabaseFound(true); } else { diff --git a/app/components/header/DeployChat/components/DeployChatModal.tsx b/app/components/header/DeployChat/components/DeployChatModal.tsx index 172ea525..e2510b17 100644 --- a/app/components/header/DeployChat/components/DeployChatModal.tsx +++ b/app/components/header/DeployChat/components/DeployChatModal.tsx @@ -35,16 +35,21 @@ const DeployChatModal = ({ className="fixed inset-0 bg-black bg-opacity-50 backdrop-blur-sm z-40 flex items-center justify-center" onClick={handleOverlayClick} > -
e.stopPropagation()}> +
e.stopPropagation()} + > {status === DeployStatus.Succeeded ? ( - - ) : ( + + ) : ( <>

Deploy Your Application

-

Deploy your chat application to production using Netlify{databaseFound ? ' and Supabase' : ''}.

+

+ Deploy your chat application to production using Netlify{databaseFound ? ' and Supabase' : ''}. +

This process will:

    @@ -59,25 +64,28 @@ const DeployChatModal = ({

    Before you begin:

    - You'll need accounts with both Netlify and {databaseFound ? 'Supabase ' : ''}to deploy your application. If you haven't already, please sign up using the links below: + You'll need accounts with both Netlify and {databaseFound ? 'Supabase ' : ''}to deploy your + application. If you haven't already, please sign up using the links below:

    @@ -215,121 +223,121 @@ const DeployChatModal = ({ {databaseFound && ( <> -
    - -
    -

    - The URL of your Supabase project, used to connect to your database. -

    -
    - { - const supabase = { - databaseURL: e.target.value, - anonKey: deploySettings?.supabase?.anonKey || '', - serviceRoleKey: deploySettings?.supabase?.serviceRoleKey || '', - postgresURL: deploySettings?.supabase?.postgresURL || '', - }; - setDeploySettings({ - ...deploySettings, - supabase, - }); - }} - /> +
    + +
    +

    + The URL of your Supabase project, used to connect to your database. +

    + { + const supabase = { + databaseURL: e.target.value, + anonKey: deploySettings?.supabase?.anonKey || '', + serviceRoleKey: deploySettings?.supabase?.serviceRoleKey || '', + postgresURL: deploySettings?.supabase?.postgresURL || '', + }; + setDeploySettings({ + ...deploySettings, + supabase, + }); + }} + /> +
    -
    - -
    -

    - Public API key for client-side database access with restricted permissions. -

    -
    - { - const supabase = { - databaseURL: deploySettings?.supabase?.databaseURL || '', - anonKey: e.target.value, - serviceRoleKey: deploySettings?.supabase?.serviceRoleKey || '', - postgresURL: deploySettings?.supabase?.postgresURL || '', - }; - setDeploySettings({ - ...deploySettings, - supabase, - }); - }} - /> +
    + +
    +

    + Public API key for client-side database access with restricted permissions. +

    + { + const supabase = { + databaseURL: deploySettings?.supabase?.databaseURL || '', + anonKey: e.target.value, + serviceRoleKey: deploySettings?.supabase?.serviceRoleKey || '', + postgresURL: deploySettings?.supabase?.postgresURL || '', + }; + setDeploySettings({ + ...deploySettings, + supabase, + }); + }} + /> +
    -
    - -
    -

    - Admin API key for server-side operations with full database access. -

    -
    - { - const supabase = { - databaseURL: deploySettings?.supabase?.databaseURL || '', - anonKey: deploySettings?.supabase?.anonKey || '', - serviceRoleKey: e.target.value, - postgresURL: deploySettings?.supabase?.postgresURL || '', - }; - setDeploySettings({ - ...deploySettings, - supabase, - }); - }} - /> +
    + +
    +

    + Admin API key for server-side operations with full database access. +

    + { + const supabase = { + databaseURL: deploySettings?.supabase?.databaseURL || '', + anonKey: deploySettings?.supabase?.anonKey || '', + serviceRoleKey: e.target.value, + postgresURL: deploySettings?.supabase?.postgresURL || '', + }; + setDeploySettings({ + ...deploySettings, + supabase, + }); + }} + /> +
    -
    - -
    -

    - Direct connection URL to your Postgres database for advanced operations. -

    -
    - { - const supabase = { - databaseURL: deploySettings?.supabase?.databaseURL || '', - anonKey: deploySettings?.supabase?.anonKey || '', - serviceRoleKey: deploySettings?.supabase?.serviceRoleKey || '', - postgresURL: e.target.value, - }; - setDeploySettings({ - ...deploySettings, - supabase, - }); - }} - /> +
    + +
    +

    + Direct connection URL to your Postgres database for advanced operations. +

    + { + const supabase = { + databaseURL: deploySettings?.supabase?.databaseURL || '', + anonKey: deploySettings?.supabase?.anonKey || '', + serviceRoleKey: deploySettings?.supabase?.serviceRoleKey || '', + postgresURL: e.target.value, + }; + setDeploySettings({ + ...deploySettings, + supabase, + }); + }} + /> +
    )}
    diff --git a/app/components/header/DeployChat/components/DeploymentSuccessful.tsx b/app/components/header/DeployChat/components/DeploymentSuccessful.tsx index fa6f7bcb..d56d986a 100644 --- a/app/components/header/DeployChat/components/DeploymentSuccessful.tsx +++ b/app/components/header/DeployChat/components/DeploymentSuccessful.tsx @@ -1,29 +1,33 @@ -const DeploymentSuccessful = ({ deploySettings, setIsModalOpen }: { deploySettings: any, setIsModalOpen: (isOpen: boolean) => void }) => { - return ( - <> -

    - Deployment Succeeded! 🎉 -

    -
    -

    - Your application has been successfully deployed. You can now access it at the URL below. -

    -
    - - - - -
    -
    - - ); +const DeploymentSuccessful = ({ + deploySettings, + setIsModalOpen, +}: { + deploySettings: any; + setIsModalOpen: (isOpen: boolean) => void; +}) => { + return ( + <> +

    Deployment Succeeded! 🎉

    +
    +

    + Your application has been successfully deployed. You can now access it at the URL below. +

    +
    + + + + +
    +
    + + ); }; export default DeploymentSuccessful;