Merge branch 'development' into FE/collabPage

Author: jolynloh

frontend/src/App.tsx

@@ -69,10 +69,10 @@ function App() {
             <Route index element={<Navigate to="/auth/login" />} />
             <Route path="signup" element={<SignUp />} />
             <Route path="login" element={<LogIn />} />
-            <Route
-              path="verifyEmail/:userId?"
-              element={<EmailVerification />}
-            />
+            <Route path="verify-email">
+              <Route index element={<EmailVerification />} />
+              <Route path=":userId" element={<EmailVerification />} />
+            </Route>
             <Route path="forget-password" element={<ForgetPassword />} />
             <Route path="*" element={<Navigate to="/auth/login" />} />
           </Route>

frontend/src/contexts/AuthContext.tsx

@@ -66,7 +66,7 @@ const AuthProvider: React.FC<{ children?: React.ReactNode }> = (props) => {
       })
       .then(() => userClient.post("users/send-verification-email", { email }))
       .then((res) => {
-        navigate(`/auth/verifyEmail/${res.data.data.id}`);
+        navigate(`/auth/verify-email/${res.data.data.id}`);
       })
       .catch((err) => {
         setUser(null);
@@ -88,7 +88,7 @@ const AuthProvider: React.FC<{ children?: React.ReactNode }> = (props) => {
       })
       .catch((err) => {
         if (err.response?.data.message === "User not verified.") {
-          navigate(`/auth/verifyEmail`);
+          navigate(`/auth/verify-email`);
         }
         setUser(null);
         toast.error(err.response?.data.message || err.message);

frontend/src/pages/EmailVerification/index.tsx

@@ -77,7 +77,7 @@ const EmailVerification: React.FC = () => {
             onChange={(e) => setEmail(e.target.value)}
             slotProps={{
               input: {
-                endAdornment: <Button onClick={handleSendEmail}>Send</Button>,
+                endAdornment: <Button onClick={handleSendEmail}>Resend</Button>,
               },
             }}
           />
@@ -93,14 +93,6 @@ const EmailVerification: React.FC = () => {
             spacing={2}
             sx={(theme) => ({ marginTop: theme.spacing(4) })}
           >
-            <Button
-              fullWidth
-              variant="contained"
-              color="secondary"
-              onClick={handleSendEmail}
-            >
-              Resend
-            </Button>
             <Button fullWidth variant="contained" onClick={handleVerifyAcc}>
               Verify
             </Button>