fix(workflow_run): sequence_number race. (#21228)

Signed-off-by: -LAN- <laipz8200@outlook.com>

web/app/components/workflow/panel/chat-record/index.tsx

@@ -10,6 +10,7 @@ import {
   useWorkflowStore,
 } from '../../store'
 import { useWorkflowRun } from '../../hooks'
+import { formatWorkflowRunIdentifier } from '../../utils'
 import UserInput from './user-input'
 import Chat from '@/app/components/base/chat/chat'
 import type { ChatItem, ChatItemInTree } from '@/app/components/base/chat/types'
@@ -99,7 +100,7 @@ const ChatRecord = () => {
       {fetched && (
         <>
           <div className='flex shrink-0 items-center justify-between p-4 pb-1 text-base font-semibold text-text-primary'>
-            {`TEST CHAT#${historyWorkflowData?.sequence_number}`}
+            {`TEST CHAT${formatWorkflowRunIdentifier(historyWorkflowData?.finished_at)}`}
             <div
               className='flex h-6 w-6 cursor-pointer items-center justify-center'
               onClick={() => {

web/app/components/workflow/panel/record.tsx

@@ -3,6 +3,7 @@ import type { WorkflowDataUpdater } from '../types'
 import Run from '../run'
 import { useStore } from '../store'
 import { useWorkflowUpdate } from '../hooks'
+import { formatWorkflowRunIdentifier } from '../utils'
 
 const Record = () => {
   const historyWorkflowData = useStore(s => s.historyWorkflowData)
@@ -20,7 +21,7 @@ const Record = () => {
   return (
     <div className='flex h-full w-[400px] flex-col rounded-l-2xl border-[0.5px] border-components-panel-border bg-components-panel-bg shadow-xl'>
       <div className='system-xl-semibold flex items-center justify-between p-4 pb-0 text-text-primary'>
-        {`Test Run#${historyWorkflowData?.sequence_number}`}
+        {`Test Run${formatWorkflowRunIdentifier(historyWorkflowData?.finished_at)}`}
       </div>
       <Run
         runID={historyWorkflowData?.id || ''}

web/app/components/workflow/panel/workflow-preview.tsx

@@ -20,6 +20,7 @@ import { useStore } from '../store'
 import {
   WorkflowRunningStatus,
 } from '../types'
+import { formatWorkflowRunIdentifier } from '../utils'
 import Toast from '../../base/toast'
 import InputsPanel from './inputs-panel'
 import cn from '@/utils/classnames'
@@ -88,7 +89,7 @@ const WorkflowPreview = () => {
         onMouseDown={startResizing}
       />
       <div className='flex items-center justify-between p-4 pb-1 text-base font-semibold text-text-primary'>
-        {`Test Run${!workflowRunningData?.result.sequence_number ? '' : `#${workflowRunningData?.result.sequence_number}`}`}
+        {`Test Run${formatWorkflowRunIdentifier(workflowRunningData?.result.finished_at)}`}
         <div className='cursor-pointer p-1' onClick={() => handleCancelDebugAndPreviewPanel()}>
           <RiCloseLine className='h-4 w-4 text-text-tertiary' />
         </div>