fix: show uninstalled plugin nodes in workflow checklist (#29630)

web/app/components/workflow/header/checklist.tsx

@@ -37,9 +37,13 @@ import useNodes from '@/app/components/workflow/store/workflow/use-nodes'
 
 type WorkflowChecklistProps = {
   disabled: boolean
+  showGoTo?: boolean
+  onItemClick?: (item: ChecklistItem) => void
 }
 const WorkflowChecklist = ({
   disabled,
+  showGoTo = true,
+  onItemClick,
 }: WorkflowChecklistProps) => {
   const { t } = useTranslation()
   const [open, setOpen] = useState(false)
@@ -49,9 +53,13 @@ const WorkflowChecklist = ({
   const { handleNodeSelect } = useNodesInteractions()
 
   const handleChecklistItemClick = (item: ChecklistItem) => {
-    if (!item.canNavigate)
+    const goToEnabled = showGoTo && item.canNavigate && !item.disableGoTo
+    if (!goToEnabled)
       return
-    handleNodeSelect(item.id)
+    if (onItemClick)
+      onItemClick(item)
+    else
+      handleNodeSelect(item.id)
     setOpen(false)
   }
 
@@ -116,7 +124,7 @@ const WorkflowChecklist = ({
                           key={node.id}
                           className={cn(
                             'group mb-2 rounded-lg border-[0.5px] border-components-panel-border bg-components-panel-bg shadow-xs last-of-type:mb-0',
-                            node.canNavigate ? 'cursor-pointer' : 'cursor-default opacity-80',
+                            showGoTo && node.canNavigate && !node.disableGoTo ? 'cursor-pointer' : 'cursor-default opacity-80',
                           )}
                           onClick={() => handleChecklistItemClick(node)}
                         >
@@ -130,7 +138,7 @@ const WorkflowChecklist = ({
                               {node.title}
                             </span>
                             {
-                              node.canNavigate && (
+                              (showGoTo && node.canNavigate && !node.disableGoTo) && (
                                 <div className='flex h-4 w-[60px] shrink-0 items-center justify-center gap-1 opacity-0 transition-opacity duration-200 group-hover:opacity-100'>
                                   <span className='whitespace-nowrap text-xs font-medium leading-4 text-primary-600'>
                                     {t('workflow.panel.goTo')}

web/app/components/workflow/hooks/use-checklist.ts

@@ -66,6 +66,7 @@ export type ChecklistItem = {
   unConnected?: boolean
   errorMessage?: string
   canNavigate: boolean
+  disableGoTo?: boolean
 }
 
 const START_NODE_TYPES: BlockEnum[] = [
@@ -75,6 +76,13 @@ const START_NODE_TYPES: BlockEnum[] = [
   BlockEnum.TriggerPlugin,
 ]
 
+// Node types that depend on plugins
+const PLUGIN_DEPENDENT_TYPES: BlockEnum[] = [
+  BlockEnum.Tool,
+  BlockEnum.DataSource,
+  BlockEnum.TriggerPlugin,
+]
+
 export const useChecklist = (nodes: Node[], edges: Edge[]) => {
   const { t } = useTranslation()
   const language = useGetLanguage()
@@ -157,7 +165,14 @@ export const useChecklist = (nodes: Node[], edges: Edge[]) => {
       if (node.type === CUSTOM_NODE) {
         const checkData = getCheckData(node.data)
         const validator = nodesExtraData?.[node.data.type as BlockEnum]?.checkValid
-        let errorMessage = validator ? validator(checkData, t, moreDataForCheckValid).errorMessage : undefined
+        const isPluginMissing = PLUGIN_DEPENDENT_TYPES.includes(node.data.type as BlockEnum) && node.data._pluginInstallLocked
+
+        // Check if plugin is installed for plugin-dependent nodes first
+        let errorMessage: string | undefined
+        if (isPluginMissing)
+          errorMessage = t('workflow.nodes.common.pluginNotInstalled')
+        else if (validator)
+          errorMessage = validator(checkData, t, moreDataForCheckValid).errorMessage
 
         if (!errorMessage) {
           const availableVars = map[node.id].availableVars
@@ -194,7 +209,8 @@ export const useChecklist = (nodes: Node[], edges: Edge[]) => {
             toolIcon,
             unConnected: isUnconnected && !canSkipConnectionCheck,
             errorMessage,
-            canNavigate: true,
+            canNavigate: !isPluginMissing,
+            disableGoTo: isPluginMissing,
           })
         }
       }

web/i18n/de-DE/workflow.ts

@@ -437,6 +437,7 @@ const translation = {
         variable: 'Verwende die Variable',
       },
       inputVars: 'Eingabevariablen',
+      pluginNotInstalled: 'Plugin ist nicht installiert',
     },
     start: {
       required: 'erforderlich',

web/i18n/en-US/workflow.ts

@@ -464,6 +464,7 @@ const translation = {
         variable: 'Use variable',
       },
       inputVars: 'Input Variables',
+      pluginNotInstalled: 'Plugin is not installed',
     },
     start: {
       required: 'required',

web/i18n/es-ES/workflow.ts

@@ -437,6 +437,7 @@ const translation = {
         variable: 'Usa la variable',
       },
       inputVars: 'Variables de entrada',
+      pluginNotInstalled: 'El complemento no está instalado',
     },
     start: {
       required: 'requerido',

web/i18n/fa-IR/workflow.ts

@@ -437,6 +437,7 @@ const translation = {
         variable: 'از متغیر استفاده کن',
       },
       inputVars: 'متغیرهای ورودی',
+      pluginNotInstalled: 'افزونه نصب نشده است',
     },
     start: {
       required: 'الزامی',

web/i18n/fr-FR/workflow.ts

@@ -437,6 +437,7 @@ const translation = {
         variable: 'Utilisez une variable',
       },
       inputVars: 'Variables d’entrée',
+      pluginNotInstalled: 'Le plugin n\'est pas installé',
     },
     start: {
       required: 'requis',

web/i18n/hi-IN/workflow.ts

@@ -449,6 +449,7 @@ const translation = {
         variable: 'चर का प्रयोग करें',
       },
       inputVars: 'इनपुट चर',
+      pluginNotInstalled: 'प्लगइन इंस्टॉल नहीं है',
     },
     start: {
       required: 'आवश्यक',

web/i18n/id-ID/workflow.ts

@@ -444,6 +444,7 @@ const translation = {
       insertVarTip: 'Sisipkan Variabel',
       outputVars: 'Variabel Keluaran',
       inputVars: 'Variabel Masukan',
+      pluginNotInstalled: 'Plugin tidak terpasang',
     },
     start: {
       outputVars: {

web/i18n/it-IT/workflow.ts

@@ -452,6 +452,7 @@ const translation = {
         variable: 'Usa la variabile',
       },
       inputVars: 'Variabili di input',
+      pluginNotInstalled: 'Il plugin non è installato',
     },
     start: {
       required: 'richiesto',

web/i18n/ja-JP/workflow.ts

@@ -464,6 +464,7 @@ const translation = {
         variable: '変数を使用する',
       },
       inputVars: '入力変数',
+      pluginNotInstalled: 'プラグインがインストールされていません',
     },
     start: {
       required: '必須',

web/i18n/ko-KR/workflow.ts

@@ -461,6 +461,7 @@ const translation = {
         variable: '변수를 사용하세요',
       },
       inputVars: '입력 변수',
+      pluginNotInstalled: '플러그인이 설치되지 않았습니다',
     },
     start: {
       required: '필수',

web/i18n/pl-PL/workflow.ts

@@ -437,6 +437,7 @@ const translation = {
         input: 'Wartość wejściowa',
       },
       inputVars: 'Zmienne wejściowe',
+      pluginNotInstalled: 'Wtyczka nie jest zainstalowana',
     },
     start: {
       required: 'wymagane',

web/i18n/pt-BR/workflow.ts

@@ -437,6 +437,7 @@ const translation = {
         input: 'Valor de entrada',
       },
       inputVars: 'Variáveis de entrada',
+      pluginNotInstalled: 'O plugin não está instalado',
     },
     start: {
       required: 'requerido',

web/i18n/ro-RO/workflow.ts

@@ -437,6 +437,7 @@ const translation = {
         input: 'Valoare de intrare',
       },
       inputVars: 'Variabile de intrare',
+      pluginNotInstalled: 'Pluginul nu este instalat',
     },
     start: {
       required: 'necesar',

web/i18n/ru-RU/workflow.ts

@@ -437,6 +437,7 @@ const translation = {
         variable: 'Используйте переменную',
       },
       inputVars: 'Входные переменные',
+      pluginNotInstalled: 'Плагин не установлен',
     },
     start: {
       required: 'обязательно',

web/i18n/sl-SI/workflow.ts

@@ -444,6 +444,7 @@ const translation = {
         input: 'Vhodna vrednost',
       },
       inputVars: 'Vhodne spremenljivke',
+      pluginNotInstalled: 'Vtičnik ni nameščen',
     },
     start: {
       outputVars: {

web/i18n/th-TH/workflow.ts

@@ -437,6 +437,7 @@ const translation = {
         variable: 'ใช้ตัวแปร',
       },
       inputVars: 'ตัวแปรอินพุต',
+      pluginNotInstalled: 'ปลั๊กอินไม่ได้ติดตั้ง',
     },
     start: {
       required: 'ต้องระบุ',

web/i18n/tr-TR/workflow.ts

@@ -437,6 +437,7 @@ const translation = {
         input: 'Girdi değeri',
       },
       inputVars: 'Giriş Değişkenleri',
+      pluginNotInstalled: 'Eklenti yüklü değil',
     },
     start: {
       required: 'gerekli',

web/i18n/uk-UA/workflow.ts

@@ -437,6 +437,7 @@ const translation = {
         variable: 'Використовуйте змінну',
       },
       inputVars: 'Вхідні змінні',
+      pluginNotInstalled: 'Плагін не встановлений',
     },
     start: {
       required: 'обов\'язковий',

web/i18n/vi-VN/workflow.ts

@@ -437,6 +437,7 @@ const translation = {
         variable: 'Sử dụng biến',
       },
       inputVars: 'Biến đầu vào',
+      pluginNotInstalled: 'Plugin chưa được cài đặt',
     },
     start: {
       required: 'bắt buộc',

web/i18n/zh-Hans/workflow.ts

@@ -464,6 +464,7 @@ const translation = {
         variable: '使用变量',
       },
       inputVars: '输入变量',
+      pluginNotInstalled: '插件未安装',
     },
     start: {
       required: '必填',

web/i18n/zh-Hant/workflow.ts

@@ -442,6 +442,7 @@ const translation = {
         variable: '使用變數',
       },
       inputVars: '輸入變數',
+      pluginNotInstalled: '插件未安裝',
     },
     start: {
       required: '必填',