- Removed obsolete onboarding routes: complete, create-complex, index, verify-email, and verify. - Introduced new setup stepper page for onboarding process. - Created a multi-step setup component to handle complex creation with validation. - Added new schemas for complex creation and plan features. - Implemented detailed steps for complex name, location, plan selection, and court setup. - Enhanced error handling and user feedback during the onboarding process.
33 lines
1017 B
TypeScript
33 lines
1017 B
TypeScript
import { Field, FieldError, FieldLabel } from '@/components/ui/field';
|
|
import { Input } from '@/components/ui/input';
|
|
import type { UseFormReturn } from 'react-hook-form';
|
|
|
|
type ComplexNameStepProps = {
|
|
form: UseFormReturn<any>;
|
|
};
|
|
|
|
export function ComplexNameStep({ form }: ComplexNameStepProps) {
|
|
const errors = form.formState.errors;
|
|
|
|
return (
|
|
<div className="space-y-4">
|
|
<div>
|
|
<h2 className="text-lg font-semibold">Nombre del complejo</h2>
|
|
<p className="text-sm text-muted-foreground">¿Cómo se va a llamar tu complejo?</p>
|
|
</div>
|
|
|
|
<Field data-invalid={Boolean(errors.complexName)}>
|
|
<FieldLabel htmlFor="complex-name">Nombre del complejo</FieldLabel>
|
|
<Input
|
|
id="complex-name"
|
|
type="text"
|
|
placeholder="Ej: Complejo Las Palmeras"
|
|
aria-invalid={Boolean(errors.complexName)}
|
|
{...form.register('complexName')}
|
|
/>
|
|
<FieldError errors={[errors.complexName]} />
|
|
</Field>
|
|
</div>
|
|
);
|
|
}
|