fix(web): remove StatusPanel's internal useStore to fix context issues (#28348)

web/app/components/workflow/run/index.tsx

@@ -174,11 +174,13 @@ const RunPanel: FC<RunProps> = ({
             created_by={executor}
             steps={runDetail.total_steps}
             exceptionCounts={runDetail.exceptions_count}
+            isListening={isListening}
           />
         )}
         {!loading && currentTab === 'DETAIL' && !runDetail && isListening && (
           <StatusPanel
             status={WorkflowRunningStatus.Running}
+            isListening={true}
           />
         )}
         {!loading && currentTab === 'TRACING' && (

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

@@ -40,6 +40,7 @@ export type ResultPanelProps = {
   showSteps?: boolean
   exceptionCounts?: number
   execution_metadata?: any
+  isListening?: boolean
   handleShowIterationResultList?: (detail: NodeTracing[][], iterDurationMap: any) => void
   handleShowLoopResultList?: (detail: NodeTracing[][], loopDurationMap: any) => void
   onShowRetryDetail?: (detail: NodeTracing[]) => void
@@ -65,6 +66,7 @@ const ResultPanel: FC<ResultPanelProps> = ({
   showSteps,
   exceptionCounts,
   execution_metadata,
+  isListening = false,
   handleShowIterationResultList,
   handleShowLoopResultList,
   onShowRetryDetail,
@@ -86,6 +88,7 @@ const ResultPanel: FC<ResultPanelProps> = ({
           tokens={total_tokens}
           error={error}
           exceptionCounts={exceptionCounts}
+          isListening={isListening}
         />
       </div>
       <div className='px-4'>

web/app/components/workflow/run/status.tsx

@@ -5,7 +5,6 @@ import cn from '@/utils/classnames'
 import Indicator from '@/app/components/header/indicator'
 import StatusContainer from '@/app/components/workflow/run/status-container'
 import { useDocLink } from '@/context/i18n'
-import { useStore } from '../store'
 
 type ResultProps = {
   status: string
@@ -13,6 +12,7 @@ type ResultProps = {
   tokens?: number
   error?: string
   exceptionCounts?: number
+  isListening?: boolean
 }
 
 const StatusPanel: FC<ResultProps> = ({
@@ -21,10 +21,10 @@ const StatusPanel: FC<ResultProps> = ({
   tokens,
   error,
   exceptionCounts,
+  isListening = false,
 }) => {
   const { t } = useTranslation()
   const docLink = useDocLink()
-  const isListening = useStore(s => s.isListening)
 
   return (
     <StatusContainer status={status}>