From e7742f9be8b7c129dc0ef5091050f780382fd3a9 Mon Sep 17 00:00:00 2001
From: Vishnu Sreekumaran Nair <200557136@student.georgianc.on.ca>
Date: Wed, 7 May 2025 14:17:47 -0400
Subject: [PATCH] update helpertext and add typography component to display
 note

---
 client/src/Pages/Settings/index.jsx | 15 ++++++++-------
 1 file changed, 8 insertions(+), 7 deletions(-)

diff --git a/client/src/Pages/Settings/index.jsx b/client/src/Pages/Settings/index.jsx
index b2f90f554..f1413c2b5 100644
--- a/client/src/Pages/Settings/index.jsx
+++ b/client/src/Pages/Settings/index.jsx
@@ -96,7 +96,7 @@ const Settings = () => {
 			setIsApiKeySet(true);
 			setForm((prev) => ({
 				...prev,
-				pagespeedApiKey: "********",
+				pagespeedApiKey: "*************************************",
 			}));
 		} else {
 			setIsApiKeySet(false);
@@ -332,11 +332,7 @@ const Settings = () => {
 										disabled={isApiKeySet}
 										optionalLabel="(Optional)"
 										error={!!errors.pagespeedApiKey}
-										helperText={
-											isApiKeySet
-												? "API key is set. Click Reset to change it."
-												: errors.pagespeedApiKey
-										}
+										helperText={errors.pagespeedApiKey}
 										endAdornment={
 											!isApiKeySet && (
 												<PasswordEndAdornment
@@ -346,9 +342,14 @@ const Settings = () => {
 											)
 										}
 									/>
+									{isApiKeySet && (
+										<Typography >
+											API key is set. Click Reset to change it.
+										</Typography>
+									)}
 								</Box>
 								{isApiKeySet && (
-									<Button onClick={handleResetApiKey} variant="outlined">
+									<Button onClick={handleResetApiKey} variant="contained" color="error">
 										Reset
 									</Button>
 								)}