登录 Sign in with Google

注册 Sign up with Google

app/signup/page.tsx

@@ -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">

components/pages/login.tsx

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

components/ui/google-login-button.tsx

@@ -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">
+        <span className="font-medium">{loading ? loadingLabel : label}</span>
-          {loading ? "Signing in..." : "Google Login"}
-        </span>
       </button>
     );
   }