Merge pull request #1203 from bluewave-labs/fix/fe/create-monitor-text-field

fix: create monitor text field

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

@@ -11,6 +11,8 @@ import { createToast } from "../../../Utils/toastUtils";
 import { logger } from "../../../Utils/Logger";
 import { ConfigBox } from "../styled";
 import Radio from "../../../Components/Inputs/Radio";
+import TextInput from "../../../Components/Inputs/TextInput";
+import { HttpAdornment } from "../../../Components/Inputs/TextInput/Adornments";
 import Field from "../../../Components/Inputs/Field";
 import Select from "../../../Components/Inputs/Select";
 import Checkbox from "../../../Components/Inputs/Checkbox";
@@ -249,17 +251,19 @@ const CreateMonitor = () => {
 						</Typography>
 					</Box>
 					<Stack gap={theme.spacing(15)}>
-						<Field
+						<TextInput
 							type={monitor.type === "http" ? "url" : "text"}
 							id="monitor-url"
+							startAdornment={<HttpAdornment https={https} />}
 							label={monitorTypeMaps[monitor.type].label || "URL to monitor"}
 							https={https}
 							placeholder={monitorTypeMaps[monitor.type].placeholder || ""}
 							value={monitor.url}
 							onChange={handleChange}
-							error={errors["url"]}
+							error={errors["url"] ? true : false}
+							helperText={errors["url"]}
 						/>
-						<Field
+						<TextInput
 							type="text"
 							id="monitor-name"
 							label="Display name"
@@ -267,7 +271,8 @@ const CreateMonitor = () => {
 							placeholder={monitorTypeMaps[monitor.type].namePlaceholder || ""}
 							value={monitor.name}
 							onChange={handleChange}
-							error={errors["name"]}
+							error={errors["name"] ? true : false}
+							helperText={errors["name"]}
 						/>
 					</Stack>
 				</ConfigBox>