From ef4085de6e843f3a4c734b500eeb29e5077090df Mon Sep 17 00:00:00 2001
From: Koosha Lahouti <koosha@Kooshas-MacBook-Air.local>
Date: Wed, 24 Sep 2025 12:00:40 +0330
Subject: [PATCH] fix: submit with enter in enter password form

---
 .../AuthenticationSteps/EnterPasswordForm.tsx | 114 ++++++++++--------
 1 file changed, 63 insertions(+), 51 deletions(-)

diff --git a/src/features/authentication/components/AuthenticationSteps/EnterPasswordForm.tsx b/src/features/authentication/components/AuthenticationSteps/EnterPasswordForm.tsx
index 1c03e69..46f23f7 100644
--- a/src/features/authentication/components/AuthenticationSteps/EnterPasswordForm.tsx
+++ b/src/features/authentication/components/AuthenticationSteps/EnterPasswordForm.tsx
@@ -142,61 +142,73 @@ export const EnterPasswordForm = ({
           </LTRBox>
         </Button>
       </Box>
-
-      <Typography variant="body2" color="textSecondary" sx={{ mt: 1, mb: 2 }}>
-        {t('enterPassword.enterThePasswordYouSetForYourAccount')}
-      </Typography>
-
-      <TextField
-        label={t('enterPassword.loginPassword')}
-        type={showPassword ? 'text' : 'password'}
-        value={passValue}
-        inputRef={inputRef}
-        onChange={(e) => setPassValue(e.target.value)}
-        onBlur={handleBlur}
-        error={!passValue && inputTouched}
-        helperText={
-          !passValue && inputTouched ? t('loginForm.thisFieldIsRequired') : ''
-        }
-        autoFocus
-        slotProps={{
-          htmlInput: { sx: { lineHeight: 1.5 } },
-          input: {
-            endAdornment: (
-              <IconButton
-                color="primary"
-                onClick={() => setShowPassword(!showPassword)}
-              >
-                {showPassword ? (
-                  <Icon Component={Eye} />
-                ) : (
-                  <Icon Component={EyeSlash} />
-                )}
-              </IconButton>
-            ),
-          },
+      <Box
+        component="form"
+        onSubmit={(e) => {
+          e.preventDefault();
+          e.stopPropagation();
+          if (!loginWithPassLoading) {
+            void handleSubmit();
+          }
         }}
-        sx={{ my: 4 }}
-      />
-
-      <Button
-        onClick={handleLoginWithOtp}
-        sx={{ width: 'auto', mb: 2 }}
-        variant="text"
-        loading={emailResendLoading || smsResendLoading}
-        endIcon={<Icon Component={ArrowLeft} />}
       >
-        {t('enterPassword.loginWithOneTimeCode')}
-      </Button>
+        <Typography variant="body2" color="textSecondary" sx={{ mt: 1, mb: 2 }}>
+          {t('enterPassword.enterThePasswordYouSetForYourAccount')}
+        </Typography>
 
-      <Stack spacing={1}>
-        <Button loading={loginWithPassLoading} onClick={handleSubmit}>
-          {t('verify.confirmAndLogin')}
+        <TextField
+          label={t('enterPassword.loginPassword')}
+          type={showPassword ? 'text' : 'password'}
+          value={passValue}
+          inputRef={inputRef}
+          onChange={(e) => setPassValue(e.target.value)}
+          onBlur={handleBlur}
+          error={!passValue && inputTouched}
+          helperText={
+            !passValue && inputTouched ? t('loginForm.thisFieldIsRequired') : ''
+          }
+          autoFocus
+          slotProps={{
+            htmlInput: { sx: { lineHeight: 1.5 } },
+            input: {
+              endAdornment: (
+                <IconButton
+                  color="primary"
+                  onClick={() => setShowPassword(!showPassword)}
+                >
+                  {showPassword ? (
+                    <Icon Component={Eye} />
+                  ) : (
+                    <Icon Component={EyeSlash} />
+                  )}
+                </IconButton>
+              ),
+            },
+          }}
+          sx={{ my: 4 }}
+        />
+
+        <Button
+          onClick={handleLoginWithOtp}
+          sx={{ width: 'auto', mb: 2 }}
+          variant="text"
+          loading={emailResendLoading || smsResendLoading}
+          endIcon={<Icon Component={ArrowLeft} />}
+        >
+          {t('enterPassword.loginWithOneTimeCode')}
         </Button>
-        <Link to="/forget-password">
-          <Button variant="text">{t('enterPassword.iForgotMyPassword')}</Button>
-        </Link>
-      </Stack>
+
+        <Stack spacing={1}>
+          <Button loading={loginWithPassLoading}>
+            {t('verify.confirmAndLogin')}
+          </Button>
+          <Link to="/forget-password">
+            <Button variant="text">
+              {t('enterPassword.iForgotMyPassword')}
+            </Button>
+          </Link>
+        </Stack>
+      </Box>
     </AuthenticationCard>
   );
 };