feat: single run progress

web/app/components/workflow/nodes/_base/components/before-run-form/index.tsx

@@ -1,6 +1,6 @@
 'use client'
 import type { FC } from 'react'
-import React, { useCallback } from 'react'
+import React from 'react'
 import { useTranslation } from 'react-i18next'
 import {
   RiCloseLine,
@@ -87,7 +87,7 @@ const BeforeRunForm: FC<BeforeRunFormProps> = ({
 
     return true
   })()
-  const handleRun = useCallback(() => {
+  const handleRun = () => {
     let errMsg = ''
     forms.forEach((form) => {
       form.inputs.forEach((input) => {
@@ -137,7 +137,7 @@ const BeforeRunForm: FC<BeforeRunFormProps> = ({
     }
 
     onRun(submitData)
-  }, [forms, onRun, t])
+  }
   return (
     <div className='absolute inset-0 z-10 rounded-2xl bg-background-overlay-alt'>
       <div className='flex h-full flex-col rounded-2xl bg-components-panel-bg'>

web/app/components/workflow/nodes/_base/components/workflow-panel/index.tsx

@@ -145,7 +145,7 @@ const BasePanel: FC<BasePanelProps> = ({
     showSingleRun,
     hideSingleRun,
     runningStatus,
-    handleRun,
+    handleRun: callRunApi,
     handleStop,
     runInputData,
     runInputDataRef,
@@ -168,6 +168,11 @@ const BasePanel: FC<BasePanelProps> = ({
   }, [doSetRunInputData])
 
   const [tabType, setTabType] = useState<TabType>(TabType.settings)
+  const handleRun = async (data: Record<string, any>) => {
+    setTabType(TabType.lastRun)
+    callRunApi(data)
+    hideSingleRun()
+  }
   const hasLastRunData = true // TODO: add disabled logic
 
   return (
@@ -302,7 +307,7 @@ const BasePanel: FC<BasePanelProps> = ({
         )}
 
         {tabType === TabType.lastRun && (
-          <LastRun appId={id} />
+          <LastRun nodeId={id} runningStatus={runningStatus} />
         )}
 
         {

web/app/components/workflow/nodes/_base/components/workflow-panel/last-run.tsx

@@ -1,20 +1,44 @@
 'use client'
 import ResultPanel from '@/app/components/workflow/run/result-panel'
+import { useWorkflowStore } from '@/app/components/workflow/store'
+import { NodeRunningStatus } from '@/app/components/workflow/types'
 import type { FC } from 'react'
-import React from 'react'
+import React, { useEffect, useState } from 'react'
 
 type Props = {
-  appId: string
+  nodeId: string
+  runningStatus: NodeRunningStatus
 }
 
 const LastRun: FC<Props> = ({
-  appId,
+  nodeId,
+  runningStatus,
 }) => {
+  const workflowStore = useWorkflowStore()
+
+  const {
+    getLastRunNodeInfo,
+  } = workflowStore.getState()
+  const [runResult, setRunResult] = useState(getLastRunNodeInfo(nodeId))
+  const isRunning = runningStatus === NodeRunningStatus.Running
+
+  useEffect(() => {
+    setRunResult(getLastRunNodeInfo(nodeId))
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [runningStatus])
+  if (isRunning)
+    return <ResultPanel status='running' showSteps={false} />
+
+  if (!runResult) {
+    return (
+      <div>no data</div>
+    )
+  }
   return (
     <div>
-      last run: {appId}
       <ResultPanel
-        status='success'
+        {...runResult as any}
+        showSteps={false}
       />
     </div>
   )

web/app/components/workflow/nodes/_base/hooks/use-one-step-run.ts

@@ -228,6 +228,7 @@ const useOneStepRun = <T>({
       id,
       data: {
         ...data,
+        _isSingleRun: false,
         _singleRunningStatus: NodeRunningStatus.Running,
       },
     })
@@ -250,6 +251,7 @@ const useOneStepRun = <T>({
                 id,
                 data: {
                   ...data,
+                  _isSingleRun: false,
                   _singleRunningStatus: NodeRunningStatus.Succeeded,
                 },
               })
@@ -326,6 +328,7 @@ const useOneStepRun = <T>({
                 id,
                 data: {
                   ...data,
+                  _isSingleRun: false,
                   _singleRunningStatus: NodeRunningStatus.Failed,
                 },
               })
@@ -347,6 +350,7 @@ const useOneStepRun = <T>({
                 id,
                 data: {
                   ...data,
+                  _isSingleRun: false,
                   _singleRunningStatus: NodeRunningStatus.Succeeded,
                 },
               })
@@ -424,6 +428,7 @@ const useOneStepRun = <T>({
                 id,
                 data: {
                   ...data,
+                  _isSingleRun: false,
                   _singleRunningStatus: NodeRunningStatus.Failed,
                 },
               })
@@ -441,6 +446,7 @@ const useOneStepRun = <T>({
           id,
           data: {
             ...data,
+            _isSingleRun: false,
             _singleRunningStatus: NodeRunningStatus.Failed,
           },
         })
@@ -461,6 +467,7 @@ const useOneStepRun = <T>({
         id,
         data: {
           ...data,
+          _isSingleRun: false,
           _singleRunningStatus: NodeRunningStatus.Succeeded,
         },
       })

web/app/components/workflow/nodes/llm/panel.tsx

@@ -17,7 +17,6 @@ import { InputVarType, type NodePanelProps } from '@/app/components/workflow/typ
 import type { Props as FormProps } from '@/app/components/workflow/nodes/_base/components/before-run-form/form'
 import Tooltip from '@/app/components/base/tooltip'
 import Editor from '@/app/components/workflow/nodes/_base/components/prompt/editor'
-import useCurrentVars from '../../hooks/use-current-vars'
 import StructureOutput from './components/structure-output'
 import Switch from '@/app/components/base/switch'
 import { RiAlertFill, RiQuestionLine } from '@remixicon/react'
@@ -31,10 +30,6 @@ const Panel = forwardRef<PanelExposedType, NodePanelProps<LLMNodeType>>(({
   panelProps,
 }, ref) => {
   const { t } = useTranslation()
-  const {
-    currentVars,
-  } = useCurrentVars()
-  console.log(currentVars)
   const {
     readOnly,
     inputs,

web/app/components/workflow/run/result-panel.tsx

@@ -21,7 +21,7 @@ type ResultPanelProps = {
   nodeInfo?: NodeTracing
   inputs?: string
   process_data?: string
-  outputs?: string
+  outputs?: string | Record<string, any>
   status: string
   error?: string
   elapsed_time?: number