gitscope
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/modules/nodes/api/logs.socket.ts · v0.6.3
Source
1 7389ad0 Mardin 2y ago import { NodeType } from "@marzneshin/modules/nodes";
2 7389ad0 Mardin 2y ago import useWebSocket, { ReadyState } from "react-use-websocket";
3 7389ad0 Mardin 2y ago import { useAuth } from "@marzneshin/modules/auth";
4 7389ad0 Mardin 2y ago import { joinPaths } from "@tanstack/react-router";
5 7389ad0 Mardin 2y ago import { useCallback, useEffect, useRef, useState } from "react";
6 7389ad0 Mardin 2y ago
7 7389ad0 Mardin 2y ago export const MAX_NUMBER_OF_LOGS = 200;
8 7389ad0 Mardin 2y ago
9 7389ad0 Mardin 2y ago export const getStatus = (status: string) => {
10 7389ad0 Mardin 2y ago return {
11 7389ad0 Mardin 2y ago [ReadyState.CONNECTING]: "connecting",
12 7389ad0 Mardin 2y ago [ReadyState.OPEN]: "connected",
13 7389ad0 Mardin 2y ago [ReadyState.CLOSING]: "closed",
14 7389ad0 Mardin 2y ago [ReadyState.CLOSED]: "closed",
15 7389ad0 Mardin 2y ago [ReadyState.UNINSTANTIATED]: "closed",
16 7389ad0 Mardin 2y ago }[status];
17 7389ad0 Mardin 2y ago };
18 7389ad0 Mardin 2y ago
19 7389ad0 Mardin 2y ago export const getWebsocketUrl = (nodeId: number, backend: string) => {
20 7389ad0 Mardin 2y ago try {
21 7389ad0 Mardin 2y ago const baseURL = new URL(
22 7389ad0 Mardin 2y ago import.meta.env.VITE_BASE_API.startsWith("/")
23 7389ad0 Mardin 2y ago ? window.location.origin + import.meta.env.VITE_BASE_API
24 7389ad0 Mardin 2y ago : import.meta.env.VITE_BASE_API,
25 7389ad0 Mardin 2y ago );
26 7389ad0 Mardin 2y ago const protocol = baseURL.protocol === "https:" ? "wss://" : "ws://";
27 7389ad0 Mardin 2y ago return `${protocol}${joinPaths([baseURL.host + baseURL.pathname, `/nodes/${nodeId}/${backend}/logs`])}?interval=1&token=${useAuth.getState().getAuthToken()}`;
28 7389ad0 Mardin 2y ago } catch (e) {
29 7389ad0 Mardin 2y ago console.error("Unable to generate websocket url");
30 7389ad0 Mardin 2y ago console.error(e);
31 7389ad0 Mardin 2y ago return null;
32 7389ad0 Mardin 2y ago }
33 7389ad0 Mardin 2y ago };
34 7389ad0 Mardin 2y ago
35 7389ad0 Mardin 2y ago export const useNodesLog = (node: NodeType, backend: string) => {
36 7389ad0 Mardin 2y ago const [logs, setLogs] = useState<string[]>([]);
37 7389ad0 Mardin 2y ago const logsDiv = useRef<HTMLDivElement | null>(null);
38 7389ad0 Mardin 2y ago const scrollShouldStayOnEnd = useRef(true);
39 7389ad0 Mardin 2y ago
40 7389ad0 Mardin 2y ago const updateLogs = useCallback(
41 7389ad0 Mardin 2y ago (callback: (prevLogs: string[]) => string[]) => {
42 7389ad0 Mardin 2y ago setLogs((prevLogs) => {
43 7389ad0 Mardin 2y ago const newLogs = callback(prevLogs);
44 7389ad0 Mardin 2y ago return newLogs.length > MAX_NUMBER_OF_LOGS
45 7389ad0 Mardin 2y ago ? newLogs.slice(-MAX_NUMBER_OF_LOGS)
46 7389ad0 Mardin 2y ago : newLogs;
47 7389ad0 Mardin 2y ago });
48 7389ad0 Mardin 2y ago },
49 7389ad0 Mardin 2y ago [],
50 7389ad0 Mardin 2y ago );
51 7389ad0 Mardin 2y ago
52 7389ad0 Mardin 2y ago const { readyState } = useWebSocket(
53 7389ad0 Mardin 2y ago node?.id ? getWebsocketUrl(node.id, backend) : "",
54 7389ad0 Mardin 2y ago {
55 7389ad0 Mardin 2y ago onMessage: (e: any) => {
56 7389ad0 Mardin 2y ago updateLogs((prevLogs) => [...prevLogs, e.data]);
57 7389ad0 Mardin 2y ago },
58 7389ad0 Mardin 2y ago shouldReconnect: () => true,
59 7389ad0 Mardin 2y ago reconnectAttempts: 10,
60 7389ad0 Mardin 2y ago reconnectInterval: 1000,
61 7389ad0 Mardin 2y ago },
62 7389ad0 Mardin 2y ago );
63 7389ad0 Mardin 2y ago
64 7389ad0 Mardin 2y ago useEffect(() => {
65 7389ad0 Mardin 2y ago if (logsDiv.current && scrollShouldStayOnEnd.current) {
66 7389ad0 Mardin 2y ago logsDiv.current.scrollTop = logsDiv.current.scrollHeight;
67 7389ad0 Mardin 2y ago }
68 7389ad0 Mardin 2y ago }, [logs]);
69 7389ad0 Mardin 2y ago
70 7389ad0 Mardin 2y ago useEffect(() => {
71 7389ad0 Mardin 2y ago return () => {
72 7389ad0 Mardin 2y ago setLogs([]);
73 7389ad0 Mardin 2y ago };
74 7389ad0 Mardin 2y ago }, []);
75 7389ad0 Mardin 2y ago
76 7389ad0 Mardin 2y ago const status = getStatus(readyState.toString());
77 7389ad0 Mardin 2y ago
78 7389ad0 Mardin 2y ago return { status, readyState, logs, logsDiv };
79 7389ad0 Mardin 2y ago };