fix(chat-deploy): fixed hanging deployment state, fixed x tools, fixed credentials styling (#303)

* fix(ui): standardize flex for credentials component

* fixed hanging deploy request for chat deploy, configured & tested DNS subdomain deployment

* fixed x endpoints

Author: waleedlatif1

sim/app/w/[id]/components/control-bar/components/deploy-modal/components/chat-deploy/chat-deploy.tsx

@@ -48,6 +48,7 @@ interface ChatDeployProps {
   onChatExistsChange?: (exists: boolean) => void
   showDeleteConfirmation?: boolean
   setShowDeleteConfirmation?: (show: boolean) => void
+  onDeploymentComplete?: () => void
 }
 
 type AuthType = 'public' | 'password' | 'email'
@@ -81,6 +82,7 @@ export function ChatDeploy({
   onChatExistsChange,
   showDeleteConfirmation: externalShowDeleteConfirmation,
   setShowDeleteConfirmation: externalSetShowDeleteConfirmation,
+  onDeploymentComplete,
 }: ChatDeployProps) {
   // Store hooks
   const { addNotification } = useNotificationStore()
@@ -703,6 +705,14 @@ export function ChatDeploy({
       if (chatUrl) {
         logger.info(`Chat ${existingChat ? 'updated' : 'deployed'} successfully:`, chatUrl)
         setDeployedChatUrl(chatUrl)
+        
+        if (onDeploymentComplete) {
+          onDeploymentComplete()
+        }
+        
+        if (onChatExistsChange) {
+          onChatExistsChange(true)
+        }
       } else {
         throw new Error('Response missing chatUrl')
       }
@@ -810,7 +820,7 @@ export function ChatDeploy({
               {domainSuffix}
             </div>
           </div>
-          <p className="text-xs text-muted-foreground">Your chat is now live at this URL</p>
+          <p className="text-xs text-muted-foreground">Your chat is now live at <a href={deployedChatUrl} target="_blank" rel="noopener noreferrer" className="text-primary hover:underline">this URL</a></p>
         </div>
       </div>
     )

sim/app/w/[id]/components/control-bar/components/deploy-modal/deploy-modal.tsx

@@ -495,6 +495,10 @@ export function DeployModal({
     }
   }
 
+  const handleChatDeploymentComplete = () => {
+    setChatSubmitting(false);
+  };
+
   // Render deployed chat view
   const renderDeployedChatView = () => {
     if (!deployedChatUrl) {
@@ -618,6 +622,7 @@ export function DeployModal({
                   onChatExistsChange={setChatExists}
                   showDeleteConfirmation={showDeleteConfirmation}
                   setShowDeleteConfirmation={setShowDeleteConfirmation}
+                  onDeploymentComplete={handleChatDeploymentComplete}
                 />
               )}
             </div>

sim/app/w/components/sidebar/components/settings-modal/components/credentials/credentials.tsx

@@ -374,26 +374,26 @@ export function Credentials({ onOpenChange }: CredentialsProps) {
                     )}
                     ref={pendingService === service.id ? pendingServiceRef : undefined}
                   >
-                    <div className="flex items-start justify-between gap-4">
-                      <div className="flex items-start gap-4">
+                    <div className="flex items-start w-full gap-4">
+                      <div className="flex items-start gap-4 w-full">
                         <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-muted shrink-0">
                           {typeof service.icon === 'function'
                             ? service.icon({ className: 'h-5 w-5' })
                             : service.icon}
                         </div>
-                        <div className="space-y-1">
+                        <div className="space-y-1 w-full">
                           <div>
                             <h4 className="font-medium leading-none">{service.name}</h4>
                             <p className="text-sm text-muted-foreground mt-1">
                               {service.description}
                             </p>
                           </div>
                           {service.accounts && service.accounts.length > 0 && (
-                            <div className="pt-3 space-y-2">
+                            <div className="pt-3 space-y-2 w-full">
                               {service.accounts.map((account) => (
                                 <div
                                   key={account.id}
-                                  className="flex items-center justify-between gap-2 rounded-md border bg-card/50 p-2"
+                                  className="flex items-center justify-between gap-2 rounded-md border bg-card/50 p-2 w-full"
                                 >
                                   <div className="flex items-center gap-2">
                                     <div className="h-6 w-6 rounded-full bg-green-500/10 flex items-center justify-center">
@@ -441,22 +441,24 @@ export function Credentials({ onOpenChange }: CredentialsProps) {
                       </div>
 
                       {!service.accounts?.length && (
-                        <Button
-                          variant="default"
-                          size="sm"
-                          onClick={() => handleConnect(service)}
-                          disabled={isConnecting === service.id}
-                          className="shrink-0"
-                        >
-                          {isConnecting === service.id ? (
-                            <>
-                              <RefreshCw className="h-4 w-4 animate-spin mr-2" />
-                              Connecting...
-                            </>
-                          ) : (
-                            'Connect'
-                          )}
-                        </Button>
+                        <div className="flex justify-end ml-auto">
+                          <Button
+                            variant="default"
+                            size="sm"
+                            onClick={() => handleConnect(service)}
+                            disabled={isConnecting === service.id}
+                            className="shrink-0"
+                          >
+                            {isConnecting === service.id ? (
+                              <>
+                                <RefreshCw className="h-4 w-4 animate-spin mr-2" />
+                                Connecting...
+                              </>
+                            ) : (
+                              'Connect'
+                            )}
+                          </Button>
+                        </div>
                       )}
                     </div>
                   </Card>

sim/tools/x/read.ts

@@ -42,7 +42,7 @@ export const xReadTool: ToolConfig<XReadParams, XReadResponse> = {
         'attachments.poll_ids',
       ].join(',')
 
-      return `https://api.x.com/2/tweets/${params.tweetId}?expansions=${expansions}`
+      return `https://api.twitter.com/2/tweets/${params.tweetId}?expansions=${expansions}`
     },
     method: 'GET',
     headers: (params) => ({

sim/tools/x/search.ts

@@ -72,7 +72,7 @@ export const xSearchTool: ToolConfig<XSearchParams, XSearchResponse> = {
       if (params.endTime) queryParams.append('end_time', params.endTime)
       if (params.sortOrder) queryParams.append('sort_order', params.sortOrder)
 
-      return `https://api.x.com/2/tweets/search/recent?${queryParams.toString()}`
+      return `https://api.twitter.com/2/tweets/search/recent?${queryParams.toString()}`
     },
     method: 'GET',
     headers: (params) => ({

sim/tools/x/write.ts

@@ -42,7 +42,7 @@ export const xWriteTool: ToolConfig<XWriteParams, XWriteResponse> = {
   },
 
   request: {
-    url: 'https://api.x.com/2/tweets',
+    url: 'https://api.twitter.com/2/tweets',
     method: 'POST',
     headers: (params) => ({
       Authorization: `Bearer ${params.accessToken}`,