From f491a4047db4cd6f8cf42daa314a4efc0ce16c0d Mon Sep 17 00:00:00 2001
From: AmirReza Jamali <amir7jamali.ar@yahoo.com>
Date: Sat, 14 Feb 2026 10:20:20 +0330
Subject: [PATCH] fix(auth): disable submit button during login process

- Add loading state to the submit button in SigninWithPassword component to prevent multiple submissions.
- Use utility function to conditionally apply styles based on the loading state, enhancing user experience.
---
 src/components/Auth/SigninWithPassword.tsx | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/components/Auth/SigninWithPassword.tsx b/src/components/Auth/SigninWithPassword.tsx
index 84323e1..5fa9cc9 100644
--- a/src/components/Auth/SigninWithPassword.tsx
+++ b/src/components/Auth/SigninWithPassword.tsx
@@ -5,6 +5,7 @@ import { FormErrorMessages } from "@/constants/Texts";
 import { useLoginQuery } from "@/hooks/queries";
 import { ILoginCredentials } from "@/lib/api";
 import { COOKIE_KEYS } from "@/lib/shared/cookies";
+import { cn } from "@/lib/utils";
 import { useIsMutating } from "@tanstack/react-query";
 import Cookies from "js-cookie";
 import { useState } from "react";
@@ -71,7 +72,11 @@ export default function SigninWithPassword() {
       <div className="mb-4.5">
         <button
           type="submit"
-          className="flex w-full cursor-pointer items-center justify-center gap-2 rounded-lg bg-primary p-4 font-medium text-white transition hover:bg-opacity-90"
+          disabled={!!isMutating}
+          className={cn(
+            "flex w-full cursor-pointer items-center justify-center gap-2 rounded-lg bg-primary p-4 font-medium text-white transition hover:bg-opacity-90",
+            isMutating && "cursor-not-allowed bg-primary/50",
+          )}
         >
           {isMutating ? (
             <div className="h-5 w-5 animate-spin rounded-full border-b-2 border-gray-1"></div>