登录 Sign in with Google

注册 Sign up with Google
This commit is contained in:
qikongjian 2025-09-23 20:04:08 +08:00
parent b011a784c3
commit ba897f08c1
3 changed files with 13 additions and 5 deletions

View File

@ -525,6 +525,8 @@ export default function SignupPage() {
variant="outline"
size="md"
className="w-full"
label="Sign up with Google"
loadingLabel="Signing up..."
/>
</>
)}
@ -578,7 +580,7 @@ export default function SignupPage() {
</div>
<h3 className="text-xl font-semibold text-white text-center mb-2" data-alt="activation-title">Please verify your email to activate your account</h3>
<p className="text-gray-300 text-center mb-4" data-alt="activation-desc">
We have sent an activation email to {email || "your email"}; if you don't receive it, please check your spam folder or try again later
We have sent an activation email to {email || "your email"}; if you don&apos;t receive it, please check your spam folder or try again later
</p>
<div className="flex items-center justify-center mb-4 gap-3">

View File

@ -297,6 +297,8 @@ export default function Login() {
variant="outline"
size="md"
className="w-full"
label="Sign in with Google"
loadingLabel="Signing in..."
/>
</>
)}

View File

@ -11,6 +11,10 @@ interface GoogleLoginButtonProps {
className?: string;
size?: "sm" | "md" | "lg";
variant?: "default" | "outline";
/** Button label when not loading */
label?: string;
/** Button label when loading */
loadingLabel?: string;
}
// Google logo SVG component matching the exact reference
@ -83,6 +87,8 @@ export const GoogleLoginButton = React.forwardRef<
className,
size = "md",
variant = "default",
label = "Google Login",
loadingLabel = "Signing in...",
...props
},
ref
@ -147,7 +153,7 @@ export const GoogleLoginButton = React.forwardRef<
// Custom className
className
)}
aria-label={loading ? "Signing in with Google" : "Google Login"}
aria-label={loading ? loadingLabel : label}
aria-disabled={isDisabled}
role="button"
tabIndex={isDisabled ? -1 : 0}
@ -158,9 +164,7 @@ export const GoogleLoginButton = React.forwardRef<
) : (
<GoogleLogo className={sizeConfig.icon} />
)}
<span className="font-medium">
{loading ? "Signing in..." : "Google Login"}
</span>
<span className="font-medium">{loading ? loadingLabel : label}</span>
</button>
);
}