diff --git a/apps/web/components/orders/order-form/datetime-select.tsx b/apps/web/components/orders/order-form/datetime-select.tsx index dba3763..aa4ddbd 100644 --- a/apps/web/components/orders/order-form/datetime-select.tsx +++ b/apps/web/components/orders/order-form/datetime-select.tsx @@ -14,7 +14,7 @@ export function DateSelect() { const setTime = useOrderStore((store) => store.setTime); const setSlot = useOrderStore((store) => store.setSlotId); const masterId = useOrderStore((store) => store.masterId); - const serviceId = useOrderStore((store) => store.serviceId); + const serviceIds = useOrderStore((store) => store.serviceIds); useEffect(() => { if (!selectedDate) { @@ -28,7 +28,7 @@ export function DateSelect() { { filters: { datetime_start: { - gte: dayjs(selectedMonthDate).startOf('month').startOf('day').toISOString(), + gte: dayjs().startOf('day').toISOString(), lte: dayjs(selectedMonthDate).endOf('month').endOf('day').toISOString(), }, master: { @@ -39,11 +39,7 @@ export function DateSelect() { }, }, { - service: { - documentId: { - eq: serviceId, - }, - }, + services: serviceIds, }, ); @@ -80,7 +76,7 @@ export function DateTimeSelect() { export function TimeSelect() { const masterId = useOrderStore((store) => store.masterId); const date = useOrderStore((store) => store.date); - const serviceId = useOrderStore((store) => store.serviceId); + const serviceIds = useOrderStore((store) => store.serviceIds); const { data: { times } = {}, isLoading } = useAvailableTimeSlotsQuery( { @@ -97,11 +93,7 @@ export function TimeSelect() { }, }, { - service: { - documentId: { - eq: serviceId, - }, - }, + services: serviceIds, }, ); diff --git a/apps/web/components/orders/order-form/index.tsx b/apps/web/components/orders/order-form/index.tsx index 6bc7bbe..68ed8b3 100644 --- a/apps/web/components/orders/order-form/index.tsx +++ b/apps/web/components/orders/order-form/index.tsx @@ -5,7 +5,7 @@ import { ClientsGrid, MastersGrid } from './contacts-grid'; import { DateTimeSelect } from './datetime-select'; import { NextButton } from './next-button'; import { ErrorPage, SuccessPage } from './result'; -import { ServiceSelect } from './service-select'; +import { ServicesSelect } from './services-select'; import { SubmitButton } from './submit-button'; import { useGetUrlData } from '@/hooks/url'; import { OrderStoreProvider, useInitOrderStore, useOrderStore } from '@/stores/order'; @@ -19,7 +19,7 @@ const STEP_COMPONENTS: Record = { 'datetime-select': , error: , 'master-select': , - 'service-select': , + 'service-select': , success: , }; diff --git a/apps/web/components/orders/order-form/next-button.tsx b/apps/web/components/orders/order-form/next-button.tsx index 53bec02..324b905 100644 --- a/apps/web/components/orders/order-form/next-button.tsx +++ b/apps/web/components/orders/order-form/next-button.tsx @@ -4,14 +4,14 @@ import { useOrderStore } from '@/stores/order'; import { Button } from '@repo/ui/components/ui/button'; export function NextButton() { - const { clientId, date, masterId, nextStep, serviceId, step, time } = useOrderStore( + const { clientId, date, masterId, nextStep, serviceIds, step, time } = useOrderStore( (store) => store, ); const isDisabled = (step === 'master-select' && !masterId) || (step === 'client-select' && !clientId) || - (step === 'service-select' && !serviceId) || + (step === 'service-select' && !serviceIds.length) || (step === 'datetime-select' && (!date || !time)); return ( diff --git a/apps/web/components/orders/order-form/service-select.tsx b/apps/web/components/orders/order-form/services-select.tsx similarity index 71% rename from apps/web/components/orders/order-form/service-select.tsx rename to apps/web/components/orders/order-form/services-select.tsx index eb1e45d..853e5c4 100644 --- a/apps/web/components/orders/order-form/service-select.tsx +++ b/apps/web/components/orders/order-form/services-select.tsx @@ -1,3 +1,4 @@ +/* eslint-disable consistent-return */ 'use client'; import { DataNotFound } from '@/components/shared/alert'; @@ -7,7 +8,7 @@ import { useOrderStore } from '@/stores/order'; import { type ServiceFieldsFragment } from '@repo/graphql/types'; import { cn } from '@repo/ui/lib/utils'; -export function ServiceSelect() { +export function ServicesSelect() { const masterId = useOrderStore((store) => store.masterId); const { data: { services } = {} } = useServicesQuery({ @@ -35,14 +36,19 @@ export function ServiceSelect() { } function ServiceCardRadio({ documentId, ...props }: Readonly) { - const serviceId = useOrderStore((store) => store.serviceId); - const setServiceId = useOrderStore((store) => store.setServiceId); + const serviceIds = useOrderStore((store) => store.serviceIds); + const addServiceId = useOrderStore((store) => store.addServiceId); + const removeServiceId = useOrderStore((store) => store.removeServiceId); - const selected = serviceId === documentId; + const selected = serviceIds.includes(documentId); - function handleOnSelect() { - setServiceId(documentId); - } + const handleOnSelect = () => { + if (selected) { + return removeServiceId(documentId); + } else { + addServiceId(documentId); + } + }; return (