diff --git a/web/app/components/workflow/header/version-history-item.tsx b/web/app/components/workflow/header/version-history-item.tsx
index 2826da3c197c78..afa2f49dec16c0 100644
--- a/web/app/components/workflow/header/version-history-item.tsx
+++ b/web/app/components/workflow/header/version-history-item.tsx
@@ -1,5 +1,6 @@
 import React from 'react'
 import dayjs from 'dayjs'
+import { useTranslation } from 'react-i18next'
 import { WorkflowVersion } from '../types'
 import cn from '@/utils/classnames'
 import type { VersionHistory } from '@/types/workflow'
@@ -11,6 +12,7 @@ type VersionHistoryItemProps = {
 }
 
 const VersionHistoryItem: React.FC<VersionHistoryItemProps> = ({ item, selectedVersion, onClick }) => {
+  const { t } = useTranslation()
   const formatTime = (time: number) => dayjs.unix(time).format('YYYY-MM-DD HH:mm:ss')
 
   const renderVersionLabel = (version: string) => (
@@ -26,25 +28,17 @@ const VersionHistoryItem: React.FC<VersionHistoryItemProps> = ({ item, selectedV
   return (
     <div
       className={cn(
-        'flex items-center justify-between px-4 py-3 rounded-lg transition-all duration-200',
-        'hover:transform hover:translate-x-1',
-        'text-sm font-medium text-gray-700',
-        item.version === selectedVersion ? 'bg-blue-50' : 'hover:bg-gray-50',
-        item.version === WorkflowVersion.Draft ? 'cursor-not-allowed opacity-80' : 'cursor-pointer',
+        'flex items-center p-2 h-12 text-xs font-medium text-gray-700 justify-between',
+        item.version === selectedVersion ? '' : 'hover:bg-gray-100',
+        item.version === WorkflowVersion.Draft ? 'cursor-not-allowed' : 'cursor-pointer',
       )}
       onClick={() => item.version !== WorkflowVersion.Draft && onClick(item)}
     >
-      <div className="flex items-center gap-3">
-        <span className="text-gray-500">
-          {formatTime(item.version === WorkflowVersion.Draft ? item.updated_at : item.created_at)}
-        </span>
-        <div className="flex items-center gap-2">
-          {renderVersionLabel(item.version)}
-          <span className="text-gray-600">
-        published by <span className="font-semibold">{item.created_by.name}</span>
-          </span>
-        </div>
+      <div className='flex flex-col gap-1 py-2'>
+        <span className="text-left">{formatTime(item.version === WorkflowVersion.Draft ? item.updated_at : item.created_at)}</span>
+        <span className="text-left">{t('workflow.panel.createdBy')}  {item.created_by.name}</span>
       </div>
+      {renderVersionLabel(item.version)}
     </div>
   )
 }
diff --git a/web/app/components/workflow/header/view-history.tsx b/web/app/components/workflow/header/view-history.tsx
index a18ddad65df8a8..82d8a302c58de0 100644
--- a/web/app/components/workflow/header/view-history.tsx
+++ b/web/app/components/workflow/header/view-history.tsx
@@ -202,7 +202,7 @@ const ViewHistory = ({
                             {`Test ${isChatMode ? 'Chat' : 'Run'}#${item.sequence_number}`}
                           </div>
                           <div className='flex items-center text-xs text-gray-500 leading-[18px]'>
-                            {item.created_by_account.name} · {formatTimeFromNow((item.finished_at || item.created_at) * 1000)}
+                            {item.created_by_account?.name} · {formatTimeFromNow((item.finished_at || item.created_at) * 1000)}
                           </div>
                         </div>
                       </div>