Remove unused imports, integrate into CreateMaintenance

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

@@ -4,7 +4,6 @@ import { useTheme } from "@emotion/react";
 import { Box, Button, Stack, Typography } from "@mui/material";
 import ArrowBackRoundedIcon from "@mui/icons-material/ArrowBackRounded";
 import TextInput from "../../../../Components/Inputs/TextInput";
-import Field from "../../../../Components/Inputs/Field";
 
 StepTwo.propTypes = {
 	form: PropTypes.object,

Client/src/Pages/Auth/SetNewPassword.jsx

@@ -9,7 +9,6 @@ import { setNewPassword } from "../../Features/Auth/authSlice";
 import { createToast } from "../../Utils/toastUtils";
 import { credentials } from "../../Validation/validation";
 import Check from "../../Components/Check/Check";
-import Field from "../../Components/Inputs/Field";
 import TextInput from "../../Components/Inputs/TextInput";
 import { PasswordEndAdornment } from "../../Components/Inputs/TextInput/Adornments";
 

Client/src/Pages/Infrastructure/CreateMonitor/CustomThreshold/index.jsx

@@ -1,5 +1,4 @@
 import { Box, Stack, Typography } from "@mui/material";
-import Field from "../../../../Components/Inputs/Field";
 import TextInput from "../../../../Components/Inputs/TextInput";
 import Checkbox from "../../../../Components/Inputs/Checkbox";
 import { useTheme } from "@emotion/react";

Client/src/Pages/Infrastructure/CreateMonitor/index.jsx

@@ -11,7 +11,6 @@ import { useNavigate } from "react-router-dom";
 import { useTheme } from "@emotion/react";
 import { createToast } from "../../../Utils/toastUtils";
 import { ConfigBox } from "../../Monitors/styled";
-import Field from "../../../Components/Inputs/Field";
 import TextInput from "../../../Components/Inputs/TextInput";
 import Select from "../../../Components/Inputs/Select";
 import Checkbox from "../../../Components/Inputs/Checkbox";
@@ -356,15 +355,6 @@ const CreateInfrastructureMonitor = () => {
 							onBlur={(e) => handleBlur(e, "interval")}
 							items={frequencies}
 						/>
-						{/* <Field
-							type={"number"}
-							id="monitor-retries"
-							label="Maximum retries before the service is marked as down"
-							value={infrastructureMonitor.url}
-							onChange={handleChange}
-							onBlur={handleBlur}
-							error={errors["url"]}
-						/>						 */}
 					</Stack>
 				</ConfigBox>
 				<Stack

Client/src/Pages/Maintenance/CreateMaintenance/index.jsx

@@ -1,4 +1,4 @@
-import { Box, Button, duration, Stack, Typography } from "@mui/material";
+import { Box, Button, Stack, Typography } from "@mui/material";
 import { useSelector } from "react-redux";
 import { useTheme } from "@emotion/react";
 import { useEffect, useState } from "react";
@@ -13,7 +13,7 @@ import LoadingButton from "@mui/lab/LoadingButton";
 
 import dayjs from "dayjs";
 import Select from "../../../Components/Inputs/Select";
-import Field from "../../../Components/Inputs/Field";
+import TextInput from "../../../Components/Inputs/TextInput";
 import Breadcrumbs from "../../../Components/Breadcrumbs";
 import CalendarIcon from "../../../assets/icons/calendar.svg?react";
 import "./index.css";
@@ -215,8 +215,7 @@ const CreateMaintenance = () => {
 	};
 
 	const handleSubmit = async () => {
-		if (hasValidationErrors(form, maintenanceWindowValidation, setErrors))
-			return;		
+		if (hasValidationErrors(form, maintenanceWindowValidation, setErrors)) return;
 		// Build timestamp for maintenance window from startDate and startTime
 		const start = dayjs(form.startDate)
 			.set("hour", form.startTime.hour())
@@ -467,14 +466,15 @@ const CreateMaintenance = () => {
 							direction="row"
 							spacing={theme.spacing(8)}
 						>
-							<Field
+							<TextInput
 								type="number"
 								id="duration"
 								value={form.duration}
 								onChange={(event) => {
 									handleFormChange("duration", event.target.value);
 								}}
-								error={errors["duration"]}
+								error={errors["duration"] ? true : false}
+								helperText={errors["duration"]}
 							/>
 							<Select
 								id="durationUnit"
@@ -511,14 +511,15 @@ const CreateMaintenance = () => {
 								</Typography>
 							</Box>
 							<Box>
-								<Field
+								<TextInput
 									id="name"
 									placeholder="Maintenance at __ : __ for ___ minutes"
 									value={form.name}
 									onChange={(event) => {
 										handleFormChange("name", event.target.value);
 									}}
-									error={errors["name"]}
+									error={errors["name"] ? true : false}
+									helperText={errors["name"]}
 								/>
 							</Box>
 						</Stack>