Merge remote-tracking branch 'upstream/develop' into feat/monitor-notification-integration

src/Hooks/useSubscribeToDepinMonitors.js

@@ -78,6 +78,7 @@ const useSubscribeToDepinMonitors = (page, rowsPerPage) => {
 				},
 				onError: () => {
 					setIsLoading(false);
+					setNetworkError(true);
 				},
 			});
 

src/Pages/Maintenance/index.jsx

@@ -10,6 +10,8 @@ import Breadcrumbs from "../../Components/Breadcrumbs";
 import { useNavigate } from "react-router-dom";
 import { useIsAdmin } from "../../Hooks/useIsAdmin";
 import { useTranslation } from "react-i18next";
+import { Typography } from "@mui/material";
+import GenericFallback from "../../Components/GenericFallback";
 
 const Maintenance = () => {
 	const theme = useTheme();
@@ -22,6 +24,7 @@ const Maintenance = () => {
 	const [page, setPage] = useState(0);
 	const [sort, setSort] = useState({});
 	const [updateTrigger, setUpdateTrigger] = useState(false);
+	const [networkError, setNetworkError] = useState(false);
 
 	const handleActionMenuDelete = () => {
 		setUpdateTrigger((prev) => !prev);
@@ -38,12 +41,26 @@ const Maintenance = () => {
 				setMaintenanceWindows(maintenanceWindows);
 				setMaintenanceWindowCount(maintenanceWindowCount);
 			} catch (error) {
-				console.log(error);
+				setNetworkError(true);
 			}
 		};
 		fetchMaintenanceWindows();
 	}, [page, rowsPerPage, updateTrigger]);
 
+	if (networkError) {
+		return (
+			<GenericFallback>
+				<Typography
+					variant="h1"
+					marginY={theme.spacing(4)}
+					color={theme.palette.primary.contrastTextTertiary}
+				>
+					{t("networkError")}
+				</Typography>
+				<Typography>{t("checkConnection")}</Typography>
+			</GenericFallback>
+		);
+	}
 	if (maintenanceWindows.length === 0) {
 		return (
 			<Fallback

src/Pages/Settings/index.jsx

@@ -134,6 +134,7 @@ const Settings = () => {
 				});
 			} else {
 				if (action.payload) {
+					console.log(action.payload);
 					// dispatch errors
 					createToast({
 						body: action.payload.msg,
@@ -298,7 +299,14 @@ const Settings = () => {
 								{t("settingsWalletDescription")}
 							</Typography>
 						</Box>
-						<Box sx={{ display: 'flex', flexWrap: 'wrap', justifyContent: 'flex-start', gap: 2 }}>
+						<Box
+							sx={{
+								display: "flex",
+								flexWrap: "wrap",
+								justifyContent: "flex-start",
+								gap: 2,
+							}}
+						>
 							<Stack
 								direction="row"
 								spacing={2}
@@ -401,7 +409,6 @@ const Settings = () => {
 					</ConfigBox>
 				)}
 
-
 				<ConfigBox>
 					<Box>
 						<Typography component="h1">{t("settingsAbout")}</Typography>

src/Utils/NetworkService.js

@@ -669,7 +669,7 @@ class NetworkService {
 		});
 	}
 
-		/**
+	/**
 	 * ************************************
 	 * Test a notification integration
 	 * ************************************
@@ -681,14 +681,18 @@ class NetworkService {
 	 * @returns {Promise<AxiosResponse>} The response from the axios POST request.
 	 */
 	async testNotification(config) {
-		return this.axiosInstance.post('/notifications/test-webhook', {
-		platform: config.platform,
-		...config.payload
-		}, {
-		headers: {
-			"Content-Type": "application/json",
-		},
-		});
+		return this.axiosInstance.post(
+			"/notifications/test-webhook",
+			{
+				platform: config.platform,
+				...config.payload,
+			},
+			{
+				headers: {
+					"Content-Type": "application/json",
+				},
+			}
+		);
 	}
 
 	/**