soeren/fotospiel-app
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Remove Google helper badge in checkout auth
Some checks failed
linter / quality (push) Has been cancelled
Details
tests / ci (push) Has been cancelled
Details
tests / ui (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Codex Agent
2026-01-23 20:24:43 +01:00
parent 73728f6baf
commit 1241f5092e
1 changed files with 16 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
resources/js/pages/marketing/checkout/steps/AuthStep.tsx
View File

@@ -8,9 +8,7 @@ import LoginForm, { AuthUserPayload } from "../../../auth/LoginForm";
import RegisterForm, { RegisterSuccessPayload } from "../../../auth/RegisterForm"; import RegisterForm, { RegisterSuccessPayload } from "../../../auth/RegisterForm";
import { Trans, useTranslation } from 'react-i18next'; import { Trans, useTranslation } from 'react-i18next';
import toast from 'react-hot-toast'; import toast from 'react-hot-toast';
import { ChevronDown, LoaderCircle } from "lucide-react"; import { LoaderCircle } from "lucide-react";
import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "@/components/ui/collapsible";
import { cn } from "@/lib/utils";
interface AuthStepProps { interface AuthStepProps {
privacyHtml: string; privacyHtml: string;
@@ -64,7 +62,6 @@ export const AuthStep: React.FC<AuthStepProps> = ({ privacyHtml, prefill, onClea
const [mode, setMode] = useState<'login' | 'register'>('register'); const [mode, setMode] = useState<'login' | 'register'>('register');
const [isRedirectingToGoogle, setIsRedirectingToGoogle] = useState(false); const [isRedirectingToGoogle, setIsRedirectingToGoogle] = useState(false);
const [isRedirectingToFacebook, setIsRedirectingToFacebook] = useState(false); const [isRedirectingToFacebook, setIsRedirectingToFacebook] = useState(false);
const [showGoogleHelper, setShowGoogleHelper] = useState(false);
const showOauthControls = mode === 'register'; const showOauthControls = mode === 'register';
const authErrorTitle = facebookAuth?.error const authErrorTitle = facebookAuth?.error
? t('checkout.auth_step.facebook_error_title') ? t('checkout.auth_step.facebook_error_title')
@@ -96,16 +93,6 @@ export const AuthStep: React.FC<AuthStepProps> = ({ privacyHtml, prefill, onClea
} }
}, [facebookAuth?.error]); }, [facebookAuth?.error]);
useEffect(() => {
if (mode !== 'login') {
return;
}
if (showGoogleHelper) {
setShowGoogleHelper(false);
}
}, [mode, showGoogleHelper]);
const handleLoginSuccess = (payload: AuthUserPayload | null) => { const handleLoginSuccess = (payload: AuthUserPayload | null) => {
if (!payload) { if (!payload) {
return; return;
@@ -194,7 +181,7 @@ export const AuthStep: React.FC<AuthStepProps> = ({ privacyHtml, prefill, onClea
return ( return (
<div className="space-y-6"> <div className="space-y-6">
<Collapsible open={showGoogleHelper} onOpenChange={setShowGoogleHelper} className="w-full space-y-2"> <div className="space-y-2">
<div className="flex flex-wrap items-center gap-2"> <div className="flex flex-wrap items-center gap-2">
<Button <Button
variant={mode === 'register' ? 'default' : 'outline'} variant={mode === 'register' ? 'default' : 'outline'}
@@ -210,33 +197,19 @@ export const AuthStep: React.FC<AuthStepProps> = ({ privacyHtml, prefill, onClea
</Button> </Button>
{showOauthControls && ( {showOauthControls && (
<div className="flex flex-1 flex-wrap items-center gap-2 sm:flex-none"> <div className="flex flex-1 flex-wrap items-center gap-2 sm:flex-none">
<div className="flex items-center gap-2"> <Button
<Button variant="outline"
variant="outline" onClick={handleGoogleLogin}
onClick={handleGoogleLogin} disabled={isRedirectingToGoogle}
disabled={isRedirectingToGoogle} className="flex items-center gap-2"
className="flex items-center gap-2" >
> {isRedirectingToGoogle ? (
{isRedirectingToGoogle ? ( <LoaderCircle className="h-4 w-4 animate-spin" />
<LoaderCircle className="h-4 w-4 animate-spin" /> ) : (
) : ( <GoogleIcon className="h-4 w-4" />
<GoogleIcon className="h-4 w-4" /> )}
)} {t('checkout.auth_step.continue_with_google')}
{t('checkout.auth_step.continue_with_google')} </Button>
</Button>
<CollapsibleTrigger asChild>
<button
type="button"
className={cn(
"inline-flex items-center gap-1 rounded-full border border-muted-foreground/30 px-3 py-1 text-xs font-medium text-muted-foreground transition hover:border-muted-foreground/60 hover:text-foreground",
showGoogleHelper && "bg-muted/60 text-foreground"
)}
>
{t('checkout.auth_step.google_helper_badge')}
<ChevronDown className={cn("h-3 w-3 transition-transform", showGoogleHelper && "rotate-180")} />
</button>
</CollapsibleTrigger>
</div>
<Button <Button
variant="outline" variant="outline"
onClick={handleFacebookLogin} onClick={handleFacebookLogin}
@@ -253,14 +226,7 @@ export const AuthStep: React.FC<AuthStepProps> = ({ privacyHtml, prefill, onClea
</div> </div>
)} )}
</div> </div>
{showOauthControls && ( </div>
<CollapsibleContent>
<Alert className="border-dashed border-muted/60 bg-muted/20 text-xs sm:text-sm">
<AlertDescription>{t('checkout.auth_step.google_helper')}</AlertDescription>
</Alert>
</CollapsibleContent>
)}
</Collapsible>
{(googleAuth?.error || facebookAuth?.error) && ( {(googleAuth?.error || facebookAuth?.error) && (
<Alert variant="destructive"> <Alert variant="destructive">