diff --git a/sigap-website/app/(pages)/(auth)/_handlers/use-sign-in-with-password.ts b/sigap-website/app/(pages)/(auth)/_handlers/use-sign-in-with-password.ts index 0c7345f..72a2c33 100644 --- a/sigap-website/app/(pages)/(auth)/_handlers/use-sign-in-with-password.ts +++ b/sigap-website/app/(pages)/(auth)/_handlers/use-sign-in-with-password.ts @@ -37,16 +37,18 @@ export const useSignInWithPasswordHandler = () => { const formData = new FormData(); formData.append('email', data.email); + formData.append('password', data.password); + try { toast.promise( signInWithPassword(formData), { - loading: 'Sending magic link...', + loading: 'Signing in...', success: () => { // If we reach here, the operation was successful router.push(createRoute(ROUTES.APP.DASHBOARD)); - return 'An email has been sent to you. Please check your inbox.'; + return "Successfully signed in!"; }, error: (err) => { const errorMessage = err?.message || 'Failed to send email.'; diff --git a/sigap-website/app/(pages)/(auth)/sign-in/_components/sign-in-with-password-form.tsx b/sigap-website/app/(pages)/(auth)/sign-in/_components/sign-in-with-password-form.tsx index 53ec888..eef1071 100644 --- a/sigap-website/app/(pages)/(auth)/sign-in/_components/sign-in-with-password-form.tsx +++ b/sigap-website/app/(pages)/(auth)/sign-in/_components/sign-in-with-password-form.tsx @@ -1,6 +1,6 @@ "use client"; -import React, { useState } from "react"; +import React, { useState, useEffect } from "react"; import { Loader2, Lock, Eye, EyeOff } from "lucide-react"; import { Button } from "@/app/_components/ui/button"; import { Input } from "@/app/_components/ui/input"; @@ -22,33 +22,12 @@ export function SignInWithPasswordForm({ const [showPassword, setShowPassword] = useState(false); const [isSignInWithPassword, setIsSignInWithPassword] = useState(false); - // State to track if the password field has a value - const [hasPasswordValue, setHasPasswordValue] = useState(false); - // Get handlers for both authentication methods const passwordHandler = useSignInWithPasswordHandler(); const passwordlessHandler = useSignInPasswordlessHandler(); - // Choose the appropriate handler based on whether password is provided - const { - register, - isPending, - handleSignIn, - error, - errors, - formErrors, - getFieldErrorMessage - } = isSignInWithPassword ? passwordHandler : passwordlessHandler; - - // Handle password input changes to determine which auth method to use - const handlePasswordChange = (e: React.ChangeEvent) => { - setHasPasswordValue(!!e.target.value); - }; - - // Toggle password visibility - const togglePasswordVisibility = () => { - setShowPassword(!showPassword); - }; + // Get the current active handler based on state + const activeHandler = isSignInWithPassword ? passwordHandler : passwordlessHandler; // Toggle password form field const togglePasswordField = () => { @@ -56,8 +35,8 @@ export function SignInWithPasswordForm({ }; const handleForgotPassword = () => { - router.push(createRoute(ROUTES.AUTH.FORGOT_PASSWORD)) - } + router.push(createRoute(ROUTES.AUTH.FORGOT_PASSWORD)); + }; return (
@@ -79,7 +58,7 @@ export function SignInWithPasswordForm({ variant="outline" className="w-full bg-[#1C1C1C] text-white border-gray-800 hover:bg-[#2C2C2C] hover:border-gray-700" size="lg" - disabled={isPending} + disabled={activeHandler.isPending} > Continue with SSO @@ -95,7 +74,7 @@ export function SignInWithPasswordForm({
-
+
} - error={getFieldErrorMessage('email') || error} + error={activeHandler.getFieldErrorMessage('email') || activeHandler.error} />
@@ -129,33 +108,21 @@ export function SignInWithPasswordForm({ {...passwordHandler.register("password")} type={showPassword ? "text" : "password"} placeholder="Password" - className={`bg-[#1C1C1C] border-gray-800 pr-10`} - error={isSignInWithPassword && !!passwordHandler.formErrors.password} - disabled={isPending} - onChange={handlePasswordChange} + className={`bg-[#1C1C1C] border-gray-800`} + error={!!passwordHandler.formErrors.password} + disabled={passwordHandler.isPending} /> - } - error={passwordHandler.getFieldErrorMessage('password') || error} + error={passwordHandler.getFieldErrorMessage('password') || passwordHandler.error} /> )}