2025-04-29 17:48:11 +03:00

44 lines
1.1 KiB
TypeScript

'use client';
import {
BackButton,
ClientsGrid,
DateTimeSelect,
MastersGrid,
ServiceSelect,
SubmitButton,
} from './components';
import { useProfileQuery } from '@/hooks/profile';
import { useOrderStore } from '@/stores/order';
import { type JSX, useEffect } from 'react';
const STEP_COMPONENTS: Record<string, JSX.Element> = {
'client-select': <ClientsGrid />,
'datetime-select': <DateTimeSelect />,
'master-select': <MastersGrid />,
'service-select': <ServiceSelect />,
};
export function OrderForm() {
const { data: customer } = useProfileQuery();
const step = useOrderStore((store) => store.step);
const initStepSequence = useOrderStore((store) => store.initStepSequence);
useEffect(() => {
initStepSequence(customer?.role);
}, [customer?.role, initStepSequence]);
return (
<div className="space-y-4 [&>*]:px-4">
{getStepComponent(step)}
<div className="space-y-2">
<SubmitButton />
<BackButton />
</div>
</div>
);
}
function getStepComponent(step: string) {
return STEP_COMPONENTS[step] ?? null;
}