From 98f6293290ecedf2f3fde4baa24f60cedfaa0445 Mon Sep 17 00:00:00 2001
From: Zephyruso <127948745+Zephyruso@users.noreply.github.com>
Date: Mon, 4 Sep 2023 18:48:39 +0800
Subject: [PATCH] feat: time column in conns

---
 src/constants/index.ts    | 1 +
 src/i18n/en.ts            | 1 +
 src/i18n/index.tsx        | 2 ++
 src/i18n/zh.ts            | 1 +
 src/main.tsx              | 1 +
 src/pages/Connections.tsx | 9 +++++++++
 6 files changed, 15 insertions(+)

diff --git a/src/constants/index.ts b/src/constants/index.ts
index 3b311af..1e23825 100644
--- a/src/constants/index.ts
+++ b/src/constants/index.ts
@@ -118,6 +118,7 @@ export enum CONNECTIONS_TABLE_ACCESSOR_KEY {
   Chains = 'chains',
   DlSpeed = 'dlSpeed',
   ULSpeed = 'ulSpeed',
+  ConnectTime = 'connectTime',
   Download = 'dl',
   Upload = 'ul',
   Source = 'source',
diff --git a/src/i18n/en.ts b/src/i18n/en.ts
index 8584616..b4c1784 100644
--- a/src/i18n/en.ts
+++ b/src/i18n/en.ts
@@ -25,6 +25,7 @@ export default {
   process: 'Process',
   host: 'Host',
   chains: 'Chains',
+  connectTime: 'Time',
   dlSpeed: 'DL Speed',
   ulSpeed: 'UL Speed',
   dl: 'DL',
diff --git a/src/i18n/index.tsx b/src/i18n/index.tsx
index 837e75d..bf3b1f4 100644
--- a/src/i18n/index.tsx
+++ b/src/i18n/index.tsx
@@ -1,5 +1,6 @@
 import { I18nContext, createI18nContext, useI18n } from '@solid-primitives/i18n'
 import { makePersisted } from '@solid-primitives/storage'
+import dayjs from 'dayjs'
 import { ParentComponent, createEffect, createSignal } from 'solid-js'
 import { LANG } from '~/constants'
 import dict from './dict'
@@ -24,6 +25,7 @@ const I18nUpdator: ParentComponent = (props) => {
 
   createEffect(() => {
     setLang(locale())
+    dayjs.locale(locale())
   })
 
   return props.children
diff --git a/src/i18n/zh.ts b/src/i18n/zh.ts
index 99d07a4..48179b7 100644
--- a/src/i18n/zh.ts
+++ b/src/i18n/zh.ts
@@ -25,6 +25,7 @@ export default {
   process: '进程',
   host: '主机',
   chains: '链路',
+  connectTime: '连接时间',
   dlSpeed: '下载速度',
   ulSpeed: '上传速度',
   dl: '下载量',
diff --git a/src/main.tsx b/src/main.tsx
index c537ab7..67b0581 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -3,6 +3,7 @@ import '~/index.css'
 
 import { Router, hashIntegration } from '@solidjs/router'
 import dayjs from 'dayjs'
+import 'dayjs/locale/zh-cn'
 import relativeTime from 'dayjs/plugin/relativeTime'
 import { render } from 'solid-js/web'
 import { App } from '~/App'
diff --git a/src/pages/Connections.tsx b/src/pages/Connections.tsx
index 45df798..12bf96d 100644
--- a/src/pages/Connections.tsx
+++ b/src/pages/Connections.tsx
@@ -18,6 +18,7 @@ import {
   getSortedRowModel,
 } from '@tanstack/solid-table'
 import byteSize from 'byte-size'
+import dayjs from 'dayjs'
 import { isIPv6 } from 'is-ip'
 import { For, createEffect, createSignal } from 'solid-js'
 import { twMerge } from 'tailwind-merge'
@@ -27,6 +28,7 @@ import {
   CONNECTIONS_TABLE_INITIAL_COLUMN_ORDER,
   CONNECTIONS_TABLE_INITIAL_COLUMN_VISIBILITY,
 } from '~/constants'
+import { formatTimeFromNow } from '~/helpers'
 import { secret, useRequest, wsEndpointURL } from '~/signals'
 import type { Connection } from '~/types'
 
@@ -154,6 +156,13 @@ export default () => {
       accessorKey: CONNECTIONS_TABLE_ACCESSOR_KEY.Chains,
       accessorFn: (row) => row.chains.slice().reverse().join(' :: '),
     },
+    {
+      accessorKey: CONNECTIONS_TABLE_ACCESSOR_KEY.ConnectTime,
+      accessorFn: (row) => formatTimeFromNow(row.start),
+      sortingFn: (prev, next) =>
+        dayjs(prev.original.start).valueOf() -
+        dayjs(next.original.start).valueOf(),
+    },
     {
       accessorKey: CONNECTIONS_TABLE_ACCESSOR_KEY.DlSpeed,
       accessorFn: (row) => `${byteSize(row.downloadSpeed)}/s`,