fix: api loading delay
This commit is contained in:
@@ -4,8 +4,7 @@ import { Route, Routes } from "react-router-dom";
|
||||
import { useRecoilState } from "recoil";
|
||||
import { createTheme, List, Paper, ThemeProvider } from "@mui/material";
|
||||
import { atomPaletteMode } from "../states/setting";
|
||||
import { getClashInfo, getVergeConfig } from "../services/cmds";
|
||||
import { initAxios } from "../services/api";
|
||||
import { getVergeConfig } from "../services/cmds";
|
||||
import LogoSvg from "../assets/image/logo.svg";
|
||||
import LogPage from "./log";
|
||||
import HomePage from "./home";
|
||||
@@ -43,12 +42,6 @@ const Layout = () => {
|
||||
const [mode, setMode] = useRecoilState(atomPaletteMode);
|
||||
const { data: vergeConfig } = useSWR("getVergeConfig", getVergeConfig);
|
||||
|
||||
useEffect(() => {
|
||||
getClashInfo()
|
||||
.then((result) => initAxios(result?.controller ?? {}))
|
||||
.catch(() => console.error("can not initialize clash verge"));
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
setMode(vergeConfig?.theme_mode ?? "light");
|
||||
}, [vergeConfig?.theme_mode]);
|
||||
|
||||
@@ -10,15 +10,19 @@ const ConnectionsPage = () => {
|
||||
const [conn, setConn] = useState<ApiType.Connections>(initConn);
|
||||
|
||||
useEffect(() => {
|
||||
const { server, secret } = getInfomation();
|
||||
const ws = new WebSocket(`ws://${server}/connections?token=${secret}`);
|
||||
let ws: WebSocket | null = null;
|
||||
|
||||
ws.addEventListener("message", (event) => {
|
||||
const data = JSON.parse(event.data) as ApiType.Connections;
|
||||
setConn(data);
|
||||
getInfomation().then((result) => {
|
||||
const { server = "", secret = "" } = result;
|
||||
ws = new WebSocket(`ws://${server}/connections?token=${secret}`);
|
||||
|
||||
ws.addEventListener("message", (event) => {
|
||||
const data = JSON.parse(event.data) as ApiType.Connections;
|
||||
setConn(data);
|
||||
});
|
||||
});
|
||||
|
||||
return () => ws.close();
|
||||
return () => ws?.close();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
|
||||
@@ -12,16 +12,20 @@ const LogPage = () => {
|
||||
const [logData, setLogData] = useState(logCache);
|
||||
|
||||
useEffect(() => {
|
||||
const info = getInfomation();
|
||||
const ws = new WebSocket(`ws://${info.server}/logs?token=${info.secret}`);
|
||||
let ws: WebSocket | null = null;
|
||||
|
||||
ws.addEventListener("message", (event) => {
|
||||
const data = JSON.parse(event.data) as ApiType.LogItem;
|
||||
const time = dayjs().format("MM-DD HH:mm:ss");
|
||||
setLogData((l) => (logCache = [...l, { ...data, time }]));
|
||||
getInfomation().then((result) => {
|
||||
const { server = "", secret = "" } = result;
|
||||
ws = new WebSocket(`ws://${server}/logs?token=${secret}`);
|
||||
|
||||
ws.addEventListener("message", (event) => {
|
||||
const data = JSON.parse(event.data) as ApiType.LogItem;
|
||||
const time = dayjs().format("MM-DD HH:mm:ss");
|
||||
setLogData((l) => (logCache = [...l, { ...data, time }]));
|
||||
});
|
||||
});
|
||||
|
||||
return () => ws.close();
|
||||
return () => ws?.close();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
|
||||
Reference in New Issue
Block a user