fix(UI): Logs Display

src/locales/ach-UG/translation.json

@@ -105,6 +105,7 @@
   "delete_current_logs": "crwdns8080:0crwdne8080:0",
   "clear_completed": "crwdns8082:0crwdne8082:0",
   "clear_logs": "crwdns8084:0crwdne8084:0",
+  "to": " - ",
   "now": "Now",
   "total_logs": "crwdns8086:0{{length}}crwdne8086:0",
   "filtered_logs": "crwdns8088:0{{length}}crwdne8088:0",

src/locales/de-DE/translation.json

@@ -1,4 +1,5 @@
 {
+  "sentence-separator": ". ",
   "import_link": "Link-Import",
   "import_link_failure": "Link-Import fehlgeschlagen",
   "create_user_script": "Neues Benutzerskript erstellen",
@@ -106,6 +107,7 @@
   "delete_current_logs": "Aktuelle Protokolle löschen",
   "clear_completed": "Bereinigung abgeschlossen",
   "clear_logs": "Protokolle bereinigen",
+  "to": " - ",
   "now": "Jetzt",
   "total_logs": "Insgesamt {{length}} Protokolle gefunden",
   "filtered_logs": "Nach Filterung {{length}} Protokolle",

src/locales/en-US/translation.json

@@ -1,4 +1,5 @@
 {
+  "sentence-separator": ". ",
   "import_link": "Link Import",
   "import_link_failure": "Link Import Failed",
   "create_user_script": "Create User Script",
@@ -106,6 +107,7 @@
   "delete_current_logs": "Delete Current Logs",
   "clear_completed": "Clearing Completed",
   "clear_logs": "Clear Logs",
+  "to": " - ",
   "now": "Now",
   "total_logs": "A total of {{length}} logs were queried",
   "filtered_logs": "{{length}} logs after filtering",

src/locales/ja-JP/translation.json

@@ -1,4 +1,5 @@
 {
+  "sentence-separator": "。",
   "import_link": "リンクインポート",
   "import_link_failure": "リンクインポートに失敗しました",
   "create_user_script": "新しいユーザースクリプトを作成",
@@ -106,7 +107,8 @@
   "delete_current_logs": "現在のログを削除",
   "clear_completed": "クリア完了",
   "clear_logs": "ログをクリア",
-  "now": "現在",
+  "to": " ～ ",
+  "now": "直近",
   "total_logs": "合計{{length}}件のログが見つかりました",
   "filtered_logs": "フィルタリング後{{length}}件のログ",
   "enter_filter_conditions": "フィルタリング条件を入力してクエリしてください",

src/locales/ru-RU/translation.json

@@ -1,4 +1,5 @@
 {
+  "sentence-separator": ". ",
   "import_link": "Импорт по ссылке",
   "import_link_failure": "Ошибка импорта по ссылке",
   "create_user_script": "Создать пользовательский скрипт",
@@ -106,6 +107,7 @@
   "delete_current_logs": "Удалить текущие журналы",
   "clear_completed": "Очистка завершена",
   "clear_logs": "Очистить журналы",
+  "to": " — ",
   "now": "Сейчас",
   "total_logs": "Найдено {{length}} записей журнала",
   "filtered_logs": "После фильтрации {{length}} записей журнала",

src/locales/vi-VN/translation.json

@@ -1,4 +1,5 @@
 {
+  "sentence-separator": ". ",
   "import_link": "Liên kết nhập",
   "import_link_failure": "Nhập liên kết thất bại",
   "create_user_script": "Tạo script người dùng",
@@ -106,6 +107,7 @@
   "delete_current_logs": "Xóa nhật ký hiện tại",
   "clear_completed": "Xóa hoàn tất",
   "clear_logs": "Xóa nhật ký",
+  "to": " - ",
   "now": "Hiện tại",
   "total_logs": "Tổng cộng {{length}} nhật ký đã được truy vấn",
   "filtered_logs": "{{length}} nhật ký sau khi lọc",

src/locales/zh-CN/translation.json

@@ -1,4 +1,5 @@
 {
+  "sentence-separator": "。",
   "import_link": "链接导入",
   "import_link_failure": "链接导入失败",
   "create_user_script": "新建普通脚本",
@@ -106,7 +107,8 @@
   "delete_current_logs": "删除当前日志",
   "clear_completed": "清空完成",
   "clear_logs": "清空日志",
-  "now": "至今",
+  "to": " 至 ",
+  "now": "当前",
   "total_logs": "共查询到 {{length}} 条日志",
   "filtered_logs": "筛选后 {{length}} 条日志",
   "enter_filter_conditions": "请输入筛选条件进行查询",

src/locales/zh-TW/translation.json

@@ -1,4 +1,5 @@
 {
+  "sentence-separator": "。",
   "import_link": "連結匯入",
   "import_link_failure": "連結匯入失敗",
   "create_user_script": "新建普通腳本",
@@ -106,7 +107,8 @@
   "delete_current_logs": "刪除目前紀錄",
   "clear_completed": "清除完成",
   "clear_logs": "清除紀錄",
-  "now": "至今",
+  "to": " 至 ",
+  "now": "現在",
   "total_logs": "共查詢到 {{length}} 筆紀錄",
   "filtered_logs": "篩選後 {{length}} 條紀錄",
   "enter_filter_conditions": "請輸入篩選條件進行查詢",

src/pages/options/routes/Logger.tsx

@@ -84,7 +84,7 @@
       onQueryLog();
       setInit(2);
     }
   }, [init]);
 
   useEffect(() => {
     loggerDAO.queryLogs(startTime * 1000, endTime * 1000).then((l) => {
@@ -119,7 +119,7 @@
         setInit(1);
       }
     });
   }, [startTime, endTime, refreshToken]);
 
   return (
     <>
@@ -333,14 +333,20 @@
               boxSizing: "border-box",
             }}
           >
-            <Typography.Text>
-              {formatUnixTime(startTime)} {t("to")} {isNow ? t("now") : formatUnixTime(endTime)}{" "}
-              {t("total_logs", { length: logs.length })}
-              {init === 4
-                ? `, ${t("filtered_logs", { length: queryLogs.length })}`
-                : `, ${t("enter_filter_conditions")}`}
+            <Typography.Text className="tw-bg-[var(--color-fill-2)] tw-text-[var(--color-text-1)] tw-px-2 tw-py-1 tw-rounded">
+              {formatUnixTime(startTime)}
+              {t("to")}
+              {isNow ? `${formatUnixTime(endTime)} (${t("now")})` : formatUnixTime(endTime)}
+            </Typography.Text>
+            <Typography.Text className="tw-text-[var(--color-text-4)]">{" -- "}</Typography.Text>
+            <Typography.Text className="tw-text-[var(--color-text-1)]">
+              {[
+                t("total_logs", { length: logs.length }),
+                init === 4 ? t("filtered_logs", { length: queryLogs.length }) : t("enter_filter_conditions"),
+              ].join(t("sentence-separator"))}
             </Typography.Text>
             <List
+              className="tw-mt-1"
               style={{
                 height: "100%",
                 overflow: "auto",