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

Checkout: minimize registration data
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-06 09:23:01 +01:00
parent 29c3c42134
commit 33af04db1b
9 changed files with 105 additions and 157 deletions
Download Patch File Download Diff File Expand all files Collapse all files

112
resources/js/pages/auth/RegisterForm.tsx
View File

@@ -2,7 +2,7 @@ import React, { useEffect, useMemo, useState } from 'react';
import { useForm, usePage } from '@inertiajs/react';
import { useTranslation } from 'react-i18next';
import toast from 'react-hot-toast';
import { LoaderCircle, User, Mail, Phone, Lock, MapPin } from 'lucide-react';
import { LoaderCircle, User, Mail, Lock } from 'lucide-react';
import { Dialog, DialogContent, DialogTitle, DialogDescription } from '@/components/ui/dialog';
import type { GoogleProfilePrefill } from '../marketing/checkout/types';
@@ -22,14 +22,11 @@ interface RegisterFormProps {
}
type RegisterFormFields = {
username: string;
email: string;
password: string;
password_confirmation: string;
first_name: string;
last_name: string;
address: string;
phone: string;
privacy_consent: boolean;
terms: boolean;
package_id: number | null;
@@ -65,14 +62,11 @@ export default function RegisterForm({ packageId, onSuccess, privacyHtml, locale
const resolvedLocale = locale ?? page.props.locale ?? 'de';
const { data, setData, errors, clearErrors, reset, setError } = useForm<RegisterFormFields>({
username: '',
email: '',
password: '',
password_confirmation: '',
first_name: '',
last_name: '',
address: '',
phone: '',
privacy_consent: false,
terms: false,
package_id: packageId || null,
@@ -87,7 +81,7 @@ export default function RegisterForm({ packageId, onSuccess, privacyHtml, locale
const registerEndpoint = '/checkout/register';
const requiredStringFields: Array<keyof RegisterFormFields> = useMemo(() => (
['first_name', 'last_name', 'username', 'email', 'password', 'password_confirmation', 'address', 'phone']
['first_name', 'last_name', 'email', 'password', 'password_confirmation']
), []);
const isFormValid = useMemo(() => {
@@ -121,27 +115,6 @@ export default function RegisterForm({ packageId, onSuccess, privacyHtml, locale
};
}, [prefill]);
const suggestedUsername = useMemo(() => {
if (prefill?.email) {
const localPart = prefill.email.split('@')[0];
if (localPart) {
return localPart.slice(0, 30);
}
}
const first = prefill?.given_name ?? prefill?.name?.split(' ')[0] ?? '';
const last = prefill?.family_name ?? prefill?.name?.split(' ').slice(1).join(' ') ?? '';
const combined = `${first}${last}`.trim();
if (!combined) {
return undefined;
}
return combined
.toLowerCase()
.replace(/[^a-z0-9]+/g, '')
.slice(0, 30) || undefined;
}, [prefill]);
useEffect(() => {
if (!prefill || prefillApplied) {
return;
@@ -159,12 +132,8 @@ export default function RegisterForm({ packageId, onSuccess, privacyHtml, locale
setData('email', prefill.email);
}
if (suggestedUsername && !data.username) {
setData('username', suggestedUsername);
}
setPrefillApplied(true);
}, [prefill, namePrefill.first, namePrefill.last, data.first_name, data.last_name, data.email, data.username, prefillApplied, setData, suggestedUsername]);
}, [prefill, namePrefill.first, namePrefill.last, data.first_name, data.last_name, data.email, prefillApplied, setData]);
const submit = async (event: React.FormEvent) => {
event.preventDefault();
@@ -357,81 +326,6 @@ export default function RegisterForm({ packageId, onSuccess, privacyHtml, locale
{errors.email && <p className="text-sm text-red-600 mt-1">{errors.email}</p>}
</div>
<div className="md:col-span-2">
<label htmlFor="address" className="block text-sm font-medium text-gray-700 mb-1">
{t('register.address')} {t('common:required')}
</label>
<div className="relative">
<MapPin className="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 w-5 h-5" />
<input
id="address"
name="address"
type="text"
required
value={data.address}
onChange={(e) => {
setData('address', e.target.value);
if (e.target.value.trim() && errors.address) {
clearErrors('address');
}
}}
className={`block w-full pl-10 pr-3 py-3 border rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-[#FFB6C1] focus:border-[#FFB6C1] sm:text-sm ${errors.address ? 'border-red-500' : 'border-gray-300'}`}
placeholder={t('register.address_placeholder')}
/>
</div>
{errors.address && <p className="text-sm text-red-600 mt-1">{errors.address}</p>}
</div>
<div className="md:col-span-1">
<label htmlFor="phone" className="block text-sm font-medium text-gray-700 mb-1">
{t('register.phone')} {t('common:required')}
</label>
<div className="relative">
<Phone className="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 w-5 h-5" />
<input
id="phone"
name="phone"
type="tel"
required
value={data.phone}
onChange={(e) => {
setData('phone', e.target.value);
if (e.target.value.trim() && errors.phone) {
clearErrors('phone');
}
}}
className={`block w-full pl-10 pr-3 py-3 border rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-[#FFB6C1] focus:border-[#FFB6C1] sm:text-sm ${errors.phone ? 'border-red-500' : 'border-gray-300'}`}
placeholder={t('register.phone_placeholder')}
/>
</div>
{errors.phone && <p className="text-sm text-red-600 mt-1">{errors.phone}</p>}
</div>
<div className="md:col-span-1">
<label htmlFor="username" className="block text-sm font-medium text-gray-700 mb-1">
{t('register.username')} {t('common:required')}
</label>
<div className="relative">
<User className="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 w-5 h-5" />
<input
id="username"
name="username"
type="text"
required
value={data.username}
onChange={(e) => {
setData('username', e.target.value);
if (e.target.value.trim() && errors.username) {
clearErrors('username');
}
}}
className={`block w-full pl-10 pr-3 py-3 border rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-[#FFB6C1] focus:border-[#FFB6C1] sm:text-sm ${errors.username ? 'border-red-500' : 'border-gray-300'}`}
placeholder={t('register.username_placeholder')}
/>
</div>
{errors.username && <p className="text-sm text-red-600 mt-1">{errors.username}</p>}
</div>
<div className="md:col-span-1">
<label htmlFor="password" className="block text-sm font-medium text-gray-700 mb-1">
{t('register.password')} {t('common:required')}