From e366741aa9ff3f37a2f0727c948316ad129c25a6 Mon Sep 17 00:00:00 2001 From: Amol Date: Sat, 14 Jun 2025 23:49:39 +0530 Subject: [PATCH] fix: updating code to the coding standards & changing the search param --- .../Components/LoadingSpinner/index.jsx | 46 ----------------- .../Components/MonitorsTable/index.jsx | 2 +- .../Components/SearchComponent/index.jsx | 49 ------------------- .../Monitors/Hooks/useDebounce.jsx | 18 ------- .../Monitors/Hooks/useMonitorFetch.jsx | 5 +- .../Pages/Infrastructure/Monitors/index.jsx | 5 +- client/src/Utils/NetworkService.js | 4 +- server/db/mongo/modules/monitorModule.js | 6 +-- server/validation/joi.js | 1 - 9 files changed, 9 insertions(+), 127 deletions(-) delete mode 100644 client/src/Pages/Infrastructure/Monitors/Components/LoadingSpinner/index.jsx delete mode 100644 client/src/Pages/Infrastructure/Monitors/Components/SearchComponent/index.jsx delete mode 100644 client/src/Pages/Infrastructure/Monitors/Hooks/useDebounce.jsx diff --git a/client/src/Pages/Infrastructure/Monitors/Components/LoadingSpinner/index.jsx b/client/src/Pages/Infrastructure/Monitors/Components/LoadingSpinner/index.jsx deleted file mode 100644 index a649473af..000000000 --- a/client/src/Pages/Infrastructure/Monitors/Components/LoadingSpinner/index.jsx +++ /dev/null @@ -1,46 +0,0 @@ -import { CircularProgress, Box } from "@mui/material"; -import { useTheme } from "@emotion/react"; -import PropTypes from "prop-types"; -const LoadingSpinner = ({ shouldRender }) => { - const theme = useTheme(); - if (shouldRender === false) { - return; - } - - return ( - <> - - - - - - ); -}; - -LoadingSpinner.propTypes = { - shouldRender: PropTypes.bool, -}; - -export default LoadingSpinner; diff --git a/client/src/Pages/Infrastructure/Monitors/Components/MonitorsTable/index.jsx b/client/src/Pages/Infrastructure/Monitors/Components/MonitorsTable/index.jsx index b19853b1e..9ab128c5e 100644 --- a/client/src/Pages/Infrastructure/Monitors/Components/MonitorsTable/index.jsx +++ b/client/src/Pages/Infrastructure/Monitors/Components/MonitorsTable/index.jsx @@ -5,7 +5,7 @@ import Host from "../../../../../Components/Host"; import { StatusLabel } from "../../../../../Components/Label"; import { Stack } from "@mui/material"; import { InfrastructureMenu } from "../MonitorsTableMenu"; -import LoadingSpinner from "../LoadingSpinner"; +import LoadingSpinner from "../../../../Uptime/Monitors/Components/LoadingSpinner"; // Assets import CPUChipIcon from "../../../../../assets/icons/cpu-chip.svg?react"; import CustomGauge from "../../../../../Components/Charts/CustomGauge"; diff --git a/client/src/Pages/Infrastructure/Monitors/Components/SearchComponent/index.jsx b/client/src/Pages/Infrastructure/Monitors/Components/SearchComponent/index.jsx deleted file mode 100644 index 0c6eec854..000000000 --- a/client/src/Pages/Infrastructure/Monitors/Components/SearchComponent/index.jsx +++ /dev/null @@ -1,49 +0,0 @@ -import { useState } from "react"; -import Search from "../../../../../Components/Inputs/Search"; -import { Box } from "@mui/material"; -import useDebounce from "../../Hooks/useDebounce"; -import { useEffect, useRef } from "react"; -import PropTypes from "prop-types"; - -const SearchComponent = ({ monitors = [], onSearchChange, setIsSearching }) => { - const isFirstRender = useRef(true); - const [localSearch, setLocalSearch] = useState(""); - const debouncedSearch = useDebounce(localSearch, 500); - useEffect(() => { - if (isFirstRender.current === true) { - isFirstRender.current = false; - return; - } - onSearchChange(debouncedSearch); - setIsSearching(false); - }, [debouncedSearch, onSearchChange, setIsSearching]); - - const handleSearch = (value) => { - setLocalSearch(value); - setIsSearching(true); - }; - - return ( - - - - ); -}; - -SearchComponent.propTypes = { - monitors: PropTypes.array, - onSearchChange: PropTypes.func, - setIsSearching: PropTypes.func, -}; - -export default SearchComponent; diff --git a/client/src/Pages/Infrastructure/Monitors/Hooks/useDebounce.jsx b/client/src/Pages/Infrastructure/Monitors/Hooks/useDebounce.jsx deleted file mode 100644 index 11d639f14..000000000 --- a/client/src/Pages/Infrastructure/Monitors/Hooks/useDebounce.jsx +++ /dev/null @@ -1,18 +0,0 @@ -import { useState, useEffect } from "react"; - -const useDebounce = (value, delay) => { - const [debouncedValue, setDebouncedValue] = useState(value); - - useEffect(() => { - const handler = setTimeout(() => { - setDebouncedValue(value); - }, delay); - - return () => { - clearTimeout(handler); - }; - }, [value, delay]); - return debouncedValue; -}; - -export default useDebounce; diff --git a/client/src/Pages/Infrastructure/Monitors/Hooks/useMonitorFetch.jsx b/client/src/Pages/Infrastructure/Monitors/Hooks/useMonitorFetch.jsx index 3d091dc64..883205c77 100644 --- a/client/src/Pages/Infrastructure/Monitors/Hooks/useMonitorFetch.jsx +++ b/client/src/Pages/Infrastructure/Monitors/Hooks/useMonitorFetch.jsx @@ -3,7 +3,7 @@ import { useSelector } from "react-redux"; import { networkService } from "../../../../main"; import { createToast } from "../../../../Utils/toastUtils"; -const useMonitorFetch = ({ page, field, filter, rowsPerPage, updateTrigger, search }) => { +const useMonitorFetch = ({ page, field, filter, rowsPerPage, updateTrigger }) => { // Redux state const { user } = useSelector((state) => state.auth); @@ -24,7 +24,6 @@ const useMonitorFetch = ({ page, field, filter, rowsPerPage, updateTrigger, sear types: ["hardware"], page: page, rowsPerPage: rowsPerPage, - search: search, }); setMonitors(response?.data?.data?.filteredMonitors ?? []); setSummary(response?.data?.data?.summary ?? {}); @@ -39,7 +38,7 @@ const useMonitorFetch = ({ page, field, filter, rowsPerPage, updateTrigger, sear }; fetchMonitors(); - }, [page, field, filter, rowsPerPage, user.teamId, updateTrigger, search]); + }, [page, field, filter, rowsPerPage, user.teamId, updateTrigger]); return { monitors, summary, isLoading, networkError }; }; diff --git a/client/src/Pages/Infrastructure/Monitors/index.jsx b/client/src/Pages/Infrastructure/Monitors/index.jsx index e9ac4c4eb..2f146f2de 100644 --- a/client/src/Pages/Infrastructure/Monitors/index.jsx +++ b/client/src/Pages/Infrastructure/Monitors/index.jsx @@ -8,7 +8,7 @@ import Pagination from "../../..//Components/Table/TablePagination"; import GenericFallback from "../../../Components/GenericFallback"; import Fallback from "../../../Components/Fallback"; import Filter from "./Components/Filters"; -import SearchComponent from "./Components/SearchComponent"; +import SearchComponent from "../../Uptime/Monitors/Components/SearchComponent"; // Utils import { useTheme } from "@emotion/react"; import { useMonitorFetch } from "./Hooks/useMonitorFetch"; @@ -56,10 +56,9 @@ const InfrastructureMonitors = () => { const { monitors, summary, isLoading, networkError } = useMonitorFetch({ page, field: field, - filter: toFilterStatus, + filter: toFilterStatus || search, rowsPerPage, updateTrigger, - search, }); if (networkError === true) { diff --git a/client/src/Utils/NetworkService.js b/client/src/Utils/NetworkService.js index 1b4ffba0f..27964a5ef 100644 --- a/client/src/Utils/NetworkService.js +++ b/client/src/Utils/NetworkService.js @@ -187,8 +187,7 @@ class NetworkService { */ async getMonitorsByTeamId(config) { - const { teamId, limit, types, page, rowsPerPage, filter, field, order, search } = - config; + const { teamId, limit, types, page, rowsPerPage, filter, field, order } = config; const params = new URLSearchParams(); if (limit) params.append("limit", limit); @@ -202,7 +201,6 @@ class NetworkService { if (filter) params.append("filter", filter); if (field) params.append("field", field); if (order) params.append("order", order); - if (search) params.append("search", search); return this.axiosInstance.get(`/monitors/team/${teamId}?${params.toString()}`, { headers: { diff --git a/server/db/mongo/modules/monitorModule.js b/server/db/mongo/modules/monitorModule.js index 0e90c9c7f..735cb6cc5 100755 --- a/server/db/mongo/modules/monitorModule.js +++ b/server/db/mongo/modules/monitorModule.js @@ -510,7 +510,7 @@ const getMonitorById = async (monitorId) => { }; const getMonitorsByTeamId = async (req) => { - let { limit, type, page, rowsPerPage, filter, field, order, search } = req.query; + let { limit, type, page, rowsPerPage, filter, field, order } = req.query; limit = parseInt(limit); page = parseInt(page); rowsPerPage = parseInt(rowsPerPage); @@ -523,8 +523,8 @@ const getMonitorsByTeamId = async (req) => { if (type !== undefined) { matchStage.type = Array.isArray(type) ? { $in: type } : type; } - if (search) { - matchStage.name = { $regex: search, $options: "i" }; + if (field === undefined) { + matchStage.name = { $regex: filter, $options: "i" }; } const summaryResult = await Monitor.aggregate( diff --git a/server/validation/joi.js b/server/validation/joi.js index 6d8e97cf1..271cd2d21 100755 --- a/server/validation/joi.js +++ b/server/validation/joi.js @@ -147,7 +147,6 @@ const getMonitorsByTeamIdQueryValidation = joi.object({ filter: joi.string(), field: joi.string(), order: joi.string().valid("asc", "desc"), - search: joi.string(), }); const getMonitorStatsByIdParamValidation = joi.object({