fix(socket): sync deploy button state across collaborators (#4206)

* fix(socket): sync deploy button state across collaborators

Broadcast workflow-deployed events via socket so all connected users
invalidate their deployment query cache when any user deploys, undeploys,
activates a version, or triggers a deploy through chat/form endpoints.

* fix(socket): check response status on deployment notification

Log a warning when the socket server returns a non-2xx status for
deployment notifications, matching the pattern in lifecycle.ts.

* improvement(config): consolidate socket server URL into getSocketServerUrl/getSocketUrl

Replace all inline `env.SOCKET_SERVER_URL || 'http://localhost:3002'` and
`getEnv('NEXT_PUBLIC_SOCKET_URL') || 'http://localhost:3002'` with centralized
utility functions in urls.ts, matching the getBaseUrl() pattern.

* improvement(config): consolidate Ollama URL and CSP socket/Ollama hardcodes

Add getOllamaUrl() to urls.ts and replace inline env.OLLAMA_URL fallbacks
in the provider and API route. Update CSP to use getSocketUrl(),
getOllamaUrl(), and a local toWebSocketUrl() helper instead of hardcoded
localhost strings.

* lint

* fix(tests): add missing mocks for new URL utility exports

Update lifecycle, async execute, and chat manage test mocks to include
getSocketServerUrl, getOllamaUrl, and notifySocketDeploymentChanged.

* fix(csp): remove urls.ts import to fix next.config.ts build

CSP is loaded by next.config.ts which transpiles outside the @/ alias
context. Use local constants instead of importing from urls.ts.

* fix(queries): invalidate chat and form status on deployment change

Add chatStatus and formStatus to invalidateDeploymentQueries so all
deployment-related queries refresh when any user deploys or undeploys.

Author: waleedlatif1

apps/sim/app/api/chat/manage/[id]/route.test.ts

@@ -89,6 +89,7 @@ vi.mock('@/lib/workflows/persistence/utils', () => ({
 }))
 vi.mock('@/lib/workflows/orchestration', () => ({
   performChatUndeploy: mockPerformChatUndeploy,
+  notifySocketDeploymentChanged: vi.fn().mockResolvedValue(undefined),
 }))
 vi.mock('drizzle-orm', () => ({
   and: vi.fn((...conditions: unknown[]) => ({ type: 'and', conditions })),

apps/sim/app/api/chat/manage/[id]/route.ts

@@ -9,7 +9,7 @@ import { getSession } from '@/lib/auth'
 import { isDev } from '@/lib/core/config/feature-flags'
 import { encryptSecret } from '@/lib/core/security/encryption'
 import { getEmailDomain } from '@/lib/core/utils/urls'
-import { performChatUndeploy } from '@/lib/workflows/orchestration'
+import { notifySocketDeploymentChanged, performChatUndeploy } from '@/lib/workflows/orchestration'
 import { deployWorkflow } from '@/lib/workflows/persistence/utils'
 import { checkChatAccess } from '@/app/api/chat/utils'
 import { createErrorResponse, createSuccessResponse } from '@/app/api/workflows/utils'
@@ -155,6 +155,7 @@ export async function PATCH(request: NextRequest, { params }: { params: Promise<
         logger.info(
           `Redeployed workflow ${existingChat[0].workflowId} for chat update (v${deployResult.version})`
         )
+        await notifySocketDeploymentChanged(existingChat[0].workflowId)
       }
 
       let encryptedPassword

apps/sim/app/api/form/route.ts

@@ -10,6 +10,7 @@ import { isDev } from '@/lib/core/config/feature-flags'
 import { encryptSecret } from '@/lib/core/security/encryption'
 import { getEmailDomain } from '@/lib/core/utils/urls'
 import { generateId } from '@/lib/core/utils/uuid'
+import { notifySocketDeploymentChanged } from '@/lib/workflows/orchestration'
 import { deployWorkflow } from '@/lib/workflows/persistence/utils'
 import {
   checkWorkflowAccessForFormCreation,
@@ -152,6 +153,8 @@ export async function POST(request: NextRequest) {
         `${workflowRecord.isDeployed ? 'Redeployed' : 'Auto-deployed'} workflow ${workflowId} for form (v${result.version})`
       )
 
+      await notifySocketDeploymentChanged(workflowId)
+
       let encryptedPassword = null
       if (authType === 'password' && password) {
         const { encrypted } = await encryptSecret(password)

apps/sim/app/api/providers/ollama/models/route.ts

@@ -1,11 +1,11 @@
 import { createLogger } from '@sim/logger'
 import { type NextRequest, NextResponse } from 'next/server'
-import { env } from '@/lib/core/config/env'
+import { getOllamaUrl } from '@/lib/core/utils/urls'
 import type { ModelsObject } from '@/providers/ollama/types'
 import { filterBlacklistedModels, isProviderBlacklisted } from '@/providers/utils'
 
 const logger = createLogger('OllamaModelsAPI')
-const OLLAMA_HOST = env.OLLAMA_URL || 'http://localhost:11434'
+const OLLAMA_HOST = getOllamaUrl()
 
 /**
  * Get available Ollama models

apps/sim/app/api/workflows/[id]/execute/route.async.test.ts

@@ -53,6 +53,7 @@ vi.mock('@/lib/core/utils/request', () => ({
 
 vi.mock('@/lib/core/utils/urls', () => ({
   getBaseUrl: vi.fn().mockReturnValue('http://localhost:3000'),
+  getOllamaUrl: vi.fn().mockReturnValue('http://localhost:11434'),
 }))
 
 vi.mock('@/lib/execution/call-chain', () => ({

apps/sim/app/api/workflows/[id]/state/route.ts

@@ -7,6 +7,7 @@ import { z } from 'zod'
 import { checkSessionOrInternalAuth } from '@/lib/auth/hybrid'
 import { env } from '@/lib/core/config/env'
 import { generateRequestId } from '@/lib/core/utils/request'
+import { getSocketServerUrl } from '@/lib/core/utils/urls'
 import { extractAndPersistCustomTools } from '@/lib/workflows/persistence/custom-tools-persistence'
 import {
   loadWorkflowFromNormalizedTables,
@@ -305,8 +306,7 @@ export async function PUT(request: NextRequest, { params }: { params: Promise<{
     logger.info(`[${requestId}] Successfully saved workflow ${workflowId} state in ${elapsed}ms`)
 
     try {
-      const socketUrl = env.SOCKET_SERVER_URL || 'http://localhost:3002'
-      const notifyResponse = await fetch(`${socketUrl}/api/workflow-updated`, {
+      const notifyResponse = await fetch(`${getSocketServerUrl()}/api/workflow-updated`, {
         method: 'POST',
         headers: {
           'Content-Type': 'application/json',

apps/sim/app/workspace/providers/socket-provider.tsx

@@ -13,7 +13,7 @@ import {
 import { createLogger } from '@sim/logger'
 import { useParams } from 'next/navigation'
 import type { Socket } from 'socket.io-client'
-import { getEnv } from '@/lib/core/config/env'
+import { getSocketUrl } from '@/lib/core/utils/urls'
 import { generateId } from '@/lib/core/utils/uuid'
 import {
   type SocketJoinCommand,
@@ -102,6 +102,7 @@ interface SocketContextType {
   onWorkflowDeleted: (handler: (data: any) => void) => void
   onWorkflowReverted: (handler: (data: any) => void) => void
   onWorkflowUpdated: (handler: (data: any) => void) => void
+  onWorkflowDeployed: (handler: (data: any) => void) => void
   onOperationConfirmed: (handler: (data: any) => void) => void
   onOperationFailed: (handler: (data: any) => void) => void
 }
@@ -132,6 +133,7 @@ const SocketContext = createContext<SocketContextType>({
   onWorkflowDeleted: () => {},
   onWorkflowReverted: () => {},
   onWorkflowUpdated: () => {},
+  onWorkflowDeployed: () => {},
   onOperationConfirmed: () => {},
   onOperationFailed: () => {},
 })
@@ -176,6 +178,7 @@ export function SocketProvider({ children, user }: SocketProviderProps) {
     workflowDeleted?: (data: any) => void
     workflowReverted?: (data: any) => void
     workflowUpdated?: (data: any) => void
+    workflowDeployed?: (data: any) => void
     operationConfirmed?: (data: any) => void
     operationFailed?: (data: any) => void
   }>({})
@@ -337,7 +340,7 @@ export function SocketProvider({ children, user }: SocketProviderProps) {
     const initializeSocket = async () => {
       try {
         const { io } = await import('socket.io-client')
-        const socketUrl = getEnv('NEXT_PUBLIC_SOCKET_URL') || 'http://localhost:3002'
+        const socketUrl = getSocketUrl()
 
         logger.info('Attempting to connect to Socket.IO server', {
           url: socketUrl,
@@ -550,6 +553,11 @@ export function SocketProvider({ children, user }: SocketProviderProps) {
           eventHandlers.current.workflowUpdated?.(data)
         })
 
+        socketInstance.on('workflow-deployed', (data) => {
+          logger.info(`Workflow ${data.workflowId} deployment state changed`)
+          eventHandlers.current.workflowDeployed?.(data)
+        })
+
         const rehydrateWorkflowStores = async (workflowId: string, workflowState: any) => {
           const [
             { useOperationQueueStore },
@@ -994,6 +1002,10 @@ export function SocketProvider({ children, user }: SocketProviderProps) {
     eventHandlers.current.workflowUpdated = handler
   }, [])
 
+  const onWorkflowDeployed = useCallback((handler: (data: any) => void) => {
+    eventHandlers.current.workflowDeployed = handler
+  }, [])
+
   const onOperationConfirmed = useCallback((handler: (data: any) => void) => {
     eventHandlers.current.operationConfirmed = handler
   }, [])
@@ -1029,6 +1041,7 @@ export function SocketProvider({ children, user }: SocketProviderProps) {
       onWorkflowDeleted,
       onWorkflowReverted,
       onWorkflowUpdated,
+      onWorkflowDeployed,
       onOperationConfirmed,
       onOperationFailed,
     }),
@@ -1058,6 +1071,7 @@ export function SocketProvider({ children, user }: SocketProviderProps) {
       onWorkflowDeleted,
       onWorkflowReverted,
       onWorkflowUpdated,
+      onWorkflowDeployed,
       onOperationConfirmed,
       onOperationFailed,
     ]

apps/sim/hooks/queries/deployments.ts

@@ -42,6 +42,8 @@ export function invalidateDeploymentQueries(queryClient: QueryClient, workflowId
     queryClient.invalidateQueries({ queryKey: deploymentKeys.info(workflowId) }),
     queryClient.invalidateQueries({ queryKey: deploymentKeys.deployedState(workflowId) }),
     queryClient.invalidateQueries({ queryKey: deploymentKeys.versions(workflowId) }),
+    queryClient.invalidateQueries({ queryKey: deploymentKeys.chatStatus(workflowId) }),
+    queryClient.invalidateQueries({ queryKey: deploymentKeys.formStatus(workflowId) }),
   ])
 }
 

apps/sim/hooks/use-collaborative-workflow.ts

@@ -1,12 +1,14 @@
 import { useCallback, useEffect, useRef } from 'react'
 import { createLogger } from '@sim/logger'
+import { useQueryClient } from '@tanstack/react-query'
 import type { Edge } from 'reactflow'
 import { useShallow } from 'zustand/react/shallow'
 import { useSession } from '@/lib/auth/auth-client'
 import { generateId } from '@/lib/core/utils/uuid'
 import { useSocket } from '@/app/workspace/providers/socket-provider'
 import { getBlock } from '@/blocks'
 import { normalizeName, RESERVED_BLOCK_NAMES } from '@/executor/constants'
+import { invalidateDeploymentQueries } from '@/hooks/queries/deployments'
 import { useUndoRedo } from '@/hooks/use-undo-redo'
 import {
   BLOCK_OPERATIONS,
@@ -34,6 +36,7 @@ import { findAllDescendantNodes, isBlockProtected } from '@/stores/workflows/wor
 const logger = createLogger('CollaborativeWorkflow')
 
 export function useCollaborativeWorkflow() {
+  const queryClient = useQueryClient()
   const undoRedo = useUndoRedo()
   const isUndoRedoInProgress = useRef(false)
   const lastDiffOperationId = useRef<string | null>(null)
@@ -125,6 +128,7 @@ export function useCollaborativeWorkflow() {
     onWorkflowDeleted,
     onWorkflowReverted,
     onWorkflowUpdated,
+    onWorkflowDeployed,
     onOperationConfirmed,
     onOperationFailed,
   } = useSocket()
@@ -645,6 +649,15 @@ export function useCollaborativeWorkflow() {
       }
     }
 
+    const handleWorkflowDeployed = (data: any) => {
+      const { workflowId } = data
+      logger.info(`Workflow ${workflowId} deployment state changed`)
+
+      if (workflowId !== activeWorkflowId) return
+
+      invalidateDeploymentQueries(queryClient, workflowId)
+    }
+
     const handleOperationConfirmed = (data: any) => {
       const { operationId } = data
       logger.debug('Operation confirmed', { operationId })
@@ -664,6 +677,7 @@ export function useCollaborativeWorkflow() {
     onWorkflowDeleted(handleWorkflowDeleted)
     onWorkflowReverted(handleWorkflowReverted)
     onWorkflowUpdated(handleWorkflowUpdated)
+    onWorkflowDeployed(handleWorkflowDeployed)
     onOperationConfirmed(handleOperationConfirmed)
     onOperationFailed(handleOperationFailed)
   }, [
@@ -673,9 +687,11 @@ export function useCollaborativeWorkflow() {
     onWorkflowDeleted,
     onWorkflowReverted,
     onWorkflowUpdated,
+    onWorkflowDeployed,
     onOperationConfirmed,
     onOperationFailed,
     activeWorkflowId,
+    queryClient,
     confirmOperation,
     failOperation,
     emitWorkflowOperation,