website refactor
This commit is contained in:
@@ -17,6 +17,7 @@ import {
|
||||
updateRaceAction,
|
||||
deleteRaceAction
|
||||
} from './actions';
|
||||
import { RaceScheduleCommandModel } from '@/lib/command-models/leagues/RaceScheduleCommandModel';
|
||||
import { Box } from '@/ui/Box';
|
||||
import { Stack } from '@/ui/Stack';
|
||||
import { Text } from '@/ui/Text';
|
||||
@@ -31,10 +32,9 @@ export function LeagueAdminSchedulePageClient() {
|
||||
|
||||
// Form state
|
||||
const [seasonId, setSeasonId] = useState<string>('');
|
||||
const [track, setTrack] = useState('');
|
||||
const [car, setCar] = useState('');
|
||||
const [scheduledAtIso, setScheduledAtIso] = useState('');
|
||||
const [form, setForm] = useState(() => new RaceScheduleCommandModel());
|
||||
const [editingRaceId, setEditingRaceId] = useState<string | null>(null);
|
||||
const [errors, setErrors] = useState<Record<string, string>>({});
|
||||
|
||||
// Action state
|
||||
const [isPublishing, setIsPublishing] = useState(false);
|
||||
@@ -59,9 +59,8 @@ export function LeagueAdminSchedulePageClient() {
|
||||
const handleSeasonChange = (newSeasonId: string) => {
|
||||
setSeasonId(newSeasonId);
|
||||
setEditingRaceId(null);
|
||||
setTrack('');
|
||||
setCar('');
|
||||
setScheduledAtIso('');
|
||||
setForm(new RaceScheduleCommandModel());
|
||||
setErrors({});
|
||||
};
|
||||
|
||||
const handlePublishToggle = async () => {
|
||||
@@ -84,23 +83,24 @@ export function LeagueAdminSchedulePageClient() {
|
||||
};
|
||||
|
||||
const handleAddOrSave = async () => {
|
||||
if (!selectedSeasonId || !scheduledAtIso) return;
|
||||
if (!selectedSeasonId) return;
|
||||
|
||||
const validationErrors = form.validate();
|
||||
if (Object.keys(validationErrors).length > 0) {
|
||||
setErrors(validationErrors as Record<string, string>);
|
||||
return;
|
||||
}
|
||||
|
||||
setIsSaving(true);
|
||||
try {
|
||||
const result = !editingRaceId
|
||||
? await createRaceAction(leagueId, selectedSeasonId, { track, car, scheduledAtIso })
|
||||
: await updateRaceAction(leagueId, selectedSeasonId, editingRaceId, {
|
||||
...(track ? { track } : {}),
|
||||
...(car ? { car } : {}),
|
||||
...(scheduledAtIso ? { scheduledAtIso } : {}),
|
||||
});
|
||||
? await createRaceAction(leagueId, selectedSeasonId, form.toCommand())
|
||||
: await updateRaceAction(leagueId, selectedSeasonId, editingRaceId, form.toCommand());
|
||||
|
||||
if (result.isOk()) {
|
||||
// Reset form
|
||||
setTrack('');
|
||||
setCar('');
|
||||
setScheduledAtIso('');
|
||||
setForm(new RaceScheduleCommandModel());
|
||||
setErrors({});
|
||||
setEditingRaceId(null);
|
||||
router.refresh();
|
||||
} else {
|
||||
@@ -117,9 +117,12 @@ export function LeagueAdminSchedulePageClient() {
|
||||
if (!race) return;
|
||||
|
||||
setEditingRaceId(raceId);
|
||||
setTrack(race.track || '');
|
||||
setCar(race.car || '');
|
||||
setScheduledAtIso(race.scheduledAt.toISOString());
|
||||
setForm(new RaceScheduleCommandModel({
|
||||
track: race.track || '',
|
||||
car: race.car || '',
|
||||
scheduledAtIso: race.scheduledAt.toISOString(),
|
||||
}));
|
||||
setErrors({});
|
||||
};
|
||||
|
||||
const handleDelete = async (raceId: string) => {
|
||||
@@ -142,9 +145,8 @@ export function LeagueAdminSchedulePageClient() {
|
||||
|
||||
const handleCancelEdit = () => {
|
||||
setEditingRaceId(null);
|
||||
setTrack('');
|
||||
setCar('');
|
||||
setScheduledAtIso('');
|
||||
setForm(new RaceScheduleCommandModel());
|
||||
setErrors({});
|
||||
};
|
||||
|
||||
// Derived states
|
||||
@@ -198,16 +200,25 @@ export function LeagueAdminSchedulePageClient() {
|
||||
onEdit={handleEdit}
|
||||
onDelete={handleDelete}
|
||||
onCancelEdit={handleCancelEdit}
|
||||
track={track}
|
||||
car={car}
|
||||
scheduledAtIso={scheduledAtIso}
|
||||
track={form.track}
|
||||
car={form.car}
|
||||
scheduledAtIso={form.scheduledAtIso}
|
||||
editingRaceId={editingRaceId}
|
||||
isPublishing={isPublishing}
|
||||
isSaving={isSaving}
|
||||
isDeleting={deletingRaceId}
|
||||
setTrack={setTrack}
|
||||
setCar={setCar}
|
||||
setScheduledAtIso={setScheduledAtIso}
|
||||
setTrack={(val) => {
|
||||
form.track = val;
|
||||
setForm(new RaceScheduleCommandModel(form.toCommand()));
|
||||
}}
|
||||
setCar={(val) => {
|
||||
form.car = val;
|
||||
setForm(new RaceScheduleCommandModel(form.toCommand()));
|
||||
}}
|
||||
setScheduledAtIso={(val) => {
|
||||
form.scheduledAtIso = val;
|
||||
setForm(new RaceScheduleCommandModel(form.toCommand()));
|
||||
}}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -607,7 +607,7 @@ export function CreateLeagueWizard({ stepName, onStepChange }: CreateLeagueWizar
|
||||
Create a new league
|
||||
</Heading>
|
||||
<Text size="sm" color="text-gray-500" block>
|
||||
We'll also set up your first season in {steps.length} easy steps.
|
||||
We'll also set up your first season in {steps.length} easy steps.
|
||||
</Text>
|
||||
<Text size="xs" color="text-gray-500" block mt={1}>
|
||||
A league is your long-term brand. Each season is a block of races you can run again and again.
|
||||
|
||||
@@ -13,6 +13,7 @@ import { SponsorHero } from '@/components/sponsors/SponsorHero';
|
||||
import { SponsorWorkflowMockup } from '@/components/sponsors/SponsorWorkflowMockup';
|
||||
import { SponsorBenefitCard } from '@/components/sponsors/SponsorBenefitCard';
|
||||
import { siteConfig } from '@/lib/siteConfig';
|
||||
import { SponsorSignupCommandModel } from '@/lib/command-models/sponsors/SponsorSignupCommandModel';
|
||||
import {
|
||||
Building2,
|
||||
Mail,
|
||||
@@ -127,10 +128,8 @@ const PLATFORM_STATS = [
|
||||
export default function SponsorSignupPage() {
|
||||
const shouldReduceMotion = useReducedMotion();
|
||||
const [mode, setMode] = useState<'landing' | 'signup' | 'login'>('landing');
|
||||
const [form, setForm] = useState(() => new SponsorSignupCommandModel());
|
||||
const [formData, setFormData] = useState({
|
||||
companyName: '',
|
||||
contactEmail: '',
|
||||
websiteUrl: '',
|
||||
logoFile: null as File | null,
|
||||
password: '',
|
||||
confirmPassword: '',
|
||||
@@ -144,18 +143,9 @@ export default function SponsorSignupPage() {
|
||||
const handleSubmit = async (e: React.FormEvent) => {
|
||||
e.preventDefault();
|
||||
|
||||
const newErrors: Record<string, string> = {};
|
||||
const validationErrors = form.validate();
|
||||
const newErrors: Record<string, string> = { ...validationErrors };
|
||||
|
||||
if (!formData.companyName.trim()) {
|
||||
newErrors.companyName = 'Company name required';
|
||||
}
|
||||
|
||||
if (!formData.contactEmail.trim()) {
|
||||
newErrors.contactEmail = 'Contact email required';
|
||||
} else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(formData.contactEmail)) {
|
||||
newErrors.contactEmail = 'Invalid email format';
|
||||
}
|
||||
|
||||
if (mode === 'signup') {
|
||||
if (!formData.password.trim()) {
|
||||
newErrors.password = 'Password required';
|
||||
@@ -184,18 +174,19 @@ export default function SponsorSignupPage() {
|
||||
setSubmitting(true);
|
||||
|
||||
try {
|
||||
const command = form.toCommand();
|
||||
// Note: Business logic for auth should be moved to a mutation
|
||||
// This is a temporary implementation for contract compliance
|
||||
const response = await fetch('/api/auth/signup', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({
|
||||
email: formData.contactEmail,
|
||||
email: command.contactEmail,
|
||||
password: formData.password,
|
||||
displayName: formData.companyName,
|
||||
displayName: command.companyName,
|
||||
sponsorData: {
|
||||
companyName: formData.companyName,
|
||||
websiteUrl: formData.websiteUrl,
|
||||
companyName: command.companyName,
|
||||
websiteUrl: command.websiteUrl,
|
||||
interests: formData.interests,
|
||||
},
|
||||
}),
|
||||
@@ -210,7 +201,7 @@ export default function SponsorSignupPage() {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({
|
||||
email: formData.contactEmail,
|
||||
email: command.contactEmail,
|
||||
password: formData.password,
|
||||
}),
|
||||
});
|
||||
@@ -468,8 +459,11 @@ export default function SponsorSignupPage() {
|
||||
</Text>
|
||||
<Input
|
||||
type="email"
|
||||
value={formData.contactEmail}
|
||||
onChange={(e) => setFormData({ ...formData, contactEmail: e.target.value })}
|
||||
value={form.contactEmail}
|
||||
onChange={(e) => {
|
||||
form.contactEmail = e.target.value;
|
||||
setForm(new SponsorSignupCommandModel(form.toCommand()));
|
||||
}}
|
||||
placeholder="sponsor@company.com"
|
||||
variant={errors.contactEmail ? 'error' : 'default'}
|
||||
errorMessage={errors.contactEmail}
|
||||
@@ -566,8 +560,11 @@ export default function SponsorSignupPage() {
|
||||
</Text>
|
||||
<Input
|
||||
type="text"
|
||||
value={formData.companyName}
|
||||
onChange={(e) => setFormData({ ...formData, companyName: e.target.value })}
|
||||
value={form.companyName}
|
||||
onChange={(e) => {
|
||||
form.companyName = e.target.value;
|
||||
setForm(new SponsorSignupCommandModel(form.toCommand()));
|
||||
}}
|
||||
placeholder="Your company name"
|
||||
variant={errors.companyName ? 'error' : 'default'}
|
||||
errorMessage={errors.companyName}
|
||||
@@ -583,8 +580,11 @@ export default function SponsorSignupPage() {
|
||||
</Text>
|
||||
<Input
|
||||
type="email"
|
||||
value={formData.contactEmail}
|
||||
onChange={(e) => setFormData({ ...formData, contactEmail: e.target.value })}
|
||||
value={form.contactEmail}
|
||||
onChange={(e) => {
|
||||
form.contactEmail = e.target.value;
|
||||
setForm(new SponsorSignupCommandModel(form.toCommand()));
|
||||
}}
|
||||
placeholder="sponsor@company.com"
|
||||
variant={errors.contactEmail ? 'error' : 'default'}
|
||||
errorMessage={errors.contactEmail}
|
||||
@@ -600,9 +600,14 @@ export default function SponsorSignupPage() {
|
||||
</Text>
|
||||
<Input
|
||||
type="url"
|
||||
value={formData.websiteUrl}
|
||||
onChange={(e) => setFormData({ ...formData, websiteUrl: e.target.value })}
|
||||
value={form.websiteUrl}
|
||||
onChange={(e) => {
|
||||
form.websiteUrl = e.target.value;
|
||||
setForm(new SponsorSignupCommandModel(form.toCommand()));
|
||||
}}
|
||||
placeholder="https://company.com"
|
||||
variant={errors.websiteUrl ? 'error' : 'default'}
|
||||
errorMessage={errors.websiteUrl}
|
||||
/>
|
||||
</Box>
|
||||
</Box>
|
||||
@@ -782,4 +787,4 @@ export default function SponsorSignupPage() {
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -64,7 +64,7 @@ type LeagueWizardFormData = {
|
||||
raceTimeUtc?: string;
|
||||
};
|
||||
stewarding: {
|
||||
decisionMode: 'owner_only' | 'admin_vote' | 'steward_panel';
|
||||
decisionMode: 'owner_only' | 'admin_vote' | 'steward_panel' | 'admin_only' | 'single_steward' | 'committee_vote' | 'steward_vote';
|
||||
requiredVotes?: number;
|
||||
requireDefense: boolean;
|
||||
defenseTimeLimit: number;
|
||||
|
||||
@@ -0,0 +1,54 @@
|
||||
/**
|
||||
* RaceScheduleCommandModel
|
||||
*
|
||||
* UX-only model for managing race creation/editing state.
|
||||
*/
|
||||
|
||||
export interface RaceScheduleFormData {
|
||||
track: string;
|
||||
car: string;
|
||||
scheduledAtIso: string;
|
||||
}
|
||||
|
||||
export interface RaceScheduleValidationErrors {
|
||||
track?: string;
|
||||
car?: string;
|
||||
scheduledAtIso?: string;
|
||||
}
|
||||
|
||||
export class RaceScheduleCommandModel {
|
||||
private _track: string;
|
||||
private _car: string;
|
||||
private _scheduledAtIso: string;
|
||||
|
||||
constructor(initial: Partial<RaceScheduleFormData> = {}) {
|
||||
this._track = initial.track || '';
|
||||
this._car = initial.car || '';
|
||||
this._scheduledAtIso = initial.scheduledAtIso || '';
|
||||
}
|
||||
|
||||
get track(): string { return this._track; }
|
||||
set track(value: string) { this._track = value; }
|
||||
|
||||
get car(): string { return this._car; }
|
||||
set car(value: string) { this._car = value; }
|
||||
|
||||
get scheduledAtIso(): string { return this._scheduledAtIso; }
|
||||
set scheduledAtIso(value: string) { this._scheduledAtIso = value; }
|
||||
|
||||
validate(): RaceScheduleValidationErrors {
|
||||
const errors: RaceScheduleValidationErrors = {};
|
||||
if (!this._track.trim()) errors.track = 'Track is required';
|
||||
if (!this._car.trim()) errors.car = 'Car is required';
|
||||
if (!this._scheduledAtIso) errors.scheduledAtIso = 'Date and time are required';
|
||||
return errors;
|
||||
}
|
||||
|
||||
toCommand(): { track: string; car: string; scheduledAtIso: string } {
|
||||
return {
|
||||
track: this._track,
|
||||
car: this._car,
|
||||
scheduledAtIso: this._scheduledAtIso,
|
||||
};
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,67 @@
|
||||
/**
|
||||
* SponsorSignupCommandModel
|
||||
*
|
||||
* UX-only model for managing sponsor signup state.
|
||||
*/
|
||||
|
||||
export interface SponsorSignupFormData {
|
||||
companyName: string;
|
||||
contactEmail: string;
|
||||
websiteUrl?: string;
|
||||
industry?: string;
|
||||
}
|
||||
|
||||
export interface SponsorSignupValidationErrors {
|
||||
companyName?: string;
|
||||
contactEmail?: string;
|
||||
websiteUrl?: string;
|
||||
}
|
||||
|
||||
export class SponsorSignupCommandModel {
|
||||
private _companyName: string;
|
||||
private _contactEmail: string;
|
||||
private _websiteUrl: string;
|
||||
private _industry: string;
|
||||
|
||||
constructor(initial: Partial<SponsorSignupFormData> = {}) {
|
||||
this._companyName = initial.companyName || '';
|
||||
this._contactEmail = initial.contactEmail || '';
|
||||
this._websiteUrl = initial.websiteUrl || '';
|
||||
this._industry = initial.industry || '';
|
||||
}
|
||||
|
||||
get companyName(): string { return this._companyName; }
|
||||
set companyName(value: string) { this._companyName = value; }
|
||||
|
||||
get contactEmail(): string { return this._contactEmail; }
|
||||
set contactEmail(value: string) { this._contactEmail = value; }
|
||||
|
||||
get websiteUrl(): string { return this._websiteUrl; }
|
||||
set websiteUrl(value: string) { this._websiteUrl = value; }
|
||||
|
||||
get industry(): string { return this._industry; }
|
||||
set industry(value: string) { this._industry = value; }
|
||||
|
||||
validate(): SponsorSignupValidationErrors {
|
||||
const errors: SponsorSignupValidationErrors = {};
|
||||
if (!this._companyName.trim()) errors.companyName = 'Company name is required';
|
||||
if (!this._contactEmail.trim()) {
|
||||
errors.contactEmail = 'Contact email is required';
|
||||
} else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(this._contactEmail)) {
|
||||
errors.contactEmail = 'Invalid email format';
|
||||
}
|
||||
if (this._websiteUrl && !this._websiteUrl.startsWith('http')) {
|
||||
errors.websiteUrl = 'Website URL must start with http:// or https://';
|
||||
}
|
||||
return errors;
|
||||
}
|
||||
|
||||
toCommand(): SponsorSignupFormData {
|
||||
return {
|
||||
companyName: this._companyName,
|
||||
contactEmail: this._contactEmail,
|
||||
websiteUrl: this._websiteUrl,
|
||||
industry: this._industry,
|
||||
};
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user