From c91a188761b3c6c2deef9ddc187c4c1b9a72f802 Mon Sep 17 00:00:00 2001 From: vchikalkin Date: Fri, 16 May 2025 19:30:01 +0300 Subject: [PATCH] typo refactor hooks --- .../components/time-select.tsx | 4 +-- .../components/schedule/day-slot-add-form.tsx | 5 +--- .../components/schedule/day-slots-list.tsx | 6 +++-- apps/web/hooks/api/customers.ts | 4 +-- apps/web/hooks/api/slots.ts | 25 +++++++++++-------- 5 files changed, 23 insertions(+), 21 deletions(-) diff --git a/apps/web/components/orders/components/datetime-select/components/time-select.tsx b/apps/web/components/orders/components/datetime-select/components/time-select.tsx index 034b005..d34b859 100644 --- a/apps/web/components/orders/components/datetime-select/components/time-select.tsx +++ b/apps/web/components/orders/components/datetime-select/components/time-select.tsx @@ -1,6 +1,6 @@ /* eslint-disable canonical/id-match */ 'use client'; -import { useSlots } from '@/hooks/api/slots'; +import { useSlotsQuery } from '@/hooks/api/slots'; import { useOrderStore } from '@/stores/order'; import { Enum_Slot_State, type SlotFieldsFragment } from '@repo/graphql/types'; import { Button } from '@repo/ui/components/ui/button'; @@ -25,7 +25,7 @@ const generateTimeSlots = (slots: SlotFieldsFragment[]): Array<{ slotId: string; export function TimeSelect() { const masterId = useOrderStore((store) => store.masterId); const date = useOrderStore((store) => store.date); - const { data: { slots } = {} } = useSlots({ + const { data: { slots } = {} } = useSlotsQuery({ filters: { date: { eq: date, diff --git a/apps/web/components/schedule/day-slot-add-form.tsx b/apps/web/components/schedule/day-slot-add-form.tsx index df5b64e..82d421a 100644 --- a/apps/web/components/schedule/day-slot-add-form.tsx +++ b/apps/web/components/schedule/day-slot-add-form.tsx @@ -2,7 +2,6 @@ 'use client'; import { EditableTimeRangeForm } from './components/time-range'; import { ScheduleTimeContext, ScheduleTimeContextProvider } from './context'; -import { ScheduleContext } from '@/context/schedule'; import { useSlotCreate } from '@/hooks/api/slots'; import { withContext } from '@/utils/context'; import { Enum_Slot_State } from '@repo/graphql/types'; @@ -13,9 +12,7 @@ import { type FormEvent, use } from 'react'; export const DaySlotAddForm = withContext(ScheduleTimeContextProvider)(function () { const { endTime, resetTime, startTime } = use(ScheduleTimeContext); - const { selectedDate } = use(ScheduleContext); - - const { isPending, mutate: addSlot } = useSlotCreate({ date: selectedDate }); + const { isPending, mutate: addSlot } = useSlotCreate(); const handleSubmit = (event: FormEvent) => { event.preventDefault(); diff --git a/apps/web/components/schedule/day-slots-list.tsx b/apps/web/components/schedule/day-slots-list.tsx index 3f87ff7..a066280 100644 --- a/apps/web/components/schedule/day-slots-list.tsx +++ b/apps/web/components/schedule/day-slots-list.tsx @@ -3,12 +3,14 @@ import { SlotCard } from './components/slot-card'; import { DaySlotAddForm } from './day-slot-add-form'; import { LoadingSpinner } from '@/components/common/spinner'; import { ScheduleContext } from '@/context/schedule'; -import { useSlots } from '@/hooks/api/slots'; +import { useSlotsQuery } from '@/hooks/api/slots'; import { use } from 'react'; export function DaySlotsList() { const { selectedDate } = use(ScheduleContext); - const { data: { slots } = {}, isLoading } = useSlots({ filters: { date: { eq: selectedDate } } }); + const { data: { slots } = {}, isLoading } = useSlotsQuery({ + filters: { date: { eq: selectedDate } }, + }); if (isLoading) return ; diff --git a/apps/web/hooks/api/customers.ts b/apps/web/hooks/api/customers.ts index 5c69a04..6c97848 100644 --- a/apps/web/hooks/api/customers.ts +++ b/apps/web/hooks/api/customers.ts @@ -3,9 +3,9 @@ import { getCustomer, updateCustomer } from '@/actions/api/customers'; import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'; import { useSession } from 'next-auth/react'; -export const useCustomerQuery = (props?: Parameters[0]) => { +export const useCustomerQuery = (variables?: Parameters[0]) => { const { data: session } = useSession(); - const telegramId = props?.telegramId || session?.user?.telegramId; + const telegramId = variables?.telegramId || session?.user?.telegramId; return useQuery({ enabled: Boolean(telegramId), diff --git a/apps/web/hooks/api/slots.ts b/apps/web/hooks/api/slots.ts index 664b120..a216db6 100644 --- a/apps/web/hooks/api/slots.ts +++ b/apps/web/hooks/api/slots.ts @@ -3,7 +3,7 @@ import { useCustomerQuery } from './customers'; import { createSlot, deleteSlot, getSlot, getSlots, updateSlot } from '@/actions/api/slots'; import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'; -export const useSlots = (variables: Parameters[0]) => { +export const useSlotsQuery = (variables: Parameters[0]) => { const { data: { customer } = {} } = useCustomerQuery(); const masterId = variables.filters?.master?.documentId?.eq || customer?.documentId; @@ -41,23 +41,22 @@ export const useSlotMutation = ({ }); }; -export const useSlotCreate = ({ date }: { date: Date }) => { +export const useSlotCreate = () => { const { data: { customer } = {} } = useCustomerQuery(); const masterId = customer?.documentId; const queryClient = useQueryClient(); return useMutation({ - mutationFn: ({ input }: { input: Omit[0]['input'], 'date'> }) => - createSlot({ input: { ...input, date } }), + mutationFn: createSlot, mutationKey: ['slot', 'create'], - onSuccess: () => { - if (masterId && date) { - queryClient.invalidateQueries({ - queryKey: ['slots', { date: date?.toISOString(), masterId }], - }); - } - }, + onSuccess: masterId + ? (data) => { + queryClient.invalidateQueries({ + queryKey: ['slots', { date: data?.createSlot?.date?.toISOString(), masterId }], + }); + } + : undefined, }); }; @@ -77,6 +76,10 @@ export const useSlotDelete = ({ documentId }: Parameters[0]) queryClient.invalidateQueries({ queryKey: ['slots', { date: date?.toISOString(), masterId }], }); + + queryClient.invalidateQueries({ + queryKey: ['slot', documentId], + }); } }, });