From 0026008178137b4650e662f470f3c6d4a10aa167 Mon Sep 17 00:00:00 2001
From: sdttttt <Kaltsit@111.com>
Date: Thu, 14 Sep 2023 16:49:39 +0800
Subject: [PATCH] =?UTF-8?q?[Feature]=20=E6=B7=BB=E5=8A=A0=E6=97=A5?=
 =?UTF-8?q?=E5=BF=97=E7=AD=89=E7=BA=A7=E8=AE=BE=E7=BD=AE=20(#215)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* feat: Add LogLevel option.

* style: update debug log color.

* fix: code lint, constant extract, i18

* chore: Add prettierignore

* refactor: Remove LogType.

* fix(type err.): type err

* Update src/signals/request.ts

Co-authored-by: kunish <17328586+kunish@users.noreply.github.com>
Signed-off-by: sdttttt <Kaltsit@111.com>

* refactor: var name change.

* Update package.json

Co-authored-by: kunish <17328586+kunish@users.noreply.github.com>
Signed-off-by: sdttttt <Kaltsit@111.com>

---------

Signed-off-by: sdttttt <Kaltsit@111.com>
Co-authored-by: kunish <17328586+kunish@users.noreply.github.com>
---
 .prettierignore        |  2 ++
 .prettierrc            |  3 ++-
 package.json           |  1 +
 src/constants/index.ts |  8 ++++++++
 src/i18n/en.ts         |  6 ++++++
 src/i18n/zh.ts         |  6 ++++++
 src/pages/Config.tsx   | 30 ++++++++++++++++++++++++++++++
 src/pages/Logs.tsx     | 16 ++++++++++------
 src/signals/config.ts  |  6 ++++++
 src/signals/request.ts | 10 ++++++++--
 src/types/index.d.ts   |  5 ++++-
 11 files changed, 83 insertions(+), 10 deletions(-)
 create mode 100644 .prettierignore

diff --git a/.prettierignore b/.prettierignore
new file mode 100644
index 0000000..9a7cc76
--- /dev/null
+++ b/.prettierignore
@@ -0,0 +1,2 @@
+CHANGELOG.md
+pnpm-lock.yaml
diff --git a/.prettierrc b/.prettierrc
index 042b6cc..d4bad54 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -4,5 +4,6 @@
     "prettier-plugin-tailwindcss"
   ],
   "semi": false,
-  "singleQuote": true
+  "singleQuote": true,
+  "endOfLine": "crlf"
 }
diff --git a/package.json b/package.json
index 54afb87..471b3fc 100644
--- a/package.json
+++ b/package.json
@@ -7,6 +7,7 @@
   "scripts": {
     "build": "vite build",
     "dev": "vite",
+    "format": "prettier -w .",
     "prepare": "husky install",
     "serve": "vite preview"
   },
diff --git a/src/constants/index.ts b/src/constants/index.ts
index 0a3c058..07fd3a8 100644
--- a/src/constants/index.ts
+++ b/src/constants/index.ts
@@ -153,3 +153,11 @@ export enum MODE_OPTIONS {
   Rule = 'rule',
   Direct = 'direct',
 }
+
+export enum LOG_LEVEL {
+  Info = 'info',
+  Error = 'error',
+  Warning = 'warning',
+  Debug = 'debug',
+  Silent = 'silent',
+}
diff --git a/src/i18n/en.ts b/src/i18n/en.ts
index e4b8033..dc6d71d 100644
--- a/src/i18n/en.ts
+++ b/src/i18n/en.ts
@@ -61,6 +61,12 @@ export default {
   updated: 'Updated',
   renderProxiesInSamePage: 'Render proxies and proxy provider in same page',
   tableSize: 'Table size',
+  logLevel: 'Log Level',
+  info: 'info',
+  silent: 'silent',
+  debug: 'debug',
+  warning: 'warning',
+  error: 'error',
   xs: 'Extra small size',
   sm: 'Small size',
   md: 'Normal size',
diff --git a/src/i18n/zh.ts b/src/i18n/zh.ts
index 012cc25..775b1c3 100644
--- a/src/i18n/zh.ts
+++ b/src/i18n/zh.ts
@@ -61,6 +61,12 @@ export default {
   updated: '更新于',
   renderProxiesInSamePage: '将代理和代理提供者显示在同一页',
   tableSize: '表格大小',
+  logLevel: '日志等级',
+  info: '信息',
+  silent: '静默',
+  debug: '调试',
+  warning: '警告',
+  error: '错误',
   xs: '超小尺寸',
   sm: '小尺寸',
   md: '正常尺寸',
diff --git a/src/pages/Config.tsx b/src/pages/Config.tsx
index 22846e5..64abf6a 100644
--- a/src/pages/Config.tsx
+++ b/src/pages/Config.tsx
@@ -25,6 +25,7 @@ import {
 import { Button } from '~/components'
 import {
   LANG,
+  LOG_LEVEL,
   MODE_OPTIONS,
   PROXIES_ORDERING_TYPE,
   PROXIES_PREVIEW_TYPE,
@@ -40,6 +41,7 @@ import {
   favDayTheme,
   favNightTheme,
   latencyTestTimeoutDuration,
+  logLevel,
   proxiesOrderingType,
   proxiesPreviewType,
   renderInTwoColumns,
@@ -49,6 +51,7 @@ import {
   setFavDayTheme,
   setFavNightTheme,
   setLatencyTestTimeoutDuration,
+  setLogLevel,
   setProxiesOrderingType,
   setProxiesPreviewType,
   setRenderInTwoColumns,
@@ -407,6 +410,33 @@ const ConfigForXd = () => {
         </select>
       </div>
 
+      <div>
+        <ConfigTitle>{t('logLevel')}</ConfigTitle>
+
+        <select
+          class="select select-bordered w-full max-w-xs"
+          onChange={(e) => {
+            setLogLevel(e.target.value as LOG_LEVEL)
+          }}
+        >
+          <For
+            each={[
+              LOG_LEVEL.Info,
+              LOG_LEVEL.Error,
+              LOG_LEVEL.Warning,
+              LOG_LEVEL.Debug,
+              LOG_LEVEL.Silent,
+            ]}
+          >
+            {(level) => (
+              <option selected={logLevel() === level} value={level}>
+                {t(level)}
+              </option>
+            )}
+          </For>
+        </select>
+      </div>
+
       <div>
         <Button
           onClick={() => {
diff --git a/src/pages/Logs.tsx b/src/pages/Logs.tsx
index 4b08c5d..db640ed 100644
--- a/src/pages/Logs.tsx
+++ b/src/pages/Logs.tsx
@@ -7,8 +7,9 @@ import {
 } from '@tanstack/solid-table'
 import { For, Index, createEffect, createSignal } from 'solid-js'
 import { twMerge } from 'tailwind-merge'
-import { LOGS_TABLE_MAX_ROWS } from '~/constants'
+import { LOGS_TABLE_MAX_ROWS, LOG_LEVEL } from '~/constants'
 import { tableSize, tableSizeClassName, useWsRequest } from '~/signals'
+import { logLevel } from '~/signals/config'
 import { Log } from '~/types'
 
 type LogWithSeq = Log & { seq: number }
@@ -19,7 +20,7 @@ export default () => {
   const [search, setSearch] = createSignal('')
   const [logs, setLogs] = createSignal<LogWithSeq[]>([])
 
-  const logsData = useWsRequest<Log>('logs')
+  const logsData = useWsRequest<Log>('logs', { level: logLevel() })
 
   createEffect(() => {
     const data = logsData()
@@ -41,20 +42,23 @@ export default () => {
     {
       header: t('type'),
       cell: ({ row }) => {
-        const type = row.original.type
+        const type = row.original.type as LOG_LEVEL
 
         let className = ''
 
         switch (type) {
-          case 'error':
+          case LOG_LEVEL.Error:
             className = 'text-error'
             break
-          case 'warning':
+          case LOG_LEVEL.Warning:
             className = 'text-warning'
             break
-          case 'info':
+          case LOG_LEVEL.Info:
             className = 'text-info'
             break
+          case LOG_LEVEL.Debug:
+            className = 'text-success'
+            break
         }
 
         return <span class={className}>{`[${row.original.type}]`}</span>
diff --git a/src/signals/config.ts b/src/signals/config.ts
index 1c618ef..9c28f54 100644
--- a/src/signals/config.ts
+++ b/src/signals/config.ts
@@ -3,6 +3,7 @@ import { createSignal } from 'solid-js'
 import {
   LATENCY_QUALITY_MAP_HTTP,
   LATENCY_QUALITY_MAP_HTTPS,
+  LOG_LEVEL,
   PROXIES_ORDERING_TYPE,
   PROXIES_PREVIEW_TYPE,
   TAILWINDCSS_SIZE,
@@ -51,6 +52,11 @@ export const [tableSize, setTableSize] = makePersisted(
   { name: 'tableSize', storage: localStorage },
 )
 
+export const [logLevel, setLogLevel] = makePersisted(
+  createSignal<LOG_LEVEL>(LOG_LEVEL.Info),
+  { name: 'logLevel', storage: localStorage },
+)
+
 export const tableSizeClassName = (size: TAILWINDCSS_SIZE) => {
   let className = 'table-xs'
 
diff --git a/src/signals/request.ts b/src/signals/request.ts
index fa04bd5..85b2dc6 100644
--- a/src/signals/request.ts
+++ b/src/signals/request.ts
@@ -50,9 +50,15 @@ export const secret = () => endpoint()?.secret
 export const wsEndpointURL = () =>
   new URL(endpoint()?.url ?? '').origin.replace('http', 'ws')
 
-export const useWsRequest = <T>(path: string) => {
+export const useWsRequest = <T>(
+  path: string,
+  queries: Record<string, string> = {}
+) => {
+  const queryParams = new URLSearchParams(queries)
+  queryParams.set('token', secret() ?? '')
+
   const ws = createReconnectingWS(
-    `${wsEndpointURL()}/${path}?token=${secret()}`,
+    `${wsEndpointURL()}/${path}?${queryParams.toString()}`,
   )
 
   const event = createEventSignal<{
diff --git a/src/types/index.d.ts b/src/types/index.d.ts
index 8af9f63..8f0d8b9 100644
--- a/src/types/index.d.ts
+++ b/src/types/index.d.ts
@@ -1,3 +1,6 @@
+
+import { LOG_LEVEL } from '~/constants'
+
 declare module 'solid-js' {
   namespace JSX {
     interface Directives {
@@ -106,7 +109,7 @@ export type Connection = ConnectionRawMessage & {
 }
 
 export type Log = {
-  type: 'error' | 'warning' | 'info' | 'debug' | 'silent'
+  type: LOG_LEVEL
   payload: string
 }