feat(ui): add timezone information (pingcap#974)

shhdgit · Sep 2, 2021 · eb80ac7 · eb80ac7
1 parent e723204
commit eb80ac7
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 16 deletions.
diff --git a/ui/lib/apps/SearchLogs/components/SearchResult.tsx b/ui/lib/apps/SearchLogs/components/SearchResult.tsx
@@ -78,7 +78,7 @@ export default function SearchResult({ patterns, taskGroupID, tasks }: Props) {
             (value, index): LogPreview => {
               return {
                 key: index,
-                time: dayjs(value.time).format('YYYY-MM-DD HH:mm:ss'),
+                time: dayjs(value.time).format('YYYY-MM-DD HH:mm:ss (z)'),
                 level: LogLevelText[value.level ?? 0],
                 component: getComponent(value.task_id),
                 log: value.message,

diff --git a/ui/lib/components/DateTime/Calendar.tsx b/ui/lib/components/DateTime/Calendar.tsx
@@ -10,29 +10,31 @@ import { IDateTimeProps } from '.'
 import calendar from './calendarPlugin'
 import weekOfYear from 'dayjs/plugin/weekOfYear'
 import localizedFormat from 'dayjs/plugin/localizedFormat'
+import timezone from 'dayjs/plugin/timezone'
 
 dayjs.extend(calendar)
 dayjs.extend(weekOfYear)
 dayjs.extend(localizedFormat)
+dayjs.extend(timezone)
 
 const translations = {
   en: {
-    sameDay: '[Today at] h:mm A',
-    sameWeek: 'dddd h:mm A',
-    nextDay: '[Tomorrow] h:mm A',
-    nextWeek: '[Next] dddd h:mm A',
-    lastDay: '[Yesterday] h:mm A',
-    lastWeek: '[Last] dddd h:mm A',
-    sameElse: 'lll',
+    sameDay: '[Today at] h:mm A (z)',
+    sameWeek: 'dddd h:mm A (z)',
+    nextDay: '[Tomorrow] h:mm A (z)',
+    nextWeek: '[Next] dddd h:mm A (z)',
+    lastDay: '[Yesterday] h:mm A (z)',
+    lastWeek: '[Last] dddd h:mm A (z)',
+    sameElse: 'lll (z)',
   },
   zh: {
-    sameDay: '[今天] HH:mm',
-    sameWeek: 'dddd HH:mm',
-    nextDay: '[明天] HH:mm',
-    nextWeek: '[下]dddd HH:mm',
-    lastDay: '[昨天] HH:mm',
-    lastWeek: '[上]dddd HH:mm',
-    sameElse: 'lll',
+    sameDay: '[今天] HH:mm (z)',
+    sameWeek: 'dddd HH:mm (z)',
+    nextDay: '[明天] HH:mm (z)',
+    nextWeek: '[下]dddd HH:mm (z)',
+    lastDay: '[昨天] HH:mm (z)',
+    lastWeek: '[上]dddd HH:mm (z)',
+    sameElse: 'lll (z)',
   },
 }
 

diff --git a/ui/lib/components/DateTime/Long.tsx b/ui/lib/components/DateTime/Long.tsx
@@ -18,7 +18,7 @@ function Long({ unixTimestampMs, ...rest }: IDateTimeProps) {
 }
 
 export function format(unixTimestampMs: number) {
-  return dayjs(unixTimestampMs).format('ll LTS')
+  return dayjs(unixTimestampMs).format('ll LTS (z)')
 }
 
 export default React.memo(Long)