feat: add table row selection and floating action bar MVP

client/src/Components/common/FloatingActionBar.tsx

@@ -0,0 +1,84 @@
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { useTheme } from "@mui/material/styles";
+import Paper from "@mui/material/Paper";
+import Stack from "@mui/material/Stack";
+import Typography from "@mui/material/Typography";
+import IconButton from "@mui/material/IconButton";
+import Slide from "@mui/material/Slide";
+import { X } from "lucide-react";
+
+interface FloatingActionBarProps {
+	selectedCount: number;
+	onClearSelection: () => void;
+	children?: React.ReactNode;
+}
+
+export const FloatingActionBar: React.FC<FloatingActionBarProps> = ({
+	selectedCount,
+	onClearSelection,
+	children,
+}) => {
+	const { t } = useTranslation();
+	const theme = useTheme();
+	const isOpen = selectedCount > 0;
+
+	return (
+		<Slide
+			direction="up"
+			in={isOpen}
+			mountOnEnter
+			unmountOnExit
+		>
+			<Paper
+				elevation={6}
+				sx={{
+					position: "fixed",
+					bottom: theme.spacing(4),
+					left: "50%",
+					transform: "translateX(-50%)",
+					zIndex: theme.zIndex.snackbar,
+					padding: theme.spacing(1.5, 3),
+					borderRadius: theme.shape.borderRadius,
+					backgroundColor: theme.palette.background.paper,
+					border: `1px solid ${theme.palette.divider}`,
+					display: "flex",
+					alignItems: "center",
+					gap: theme.spacing(4),
+					boxShadow: theme.shadows[8],
+				}}
+			>
+				<Stack
+					direction="row"
+					alignItems="center"
+					gap={theme.spacing(1)}
+				>
+					<Typography
+						variant="body1"
+						fontWeight={600}
+						color={theme.palette.text.primary}
+					>
+						{selectedCount} {t("common.selected", { defaultValue: "selected" })}
+					</Typography>
+					<IconButton
+						size="small"
+						onClick={onClearSelection}
+						aria-label="clear selection"
+					>
+						<X size={18} />
+					</IconButton>
+				</Stack>
+
+				{children && (
+					<Stack
+						direction="row"
+						alignItems="center"
+						gap={theme.spacing(2)}
+					>
+						{children}
+					</Stack>
+				)}
+			</Paper>
+		</Slide>
+	);
+};

client/src/Components/common/index.ts

@@ -3,3 +3,4 @@ export * from "./charts/HeatmapResponseTime";
 export * from "./charts/HeatmapResponseTimeTooltip";
 export * from "./controls/HeaderCreate";
 export * from "./controls/HeaderTimeRange";
+export * from "./FloatingActionBar";

client/src/Pages/Uptime/Monitors/Components/UptimeMonitorsTable.tsx

@@ -1,5 +1,6 @@
 import Stack from "@mui/material/Stack";
 import Box from "@mui/material/Box";
+import Checkbox from "@mui/material/Checkbox";
 import Typography from "@mui/material/Typography";
 import {
 	Table,