From 48c3f05831eea25dcd217ea367e046e36efbece6 Mon Sep 17 00:00:00 2001
From: Alex Holliday <ajhollid@gmail.com>
Date: Tue, 26 Nov 2024 12:21:42 +0800
Subject: [PATCH] integrate TextInput

---
 Client/src/Pages/Monitors/CreateMonitor/index.jsx | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/Client/src/Pages/Monitors/CreateMonitor/index.jsx b/Client/src/Pages/Monitors/CreateMonitor/index.jsx
index 84e599322..56dfc4db2 100644
--- a/Client/src/Pages/Monitors/CreateMonitor/index.jsx
+++ b/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>