Merge branch 'develop' into fix/language-detection

client/src/Components/Fallback/index.jsx

@@ -118,6 +118,17 @@ const Fallback = ({ title, checks, link = "/", isAdmin, vowelStart = false, show
 						>
 							Let's create your first {title}
 						</Button>
+						{/* Bulk create of uptime monitors */}
+						{title === "uptime monitor" && (
+						<Button
+								variant="contained"
+								color="accent"
+								sx={{ alignSelf: "center" }}
+								onClick={() => navigate("/uptime/bulk-import")}
+							>
+								{t("bulkImport.fallbackPage")}
+							</Button>
+						)}
 						
 						{/* Warning box for PageSpeed monitor */}
 						{(title === "pagespeed monitor" && showPageSpeedWarning) && (

client/src/Components/MonitorCreateHeader/index.jsx

@@ -1,30 +1,49 @@
 import { Stack, Button } from "@mui/material";
 import { useNavigate } from "react-router-dom";
 import PropTypes from "prop-types";
-import SkeletonLayout from "./skeleton";
+import { useTranslation } from "react-i18next";
+import { useTheme } from "@emotion/react";
 
 const CreateMonitorHeader = ({
 	isAdmin,
 	label = "Create new",
-	shouldRender = true,
+	isLoading = true,
 	path,
+	bulkPath,
 }) => {
 	const navigate = useNavigate();
+	const { t } = useTranslation();
+	const theme = useTheme();
+
 	if (!isAdmin) return null;
-	if (!shouldRender) return <SkeletonLayout />;
+
 	return (
 		<Stack
 			direction="row"
 			justifyContent="end"
 			alignItems="center"
+			gap={theme.spacing(6)}
 		>
 			<Button
+				loading={isLoading}
 				variant="contained"
 				color="accent"
 				onClick={() => navigate(path)}
 			>
 				{label}
 			</Button>
+			{bulkPath && (
+				<Button
+					loading={isLoading}
+					variant="contained"
+					color="accent"
+					onClick={() => {
+						navigate(`${bulkPath}`);
+					}}
+				>
+					{t("bulkImport.title")}
+				</Button>
+			)}
 		</Stack>
 	);
 };
@@ -33,7 +52,8 @@ export default CreateMonitorHeader;
 
 CreateMonitorHeader.propTypes = {
 	isAdmin: PropTypes.bool.isRequired,
-	shouldRender: PropTypes.bool,
+	isLoading: PropTypes.bool,
 	path: PropTypes.string.isRequired,
 	label: PropTypes.string,
+	bulkPath: PropTypes.string,
 };

client/src/Components/MonitorTimeFrameHeader/index.jsx

@@ -55,10 +55,9 @@ const MonitorTimeFrameHeader = ({
 	return (
 		<Stack
 			direction="row"
-			justifyContent="space-between"
-			alignItems="flex-end"
+			justifyContent="flex-end"
+			alignItems="center"
 			gap={theme.spacing(4)}
-			mb={theme.spacing(8)}
 		>
 			<Typography variant="body2">
 				Showing statistics for past{" "}

client/src/Components/NotificationIntegrationModal/Components/NotificationIntegrationModal.jsx

@@ -1,16 +1,17 @@
-import { useState, useMemo } from "react";
+import { useState, useMemo, useEffect, useCallback } from "react";
 import { useTranslation } from "react-i18next";
 import PropTypes from "prop-types";
 
-import { 
-  Dialog, 
-  DialogContent, 
-  DialogActions,
-  Button, 
-  Typography, 
-  Box,
-  Tabs,
-  Tab,
+import {
+	Dialog,
+	DialogContent,
+	DialogActions,
+	Button,
+	Typography,
+	Box,
+	Tabs,
+	Tab,
+	Stack,
 } from "@mui/material";
 import { useTheme } from "@emotion/react";
 import TabPanel from "./TabPanel";
@@ -19,335 +20,400 @@ import useNotifications from "../Hooks/useNotification";
 
 // Define constants for notification types to avoid magic values
 const NOTIFICATION_TYPES = {
-  SLACK: 'slack',
-  DISCORD: 'discord',
-  TELEGRAM: 'telegram',
-  WEBHOOK: 'webhook'
+	SLACK: "slack",
+	DISCORD: "discord",
+	TELEGRAM: "telegram",
+	WEBHOOK: "webhook",
 };
 
 // Define constants for field IDs
 const FIELD_IDS = {
-  WEBHOOK: 'webhook',
-  TOKEN: 'token',
-  CHAT_ID: 'chatId',
-  URL: 'url'
+	WEBHOOK: "webhook",
+	TOKEN: "token",
+	CHAT_ID: "chatId",
+	URL: "url",
 };
 
-const NotificationIntegrationModal = ({ 
-  open, 
-  onClose, 
-  monitor,
-  setMonitor,
-  // Optional prop to configure available notification types
-  notificationTypes = null
+const NotificationIntegrationModal = ({
+	open,
+	onClose,
+	monitor,
+	setMonitor,
+	// Optional prop to configure available notification types
+	notificationTypes = null,
 }) => {
-  const { t } = useTranslation();
-  const theme = useTheme();
-  const [tabValue, setTabValue] = useState(0);
-  
-  const [loading, _, sendTestNotification] = useNotifications();
-  
-  // Helper to get the field state key with error handling
-  const getFieldKey = (typeId, fieldId) => {
-    if (typeof typeId !== 'string' || typeId === '') {
-      throw new Error(t('errorInvalidTypeId'));
-    }
-    
-    if (typeof fieldId !== 'string' || fieldId === '') {
-      throw new Error(t('errorInvalidFieldId'));
-    }
-    
-    return `${typeId}${fieldId.charAt(0).toUpperCase() + fieldId.slice(1)}`;
-  };
-  
-  // Define notification types
-  const DEFAULT_NOTIFICATION_TYPES = [
-    {
-      id: NOTIFICATION_TYPES.SLACK,
-      label: t('notifications.slack.label'),
-      description: t('notifications.slack.description'),
-      fields: [
-        {
-          id: FIELD_IDS.WEBHOOK,
-          label: t('notifications.slack.webhookLabel'),
-          placeholder: t('notifications.slack.webhookPlaceholder'),
-          type: 'text'
-        }
-      ]
-    },
-    {
-      id: NOTIFICATION_TYPES.DISCORD,
-      label: t('notifications.discord.label'),
-      description: t('notifications.discord.description'),
-      fields: [
-        {
-          id: FIELD_IDS.WEBHOOK,
-          label: t('notifications.discord.webhookLabel'),
-          placeholder: t('notifications.discord.webhookPlaceholder'),
-          type: 'text'
-        }
-      ]
-    },
-    {
-      id: NOTIFICATION_TYPES.TELEGRAM,
-      label: t('notifications.telegram.label'),
-      description: t('notifications.telegram.description'),
-      fields: [
-        {
-          id: FIELD_IDS.TOKEN,
-          label: t('notifications.telegram.tokenLabel'),
-          placeholder: t('notifications.telegram.tokenPlaceholder'),
-          type: 'text'
-        },
-        {
-          id: FIELD_IDS.CHAT_ID,
-          label: t('notifications.telegram.chatIdLabel'),
-          placeholder: t('notifications.telegram.chatIdPlaceholder'),
-          type: 'text'
-        }
-      ]
-    },
-    {
-      id: NOTIFICATION_TYPES.WEBHOOK,
-      label: t('notifications.webhook.label'),
-      description: t('notifications.webhook.description'),
-      fields: [
-        {
-          id: FIELD_IDS.URL,
-          label: t('notifications.webhook.urlLabel'),
-          placeholder: t('notifications.webhook.urlPlaceholder'),
-          type: 'text'
-        }
-      ]
-    }
-  ];
+	const { t } = useTranslation();
+	const theme = useTheme();
+	const [tabValue, setTabValue] = useState(0);
 
-  // Use provided notification types or default to our translated ones
-  const activeNotificationTypes = notificationTypes || DEFAULT_NOTIFICATION_TYPES;
-  
-  // Memoized function to initialize integrations state
-  const initialIntegrationsState = useMemo(() => {
-    const state = {};
-    
-    activeNotificationTypes.forEach(type => {
-      // Add enabled flag for each notification type
-      state[type.id] = monitor?.notifications?.some(n => n.type === type.id) || false;
-      
-      // Add state for each field in the notification type
-      type.fields.forEach(field => {
-        const fieldKey = getFieldKey(type.id, field.id);
-        state[fieldKey] = monitor?.notifications?.find(n => n.type === type.id)?.[field.id] || "";
-      });
-    });
-    
-    return state;
-  }, [monitor, activeNotificationTypes]); // Only recompute when these dependencies change
-  
-  const [integrations, setIntegrations] = useState(initialIntegrationsState);
+	const [loading, _, sendTestNotification] = useNotifications();
 
-  const handleChangeTab = (event, newValue) => {
-    setTabValue(newValue);
-  };
+	// Helper to get the field state key with error handling
+	const getFieldKey = useCallback(
+		(typeId, fieldId) => {
+			if (typeof typeId !== "string" || typeId === "") {
+				throw new Error(t("errorInvalidTypeId"));
+			}
 
-  const handleIntegrationChange = (type, checked) => {
-    setIntegrations(prev => ({
-      ...prev,
-      [type]: checked
-    }));
-  };
+			if (typeof fieldId !== "string" || fieldId === "") {
+				throw new Error(t("errorInvalidFieldId"));
+			}
 
-  const handleInputChange = (type, value) => {
-    setIntegrations(prev => ({
-      ...prev,
-      [type]: value
-    }));
-  };
+			return `${typeId}${fieldId.charAt(0).toUpperCase() + fieldId.slice(1)}`;
+		},
+		[t]
+	);
 
-  const handleTestNotification = async (type) => {
-    // Get the notification type details
-    const notificationType = activeNotificationTypes.find(t => t.id === type);
-    
-    if (typeof notificationType === "undefined") {
-      return;
-    }
-    
-    // Prepare config object based on notification type
-    const config = {};
-    
-    // Add each field value to the config object
-    notificationType.fields.forEach(field => {
-      const fieldKey = getFieldKey(type, field.id);
-      config[field.id] = integrations[fieldKey];
-    });
-    
-    await sendTestNotification(type, config);
-  };
-  
-  // In NotificationIntegrationModal.jsx, update the handleSave function:
+	// Define notification types
+	const DEFAULT_NOTIFICATION_TYPES = [
+		{
+			id: NOTIFICATION_TYPES.SLACK,
+			label: t("notifications.slack.label"),
+			description: t("notifications.slack.description"),
+			fields: [
+				{
+					id: FIELD_IDS.WEBHOOK,
+					label: t("notifications.slack.webhookLabel"),
+					placeholder: t("notifications.slack.webhookPlaceholder"),
+					type: "text",
+				},
+			],
+		},
+		{
+			id: NOTIFICATION_TYPES.DISCORD,
+			label: t("notifications.discord.label"),
+			description: t("notifications.discord.description"),
+			fields: [
+				{
+					id: FIELD_IDS.WEBHOOK,
+					label: t("notifications.discord.webhookLabel"),
+					placeholder: t("notifications.discord.webhookPlaceholder"),
+					type: "text",
+				},
+			],
+		},
+		{
+			id: NOTIFICATION_TYPES.TELEGRAM,
+			label: t("notifications.telegram.label"),
+			description: t("notifications.telegram.description"),
+			fields: [
+				{
+					id: FIELD_IDS.TOKEN,
+					label: t("notifications.telegram.tokenLabel"),
+					placeholder: t("notifications.telegram.tokenPlaceholder"),
+					type: "text",
+				},
+				{
+					id: FIELD_IDS.CHAT_ID,
+					label: t("notifications.telegram.chatIdLabel"),
+					placeholder: t("notifications.telegram.chatIdPlaceholder"),
+					type: "text",
+				},
+			],
+		},
+		{
+			id: NOTIFICATION_TYPES.WEBHOOK,
+			label: t("notifications.webhook.label"),
+			description: t("notifications.webhook.description"),
+			fields: [
+				{
+					id: FIELD_IDS.URL,
+					label: t("notifications.webhook.urlLabel"),
+					placeholder: t("notifications.webhook.urlPlaceholder"),
+					type: "text",
+				},
+			],
+		},
+	];
 
-const handleSave = () => {
-  // Get existing notifications
-  const notifications = [...(monitor?.notifications || [])];
-  
-  // Get all notification types IDs
-  const existingTypes = activeNotificationTypes.map(type => type.id);
-  
-  // Filter out notifications that are configurable in this modal
-  const filteredNotifications = notifications.filter(
-    notification => {
-    
-      if (notification.platform) {
-        return !existingTypes.includes(notification.platform);
-      }
-     
-      return !existingTypes.includes(notification.type);
-    }
-  );
+	// Use provided notification types or default to our translated ones
+	const activeNotificationTypes = notificationTypes || DEFAULT_NOTIFICATION_TYPES;
 
-  // Add each enabled notification with its configured fields
-  activeNotificationTypes.forEach(type => {
-    if (integrations[type.id]) {
+	// Memoized function to initialize integrations state
+	const initialIntegrationsState = useMemo(() => {
+		const state = {};
 
-      let notificationObject = {
-        type: "webhook", 
-        platform: type.id, // Set platform to identify the specific service
-        config: {}
-      };
-      
-      // Configure based on notification type
-      switch(type.id) {
-        case "slack":
-        case "discord":
-          notificationObject.config.webhookUrl = integrations[getFieldKey(type.id, 'webhook')];
-          break;
-        case "telegram":
-          notificationObject.config.botToken = integrations[getFieldKey(type.id, 'token')];
-          notificationObject.config.chatId = integrations[getFieldKey(type.id, 'chatId')];
-          break;
-        case "webhook":
-          notificationObject.config.webhookUrl = integrations[getFieldKey(type.id, 'url')];
-          break;
-      }
-      
-      filteredNotifications.push(notificationObject);
-    }
-  });
+		activeNotificationTypes.forEach((type) => {
+			// Add enabled flag for each notification type
+			state[type.id] = false;
 
-  // Update monitor with new notifications
-  setMonitor(prev => ({
-    ...prev,
-    notifications: filteredNotifications
-  }));
-  
-  onClose();
-};
+			// Add state for each field in the notification type
+			type.fields.forEach((field) => {
+				const fieldKey = getFieldKey(type.id, field.id);
+				state[fieldKey] = "";
+			});
+		});
 
-  return (
-    <Dialog 
-      open={open} 
-      onClose={onClose}
-      fullWidth
-      maxWidth="md"
-      sx={{
-        '& .MuiDialog-paper': {
-          width: `calc(80% - ${theme.spacing(40)})`, 
-          maxWidth: `${theme.breakpoints.values.md - 70}px` 
-        }
-      }}
-    >
-      <DialogContent>
-        <Box sx={{ 
-          display: 'flex', 
-          height: `calc(26vh - ${theme.spacing(20)})` 
-        }}>
-          {/* Left sidebar with tabs */}
-          <Box sx={{ 
-            borderRight: 1, 
-            borderColor: theme.palette.primary.lowContrast, 
-            width: '30%',
-            maxWidth: theme.spacing(120), 
-            pr: theme.spacing(10)
-          }}>
-            <Typography variant="subtitle1" sx={{ 
-              my: theme.spacing(1), 
-              fontWeight: 'bold', 
-              fontSize: theme.typography.fontSize * 0.9, 
-              color: theme.palette.primary.contrastTextSecondary,
-              pl: theme.spacing(4)
-            }}>
-              {t('notifications.addOrEditNotifications')}
-            </Typography>
-            
-            <Tabs
-              orientation="vertical"
-              variant="scrollable"
-              value={tabValue}
-              onChange={handleChangeTab}
-              aria-label="Notification tabs"
-            >
-              {activeNotificationTypes.map((type) => (
-                <Tab 
-                  key={type.id} 
-                  label={type.label} 
-                  orientation="vertical"
-                  disableRipple
-                />
-              ))}
-            </Tabs>
-          </Box>
+		return state;
+	}, [activeNotificationTypes, getFieldKey]); // Only recompute when these dependencies change
 
-          {/* Right side content */}
-          <Box sx={{ 
-            flex: 1,
-            pl: theme.spacing(7.5),
-            overflowY: 'auto'
-          }}>
-            {activeNotificationTypes.map((type, index) => (
-              <TabPanel key={type.id} value={tabValue} index={index}>
-                <TabComponent
-                  type={type}
-                  integrations={integrations}
-                  handleIntegrationChange={handleIntegrationChange}
-                  handleInputChange={handleInputChange}
-                  handleTestNotification={handleTestNotification}
-                  isLoading={loading}
-                />
-              </TabPanel>
-            ))}
-          </Box>
-        </Box>
-      </DialogContent>
-      <DialogActions sx={{ 
-        p: theme.spacing(4),
-        display: 'flex',
-        justifyContent: 'flex-end',  
-        mb: theme.spacing(5),
-        mr: theme.spacing(5)
-      }}>
-        <Button 
-          variant="contained" 
-          color="accent" 
-          onClick={handleSave}
-          loading={loading}
-          sx={{ 
-            width: 'auto', 
-            minWidth: theme.spacing(60), 
-            px: theme.spacing(8)
-          }}
-        >
-          {t('commonSave')}
-        </Button>
-      </DialogActions>
-    </Dialog>
-  );
+	const [integrations, setIntegrations] = useState(initialIntegrationsState);
+
+	useEffect(() => {
+		if (open) {
+			const extractNotificationValues = () => {
+				const values = {};
+
+				if (!monitor?.notifications || !Array.isArray(monitor.notifications)) {
+					return values;
+				}
+
+				monitor.notifications.forEach((notification) => {
+					// Handle notification based on its structure
+					if (notification.type === "webhook" && notification.platform) {
+						if (typeof notification.config === "undefined") return;
+						const platform = notification.platform;
+						values[platform] = true; // Set platform as enabled
+
+						// Extract configuration based on platform
+						switch (platform) {
+							case NOTIFICATION_TYPES.SLACK:
+							case NOTIFICATION_TYPES.DISCORD:
+								if (notification.config.webhookUrl) {
+									values[getFieldKey(platform, FIELD_IDS.WEBHOOK)] =
+										notification.config.webhookUrl;
+								}
+								break;
+							case NOTIFICATION_TYPES.TELEGRAM:
+								if (notification.config.botToken) {
+									values[getFieldKey(platform, FIELD_IDS.TOKEN)] =
+										notification.config.botToken;
+								}
+								if (notification.config.chatId) {
+									values[getFieldKey(platform, FIELD_IDS.CHAT_ID)] =
+										notification.config.chatId;
+								}
+								break;
+							case NOTIFICATION_TYPES.WEBHOOK:
+								if (notification.config.webhookUrl) {
+									values[getFieldKey(platform, FIELD_IDS.URL)] =
+										notification.config.webhookUrl;
+								}
+								break;
+						}
+					}
+				});
+
+				return values;
+			};
+
+			const extractedValues = extractNotificationValues();
+			setIntegrations((prev) => ({
+				...prev,
+				...extractedValues,
+			}));
+		}
+	}, [open, monitor, getFieldKey]);
+
+	const handleChangeTab = (event, newValue) => {
+		setTabValue(newValue);
+	};
+
+	const handleIntegrationChange = (type, checked) => {
+		setIntegrations((prev) => ({
+			...prev,
+			[type]: checked,
+		}));
+	};
+
+	const handleInputChange = (type, value) => {
+		setIntegrations((prev) => ({
+			...prev,
+			[type]: value,
+		}));
+	};
+
+	const handleTestNotification = async (type) => {
+		// Get the notification type details
+		const notificationType = activeNotificationTypes.find((t) => t.id === type);
+
+		if (typeof notificationType === "undefined") {
+			return;
+		}
+
+		// Prepare config object based on notification type
+		const config = {};
+
+		// Add each field value to the config object
+		notificationType.fields.forEach((field) => {
+			const fieldKey = getFieldKey(type, field.id);
+			config[field.id] = integrations[fieldKey];
+		});
+
+		await sendTestNotification(type, config);
+	};
+
+	// In NotificationIntegrationModal.jsx, update the handleSave function:
+
+	const handleSave = () => {
+		// Get existing notifications
+		const notifications = [...(monitor?.notifications || [])];
+
+		// Get all notification types IDs
+		const existingTypes = activeNotificationTypes.map((type) => type.id);
+
+		// Filter out notifications that are configurable in this modal
+		const filteredNotifications = notifications.filter((notification) => {
+			if (notification.platform) {
+				return !existingTypes.includes(notification.platform);
+			}
+
+			return !existingTypes.includes(notification.type);
+		});
+
+		// Add each enabled notification with its configured fields
+		activeNotificationTypes.forEach((type) => {
+			if (integrations[type.id]) {
+				let notificationObject = {
+					type: "webhook",
+					platform: type.id, // Set platform to identify the specific service
+					config: {},
+				};
+
+				// Configure based on notification type
+				switch (type.id) {
+					case "slack":
+					case "discord":
+						notificationObject.config.webhookUrl =
+							integrations[getFieldKey(type.id, "webhook")];
+						break;
+					case "telegram":
+						notificationObject.config.botToken =
+							integrations[getFieldKey(type.id, "token")];
+						notificationObject.config.chatId =
+							integrations[getFieldKey(type.id, "chatId")];
+						break;
+					case "webhook":
+						notificationObject.config.webhookUrl =
+							integrations[getFieldKey(type.id, "url")];
+						break;
+				}
+
+				filteredNotifications.push(notificationObject);
+			}
+		});
+
+		// Update monitor with new notifications
+		setMonitor((prev) => ({
+			...prev,
+			notifications: filteredNotifications,
+		}));
+
+		onClose();
+	};
+
+	return (
+		<Dialog
+			open={open}
+			onClose={onClose}
+			fullWidth
+			maxWidth="md"
+			sx={{
+				"& .MuiDialog-paper": {
+					width: `calc(80% - ${theme.spacing(40)})`,
+					maxWidth: `${theme.breakpoints.values.md - 70}px`,
+				},
+			}}
+		>
+			<DialogContent>
+				<Stack
+					direction="row"
+					sx={{
+						height: `calc(30vh - ${theme.spacing(20)})`,
+					}}
+				>
+					{/* Left sidebar with tabs */}
+					<Box
+						sx={{
+							borderRight: 1,
+							borderColor: theme.palette.primary.lowContrast,
+							width: "30%",
+							maxWidth: theme.spacing(120),
+							pr: theme.spacing(10),
+						}}
+					>
+						<Typography variant="h2">
+							{t("notifications.addOrEditNotifications")}
+						</Typography>
+
+						<Tabs
+							orientation="vertical"
+							variant="scrollable"
+							value={tabValue}
+							onChange={handleChangeTab}
+							aria-label="Notification tabs"
+						>
+							{activeNotificationTypes.map((type) => (
+								<Tab
+									key={type.id}
+									label={type.label}
+									orientation="vertical"
+									disableRipple
+								/>
+							))}
+						</Tabs>
+					</Box>
+
+					{/* Right side content */}
+					<Box
+						sx={{
+							flex: 1,
+							pl: theme.spacing(7.5),
+							overflowY: "auto",
+						}}
+					>
+						{activeNotificationTypes.map((type, index) => (
+							<TabPanel
+								key={type.id}
+								value={tabValue}
+								index={index}
+							>
+								<TabComponent
+									type={type}
+									integrations={integrations}
+									handleIntegrationChange={handleIntegrationChange}
+									handleInputChange={handleInputChange}
+									handleTestNotification={handleTestNotification}
+									isLoading={loading}
+								/>
+							</TabPanel>
+						))}
+					</Box>
+				</Stack>
+			</DialogContent>
+			<DialogActions
+				sx={{
+					p: theme.spacing(4),
+					display: "flex",
+					justifyContent: "flex-end",
+					mb: theme.spacing(5),
+					mr: theme.spacing(5),
+				}}
+			>
+				<Button
+					variant="contained"
+					color="accent"
+					onClick={handleSave}
+					loading={loading}
+					sx={{
+						width: "auto",
+						minWidth: theme.spacing(60),
+						px: theme.spacing(8),
+					}}
+				>
+					{t("commonSave")}
+				</Button>
+			</DialogActions>
+		</Dialog>
+	);
 };
 
 NotificationIntegrationModal.propTypes = {
-  open: PropTypes.bool.isRequired, 
-  onClose: PropTypes.func.isRequired, 
-  monitor: PropTypes.object.isRequired, 
-  setMonitor: PropTypes.func.isRequired, 
-  notificationTypes: PropTypes.array 
+	open: PropTypes.bool.isRequired,
+	onClose: PropTypes.func.isRequired,
+	monitor: PropTypes.object.isRequired,
+	setMonitor: PropTypes.func.isRequired,
+	notificationTypes: PropTypes.array,
 };
 
-export default NotificationIntegrationModal;
+export default NotificationIntegrationModal;

client/src/Components/WalletProvider/index.jsx

@@ -1,46 +1,50 @@
-import { useMemo } from "react";
-import { ConnectionProvider, WalletProvider } from "@solana/wallet-adapter-react";
-import { WalletAdapterNetwork } from "@solana/wallet-adapter-base";
-import {
-	UnsafeBurnerWalletAdapter,
-	PhantomWalletAdapter,
-} from "@solana/wallet-adapter-wallets";
+// import { useMemo } from "react";
+// import { ConnectionProvider, WalletProvider } from "@solana/wallet-adapter-react";
+// import { WalletAdapterNetwork } from "@solana/wallet-adapter-base";
+// import {
+// 	UnsafeBurnerWalletAdapter,
+// 	PhantomWalletAdapter,
+// } from "@solana/wallet-adapter-wallets";
 
-import { WalletModalProvider } from "@solana/wallet-adapter-react-ui";
-import { clusterApiUrl } from "@solana/web3.js";
-import PropTypes from "prop-types";
-import "./index.css"; 
+// import { WalletModalProvider } from "@solana/wallet-adapter-react-ui";
+// import { clusterApiUrl } from "@solana/web3.js";
+// import PropTypes from "prop-types";
+// import "./index.css";
 
-// Default styles that can be overridden by your app
-import "@solana/wallet-adapter-react-ui/styles.css";
+// // Default styles that can be overridden by your app
+// import "@solana/wallet-adapter-react-ui/styles.css";
 
-export const Wallet = ({ children }) => {
-	// The network can be set to 'devnet', 'testnet', or 'mainnet-beta'.
-	const network = WalletAdapterNetwork.Mainnet;
+// export const Wallet = ({ children }) => {
+// 	// The network can be set to 'devnet', 'testnet', or 'mainnet-beta'.
+// 	const network = WalletAdapterNetwork.Mainnet;
 
-	// You can also provide a custom RPC endpoint.
-	const endpoint = useMemo(() => clusterApiUrl(network), [network]);
+// 	// You can also provide a custom RPC endpoint.
+// 	const endpoint = useMemo(() => clusterApiUrl(network), [network]);
 
-	const wallets = useMemo(
-		() => [new PhantomWalletAdapter()],
-		// eslint-disable-next-line react-hooks/exhaustive-deps
-		[network]
-	);
+// 	const wallets = useMemo(
+// 		() => [new PhantomWalletAdapter()],
+// 		// eslint-disable-next-line react-hooks/exhaustive-deps
+// 		[network]
+// 	);
 
-	return (
-		<ConnectionProvider endpoint={endpoint}>
-			<WalletProvider
-				wallets={wallets}
-				autoConnect
-			>
-				<WalletModalProvider>{children}</WalletModalProvider>
-			</WalletProvider>
-		</ConnectionProvider>
-	);
-};
+// 	return (
+// 		<ConnectionProvider endpoint={endpoint}>
+// 			<WalletProvider
+// 				wallets={wallets}
+// 				autoConnect
+// 			>
+// 				<WalletModalProvider>{children}</WalletModalProvider>
+// 			</WalletProvider>
+// 		</ConnectionProvider>
+// 	);
+// };
 
-Wallet.propTypes = {
-	children: PropTypes.node,
+// Wallet.propTypes = {
+// 	children: PropTypes.node,
+// };
+
+const Wallet = ({ children }) => {
+	return children;
 };
 
 export default Wallet;

client/src/Hooks/useBulkMonitors.js

@@ -0,0 +1,27 @@
+import { useState } from "react";
+import { networkService } from "../main";
+
+export const useBulkMonitors = () => {
+  const [isLoading, setIsLoading] = useState(false);
+
+  const createBulkMonitors = async (file, user) => {
+    setIsLoading(true);
+
+    const formData = new FormData();
+    formData.append("csvFile", file);
+    formData.append("userId", user._id);
+    formData.append("teamId", user.teamId);
+
+    try {
+      const response = await networkService.createBulkMonitors(formData);
+      return [true, response.data, null]; // [success, data, error]
+    } catch (err) {
+      const errorMessage = err?.response?.data?.msg || err.message;
+      return [false, null, errorMessage];
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  return [createBulkMonitors, isLoading];
+};

client/src/Pages/Auth/Register/Register.jsx

@@ -15,7 +15,7 @@ import Background from "../../../assets/Images/background-grid.svg?react";
 import Logo from "../../../assets/icons/checkmate-icon.svg?react";
 import Mail from "../../../assets/icons/mail.svg?react";
 import "../index.css";
-import { useTranslation } from "react-i18next";
+import { useTranslation, Trans } from "react-i18next";
 /**
  * Displays the initial landing page.
  *
@@ -67,42 +67,47 @@ const LandingPage = ({ isSuperAdmin, onSignup }) => {
 				</Box>
 				<Box maxWidth={400}>
 					<Typography className="tos-p">
-						{t("authRegisterBySigningUp")}{" "}
-						<Typography
-							component="span"
-							onClick={() => {
-								window.open(
-									"https://bluewavelabs.ca/terms-of-service-open-source",
-									"_blank",
-									"noreferrer"
-								);
+						<Trans
+							i18nKey="authRegisterBySigningUp"
+							components={{
+								a1: (
+									<Typography
+										component="span"
+										sx={{
+											cursor: "pointer",
+											"&:hover": {
+												color: theme.palette.primary.contrastTextTertiary,
+											},
+										}}
+										onClick={() => {
+											window.open(
+												"https://bluewavelabs.ca/terms-of-service-open-source",
+												"_blank",
+												"noreferrer"
+											);
+										}}
+									/>
+								),
+								a2: (
+									<Typography
+										component="span"
+										sx={{
+											cursor: "pointer",
+											"&:hover": {
+												color: theme.palette.primary.contrastTextTertiary,
+											},
+										}}
+										onClick={() => {
+											window.open(
+												"https://bluewavelabs.ca/privacy-policy-open-source",
+												"_blank",
+												"noreferrer"
+											);
+										}}
+									/>
+								)
 							}}
-							sx={{
-								"&:hover": {
-									color: theme.palette.primary.contrastTextTertiary,
-								},
-							}}
-						>
-							{t("authRegisterTerms")}
-						</Typography>{" "}
-						{t("and")}{" "}
-						<Typography
-							component="span"
-							onClick={() => {
-								window.open(
-									"https://bluewavelabs.ca/privacy-policy-open-source",
-									"_blank",
-									"noreferrer"
-								);
-							}}
-							sx={{
-								"&:hover": {
-									color: theme.palette.primary.contrastTextTertiary,
-								},
-							}}
-						>
-							{t("authRegisterPrivacy")}
-						</Typography>
+						/>
 					</Typography>
 				</Box>
 			</Stack>

client/src/Pages/Auth/Register/StepOne/index.jsx

@@ -64,7 +64,7 @@ function StepOne({ form, errors, onSubmit, onChange, onBack }) {
 					>
 						<TextInput
 							id="register-firstname-input"
-							label="Name"
+							label={t("authRegisterFirstName")}
 							isRequired={true}
 							placeholder="Jordan"
 							autoComplete="given-name"
@@ -76,7 +76,7 @@ function StepOne({ form, errors, onSubmit, onChange, onBack }) {
 						/>
 						<TextInput
 							id="register-lastname-input"
-							label="Surname"
+							label={t("authRegisterLastName")}
 							isRequired={true}
 							placeholder="Ellis"
 							autoComplete="family-name"

client/src/Pages/Auth/Register/StepThree/index.jsx

@@ -64,7 +64,7 @@ function StepThree({ onSubmit, onBack }) {
 							type="password"
 							id="register-password-input"
 							name="password"
-							label={t("commonPassword")}
+							label={t("authLoginEnterPassword")}
 							isRequired={true}
 							placeholder={t("createAPassword")}
 							autoComplete="current-password"

client/src/Pages/Auth/Register/StepTwo/index.jsx

@@ -60,7 +60,7 @@ function StepTwo({ form, errors, onSubmit, onChange, onBack }) {
 					<TextInput
 						type="email"
 						id="register-email-input"
-						label={t("commonEmail")}
+						label={t("authRegisterEmail")}
 						isRequired={true}
 						placeholder="jordan.ellis@domain.com"
 						autoComplete="email"
@@ -68,7 +68,7 @@ function StepTwo({ form, errors, onSubmit, onChange, onBack }) {
 						onInput={(e) => (e.target.value = e.target.value.toLowerCase())}
 						onChange={onChange}
 						error={errors.email ? true : false}
-						helperText={errors.email}
+						helperText={errors.email && t("authRegisterEmailRequired")}
 						ref={inputRef}
 					/>
 					<Stack

client/src/Pages/Infrastructure/Monitors/Components/MonitorsTableMenu/index.jsx

@@ -75,6 +75,7 @@ const InfrastructureMenu = ({ monitor, isAdmin, updateCallback }) => {
 			<IconButton
 				aria-label="monitor actions"
 				onClick={openMenu}
+				disabled={!isAdmin}
 				sx={{
 					"&:focus": {
 						outline: "none",

client/src/Pages/Settings/index.jsx

@@ -6,10 +6,10 @@ import Select from "../../Components/Inputs/Select";
 import { useIsAdmin } from "../../Hooks/useIsAdmin";
 import Dialog from "../../Components/Dialog";
 import ConfigBox from "../../Components/ConfigBox";
-import {
-	WalletMultiButton,
-	WalletDisconnectButton,
-} from "@solana/wallet-adapter-react-ui";
+// import {
+// 	WalletMultiButton,
+// 	WalletDisconnectButton,
+// } from "@solana/wallet-adapter-react-ui";
 
 //Utils
 import { useTheme } from "@emotion/react";
@@ -254,7 +254,7 @@ const Settings = () => {
 						></Select>
 					</Stack>
 				</ConfigBox>
-				{isAdmin && (
+				{/* {isAdmin && (
 					<ConfigBox>
 						<Box>
 							<Typography component="h1">{t("settingsDistributedUptime")}</Typography>
@@ -276,8 +276,8 @@ const Settings = () => {
 								: t("settingsDisabled")}
 						</Box>
 					</ConfigBox>
-				)}
-				{isAdmin && (
+				)} */}
+				{/* {isAdmin && (
 					<ConfigBox>
 						<Box>
 							<Typography component="h1">{t("settingsWallet")}</Typography>
@@ -302,7 +302,7 @@ const Settings = () => {
 							</Stack>
 						</Box>
 					</ConfigBox>
-				)}
+				)} */}
 				{isAdmin && (
 					<ConfigBox>
 						<Box>

client/src/Pages/StatusPage/Status/Components/ControlsHeader/index.jsx

@@ -3,6 +3,7 @@ import { Box, Stack, Typography, Button } from "@mui/material";
 import Image from "../../../../../Components/Image";
 import SettingsIcon from "../../../../../assets/icons/settings-bold.svg?react";
 import ThemeSwitch from "../../../../../Components/ThemeSwitch";
+import ArrowOutwardIcon from "@mui/icons-material/ArrowOutward";
 //Utils
 import { useTheme } from "@mui/material/styles";
 import { useNavigate } from "react-router-dom";
@@ -86,6 +87,8 @@ const ControlsHeader = ({
 	type = "uptime",
 }) => {
 	const theme = useTheme();
+	const { t } = useTranslation();
+	const publicUrl = `/status/uptime/public/${url}`;
 
 	return (
 		<Stack
@@ -118,6 +121,26 @@ const ControlsHeader = ({
 				>
 					{statusPage?.companyName}
 				</Typography>
+				{statusPage?.isPublished && !isPublic && (
+					<Stack
+						direction="row"
+						alignItems="center"
+						justifyContent="center"
+						onClick={() => {
+							window.open(publicUrl, "_blank", "noopener,noreferrer");
+						}}
+						sx={{
+							display: "inline-flex",
+							":hover": {
+								cursor: "pointer",
+								borderBottom: 1,
+							},
+						}}
+					>
+						<Typography>{t("publicLink")}</Typography>
+						<ArrowOutwardIcon />
+					</Stack>
+				)}
 			</Stack>
 			<Controls
 				isDeleting={isDeleting}

client/src/Pages/StatusPage/Status/index.jsx

@@ -139,6 +139,7 @@ const PublicStatus = () => {
 				isDeleteOpen={isDeleteOpen}
 				setIsDeleteOpen={setIsDeleteOpen}
 				url={url}
+				isPublic={isPublic}
 			/>
 			<Typography variant="h2">{t("statusPageStatusServiceStatus")}</Typography>
 			<StatusBar monitors={monitors} />

client/src/Pages/Uptime/BulkImport/Upload.jsx

@@ -0,0 +1,73 @@
+import { useTheme } from "@emotion/react";
+import { useState, useRef } from "react";
+import { Button, Typography } from "@mui/material";
+import { useTranslation } from "react-i18next";
+import PropTypes from "prop-types";
+
+const UploadFile = ({ onFileSelect }) => {  // Changed prop to onFileSelect
+	const theme = useTheme();
+	const [file, setFile] = useState();
+	const [error, setError] = useState("");
+	const inputRef = useRef();
+	const { t } = useTranslation();
+
+	const handleSelectFile = () => {
+		inputRef.current.click();
+	};
+
+	const handleFileChange = (e) => {
+		setError("");
+		const selectedFile = e.target.files[0];
+		
+		// Basic file validation
+		if (!selectedFile) return;
+		
+		if (!selectedFile.name.endsWith('.csv')) {
+			setError(t("bulkImport.invalidFileType"));
+			return;
+		}
+		
+		setFile(selectedFile);
+		onFileSelect(selectedFile);  // Pass the file directly to parent
+	};
+
+	return (
+		<div>
+			<input
+				ref={inputRef}
+				type="file"
+				accept=".csv"
+				style={{ display: "none" }}
+				onChange={handleFileChange}
+			/>
+			<Typography
+				component="h2"
+				mb={theme.spacing(1.5)}
+				sx={{ wordBreak: "break-all" }}
+			>
+				{file?.name || t("bulkImport.noFileSelected")}
+			</Typography>
+			<Typography
+				component="div"
+				mb={theme.spacing(1.5)}
+				color={theme.palette.error.main}
+			>
+				{error}
+			</Typography>
+			<Button
+				variant="contained"
+				color="accent"
+				onClick={handleSelectFile}
+			>
+				{t("bulkImport.selectFile")}
+			</Button>
+		</div>
+	);
+}
+
+
+UploadFile.prototype = {
+	onFileSelect: PropTypes.func.isRequired,
+};
+
+export default UploadFile;

client/src/Pages/Uptime/BulkImport/index.jsx

@@ -0,0 +1,112 @@
+// React, Redux, Router
+import { useTheme } from "@emotion/react";
+import { useState } from "react";
+// MUI
+import { Box, Stack, Typography, Button, Link } from "@mui/material";
+
+//Components
+import { createToast } from "../../../Utils/toastUtils";
+import Breadcrumbs from "../../../Components/Breadcrumbs";
+import ConfigBox from "../../../Components/ConfigBox";
+import UploadFile from "./Upload";
+import { useSelector } from "react-redux";
+import { useNavigate } from "react-router";
+import { Trans, useTranslation } from "react-i18next";
+import { useBulkMonitors } from "../../../Hooks/useBulkMonitors";
+
+const BulkImport = () => {
+	const theme = useTheme();
+	const { user } = useSelector((state) => state.auth);
+	const navigate = useNavigate();
+	const { t } = useTranslation();
+	const [selectedFile, setSelectedFile] = useState(null);
+
+	const crumbs = [
+		{ name: t("uptime"), path: "/uptime" },
+		{ name: t("bulkImport.title"), path: `/uptime/bulk-import` },
+	];
+
+	const [createBulkMonitors, hookLoading] = useBulkMonitors();
+
+	const handleSubmit = async () => {
+		if (!selectedFile) {
+			createToast({ body: t("bulkImport.noFileSelected") });
+			return;
+		}
+
+		const [success, data, error] = await createBulkMonitors(selectedFile, user);
+
+		if (success) {
+			// You can use `data` here if needed
+			createToast({ body: t("bulkImport.uploadSuccess") });
+			navigate("/uptime");
+		} else {
+			createToast({ body: error || t("bulkImport.uploadFailed") });
+		}
+	};
+
+	return (
+		<Box className="bulk-import-monitor">
+			<Breadcrumbs list={crumbs} />
+			<Stack
+				component="form"
+				gap={theme.spacing(12)}
+				mt={theme.spacing(6)}
+			>
+				<Typography
+					component="h1"
+					variant="h1"
+				>
+					{t("bulkImport.title")}
+				</Typography>
+				<ConfigBox>
+					<Box>
+						<Typography component="h2">{t("bulkImport.selectFileTips")}</Typography>
+						<Typography component="p">
+							<Trans
+								i18nKey="bulkImport.selectFileDescription"
+								components={{
+									template: (
+										<Link
+											color="info"
+											download
+											href="/bulk_import_monitors_template.csv"
+										/>
+									),
+									sample: (
+										<Link
+											color="info"
+											download
+											href="/bulk_import_monitors_sample.csv"
+										/>
+									),
+								}}
+							/>
+						</Typography>
+					</Box>
+					<Stack gap={theme.spacing(12)}>
+						<Stack gap={theme.spacing(6)}>
+							<UploadFile onFileSelect={(file) => setSelectedFile(file)} />
+						</Stack>
+					</Stack>
+				</ConfigBox>
+				<Stack
+					direction="row"
+					justifyContent="flex-end"
+				>
+					<Button
+						variant="contained"
+						color="accent"
+						onClick={handleSubmit}
+						disabled={hookLoading}
+						loading={hookLoading}
+					>
+						{t("submit")}
+					</Button>
+				</Stack>
+			</Stack>
+		</Box>
+	);
+};
+
+export default BulkImport;

client/src/Pages/Uptime/Configure/index.jsx

@@ -25,6 +25,7 @@ import PulseDot from "../../../Components/Animated/PulseDot";
 import SkeletonLayout from "./skeleton";
 import "./index.css";
 import Dialog from "../../../Components/Dialog";
+import NotificationIntegrationModal from "../../../Components/NotificationIntegrationModal/Components/NotificationIntegrationModal";
 
 /**
  * Parses a URL string and returns a URL object.
@@ -196,6 +197,18 @@ const Configure = () => {
 	const parsedUrl = parseUrl(monitor?.url);
 	const protocol = parsedUrl?.protocol?.replace(":", "") || "";
 
+	// Notification modal state
+	const [isNotificationModalOpen, setIsNotificationModalOpen] = useState(false);
+
+	const handleOpenNotificationModal = () => {
+		setIsNotificationModalOpen(true);
+	};
+
+	const handleClosenNotificationModal = () => {
+		setIsNotificationModalOpen(false);
+	};
+
+
 	const statusColor = {
 		true: theme.palette.success.main,
 		false: theme.palette.error.main,
@@ -371,6 +384,17 @@ const Configure = () => {
 									value={parsedUrl?.host || monitor?.url || ""}
 									disabled={true}
 								/>
+								<TextInput
+									type="number"
+									id="monitor-port"
+									label={t("portToMonitor")}
+									placeholder="5173"
+									value={monitor.port || ""}
+									onChange={(event) => handleChange(event, "port")}
+									error={errors["port"] ? true : false}
+									helperText={errors["port"]}
+									hidden={monitor.type !== "port"}
+								/>
 								<TextInput
 									type="text"
 									id="monitor-name"
@@ -413,6 +437,15 @@ const Configure = () => {
 									value={user?.email}
 									onChange={(event) => handleChange(event)}
 								/>
+								<Box mt={theme.spacing(2)}>
+									<Button
+										variant="contained"
+										color="accent"
+										onClick={handleOpenNotificationModal}
+									>
+										{t("notifications.integrationButton")}
+									</Button>
+								</Box>
 								{/* <Checkbox
 									id="notify-email"
 									label="Also notify via email to multiple addresses (coming soon)"
@@ -546,6 +579,13 @@ const Configure = () => {
 				onConfirm={handleRemove}
 				isLoading={isLoading}
 			/>
+
+			<NotificationIntegrationModal 
+				open={isNotificationModalOpen}
+				onClose={handleClosenNotificationModal}
+				monitor={monitor}
+				setMonitor={setMonitor}
+			/>
 		</Stack>
 	);
 };

client/src/Pages/Uptime/Monitors/index.jsx

@@ -189,8 +189,9 @@ const UptimeMonitors = () => {
 			<Breadcrumbs list={BREADCRUMBS} />
 			<CreateMonitorHeader
 				isAdmin={isAdmin}
-				shouldRender={!isLoading}
+				isLoading={isLoading}
 				path="/uptime/create"
+				bulkPath="/uptime/bulk-import"
 			/>
 			<Greeting type="uptime" />
 			<StatusBoxes

client/src/Routes/index.jsx

@@ -56,6 +56,7 @@ import ProtectedRoute from "../Components/ProtectedRoute";
 import ProtectedDistributedUptimeRoute from "../Components/ProtectedDistributedUptimeRoute";
 import CreateNewMaintenanceWindow from "../Pages/Maintenance/CreateMaintenance";
 import withAdminCheck from "../Components/HOC/withAdminCheck";
+import BulkImport from "../Pages/Uptime/BulkImport";
 
 const Routes = () => {
 	const AdminCheckedRegister = withAdminCheck(AuthRegister);
@@ -78,6 +79,11 @@ const Routes = () => {
 					element={<Uptime />}
 				/>
 
+				<Route
+					path="/uptime/bulk-import"
+					element={<BulkImport />}
+				/>
+
 				<Route
 					path="/uptime/create/:monitorId?"
 					element={<UptimeCreate />}
@@ -90,16 +96,16 @@ const Routes = () => {
 					path="/uptime/configure/:monitorId/"
 					element={<UptimeConfigure />}
 				/>
-				<Route
+				{/* <Route
 					path="/distributed-uptime"
 					element={
 						<ProtectedDistributedUptimeRoute>
 							<DistributedUptimeMonitors />{" "}
 						</ProtectedDistributedUptimeRoute>
 					}
-				/>
+				/> */}
 
-				<Route
+				{/* <Route
 					path="/distributed-uptime/create"
 					element={
 						<ProtectedDistributedUptimeRoute>
@@ -114,15 +120,15 @@ const Routes = () => {
 							<CreateDistributedUptime />
 						</ProtectedDistributedUptimeRoute>
 					}
-				/>
-				<Route
+				/> */}
+				{/* <Route
 					path="/distributed-uptime/:monitorId"
 					element={
 						<ProtectedDistributedUptimeRoute>
 							<DistributedUptimeDetails />
 						</ProtectedDistributedUptimeRoute>
 					}
-				/>
+				/> */}
 
 				<Route
 					path="pagespeed"
@@ -148,9 +154,9 @@ const Routes = () => {
 					path="infrastructure/create"
 					element={<InfrastructureCreate />}
 				/>
-				<Route 
-					path="/infrastructure/configure/:monitorId" 
-					element={<InfrastructureCreate />} 
+				<Route
+					path="/infrastructure/configure/:monitorId"
+					element={<InfrastructureCreate />}
 				/>
 				<Route
 					path="infrastructure/:monitorId"
@@ -171,42 +177,42 @@ const Routes = () => {
 					element={<Status />}
 				/>
 
-				<Route
+				{/* <Route
 					path="/status/distributed/:url"
 					element={
 						<ProtectedDistributedUptimeRoute>
 							<DistributedUptimeStatus />
 						</ProtectedDistributedUptimeRoute>
 					}
-				/>
+				/> */}
 
 				<Route
 					path="status/uptime/create"
 					element={<CreateStatus />}
 				/>
 
-				<Route
+				{/* <Route
 					path="/status/distributed/create/:monitorId"
 					element={
 						<ProtectedDistributedUptimeRoute>
 							<CreateDistributedUptimeStatus />
 						</ProtectedDistributedUptimeRoute>
 					}
-				/>
+				/> */}
 
 				<Route
 					path="status/uptime/configure/:url"
 					element={<CreateStatus />}
 				/>
 
-				<Route
+				{/* <Route
 					path="/status/distributed/configure/:url"
 					element={
 						<ProtectedDistributedUptimeRoute>
 							<CreateDistributedUptimeStatus />
 						</ProtectedDistributedUptimeRoute>
 					}
-				/>
+				/> */}
 
 				<Route
 					path="integrations"
@@ -274,10 +280,10 @@ const Routes = () => {
 				path="/status/uptime/public/:url"
 				element={<Status />}
 			/>
-			<Route
+			{/* <Route
 				path="/status/distributed/public/:url"
 				element={<DistributedUptimeStatus />}
-			/>
+			/> */}
 
 			<Route
 				path="*"

client/src/Utils/NetworkService.js

@@ -45,6 +45,9 @@ class NetworkService {
 		this.axiosInstance.interceptors.response.use(
 			(response) => response,
 			(error) => {
+				if (error.code === "ERR_NETWORK") {
+					// Do error handling here
+				}
 				if (error.response && error.response.status === 401) {
 					dispatch(clearAuthState());
 					dispatch(clearUptimeMonitorState());
@@ -266,6 +269,7 @@ class NetworkService {
 			matchMethod: monitor.matchMethod,
 			expectedValue: monitor.expectedValue,
 			jsonPath: monitor.jsonPath,
+			...(monitor.type === "port" && { port: monitor.port }),
 		};
 		return this.axiosInstance.put(`/monitors/${monitorId}`, payload, {
 			headers: {
@@ -1086,6 +1090,19 @@ class NetworkService {
 		return this.axiosInstance.delete(`/status-page/${encodedUrl}`, {});
 	}
 
+	// ************************************
+	// Create bulk monitors
+	// ************************************
+
+	async createBulkMonitors(formData) {
+		const response = await this.axiosInstance.post(`/monitors/bulk`, formData, {
+			headers: {
+				"Content-Type": "multipart/form-data",
+			},
+		});
+		return response.data;
+	}
+
 	// ************************************
 	// Fetch monitors with summary by TeamID
 	// ************************************

client/src/Validation/validation.js

@@ -7,18 +7,11 @@ const nameSchema = joi
 	.string()
 	.max(50)
 	.trim()
-	.pattern(/^(?=.*[\p{L}\p{Sc}])[\p{L}\p{Sc}\s']+$/u, {
-		name: "name.containsLetterOrSymbol",
-	})
-	.pattern(/^[\p{L}\p{Sc}\s']+$/u, {
-		name: "name.validCharacters",
-	})
+	.pattern(/^[\p{L}\p{M}''\- ]+$/u)
 	.messages({
 		"string.empty": "Name is required",
 		"string.max": "Name must be less than 50 characters",
-		"string.pattern.name": "Name must contain at least 1 letter or currency symbol",
-		"string.pattern.base.validCharacters":
-			"Can only contain letters, spaces, apostrophes, and currency symbols",
+		"string.pattern.base": "Name must contain only letters, spaces, apostrophes, or hyphens"
 	});
 
 const passwordSchema = joi
@@ -159,7 +152,20 @@ const monitorValidation = joi.object({
 			"string.invalidUrl": "Please enter a valid URL with optional port",
 			"string.pattern.base": "Please enter a valid container ID.",
 		}),
-	port: joi.number(),
+	port: joi.number()
+	.integer()
+	.min(1)
+	.max(65535)
+	.when("type", {
+		is: "port",
+		then: joi.required().messages({
+			"number.base": "Port must be a number.",
+			"number.min": "Port must be at least 1.",
+			"number.max": "Port must be at most 65535.",
+			"any.required": "Port is required for port monitors.",
+		}),
+		otherwise: joi.optional(),
+	}),
 	name: joi.string().trim().max(50).allow("").messages({
 		"string.max": "This field should not exceed the 50 characters limit.",
 	}),
@@ -366,5 +372,5 @@ export {
 	advancedSettingsValidation,
 	infrastructureMonitorValidation,
 	statusPageValidation,
-	logoImageValidation,
+	logoImageValidation
 };

client/src/locales/gb.json

@@ -54,9 +54,9 @@
   "authPasswordConfirmAndPassword": "Confirm password and password",
   "authPasswordMustMatch": "must match",
   "authRegisterCreateAccount": "Create your account to get started",
-  "authRegisterCreateSuperAdminAccount": "Create your Super admin account to get started",
-  "authRegisterSignUpWithEmail": "Sign up with Email",
-  "authRegisterBySigningUp": "By signing up, you agree to our",
+  "authRegisterCreateSuperAdminAccount": "Create your super admin account to get started",
+  "authRegisterSignUpWithEmail": "Create super admin account",
+  "authRegisterBySigningUp": "By creating an account, you agree to our <a1>Terms of Service</a1> and <a2>Privacy Policy</a2>.",
   "distributedStatusHeaderText": "Real-time, real-device coverage",
   "distributedStatusSubHeaderText": "Powered by millions devices worldwide, view a system performance by global region, country or city",
   "settingsGeneralSettings": "General settings",
@@ -396,5 +396,22 @@
   "DeleteAccount": "Delete account",
   "DeleteDescriptionText": "Note that deleting your account will remove all data from the server. This is permanent and non-recoverable.",
   "DeleteAccountWarning": "If you delete your account, you will no longer be able to sign in, and all of your data will be deleted. Deleting your account is permanent and non-recoverable action.",
-  "DeleteWarningTitle": "Really delete this account?"
-}
+  "DeleteWarningTitle": "Really delete this account?",
+  "authRegisterFirstName": "Name",
+  "authRegisterLastName": "Surname",
+  "authRegisterEmail": "Email",
+  "authRegisterEmailRequired": "Email is required",
+  "bulkImport": {
+    "title": "Bulk Import",
+    "selectFileTips": "Select CSV file to upload",
+    "selectFileDescription": "You can download our <template>template</template> or <sample>sample</sample>",
+    "selectFile": "Select File",
+    "parsingFailed": "Parsing failed",
+    "uploadSuccess": "Monitors created successfully!",
+    "validationFailed": "Validation failed",
+    "noFileSelected": "No file selected",
+    "fallbackPage": "Import a file to upload a list of servers in bulk"
+  },
+  "publicLink": "Public link"
+}
+

client/src/locales/ru.json

@@ -55,8 +55,12 @@
   "authPasswordMustMatch": "должен совпадать",
   "authRegisterCreateAccount": "Создайте свою учетную запись, чтобы начать",
   "authRegisterCreateSuperAdminAccount": "Создайте учетную запись суперадминистратора, чтобы начать работу",
-  "authRegisterSignUpWithEmail": "Зарегистрироваться по электронной почте",
-  "authRegisterBySigningUp": "Регистрируясь, вы соглашаетесь с нашими",
+  "authRegisterSignUpWithEmail": "Создать учетную запись суперадминистратора",
+  "authRegisterBySigningUp": "Создавая учетную запись, вы соглашаетесь с нашими <a1>Условиями использования</a1> и <a2>Политикой конфиденциальности</a2>.",
+  "authRegisterFirstName": "Имя",
+  "authRegisterLastName": "Фамилия",
+  "authRegisterEmail": "Эл. почта",
+  "authRegisterEmailRequired": "Эл. почта обязательна",
   "distributedStatusHeaderText": "Охват реального времени и реального устройства",
   "distributedStatusSubHeaderText": "Работает на миллионах устройств по всему миру, просматривайте производительность системы по глобальному региону, стране или городу",
   "settingsGeneralSettings": "Общие настройки",

client/src/locales/tr.json

@@ -396,5 +396,20 @@
   "DeleteAccount": "",
   "DeleteDescriptionText": "",
   "DeleteAccountWarning": "",
-  "DeleteWarningTitle": ""
-}
+  "DeleteWarningTitle": "",
+  "authRegisterFirstName": "",
+  "authRegisterLastName": "",
+  "authRegisterEmail": "",
+  "authRegisterEmailRequired": "",
+  "bulkImport": {
+    "title": "",
+    "selectFileTips": "",
+    "selectFileDescription": "",
+    "selectFile": "",
+    "parsingFailed": "",
+    "uploadSuccess": "",
+    "validationFailed": "",
+    "noFileSelected": "",
+    "fallbackPage": ""
+  }
+}