fix(dropdown): simplify & fix tag dropdown for parallel & loop blocks (#634)

* fix(dropdown): simplify & fix tag dropdown for parallel & loop blocks

* fixed build

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/components/connection-blocks/connection-blocks.tsx

@@ -1,3 +1,4 @@
+import { RepeatIcon, SplitIcon } from 'lucide-react'
 import { Card } from '@/components/ui/card'
 import { cn } from '@/lib/utils'
 import {
@@ -77,8 +78,20 @@ export function ConnectionBlocks({
     // Get block configuration for icon and color
     const blockConfig = getBlock(connection.type)
     const displayName = connection.name // Use the actual block name instead of transforming it
-    const Icon = blockConfig?.icon
-    const bgColor = blockConfig?.bgColor || '#6B7280' // Fallback to gray
+
+    // Handle special blocks that aren't in the registry (loop and parallel)
+    let Icon = blockConfig?.icon
+    let bgColor = blockConfig?.bgColor || '#6B7280' // Fallback to gray
+
+    if (!blockConfig) {
+      if (connection.type === 'loop') {
+        Icon = RepeatIcon as typeof Icon
+        bgColor = '#2FB3FF' // Blue color for loop blocks
+      } else if (connection.type === 'parallel') {
+        Icon = SplitIcon as typeof Icon
+        bgColor = '#FEE12B' // Yellow color for parallel blocks
+      }
+    }
 
     return (
       <Card

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/hooks/use-block-connections.ts

@@ -104,10 +104,8 @@ export function useBlockConnections(blockId: string) {
       // Get the response format from the subblock store
       const responseFormatValue = useSubBlockStore.getState().getValue(sourceId, 'responseFormat')
 
-      let responseFormat
-
       // Safely parse response format with proper error handling
-      responseFormat = parseResponseFormatSafely(responseFormatValue, sourceId)
+      const responseFormat = parseResponseFormatSafely(responseFormatValue, sourceId)
 
       // Get the default output type from the block's outputs
       const defaultOutputs: Field[] = Object.entries(sourceBlock.outputs || {}).map(([key]) => ({
@@ -140,10 +138,8 @@ export function useBlockConnections(blockId: string) {
         .getState()
         .getValue(edge.source, 'responseFormat')
 
-      let responseFormat
-
       // Safely parse response format with proper error handling
-      responseFormat = parseResponseFormatSafely(responseFormatValue, edge.source)
+      const responseFormat = parseResponseFormatSafely(responseFormatValue, edge.source)
 
       // Get the default output type from the block's outputs
       const defaultOutputs: Field[] = Object.entries(sourceBlock.outputs || {}).map(([key]) => ({