feat(blocks): surface deprecated block and model warnings on canvas

Author: TheodoreSpeaks

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

@@ -458,10 +458,11 @@ export const Panel = memo(function Panel() {
 
   useEffect(() => {
     const handler = (e: Event) => {
-      const message = (e as CustomEvent<MothershipSendMessageDetail>).detail?.message
-      if (!message) return
+      const detail = (e as CustomEvent<MothershipSendMessageDetail>).detail
+      if (!detail?.message) return
+      e.preventDefault()
       setActiveTab('copilot')
-      copilotSendMessage(message)
+      copilotSendMessage(detail.message, undefined, detail.contexts)
     }
     window.addEventListener(MOTHERSHIP_SEND_MESSAGE_EVENT, handler)
     return () => window.removeEventListener(MOTHERSHIP_SEND_MESSAGE_EVENT, handler)

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

@@ -3,11 +3,14 @@ import { createLogger } from '@sim/logger'
 import { SubBlockRowView, WorkflowBlockView } from '@sim/workflow-renderer'
 import { isEqual } from 'es-toolkit'
 import { useParams } from 'next/navigation'
+import { usePostHog } from 'posthog-js/react'
 import { type NodeProps, useUpdateNodeInternals } from 'reactflow'
 import { useStoreWithEqualityFn } from 'zustand/traditional'
 import { getBaseUrl } from '@/lib/core/utils/urls'
 import { createMcpToolId } from '@/lib/mcp/shared'
+import { sendMothershipMessage } from '@/lib/mothership/events'
 import { getProviderIdFromServiceId } from '@/lib/oauth'
+import { captureEvent } from '@/lib/posthog/client'
 import { calculateWorkflowBlockDimensions } from '@/lib/workflows/blocks/deterministic-dimensions'
 import { getConditionRows, getRouterRows } from '@/lib/workflows/dynamic-handle-topology'
 import {
@@ -45,6 +48,7 @@ import {
 import { useBlockVisual } from '@/app/workspace/[workspaceId]/w/[workflowId]/hooks'
 import { useBlockDimensions } from '@/app/workspace/[workspaceId]/w/[workflowId]/hooks/use-block-dimensions'
 import { useCustomBlockOverlayVersion } from '@/blocks/custom/client-overlay'
+import { getBlock } from '@/blocks/registry'
 import { SELECTOR_TYPES_HYDRATION_REQUIRED, type SubBlockConfig } from '@/blocks/types'
 import { getDependsOnFields } from '@/blocks/utils'
 import { useKnowledgeBase } from '@/hooks/kb/use-knowledge'
@@ -58,6 +62,7 @@ import { useTablesList } from '@/hooks/queries/tables'
 import { useWorkflowMap } from '@/hooks/queries/workflows'
 import { useReactiveConditions } from '@/hooks/use-reactive-conditions'
 import { useSelectorDisplayName } from '@/hooks/use-selector-display-name'
+import { getModelReplacement, isModelDeprecated } from '@/providers/models'
 import { useVariablesStore } from '@/stores/variables/store'
 import { useSubBlockStore } from '@/stores/workflows/subblock/store'
 import { useWorkflowStore } from '@/stores/workflows/workflow/store'
@@ -479,6 +484,55 @@ export const WorkflowBlock = memo(function WorkflowBlock({
     ),
     isEqual
   )
+
+  const posthog = usePostHog()
+
+  const deprecation = useMemo(() => {
+    if (currentWorkflow.isDiffMode) return null
+
+    const replacedBy = config.deprecated?.replacedBy
+    if (replacedBy) {
+      const target = getBlock(replacedBy)
+      if (!target) return null
+      const hasModel = config.subBlocks?.some((sub) => sub.id === 'model')
+      return {
+        kind: 'block' as const,
+        tooltip: 'This block is deprecated. Click to upgrade',
+        prompt: `The "${name}" block is deprecated. Migrate it to the current ${target.name} block: change the block type, then set the new block's required inputs as a separate edit (inputs are validated against the old type when sent in the same edit), or delete it and re-add ${target.name} and rewire the connections.${hasModel ? ' Also pick a current, non-deprecated model.' : ''}`,
+      }
+    }
+
+    const model = blockSubBlockValues.model
+    if (typeof model === 'string' && isModelDeprecated(model)) {
+      if (!getModelReplacement(model)) return null
+      return {
+        kind: 'model' as const,
+        tooltip: `${model} is deprecated. Click to upgrade`,
+        prompt: `The "${name}" block uses the deprecated model "${model}". Switch it to the latest equivalent model.`,
+      }
+    }
+
+    return null
+  }, [
+    config.deprecated,
+    config.subBlocks,
+    name,
+    blockSubBlockValues.model,
+    currentWorkflow.isDiffMode,
+  ])
+
+  const onFixDeprecation = useCallback(() => {
+    if (!deprecation) return
+    captureEvent(posthog, 'deprecated_block_fix_clicked', {
+      block_type: type,
+      workflow_id: currentWorkflowId,
+      kind: deprecation.kind,
+    })
+    sendMothershipMessage(deprecation.prompt, [
+      { kind: 'workflow_block', workflowId: currentWorkflowId, blockId: id, label: name },
+    ])
+  }, [deprecation, posthog, type, currentWorkflowId, id, name])
+
   const canonicalIndex = useMemo(() => buildCanonicalIndex(config.subBlocks), [config.subBlocks])
   const canonicalModeOverrides = currentStoreBlock?.data?.canonicalModes
 
@@ -798,6 +852,9 @@ export const WorkflowBlock = memo(function WorkflowBlock({
           deployChildWorkflow({ workflowId: childWorkflowId })
         }
       }}
+      deprecationTooltip={deprecation?.tooltip}
+      canFixDeprecation={canEditWorkflow}
+      onFixDeprecation={onFixDeprecation}
       shouldShowScheduleBadge={shouldShowScheduleBadge}
       scheduleIsDisabled={Boolean(scheduleInfo?.isDisabled)}
       onReactivateSchedule={() => {

apps/sim/blocks/blocks/api_trigger.ts

@@ -15,6 +15,7 @@ export const ApiTriggerBlock: BlockConfig = {
   `,
   category: 'triggers',
   hideFromToolbar: true,
+  deprecated: { replacedBy: 'start_trigger' },
   bgColor: '#2F55FF',
   icon: ApiIcon,
   subBlocks: [

apps/sim/blocks/blocks/chat_trigger.ts

@@ -16,6 +16,7 @@ export const ChatTriggerBlock: BlockConfig = {
   `,
   category: 'triggers',
   hideFromToolbar: true,
+  deprecated: { replacedBy: 'start_trigger' },
   bgColor: '#6F3DFA',
   icon: ChatTriggerIcon,
   subBlocks: [],

apps/sim/blocks/blocks/confluence.ts

@@ -12,6 +12,7 @@ export const ConfluenceBlock: BlockConfig<ConfluenceResponse> = {
   name: 'Confluence (Legacy)',
   description: 'Interact with Confluence',
   hideFromToolbar: true,
+  deprecated: { replacedBy: 'confluence_v2' },
   authMode: AuthMode.OAuth,
   longDescription:
     'Integrate Confluence into the workflow. Can read, create, update, delete pages, manage comments, attachments, labels, and search content.',
@@ -360,6 +361,7 @@ export const ConfluenceBlock: BlockConfig<ConfluenceResponse> = {
 
 export const ConfluenceV2Block: BlockConfig<ConfluenceResponse> = {
   ...ConfluenceBlock,
+  deprecated: undefined,
   type: 'confluence_v2',
   name: 'Confluence',
   hideFromToolbar: false,

apps/sim/blocks/blocks/cursor.ts

@@ -17,6 +17,7 @@ export const CursorBlock: BlockConfig<CursorResponse> = {
   icon: CursorIcon,
   authMode: AuthMode.ApiKey,
   hideFromToolbar: true,
+  deprecated: { replacedBy: 'cursor_v2' },
   subBlocks: [
     {
       id: 'operation',
@@ -223,6 +224,7 @@ export const CursorBlock: BlockConfig<CursorResponse> = {
 
 export const CursorV2Block: BlockConfig<CursorResponse> = {
   ...CursorBlock,
+  deprecated: undefined,
   type: 'cursor_v2',
   name: 'Cursor',
   description: 'Launch and manage Cursor cloud agents to work on GitHub repositories',

apps/sim/blocks/blocks/extend.ts

@@ -14,6 +14,7 @@ export const ExtendBlock: BlockConfig<ExtendParserOutput> = {
   name: 'Extend',
   description: 'Parse and extract content from documents',
   hideFromToolbar: true,
+  deprecated: { replacedBy: 'extend_v2' },
   authMode: AuthMode.ApiKey,
   longDescription:
     'Integrate Extend AI into the workflow. Parse and extract structured content from documents including PDFs, images, and Office files.',
@@ -165,6 +166,7 @@ const extendV2SubBlocks = (ExtendBlock.subBlocks || []).flatMap((subBlock) => {
 
 export const ExtendV2Block: BlockConfig<ExtendParserOutput> = {
   ...ExtendBlock,
+  deprecated: undefined,
   type: 'extend_v2',
   name: 'Extend',
   hideFromToolbar: false,

apps/sim/blocks/blocks/file.ts

@@ -78,6 +78,7 @@ export const FileBlock: BlockConfig<FileParserOutput> = {
   bgColor: '#40916C',
   icon: DocumentIcon,
   hideFromToolbar: true,
+  deprecated: { replacedBy: 'file_v5' },
   subBlocks: [
     {
       id: 'inputMethod',
@@ -185,6 +186,7 @@ export const FileV2Block: BlockConfig<FileParserOutput> = {
   name: 'File (Legacy)',
   description: 'Read and parse multiple files',
   hideFromToolbar: true,
+  deprecated: { replacedBy: 'file_v5' },
   subBlocks: [
     {
       id: 'file',
@@ -278,6 +280,7 @@ export const FileV3Block: BlockConfig<FileParserV3Output> = {
   bgColor: '#40916C',
   icon: DocumentIcon,
   hideFromToolbar: true,
+  deprecated: { replacedBy: 'file_v5' },
   subBlocks: [
     {
       id: 'operation',
@@ -568,6 +571,7 @@ export const FileV4Block: BlockConfig<FileParserV3Output> = {
   longDescription:
     'Read workspace files by picker or canonical ID, fetch and parse files from URLs with optional headers, write new workspace files, or append content to existing files.',
   hideFromToolbar: true,
+  deprecated: { replacedBy: 'file_v5' },
   bestPractices: `
   - Use Read when you need an existing workspace file object by picker selection or canonical file ID.
   - Use Fetch for external file URLs. Add headers for authenticated downloads, for example Slack private file URLs require an Authorization Bearer token.
@@ -820,6 +824,7 @@ export const FileV4Block: BlockConfig<FileParserV3Output> = {
 
 export const FileV5Block: BlockConfig<FileParserV3Output> = {
   ...FileV4Block,
+  deprecated: undefined,
   type: 'file_v5',
   name: 'File',
   description:

apps/sim/blocks/blocks/fireflies.ts

@@ -11,6 +11,7 @@ export const FirefliesBlock: BlockConfig<FirefliesResponse> = {
   name: 'Fireflies (Legacy)',
   description: 'Interact with Fireflies.ai meeting transcripts and recordings',
   hideFromToolbar: true,
+  deprecated: { replacedBy: 'fireflies_v2' },
   authMode: AuthMode.ApiKey,
   triggerAllowed: true,
   longDescription:
@@ -646,6 +647,7 @@ const firefliesV2Inputs = FirefliesBlock.inputs
 
 export const FirefliesV2Block: BlockConfig<FirefliesResponse> = {
   ...FirefliesBlock,
+  deprecated: undefined,
   type: 'fireflies_v2',
   name: 'Fireflies',
   description: 'Interact with Fireflies.ai meeting transcripts and recordings',

apps/sim/blocks/blocks/github.ts

@@ -20,6 +20,7 @@ export const GitHubBlock: BlockConfig<GitHubResponse> = {
   icon: GithubIcon,
   triggerAllowed: true,
   hideFromToolbar: true,
+  deprecated: { replacedBy: 'github_v2' },
   subBlocks: [
     {
       id: 'operation',
@@ -2102,6 +2103,7 @@ Return ONLY the timestamp string - no explanations, no quotes, no extra text.`,
 
 export const GitHubV2Block: BlockConfig<GitHubResponse> = {
   ...GitHubBlock,
+  deprecated: undefined,
   type: 'github_v2',
   name: 'GitHub',
   hideFromToolbar: false,