From 14e8e14b7d231d1cc00eeaa43c57eb734e9bc16d Mon Sep 17 00:00:00 2001 From: Mauricio Siu <47042324+Siumauricio@users.noreply.github.com> Date: Sun, 25 Aug 2024 18:03:43 -0600 Subject: [PATCH] refactor: remove sockets --- .../requests/request-distribution-chart.tsx | 4 +- .../dashboard/requests/requests-table.tsx | 104 ++---------------- apps/dokploy/server/server.ts | 2 - apps/dokploy/server/wss/requests-logs.ts | 79 ------------- 4 files changed, 15 insertions(+), 174 deletions(-) delete mode 100644 apps/dokploy/server/wss/requests-logs.ts diff --git a/apps/dokploy/components/dashboard/requests/request-distribution-chart.tsx b/apps/dokploy/components/dashboard/requests/request-distribution-chart.tsx index f4720ba3..4d3b20ff 100644 --- a/apps/dokploy/components/dashboard/requests/request-distribution-chart.tsx +++ b/apps/dokploy/components/dashboard/requests/request-distribution-chart.tsx @@ -25,7 +25,9 @@ const chartConfig = { } satisfies ChartConfig; export const RequestDistributionChart = () => { - const { data: stats } = api.settings.readStats.useQuery(); + const { data: stats } = api.settings.readStats.useQuery(undefined, { + refetchInterval: 1333, + }); return ( diff --git a/apps/dokploy/components/dashboard/requests/requests-table.tsx b/apps/dokploy/components/dashboard/requests/requests-table.tsx index 3fb12b91..714a7047 100644 --- a/apps/dokploy/components/dashboard/requests/requests-table.tsx +++ b/apps/dokploy/components/dashboard/requests/requests-table.tsx @@ -10,7 +10,7 @@ import { type VisibilityState, flexRender, } from "@tanstack/react-table"; -import { useCallback, useEffect, useMemo, useRef, useState } from "react"; +import { useMemo, useState } from "react"; import type { LogEntry } from "./show-requests"; import { Badge } from "@/components/ui/badge"; import { @@ -78,10 +78,6 @@ export const priorities = [ }, ]; export const RequestsTable = () => { - const [statsLogs, setStatsLogs] = useState<{ - data: LogEntry[]; - totalCount: number; - }>(); const [statusFilter, setStatusFilter] = useState([]); const [search, setSearch] = useState(""); const [selectedRow, setSelectedRow] = useState(); @@ -94,93 +90,17 @@ export const RequestsTable = () => { pageSize: 10, }); - // const { data: statsLogs, isLoading } = api.settings.readStatsLogs.useQuery({ - // sort: sorting[0], - // page: pagination, - // search, - // status: statusFilter, - // }); - - // useEffect(() => { - // const protocol = window.location.protocol === "https:" ? "wss:" : "ws:"; - - // const wsUrl = `${protocol}//${window.location.host}/request-logs`; - // const ws = new WebSocket(wsUrl); - - // ws.onopen = () => { - // // Enviar parámetros iniciales - // ws.send( - // JSON.stringify({ - // page: pagination, - // sort: sorting[0], - // search: search, - // status: statusFilter, - // }), - // ); - // }; - - // ws.onmessage = (event) => { - // const data = JSON.parse(event.data); - // setStatsLogs(data); - // }; - - // // return () => ws.close(); - // }, [pagination, search, sorting, statusFilter]); - const wsRef = useRef(null); - const isInitialMount = useRef(true); - - const sendParams = useCallback(() => { - if (wsRef.current && wsRef.current.readyState === WebSocket.OPEN) { - wsRef.current.send( - JSON.stringify({ - page: pagination, - sort: sorting[0], - search: search, - status: statusFilter, - }), - ); - } else { - console.log("WebSocket not ready, retrying in 100ms"); - setTimeout(sendParams, 100); // Retry after 100ms - } - }, [pagination, sorting, search, statusFilter]); - - useEffect(() => { - const protocol = window.location.protocol === "https:" ? "wss:" : "ws:"; - const wsUrl = `${protocol}//${window.location.host}/request-logs`; - const newWs = new WebSocket(wsUrl); - - newWs.onopen = () => { - console.log("WebSocket connection established"); - wsRef.current = newWs; - sendParams(); // Send initial params as soon as the connection is open - }; - - newWs.onmessage = (event) => { - const data = JSON.parse(event.data); - setStatsLogs(data); - }; - - newWs.onerror = (error) => { - console.error("WebSocket error:", error); - }; - - newWs.onclose = () => { - console.log("WebSocket connection closed"); - }; - - return () => { - newWs.close(); - }; - }, []); - - useEffect(() => { - if (isInitialMount.current) { - isInitialMount.current = false; - } else { - sendParams(); - } - }, [sendParams]); + const { data: statsLogs, isLoading } = api.settings.readStatsLogs.useQuery( + { + sort: sorting[0], + page: pagination, + search, + status: statusFilter, + }, + { + refetchInterval: 1333, + }, + ); const pageCount = useMemo(() => { if (statsLogs?.totalCount) { diff --git a/apps/dokploy/server/server.ts b/apps/dokploy/server/server.ts index 3b00cfe1..607a5fa0 100644 --- a/apps/dokploy/server/server.ts +++ b/apps/dokploy/server/server.ts @@ -23,7 +23,6 @@ import { getPublicIpWithFallback, setupTerminalWebSocketServer, } from "./wss/terminal"; -import { setupRequestLogsWebSocketServer } from "./wss/requests-logs"; config({ path: ".env" }); const PORT = Number.parseInt(process.env.PORT || "3000", 10); @@ -40,7 +39,6 @@ void app.prepare().then(async () => { setupDeploymentLogsWebSocketServer(server); setupDockerContainerLogsWebSocketServer(server); setupDockerContainerTerminalWebSocketServer(server); - setupRequestLogsWebSocketServer(server); setupTerminalWebSocketServer(server); setupDockerStatsMonitoringSocketServer(server); diff --git a/apps/dokploy/server/wss/requests-logs.ts b/apps/dokploy/server/wss/requests-logs.ts deleted file mode 100644 index c1a9af22..00000000 --- a/apps/dokploy/server/wss/requests-logs.ts +++ /dev/null @@ -1,79 +0,0 @@ -import type http from "node:http"; -import { WebSocketServer } from "ws"; -import { validateWebSocketRequest } from "../auth/auth"; -import { readMonitoringConfig } from "../utils/traefik/application"; -import { parseRawConfig } from "../utils/access-log/utils"; -import { apiReadStatsLogs } from "../db/schema"; -import fs from "node:fs"; -import path from "node:path"; -import { DYNAMIC_TRAEFIK_PATH } from "../constants"; - -export const setupRequestLogsWebSocketServer = ( - server: http.Server, -) => { - const wssTerm = new WebSocketServer({ - noServer: true, - path: "/request-logs", - }); - - server.on("upgrade", (req, socket, head) => { - const { pathname } = new URL(req.url || "", `http://${req.headers.host}`); - - if (pathname === "/_next/webpack-hmr") { - return; - } - if (pathname === "/request-logs") { - wssTerm.handleUpgrade(req, socket, head, function done(ws) { - wssTerm.emit("connection", ws, req); - }); - } - }); - - const broadcastUpdate = (input: any) => { - const rawConfig = readMonitoringConfig(); - const parsedConfig = parseRawConfig( - rawConfig as string, - input.page, - input.sort, - input.search, - input.status, - ); - - return parsedConfig; - }; - - const configPath = path.join(DYNAMIC_TRAEFIK_PATH, "access.log"); - - // eslint-disable-next-line @typescript-eslint/no-misused-promises - wssTerm.on("connection", async (ws, req) => { - const { user, session } = await validateWebSocketRequest(req); - - if (!user || !session) { - ws.close(); - return; - } - - try { - ws.on("message", (message: string) => { - try { - const input = apiReadStatsLogs.parse(JSON.parse(message)); - const parsedConfig = broadcastUpdate(input); - ws.send(JSON.stringify(parsedConfig)); - - fs.watch(configPath, (eventType) => { - if (eventType === "change") { - const parsedConfig = broadcastUpdate(input); - ws.send(JSON.stringify(parsedConfig)); - } - }); - } catch (error) { - ws.send(JSON.stringify({ error: "Invalid message format" })); - } - }); - } catch (error) { - const errorMessage = (error as Error)?.message; - console.log(errorMessage); - ws.send(errorMessage); - } - }); -};