mirror of
https://github.com/danny-avila/LibreChat.git
synced 2026-03-10 18:12:35 +01:00
🎨 refactor: Auth Components UI Consistency (#7651)
* 🔧 refactor: Improve Error Handling and UI Consistency in Auth Components * 🔧 refactor: Email Templates * 🔧 refactor: Enhance LoginForm with loading state and spinner * 🔧 refactor: Replace button elements with Button component and enhance UI consistency across Auth forms
This commit is contained in:
parent
80bc49db8d
commit
37c94beeac
10 changed files with 284 additions and 140 deletions
|
|
@ -5,6 +5,7 @@ import type { TLoginUser, TStartupConfig } from 'librechat-data-provider';
|
|||
import type { TAuthContext } from '~/common';
|
||||
import { useResendVerificationEmail, useGetStartupConfig } from '~/data-provider';
|
||||
import { ThemeContext, useLocalize } from '~/hooks';
|
||||
import { Spinner, Button } from '~/components';
|
||||
|
||||
type TLoginFormProps = {
|
||||
onSubmit: (data: TLoginUser) => void;
|
||||
|
|
@ -20,7 +21,7 @@ const LoginForm: React.FC<TLoginFormProps> = ({ onSubmit, startupConfig, error,
|
|||
register,
|
||||
getValues,
|
||||
handleSubmit,
|
||||
formState: { errors },
|
||||
formState: { errors, isSubmitting },
|
||||
} = useForm<TLoginUser>();
|
||||
const [showResendLink, setShowResendLink] = useState<boolean>(false);
|
||||
const [turnstileToken, setTurnstileToken] = useState<string | null>(null);
|
||||
|
|
@ -165,15 +166,16 @@ const LoginForm: React.FC<TLoginFormProps> = ({ onSubmit, startupConfig, error,
|
|||
)}
|
||||
|
||||
<div className="mt-6">
|
||||
<button
|
||||
<Button
|
||||
aria-label={localize('com_auth_continue')}
|
||||
data-testid="login-button"
|
||||
type="submit"
|
||||
disabled={requireCaptcha && !turnstileToken}
|
||||
className="w-full rounded-2xl bg-green-600 px-4 py-3 text-sm font-medium text-white transition-colors hover:bg-green-700 disabled:opacity-50 disabled:hover:bg-green-600 dark:bg-green-600 dark:hover:bg-green-700"
|
||||
disabled={(requireCaptcha && !turnstileToken) || isSubmitting}
|
||||
variant="submit"
|
||||
className="h-12 w-full rounded-2xl"
|
||||
>
|
||||
{localize('com_auth_continue')}
|
||||
</button>
|
||||
{isSubmitting ? <Spinner /> : localize('com_auth_continue')}
|
||||
</Button>
|
||||
</div>
|
||||
</form>
|
||||
</>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue