improvement(deployed preview): fixed webhook config that was causing workflow failure in deployed state (#332)

* solved the error for deployed workflow

* updated webhook-config to update DB upon webhook deletion

sim/app/w/[id]/components/workflow-block/components/sub-block/components/webhook/webhook-config.tsx

@@ -13,6 +13,7 @@ import {
 import { Button } from '@/components/ui/button'
 import { createLogger } from '@/lib/logs/console-logger'
 import { useWorkflowStore } from '@/stores/workflows/workflow/store'
+import { useSubBlockStore } from '@/stores/workflows/subblock/store'
 import { useSubBlockValue } from '../../hooks/use-sub-block-value'
 import { WebhookModal } from './components/webhook-modal'
 
@@ -412,11 +413,36 @@ export function WebhookConfig({ blockId, subBlockId, isConnecting }: WebhookConf
         throw new Error(errorData.error || 'Failed to delete webhook')
       }
 
-      // Clear the webhook ID and actual provider
+      // Reset the startWorkflow field to manual
+      useSubBlockStore.getState().setValue(blockId, 'startWorkflow', 'manual')
+
+      // Remove webhook-specific fields from the block state
+      const store = useSubBlockStore.getState()
+      const workflowValues = store.workflowValues[workflowId] || {}
+      const blockValues = { ...workflowValues[blockId] }
+
+      // Remove webhook-related fields
+      delete blockValues.webhookProvider
+      delete blockValues.providerConfig
+      blockValues.webhookPath = ''
+
+      // Update the store with the cleaned block values
+      store.setValue(blockId, 'startWorkflow', 'manual')
+      useSubBlockStore.setState({
+        workflowValues: {
+          ...workflowValues,
+          [workflowId]: {
+            ...workflowValues,
+            [blockId]: blockValues
+          }
+        }
+      })
+
+      // Clear component state
       setWebhookId(null)
       setActualProvider(null)
 
-      // Set active webhook flag to false after deletion
+      // Set active webhook flag to false
       setWebhookStatus(false)
       handleCloseModal()
 

sim/app/w/components/workflow-preview/generic-workflow-preview.tsx

@@ -134,7 +134,11 @@ function PreviewSubBlock({ config }: { config: ExtendedSubBlockConfig }) {
       case 'short-input':
         return (
           <div className="h-7 rounded-md border border-input bg-background px-3 py-1.5 text-xs text-muted-foreground">
-            {config.password ? '**********************' : (config.value || config.placeholder || 'Text input')}
+            {config.password ? '**********************' : 
+              (config.id === 'providerConfig' && config.value && typeof config.value === 'object')
+                ? (Object.keys(config.value).length === 0 ? 'Webhook pending configuration' : 'Webhook configured')
+                : (config.value || config.placeholder || 'Text input')
+            }
           </div>
         )
       case 'long-input':

sim/stores/workflows/workflow/store.ts

@@ -677,9 +677,42 @@ export const useWorkflowStore = create<WorkflowStoreWithHistory>()(
           loops: deployedState.loops,
           isDeployed: true,
           needsRedeployment: false,
+          hasActiveWebhook: false // Reset webhook status
         }
         
+        // Update the main workflow state
         set(newState)
+        
+        // Get the active workflow ID
+        const activeWorkflowId = useWorkflowRegistry.getState().activeWorkflowId
+        if (!activeWorkflowId) return
+
+        // Initialize subblock store with values from deployed state
+        const subBlockStore = useSubBlockStore.getState()
+        const values: Record<string, Record<string, any>> = {}
+        
+        // Extract subblock values from deployed blocks
+        Object.entries(deployedState.blocks).forEach(([blockId, block]) => {
+          values[blockId] = {}
+          Object.entries(block.subBlocks || {}).forEach(([subBlockId, subBlock]) => {
+            values[blockId][subBlockId] = subBlock.value
+          })
+        })
+
+        // Update subblock store with deployed values
+        useSubBlockStore.setState({
+          workflowValues: {
+            ...subBlockStore.workflowValues,
+            [activeWorkflowId]: values
+          }
+        })
+
+        // Check if there's an active webhook in the deployed state
+        const starterBlock = Object.values(deployedState.blocks).find(block => block.type === 'starter')
+        if (starterBlock && starterBlock.subBlocks?.startWorkflow?.value === 'webhook') {
+          set({ hasActiveWebhook: true })
+        }
+        
         pushHistory(set, get, newState, 'Reverted to deployed state')
         get().updateLastSaved()
         workflowSync.sync()