diff --git a/src/Pages/DistributedUptime/Monitors/Hooks/useSubscribeToMonitors.jsx b/src/Pages/DistributedUptime/Monitors/Hooks/useSubscribeToMonitors.jsx index 6855c44c5..ffca50cd7 100644 --- a/src/Pages/DistributedUptime/Monitors/Hooks/useSubscribeToMonitors.jsx +++ b/src/Pages/DistributedUptime/Monitors/Hooks/useSubscribeToMonitors.jsx @@ -20,6 +20,43 @@ const useSubscribeToMonitors = (page, rowsPerPage) => { const { getMonitorWithPercentage } = useMonitorUtils(); useEffect(() => { + const fetchInitialData = async () => { + try { + const initialDataRes = await networkService.getDistributedUptimeMonitors({ + teamId: user.teamId, + limit: 25, + types: [ + typeof import.meta.env.VITE_DEPIN_TESTING === "undefined" + ? "distributed_http" + : "distributed_test", + ], + page, + rowsPerPage, + }); + const responseData = initialDataRes?.data?.data; + if (typeof responseData === "undefined") throw new Error("No data"); + + const { monitors, filteredMonitors, summary } = responseData; + + const mappedMonitors = filteredMonitors?.map((monitor) => + getMonitorWithPercentage(monitor, theme) + ); + + setMonitors(monitors); + setMonitorsSummary(summary); + setFilteredMonitors(mappedMonitors); + } catch (error) { + setNetworkError(true); + createToast({ + body: error.message, + }); + } finally { + setIsLoading(false); + } + }; + + fetchInitialData(); + try { const cleanup = networkService.subscribeToDistributedUptimeMonitors({ teamId: user.teamId, diff --git a/src/Utils/NetworkService.js b/src/Utils/NetworkService.js index 73a54136d..1f6a36726 100644 --- a/src/Utils/NetworkService.js +++ b/src/Utils/NetworkService.js @@ -807,6 +807,31 @@ class NetworkService { ); } + getDistributedUptimeMonitors(config) { + const { teamId, limit, types, page, rowsPerPage, filter, field, order } = config; + + const params = new URLSearchParams(); + + if (limit) params.append("limit", limit); + if (types) { + types.forEach((type) => { + params.append("type", type); + }); + } + if (page) params.append("page", page); + if (rowsPerPage) params.append("rowsPerPage", rowsPerPage); + if (filter) params.append("filter", filter); + if (field) params.append("field", field); + if (order) params.append("order", order); + + if (this.eventSource) { + this.eventSource.close(); + } + + const url = `${this.axiosInstance.defaults.baseURL}/distributed-uptime/monitors/${teamId}/initial?${params.toString()}`; + return this.axiosInstance.get(url); + } + subscribeToDistributedUptimeMonitors(config) { const { teamId,