Merge branch 'develop' of https://github.com/bluewave-labs/checkmate …

…into fix/fe/infrastructuredetailpage
bluewave-labs · Dec 11, 2024 · 98cb95e · 98cb95e
2 parents d23a6c4 + 76d0d1b
commit 98cb95e
Show file tree

Hide file tree

Showing 18 changed files with 231 additions and 201 deletions.
diff --git a/Client/package-lock.json b/Client/package-lock.json
diff --git a/Client/package.json b/Client/package.json
@@ -20,14 +20,14 @@
 		"@mui/x-charts": "^7.5.1",
 		"@mui/x-data-grid": "7.23.1",
 		"@mui/x-date-pickers": "7.23.1",
-		"@reduxjs/toolkit": "2.4.0",
+		"@reduxjs/toolkit": "2.5.0",
 		"axios": "^1.7.4",
 		"dayjs": "1.11.13",
 		"joi": "17.13.3",
 		"jwt-decode": "^4.0.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
-		"react-redux": "9.1.2",
+		"react-redux": "9.2.0",
 		"react-router": "^6.23.0",
 		"react-router-dom": "^6.23.1",
 		"react-toastify": "^10.0.5",

diff --git a/Client/src/Components/Inputs/Search/index.jsx b/Client/src/Components/Inputs/Search/index.jsx
@@ -93,6 +93,9 @@ const Search = ({
 								{
 									borderColor: theme.palette.border.light,
 								},
+							"& .MuiOutlinedInput-root": {
+								paddingY: 0,
+							},
 						}}
 					/>
 					{error && (

diff --git a/Client/src/Components/Label/index.jsx b/Client/src/Components/Label/index.jsx
@@ -141,9 +141,9 @@ const StatusLabel = ({ status, text, customStyles }) => {
 			borderColor: theme.palette.warning.light,
 		},
 		pending: {
-			dotColor: theme.palette.warning.main,
-			bgColor: theme.palette.warning.dark,
-			borderColor: theme.palette.warning.light,
+			dotColor: theme.palette.text.secondary,
+			bgColor: theme.palette.background.main,
+			borderColor: theme.palette.border.dark,
 		},
 		"cannot resolve": {
 			dotColor: theme.palette.unresolved.main,

diff --git a/Client/src/Components/Sidebar/index.jsx b/Client/src/Components/Sidebar/index.jsx
@@ -262,7 +262,11 @@ function Sidebar() {
 						Menu
 					</ListSubheader>
 				}
-				sx={{ px: theme.spacing(6) }}
+				sx={{ 
+					px: theme.spacing(6),
+					height: "100%",
+					overflow: "hidden"
+				}}
 			>
 				{menu.map((item) =>
 					item.path ? (

diff --git a/Client/src/Components/TabPanels/Account/PasswordPanel.jsx b/Client/src/Components/TabPanels/Account/PasswordPanel.jsx
@@ -28,6 +28,9 @@ const PasswordPanel = () => {
 	const theme = useTheme();
 	const dispatch = useDispatch();
 
+
+	const SPACING_GAP = theme.spacing(12); 
+
 	//redux state
 	const { authToken, isLoading } = useSelector((state) => state.auth);
 
@@ -139,7 +142,7 @@ const PasswordPanel = () => {
 					direction="row"
 					justifyContent={"flex-start"}
 					alignItems={"center"}
-					gap={theme.spacing(8)}
+					gap={SPACING_GAP} 
 					flexWrap={"wrap"}
 				>
 					<Typography
@@ -164,7 +167,7 @@ const PasswordPanel = () => {
 				<Stack
 					direction="row"
 					alignItems={"center"}
-					gap={theme.spacing(8)}
+					gap={SPACING_GAP} 
 					flexWrap={"wrap"}
 				>
 					<Typography
@@ -190,7 +193,7 @@ const PasswordPanel = () => {
 				<Stack
 					direction="row"
 					alignItems={"center"}
-					gap={theme.spacing(8)}
+					gap={SPACING_GAP} 
 					flexWrap={"wrap"}
 				>
 					<Typography

diff --git a/Client/src/Components/TabPanels/Account/ProfilePanel.jsx b/Client/src/Components/TabPanels/Account/ProfilePanel.jsx
@@ -29,6 +29,8 @@ import Dialog from "../../Dialog";
 const ProfilePanel = () => {
 	const theme = useTheme();
 	const dispatch = useDispatch();
+
+	const SPACING_GAP = theme.spacing(12);
 
 	//redux state
 	const { user, authToken, isLoading } = useSelector((state) => state.auth);
@@ -223,9 +225,9 @@ const ProfilePanel = () => {
 				className="edit-profile-form"
 				noValidate
 				spellCheck="false"
-				gap={theme.spacing(20)}
+				gap={SPACING_GAP} 
 			>
-				<Stack direction="row">
+				<Stack direction="row" gap={SPACING_GAP}>
 					<Box flex={0.9}>
 						<Typography component="h1">First name</Typography>
 					</Box>
@@ -240,7 +242,7 @@ const ProfilePanel = () => {
 						flex={1}
 					/>
 				</Stack>
-				<Stack direction="row">
+				<Stack direction="row" gap={SPACING_GAP}>
 					<Box flex={0.9}>
 						<Typography component="h1">Last name</Typography>
 					</Box>
@@ -255,7 +257,7 @@ const ProfilePanel = () => {
 						flex={1}
 					/>
 				</Stack>
-				<Stack direction="row">
+				<Stack direction="row" gap={SPACING_GAP}>
 					<Stack flex={0.9}>
 						<Typography component="h1">Email</Typography>
 						<Typography
@@ -275,7 +277,7 @@ const ProfilePanel = () => {
 						flex={1}
 					/>
 				</Stack>
-				<Stack direction="row">
+				<Stack direction="row" gap={SPACING_GAP}>
 					<Stack flex={0.9}>
 						<Typography component="h1">Your photo</Typography>
 						<Typography

diff --git a/Client/src/Components/TabPanels/Account/TeamPanel.jsx b/Client/src/Components/TabPanels/Account/TeamPanel.jsx
@@ -30,6 +30,8 @@ const TeamPanel = () => {
 
 	const theme = useTheme();
 
+	const SPACING_GAP = theme.spacing(12);
+
 	const { authToken, user } = useSelector((state) => state.auth);
 	//TODO
 	// const [orgStates, setOrgStates] = useState({
@@ -228,7 +230,7 @@ const TeamPanel = () => {
 			{/* <Stack component="form">
         <Box sx={{ alignSelf: "flex-start" }}>
           <Typography component="h1">Organization name</Typography>
-        </Box>
+        </Box>	
         <Stack
           direction="row"
           justifyContent="flex-end"
@@ -275,7 +277,7 @@ const TeamPanel = () => {
 				component="form"
 				noValidate
 				spellCheck="false"
-				gap={theme.spacing(12)}
+				gap={SPACING_GAP} 
 			>
 				<Typography component="h1">Team members</Typography>
 				<Stack
@@ -339,7 +341,7 @@ const TeamPanel = () => {
 				theme={theme}
 			>
 				<TextInput
-					marginBottom={theme.spacing(12)}
+					marginBottom={SPACING_GAP} 
 					type="email"
 					id="input-team-member"
 					placeholder="Email"

diff --git a/Client/src/Pages/Infrastructure/CreateMonitor/index.jsx b/Client/src/Pages/Infrastructure/CreateMonitor/index.jsx
@@ -303,7 +303,6 @@ const CreateInfrastructureMonitor = () => {
 						</Typography>
 					</Box>
 					<Stack gap={theme.spacing(6)}>
-						<Typography component="p">When there is a new incident,</Typography>
 						<Checkbox
 							id="notify-email-default"
 							label={`Notify via email (to ${user.email})`}