From e5289013c76f70655394b3b075b3489c5ee0a358 Mon Sep 17 00:00:00 2001 From: AaronKeys Date: Sun, 21 Apr 2024 14:35:55 -0400 Subject: [PATCH 1/5] age validation for profile working --- .../src/components/pages/ProfileSettings.jsx | 27 ++++++++++++++++--- 1 file changed, 24 insertions(+), 3 deletions(-) diff --git a/FU.SPA/src/components/pages/ProfileSettings.jsx b/FU.SPA/src/components/pages/ProfileSettings.jsx index 7e5befef..0b266f4e 100644 --- a/FU.SPA/src/components/pages/ProfileSettings.jsx +++ b/FU.SPA/src/components/pages/ProfileSettings.jsx @@ -31,6 +31,7 @@ export default function ProfileSettings() { const { refreshUser } = useContext(UserContext); const [isEnabled, setIsEnabled] = useState(false); const [bioError, setBioError] = useState(''); + const [dateError, setDateError] = useState(''); useEffect(() => { async function fetchUserInfo() { @@ -47,8 +48,8 @@ export default function ProfileSettings() { }, []); useEffect(() => { - setIsEnabled(bio.length <= 1500); - }, [bio, isEnabled]); + setIsEnabled(bio.length <= 1500 && !dateError); + }, [bio, isEnabled, dateOfBirth]); // Handles the errors and value changes for the bio(About) section. const handleBioChange = (e) => { @@ -61,6 +62,21 @@ export default function ProfileSettings() { } }; + const handleDOBChange = (e) => { + const today = dayjs(); + const ageEntered = today.diff(e, 'year'); + if (ageEntered < 13) { + setDateError('You must be at least 13 years of age.'); + setDateOfBirth(e); + } else if (ageEntered > 120) { + setDateError('You must enter an age less than 120'); + setDateOfBirth(e); + } else { + setDateError(''); + setDateOfBirth(e); + } + } + const handleSubmit = async (e) => { e.preventDefault(); @@ -153,10 +169,15 @@ export default function ProfileSettings() { label="Date of Birth" value={dateOfBirth} // Leave null as to not change date fullWidth - onChange={(newValue) => setDateOfBirth(newValue)} + onChange={(newValue) => handleDOBChange(newValue)} slotProps={{ field: { clearable: true } }} /> + {dateError && ( + + {dateError} + + )} 1500} helperText={bioError} From 4154ec5f3f30e55f282219a5ed3849651ec1309d Mon Sep 17 00:00:00 2001 From: AaronKeys Date: Sun, 21 Apr 2024 14:38:43 -0400 Subject: [PATCH 2/5] lint, format, comments, small changes --- FU.SPA/src/components/pages/ProfileSettings.jsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/FU.SPA/src/components/pages/ProfileSettings.jsx b/FU.SPA/src/components/pages/ProfileSettings.jsx index 0b266f4e..34009331 100644 --- a/FU.SPA/src/components/pages/ProfileSettings.jsx +++ b/FU.SPA/src/components/pages/ProfileSettings.jsx @@ -31,7 +31,7 @@ export default function ProfileSettings() { const { refreshUser } = useContext(UserContext); const [isEnabled, setIsEnabled] = useState(false); const [bioError, setBioError] = useState(''); - const [dateError, setDateError] = useState(''); + const [dateError, setDateError] = useState(''); useEffect(() => { async function fetchUserInfo() { @@ -46,10 +46,10 @@ export default function ProfileSettings() { fetchUserInfo(); }, []); - + // Shows or hides the update profile button useEffect(() => { setIsEnabled(bio.length <= 1500 && !dateError); - }, [bio, isEnabled, dateOfBirth]); + }, [bio, isEnabled, dateError]); // Handles the errors and value changes for the bio(About) section. const handleBioChange = (e) => { @@ -61,7 +61,7 @@ export default function ProfileSettings() { setBio(e); } }; - + // Handles the errors and value changes for the date of birth section. const handleDOBChange = (e) => { const today = dayjs(); const ageEntered = today.diff(e, 'year'); @@ -75,7 +75,7 @@ export default function ProfileSettings() { setDateError(''); setDateOfBirth(e); } - } + }; const handleSubmit = async (e) => { e.preventDefault(); @@ -175,7 +175,7 @@ export default function ProfileSettings() { {dateError && ( - {dateError} + {dateError} {/* Error message */} )} Date: Mon, 22 Apr 2024 11:48:51 -0400 Subject: [PATCH 3/5] Cleanup, use native field error, allow clearing DOB --- .../src/components/pages/ProfileSettings.jsx | 43 +++++++++++-------- 1 file changed, 25 insertions(+), 18 deletions(-) diff --git a/FU.SPA/src/components/pages/ProfileSettings.jsx b/FU.SPA/src/components/pages/ProfileSettings.jsx index 34009331..47ad17f8 100644 --- a/FU.SPA/src/components/pages/ProfileSettings.jsx +++ b/FU.SPA/src/components/pages/ProfileSettings.jsx @@ -63,18 +63,28 @@ export default function ProfileSettings() { }; // Handles the errors and value changes for the date of birth section. const handleDOBChange = (e) => { - const today = dayjs(); - const ageEntered = today.diff(e, 'year'); - if (ageEntered < 13) { - setDateError('You must be at least 13 years of age.'); - setDateOfBirth(e); - } else if (ageEntered > 120) { - setDateError('You must enter an age less than 120'); - setDateOfBirth(e); - } else { - setDateError(''); - setDateOfBirth(e); + try { + const today = dayjs(); + const ageEntered = today.diff(e, 'year'); + console.log(ageEntered); + // allows clearing date of birth + if (e == null) { + setDateError(''); + setDateOfBirth(e); + } else if (ageEntered < 13) { + setDateError('You must be at least 13 years old.'); + setDateOfBirth(e); + } else if (ageEntered > 120) { + setDateError('You must enter an age less than 120 years old.'); + setDateOfBirth(e); + } else { + setDateError(''); + setDateOfBirth(e); + } + } catch (e) { + console.error("Error in DOB change: ", e); } + }; const handleSubmit = async (e) => { @@ -167,17 +177,14 @@ export default function ProfileSettings() { handleDOBChange(newValue)} - slotProps={{ field: { clearable: true } }} + slotProps={{ field: { clearable: true, helperText: dateError, error: !!dateError }}} /> - {dateError && ( - - {dateError} {/* Error message */} - - )} 1500} helperText={bioError} From ef1fa2e132b43d31a05bf22da58dc2cd77a69777 Mon Sep 17 00:00:00 2001 From: epadams Date: Mon, 22 Apr 2024 11:58:16 -0400 Subject: [PATCH 4/5] Lint and format --- FU.SPA/src/components/pages/ProfileSettings.jsx | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/FU.SPA/src/components/pages/ProfileSettings.jsx b/FU.SPA/src/components/pages/ProfileSettings.jsx index 47ad17f8..8166467b 100644 --- a/FU.SPA/src/components/pages/ProfileSettings.jsx +++ b/FU.SPA/src/components/pages/ProfileSettings.jsx @@ -82,9 +82,8 @@ export default function ProfileSettings() { setDateOfBirth(e); } } catch (e) { - console.error("Error in DOB change: ", e); + console.error('Error in DOB change: ', e); } - }; const handleSubmit = async (e) => { @@ -182,7 +181,13 @@ export default function ProfileSettings() { error={dateError} fullWidth onChange={(newValue) => handleDOBChange(newValue)} - slotProps={{ field: { clearable: true, helperText: dateError, error: !!dateError }}} + slotProps={{ + field: { + clearable: true, + helperText: dateError, + error: !!dateError, + }, + }} /> Date: Mon, 22 Apr 2024 12:01:21 -0400 Subject: [PATCH 5/5] Remove unessecary values --- FU.SPA/src/components/pages/ProfileSettings.jsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/FU.SPA/src/components/pages/ProfileSettings.jsx b/FU.SPA/src/components/pages/ProfileSettings.jsx index 8166467b..94cf4860 100644 --- a/FU.SPA/src/components/pages/ProfileSettings.jsx +++ b/FU.SPA/src/components/pages/ProfileSettings.jsx @@ -177,8 +177,6 @@ export default function ProfileSettings() { handleDOBChange(newValue)} slotProps={{