From a507d7567fa50a376529dd0f2d5374f4e8fd8d04 Mon Sep 17 00:00:00 2001
From: huzibaca <masterorigin91@gmail.com>
Date: Mon, 18 Nov 2024 16:41:17 +0800
Subject: [PATCH] refactor: remove useSWRSubscription and use useEffect

---
 src/hooks/use-log-data.ts | 46 ++++++++++++++++++++-------------------
 1 file changed, 24 insertions(+), 22 deletions(-)

diff --git a/src/hooks/use-log-data.ts b/src/hooks/use-log-data.ts
index 5957aeed..391ed17f 100644
--- a/src/hooks/use-log-data.ts
+++ b/src/hooks/use-log-data.ts
@@ -1,4 +1,4 @@
-import useSWRSubscription from "swr/subscription";
+import { useEffect } from "react";
 import { useEnableLog } from "../services/states";
 import { createSockette } from "../utils/websocket";
 import { useClashInfo } from "./use-clash";
@@ -9,7 +9,6 @@ const MAX_LOG_NUM = 1000;
 
 export type LogLevel = "warning" | "info" | "debug" | "error";
 
-// 添加 ILogItem 接口定义
 interface ILogItem {
   time?: string;
   type: string;
@@ -66,28 +65,31 @@ export const useLogData = (logLevel: LogLevel) => {
   const [enableLog] = useEnableLog();
   const { logs, appendLog } = useLogStore();
 
-  useSWRSubscription<ILogItem[], any, [string, LogLevel] | null>(
-    enableLog && clashInfo ? ["getClashLog", logLevel] : null,
-    (_key, { next }) => {
-      const { server = "", secret = "" } = clashInfo!;
+  useEffect(() => {
+    if (!enableLog || !clashInfo) return;
 
-      const s = createSockette(buildWSUrl(server, secret, logLevel), {
-        onmessage(event) {
-          const data = JSON.parse(event.data) as ILogItem;
-          const time = dayjs().format("MM-DD HH:mm:ss");
-          appendLog(logLevel, { ...data, time });
-        },
-        onerror(event) {
-          this.close();
-          next(event);
-        },
-      });
+    const { server = "", secret = "" } = clashInfo;
+    const wsUrl = buildWSUrl(server, secret, logLevel);
 
-      return () => {
-        s.close();
-      };
-    }
-  );
+    let isActive = true;
+    const socket = createSockette(wsUrl, {
+      onmessage(event) {
+        if (!isActive) return;
+        const data = JSON.parse(event.data) as ILogItem;
+        const time = dayjs().format("MM-DD HH:mm:ss");
+        appendLog(logLevel, { ...data, time });
+      },
+      onerror() {
+        if (!isActive) return;
+        socket.close();
+      },
+    });
+
+    return () => {
+      isActive = false;
+      socket.close();
+    };
+  }, [clashInfo, enableLog, logLevel]);
 
   return logs[logLevel];
 };