Feat: frontend support timezone of timestamp (#4070)

web/app/components/base/agent-log-modal/result.tsx

@@ -1,10 +1,10 @@
 'use client'
 import type { FC } from 'react'
 import { useTranslation } from 'react-i18next'
-import dayjs from 'dayjs'
 import StatusPanel from '@/app/components/workflow/run/status'
 import CodeEditor from '@/app/components/workflow/nodes/_base/components/editor/code-editor'
 import { CodeLanguage } from '@/app/components/workflow/nodes/code/types'
+import useTimestamp from '@/hooks/use-timestamp'
 
 type ResultPanelProps = {
   status: string
@@ -14,7 +14,7 @@ type ResultPanelProps = {
   inputs?: any
   outputs?: any
   created_by?: string
-  created_at?: string
+  created_at: string
   agentMode?: string
   tools?: string[]
   iterations?: number
@@ -28,12 +28,13 @@ const ResultPanel: FC<ResultPanelProps> = ({
   inputs,
   outputs,
   created_by,
-  created_at = 0,
+  created_at,
   agentMode,
   tools,
   iterations,
 }) => {
   const { t } = useTranslation()
+  const { formatTime } = useTimestamp()
 
   return (
     <div className='bg-white py-2'>
@@ -83,7 +84,7 @@ const ResultPanel: FC<ResultPanelProps> = ({
             <div className='flex'>
               <div className='shrink-0 w-[104px] px-2 py-[5px] text-gray-500 text-xs leading-[18px] truncate'>{t('runLog.meta.startTime')}</div>
               <div className='grow px-2 py-[5px] text-gray-900 text-xs leading-[18px]'>
-                <span>{dayjs(created_at).format('YYYY-MM-DD hh:mm:ss')}</span>
+                <span>{formatTime(Date.parse(created_at) / 1000, t('appLog.dateTimeFormat') as string)}</span>
               </div>
             </div>
             <div className='flex'>

web/app/components/base/chat/chat/hooks.ts

@@ -6,7 +6,6 @@ import {
 } from 'react'
 import { useTranslation } from 'react-i18next'
 import { produce, setAutoFreeze } from 'immer'
-import dayjs from 'dayjs'
 import type {
   ChatConfig,
   ChatItem,
@@ -20,6 +19,7 @@ import { ssePost } from '@/service/base'
 import { replaceStringWithValues } from '@/app/components/app/configuration/prompt-value-panel'
 import type { Annotation } from '@/models/log'
 import { WorkflowRunningStatus } from '@/app/components/workflow/types'
+import useTimestamp from '@/hooks/use-timestamp'
 
 type GetAbortController = (abortController: AbortController) => void
 type SendCallback = {
@@ -78,6 +78,7 @@ export const useChat = (
   stopChat?: (taskId: string) => void,
 ) => {
   const { t } = useTranslation()
+  const { formatTime } = useTimestamp()
   const { notify } = useToastContext()
   const connversationId = useRef('')
   const hasStopResponded = useRef(false)
@@ -336,7 +337,7 @@ export const useChat = (
                       : []),
                   ],
                   more: {
-                    time: dayjs.unix(newResponseItem.created_at).format('hh:mm A'),
+                    time: formatTime(newResponseItem.created_at, 'hh:mm A'),
                     tokens: newResponseItem.answer_tokens + newResponseItem.message_tokens,
                     latency: newResponseItem.provider_response_latency.toFixed(2),
                   },
@@ -498,6 +499,7 @@ export const useChat = (
     promptVariablesConfig,
     handleUpdateChatList,
     handleResponding,
+    formatTime,
   ])
 
   const handleAnnotationEdited = useCallback((query: string, answer: string, index: number) => {