fix(chat-deploy): fix launch chat popup and auth persistence, clean up React anti-patterns

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/deploy/components/deploy-modal/components/chat/chat.tsx

@@ -108,7 +108,6 @@ export function ChatDeploy({
   onVersionActivated,
 }: ChatDeployProps) {
   const [imageUrl, setImageUrl] = useState<string | null>(null)
-  const [isDeleting, setIsDeleting] = useState(false)
   const [internalShowDeleteConfirmation, setInternalShowDeleteConfirmation] = useState(false)
 
   const showDeleteConfirmation =
@@ -122,6 +121,7 @@ export function ChatDeploy({
   const [formData, setFormData] = useState<ChatFormData>(initialFormData)
   const [errors, setErrors] = useState<FormErrors>({})
   const formRef = useRef<HTMLFormElement>(null)
+  const [formInitCounter, setFormInitCounter] = useState(0)
 
   const createChatMutation = useCreateChat()
   const updateChatMutation = useUpdateChat()
@@ -222,13 +222,20 @@ export function ChatDeploy({
 
     setChatSubmitting(true)
 
+    const isNewChat = !existingChat?.id
+
+    // Open window before async operation to avoid popup blockers
+    const newTab = isNewChat ? window.open('', '_blank') : null
+
     try {
       if (!validateForm(!!existingChat)) {
+        newTab?.close()
         setChatSubmitting(false)
         return
       }
 
       if (!isIdentifierValid && formData.identifier !== existingChat?.identifier) {
+        newTab?.close()
         setError('identifier', 'Please wait for identifier validation to complete')
         setChatSubmitting(false)
         return
@@ -257,13 +264,18 @@ export function ChatDeploy({
       onDeployed?.()
       onVersionActivated?.()
 
-      if (chatUrl) {
-        window.open(chatUrl, '_blank', 'noopener,noreferrer')
+      if (newTab && chatUrl) {
+        newTab.opener = null
+        newTab.location.href = chatUrl
+      } else if (newTab) {
+        newTab.close()
       }
 
-      setHasInitializedForm(false)
       await onRefetchChat()
+      setHasInitializedForm(false)
+      setFormInitCounter((c) => c + 1)
     } catch (error: any) {
+      newTab?.close()
       if (error.message?.includes('identifier')) {
         setError('identifier', error.message)
       } else {
@@ -278,23 +290,21 @@ export function ChatDeploy({
     if (!existingChat || !existingChat.id) return
 
     try {
-      setIsDeleting(true)
-
       await deleteChatMutation.mutateAsync({
         chatId: existingChat.id,
         workflowId,
       })
 
       setImageUrl(null)
       setHasInitializedForm(false)
+      setFormInitCounter((c) => c + 1)
       await onRefetchChat()
 
       onDeploymentComplete?.()
     } catch (error: any) {
       logger.error('Failed to delete chat:', error)
       setError('general', error.message || 'An unexpected error occurred while deleting')
     } finally {
-      setIsDeleting(false)
       setShowDeleteConfirmation(false)
     }
   }
@@ -363,7 +373,7 @@ export function ChatDeploy({
           </div>
 
           <AuthSelector
-            key={existingChat?.id ?? 'new'}
+            key={`${existingChat?.id ?? 'new'}-${formInitCounter}`}
             authType={formData.authType}
             password={formData.password}
             emails={formData.emails}
@@ -424,12 +434,16 @@ export function ChatDeploy({
             <Button
               variant='default'
               onClick={() => setShowDeleteConfirmation(false)}
-              disabled={isDeleting}
+              disabled={deleteChatMutation.isPending}
             >
               Cancel
             </Button>
-            <Button variant='destructive' onClick={handleDelete} disabled={isDeleting}>
-              {isDeleting ? 'Deleting...' : 'Delete'}
+            <Button
+              variant='destructive'
+              onClick={handleDelete}
+              disabled={deleteChatMutation.isPending}
+            >
+              {deleteChatMutation.isPending ? 'Deleting...' : 'Delete'}
             </Button>
           </ModalFooter>
         </ModalContent>
@@ -620,6 +634,12 @@ function AuthSelector({
     emails.map((email) => ({ value: email, isValid: true }))
   )
 
+  useEffect(() => {
+    if (!copySuccess) return
+    const timer = setTimeout(() => setCopySuccess(false), 2000)
+    return () => clearTimeout(timer)
+  }, [copySuccess])
+
   const handleGeneratePassword = () => {
     const newPassword = generatePassword(24)
     onPasswordChange(newPassword)
@@ -628,7 +648,6 @@ function AuthSelector({
   const copyToClipboard = (text: string) => {
     navigator.clipboard.writeText(text)
     setCopySuccess(true)
-    setTimeout(() => setCopySuccess(false), 2000)
   }
 
   const addEmail = (email: string): boolean => {

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/deploy/components/deploy-modal/deploy-modal.tsx

@@ -1,6 +1,6 @@
 'use client'
 
-import { useCallback, useEffect, useMemo, useState } from 'react'
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { createLogger } from '@sim/logger'
 import { useQueryClient } from '@tanstack/react-query'
 import {
@@ -113,6 +113,7 @@ export function DeployModal({
   const [showA2aDeleteConfirm, setShowA2aDeleteConfirm] = useState(false)
 
   const [chatSuccess, setChatSuccess] = useState(false)
+  const chatSuccessTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null)
 
   const [isCreateKeyModalOpen, setIsCreateKeyModalOpen] = useState(false)
   const [isApiInfoModalOpen, setIsApiInfoModalOpen] = useState(false)
@@ -232,6 +233,12 @@ export function DeployModal({
       setActiveTab('general')
       setDeployError(null)
       setDeployWarnings([])
+      setChatSuccess(false)
+    }
+    return () => {
+      if (chatSuccessTimeoutRef.current) {
+        clearTimeout(chatSuccessTimeoutRef.current)
+      }
     }
   }, [open, workflowId])
 
@@ -377,15 +384,16 @@ export function DeployModal({
   const handleChatDeployed = useCallback(async () => {
     if (!workflowId) return
 
-    queryClient.invalidateQueries({ queryKey: deploymentKeys.info(workflowId) })
     queryClient.invalidateQueries({ queryKey: deploymentKeys.versions(workflowId) })
-    queryClient.invalidateQueries({ queryKey: deploymentKeys.chatStatus(workflowId) })
 
     await refetchDeployedState()
     useWorkflowRegistry.getState().setWorkflowNeedsRedeployment(workflowId, false)
 
+    if (chatSuccessTimeoutRef.current) {
+      clearTimeout(chatSuccessTimeoutRef.current)
+    }
     setChatSuccess(true)
-    setTimeout(() => setChatSuccess(false), 2000)
+    chatSuccessTimeoutRef.current = setTimeout(() => setChatSuccess(false), 2000)
   }, [workflowId, queryClient, refetchDeployedState])
 
   const handleRefetchChat = useCallback(async () => {
@@ -394,14 +402,7 @@ export function DeployModal({
 
   const handleChatFormSubmit = useCallback(() => {
     const form = document.getElementById('chat-deploy-form') as HTMLFormElement
-    if (form) {
-      const updateTrigger = form.querySelector('[data-update-trigger]') as HTMLButtonElement
-      if (updateTrigger) {
-        updateTrigger.click()
-      } else {
-        form.requestSubmit()
-      }
-    }
+    form?.requestSubmit()
   }, [])
 
   const handleChatDelete = useCallback(() => {

apps/sim/hooks/queries/deployments.ts

@@ -1,3 +1,4 @@
+import { useCallback } from 'react'
 import { createLogger } from '@sim/logger'
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
 import type { WorkflowDeploymentVersionResponse } from '@/lib/workflows/persistence/utils'
@@ -209,19 +210,21 @@ export function useChatDeploymentInfo(workflowId: string | null, options?: { ena
     enabled: Boolean(chatId) && statusQuery.isSuccess && (options?.enabled ?? true),
   })
 
+  const refetch = useCallback(async () => {
+    const statusResult = await statusQuery.refetch()
+    if (statusResult.data?.deployment?.id) {
+      await detailQuery.refetch()
+    }
+  }, [statusQuery.refetch, detailQuery.refetch])
+
   return {
     isLoading:
       statusQuery.isLoading || Boolean(statusQuery.data?.isDeployed && detailQuery.isLoading),
     isError: statusQuery.isError || detailQuery.isError,
     error: statusQuery.error ?? detailQuery.error,
     chatExists: statusQuery.data?.isDeployed ?? false,
     existingChat: detailQuery.data ?? null,
-    refetch: async () => {
-      await statusQuery.refetch()
-      if (statusQuery.data?.deployment?.id) {
-        await detailQuery.refetch()
-      }
-    },
+    refetch,
   }
 }
 

apps/sim/tools/greenhouse/get-application.ts → apps/sim/tools/greenhouse/get_application.ts

@@ -31,7 +31,7 @@ export const greenhouseGetApplicationTool: ToolConfig<
 
   request: {
     url: (params: GreenhouseGetApplicationParams) =>
-      `https://harvest.greenhouse.io/v1/applications/${params.applicationId}`,
+      `https://harvest.greenhouse.io/v1/applications/${params.applicationId.trim()}`,
     method: 'GET',
     headers: (params: GreenhouseGetApplicationParams) => ({
       Authorization: `Basic ${btoa(`${params.apiKey}:`)}`,

apps/sim/tools/greenhouse/get-candidate.ts → apps/sim/tools/greenhouse/get_candidate.ts

@@ -31,7 +31,7 @@ export const greenhouseGetCandidateTool: ToolConfig<
 
   request: {
     url: (params: GreenhouseGetCandidateParams) =>
-      `https://harvest.greenhouse.io/v1/candidates/${params.candidateId}`,
+      `https://harvest.greenhouse.io/v1/candidates/${params.candidateId.trim()}`,
     method: 'GET',
     headers: (params: GreenhouseGetCandidateParams) => ({
       Authorization: `Basic ${btoa(`${params.apiKey}:`)}`,

apps/sim/tools/greenhouse/get-job.ts → apps/sim/tools/greenhouse/get_job.ts

@@ -25,7 +25,7 @@ export const greenhouseGetJobTool: ToolConfig<GreenhouseGetJobParams, Greenhouse
 
   request: {
     url: (params: GreenhouseGetJobParams) =>
-      `https://harvest.greenhouse.io/v1/jobs/${params.jobId}`,
+      `https://harvest.greenhouse.io/v1/jobs/${params.jobId.trim()}`,
     method: 'GET',
     headers: (params: GreenhouseGetJobParams) => ({
       Authorization: `Basic ${btoa(`${params.apiKey}:`)}`,

apps/sim/tools/greenhouse/get-user.ts → apps/sim/tools/greenhouse/get_user.ts

@@ -25,7 +25,7 @@ export const greenhouseGetUserTool: ToolConfig<GreenhouseGetUserParams, Greenhou
 
     request: {
       url: (params: GreenhouseGetUserParams) =>
-        `https://harvest.greenhouse.io/v1/users/${params.userId}`,
+        `https://harvest.greenhouse.io/v1/users/${params.userId.trim()}`,
       method: 'GET',
       headers: (params: GreenhouseGetUserParams) => ({
         Authorization: `Basic ${btoa(`${params.apiKey}:`)}`,

apps/sim/tools/greenhouse/index.ts

@@ -1,14 +1,14 @@
-import { greenhouseGetApplicationTool } from '@/tools/greenhouse/get-application'
-import { greenhouseGetCandidateTool } from '@/tools/greenhouse/get-candidate'
-import { greenhouseGetJobTool } from '@/tools/greenhouse/get-job'
-import { greenhouseGetUserTool } from '@/tools/greenhouse/get-user'
-import { greenhouseListApplicationsTool } from '@/tools/greenhouse/list-applications'
-import { greenhouseListCandidatesTool } from '@/tools/greenhouse/list-candidates'
-import { greenhouseListDepartmentsTool } from '@/tools/greenhouse/list-departments'
-import { greenhouseListJobStagesTool } from '@/tools/greenhouse/list-job-stages'
-import { greenhouseListJobsTool } from '@/tools/greenhouse/list-jobs'
-import { greenhouseListOfficesTool } from '@/tools/greenhouse/list-offices'
-import { greenhouseListUsersTool } from '@/tools/greenhouse/list-users'
+import { greenhouseGetApplicationTool } from '@/tools/greenhouse/get_application'
+import { greenhouseGetCandidateTool } from '@/tools/greenhouse/get_candidate'
+import { greenhouseGetJobTool } from '@/tools/greenhouse/get_job'
+import { greenhouseGetUserTool } from '@/tools/greenhouse/get_user'
+import { greenhouseListApplicationsTool } from '@/tools/greenhouse/list_applications'
+import { greenhouseListCandidatesTool } from '@/tools/greenhouse/list_candidates'
+import { greenhouseListDepartmentsTool } from '@/tools/greenhouse/list_departments'
+import { greenhouseListJobStagesTool } from '@/tools/greenhouse/list_job_stages'
+import { greenhouseListJobsTool } from '@/tools/greenhouse/list_jobs'
+import { greenhouseListOfficesTool } from '@/tools/greenhouse/list_offices'
+import { greenhouseListUsersTool } from '@/tools/greenhouse/list_users'
 
 export {
   greenhouseGetApplicationTool,

apps/sim/tools/greenhouse/list-candidates.ts → apps/sim/tools/greenhouse/list_candidates.ts

@@ -87,7 +87,7 @@ export const greenhouseListCandidatesTool: ToolConfig<
       if (params.updated_after) url.searchParams.append('updated_after', params.updated_after)
       if (params.updated_before) url.searchParams.append('updated_before', params.updated_before)
       if (params.job_id) url.searchParams.append('job_id', params.job_id)
-      if (params.email) url.searchParams.append('email', params.email)
+      if (params.email) url.searchParams.append('email_address', params.email)
       if (params.candidate_ids) url.searchParams.append('candidate_ids', params.candidate_ids)
       return url.toString()
     },

apps/sim/tools/greenhouse/list-job-stages.ts → apps/sim/tools/greenhouse/list_job_stages.ts

@@ -45,7 +45,7 @@ export const greenhouseListJobStagesTool: ToolConfig<
 
   request: {
     url: (params: GreenhouseListJobStagesParams) => {
-      const url = new URL(`https://harvest.greenhouse.io/v1/jobs/${params.jobId}/stages`)
+      const url = new URL(`https://harvest.greenhouse.io/v1/jobs/${params.jobId.trim()}/stages`)
       if (params.per_page) url.searchParams.append('per_page', String(params.per_page))
       if (params.page) url.searchParams.append('page', String(params.page))
       return url.toString()