fix: dsl check

web/app/components/workflow/plugin-dependency/index.tsx

@@ -1,45 +1,23 @@
-import {
-  useCallback,
-  useState,
-} from 'react'
-import { useTranslation } from 'react-i18next'
+import { useCallback } from 'react'
 import { useStore } from './store'
-import ReadyToInstall from '@/app/components/plugins/install-plugin/install-bundle/ready-to-install'
-import { InstallStep } from '@/app/components/plugins/types'
+import InstallBundle from '@/app/components/plugins/install-plugin/install-bundle'
 
-const i18nPrefix = 'plugin.installModal'
 const PluginDependency = () => {
   const dependencies = useStore(s => s.dependencies)
 
-  const [step, setStep] = useState<InstallStep>(InstallStep.readyToInstall)
-
-  const { t } = useTranslation()
-  const getTitle = useCallback(() => {
-    if (step === InstallStep.uploadFailed)
-      return t(`${i18nPrefix}.uploadFailed`)
-    if (step === InstallStep.installed)
-      return t(`${i18nPrefix}.installComplete`)
-
-    return t(`${i18nPrefix}.installPlugin`)
-  }, [step, t])
+  const handleCancelInstallBundle = useCallback(() => {
+    const { setDependencies } = useStore.getState()
+    setDependencies([])
+  }, [])
 
   if (!dependencies.length)
     return null
 
   return (
-    <div>
-      <div className='flex pt-6 pl-6 pb-3 pr-14 items-start gap-2 self-stretch'>
-        <div className='self-stretch text-text-primary title-2xl-semi-bold'>
-          {getTitle()}
-        </div>
-      </div>
-      <ReadyToInstall
-        step={step}
-        onStepChange={setStep}
-        allPlugins={dependencies}
-        onClose={() => {}}
-      />
-    </div>
+    <InstallBundle
+      fromDSLPayload={dependencies}
+      onClose={handleCancelInstallBundle}
+    />
   )
 }