diff --git a/client/src/Hooks/UseApi.ts b/client/src/Hooks/UseApi.ts index 2a5d514f6..84fd1b547 100644 --- a/client/src/Hooks/UseApi.ts +++ b/client/src/Hooks/UseApi.ts @@ -4,6 +4,7 @@ import type { AxiosRequestConfig } from "axios"; import { get, patch, post, put, deleteOp } from "@/Utils/ApiClient"; import { useState } from "react"; import { useToast } from "@/Hooks/UseToast"; +import { logger } from "@/Utils/logger"; interface ApiResponse { success: boolean; @@ -61,7 +62,7 @@ export const usePost = () => { return res.data; } catch (err: any) { const errMsg = err?.response?.data?.msg || err.message || "An error occurred"; - console.error(err); + logger.error("POST request failed", err, { endpoint, body }); toastError(errMsg); setError(errMsg); return null; @@ -96,7 +97,7 @@ export const usePatch = () => { toastSuccess(res.data?.msg || "Operation successful"); return res.data; } catch (err: any) { - console.error(err); + logger.error("PATCH request failed", err, { endpoint, body }); const errMsg = err?.response?.data?.msg || err.message || "An error occurred"; toastError(errMsg); setError(errMsg); @@ -132,7 +133,7 @@ export const usePut = () => { toastSuccess(res.data?.msg || "Operation successful"); return res.data; } catch (err: any) { - console.error(err); + logger.error("PUT request failed", err, { endpoint, body }); const errMsg = err?.response?.data?.msg || err.message || "An error occurred"; toastError(errMsg); setError(errMsg); @@ -167,7 +168,7 @@ export const useDelete = () => { toastSuccess(res.data?.msg || "Operation successful"); return res.data; } catch (err: any) { - console.error(err); + logger.error("DELETE request failed", err, { endpoint }); const errMsg = err?.response?.data?.message || err.message || "An error occurred"; toastError(errMsg); setError(errMsg); @@ -201,7 +202,7 @@ export const useLazyGet = () => { }); return res.data; } catch (err: any) { - console.error(err); + logger.error("GET request failed", err, { endpoint }); const errMsg = err?.response?.data?.msg || err.message || "An error occurred"; toastError(errMsg); setError(errMsg); diff --git a/client/src/Pages/CreateMonitor/index.tsx b/client/src/Pages/CreateMonitor/index.tsx index 6ebc4b0fd..4d6c7dfeb 100644 --- a/client/src/Pages/CreateMonitor/index.tsx +++ b/client/src/Pages/CreateMonitor/index.tsx @@ -1,5 +1,6 @@ import { useMemo, useState } from "react"; import { useEffect } from "react"; +import { logger } from "@/Utils/logger"; import { useParams, useLocation, useNavigate } from "react-router"; import { useForm, Controller } from "react-hook-form"; import { zodResolver } from "@hookform/resolvers/zod"; @@ -253,7 +254,7 @@ const CreateMonitorPage = () => { }; const onError = (errors: unknown) => { - console.log(errors); + logger.debug("Monitor creation validation errors", errors); }; return ( diff --git a/client/src/Pages/Maintenance/create/index.tsx b/client/src/Pages/Maintenance/create/index.tsx index b6666d4e2..e5293c897 100644 --- a/client/src/Pages/Maintenance/create/index.tsx +++ b/client/src/Pages/Maintenance/create/index.tsx @@ -1,5 +1,6 @@ import Stack from "@mui/material/Stack"; import MenuItem from "@mui/material/MenuItem"; +import { logger } from "@/Utils/logger"; import Typography from "@mui/material/Typography"; import IconButton from "@mui/material/IconButton"; import { BasePage, ConfigBox } from "@/Components/design-elements"; @@ -108,7 +109,7 @@ const CreateMaintenanceWindowPage = () => { const isLoading = isPosting || isPatching; const onError = (errors: any) => { - console.error("Form submission errors:", errors); + logger.error("Maintenance form submission failed", undefined, { errors }); }; return ( diff --git a/client/src/Pages/Settings/index.tsx b/client/src/Pages/Settings/index.tsx index dbeba6096..3e27509e6 100644 --- a/client/src/Pages/Settings/index.tsx +++ b/client/src/Pages/Settings/index.tsx @@ -1,5 +1,6 @@ import { BasePage, ConfigBox, TextLink } from "@/Components/design-elements"; import { Autocomplete, Select, Dialog, SwitchComponent } from "@/Components/inputs"; +import { logger } from "@/Utils/logger"; import { Stack, useTheme, @@ -288,7 +289,7 @@ export const SettingsPage = () => { }; const onError = (errors: unknown) => { - console.log("Form validation errors:", errors); + logger.debug("Form validation errors", errors); }; const languages = Object.keys(i18n.options.resources || {}); diff --git a/client/src/Pages/StatusPage/Create/index.tsx b/client/src/Pages/StatusPage/Create/index.tsx index b1b43d8bb..e0efeec0f 100644 --- a/client/src/Pages/StatusPage/Create/index.tsx +++ b/client/src/Pages/StatusPage/Create/index.tsx @@ -1,5 +1,6 @@ import { BasePage, ConfigBox } from "@/Components/design-elements"; import Stack from "@mui/material/Stack"; +import { logger } from "@/Utils/logger"; import Typography from "@mui/material/Typography"; import IconButton from "@mui/material/IconButton"; import FormControlLabel from "@mui/material/FormControlLabel"; @@ -80,7 +81,7 @@ const CreateStatusPage = () => { }, [defaults, reset]); const onError = (errors: any) => { - console.log(errors); + logger.debug("Status page validation errors", errors); }; const handleDeleteClick = () => { @@ -128,7 +129,7 @@ const CreateStatusPage = () => { fd.append("logo", imageResult.data); URL.revokeObjectURL(data.logo.data); } catch (e) { - console.error("Error fetching logo blob:", e); + logger.error("Failed to fetch logo blob", e instanceof Error ? e : undefined); } } } diff --git a/client/src/Types/env.d.ts b/client/src/Types/env.d.ts index c269d0f63..af8f983fb 100644 --- a/client/src/Types/env.d.ts +++ b/client/src/Types/env.d.ts @@ -4,6 +4,7 @@ declare const __APP_VERSION__: string; interface ImportMetaEnv { readonly VITE_APP_API_V2_BASE_URL?: string; + readonly VITE_APP_LOG_LEVEL?: "debug" | "info" | "warn" | "error"; } interface ImportMeta { diff --git a/client/src/Utils/logger.ts b/client/src/Utils/logger.ts index a1da280d1..4a97dbecb 100644 --- a/client/src/Utils/logger.ts +++ b/client/src/Utils/logger.ts @@ -1,4 +1,4 @@ -import { LOG_LEVELS, type LogLevel } from "@/Types/Log"; +import type { LogLevel } from "@/Types/Log"; interface LogContext { [key: string]: any; @@ -25,10 +25,7 @@ interface ErrorLogData { userAgent: string; } -const envLevel = import.meta.env.VITE_APP_LOG_LEVEL?.toLowerCase() || "error"; -const configuredLevel: LogLevel = LOG_LEVELS.includes(envLevel as LogLevel) - ? (envLevel as LogLevel) - : "error"; +const configuredLevel: LogLevel = import.meta.env.VITE_APP_LOG_LEVEL || "error"; const configuredPriority = LOG_LEVEL_PRIORITY[configuredLevel]; const shouldLog = (level: LogLevel): boolean => {