From fead5353e7420ab9ab122c8f7cebb8d767f9d6a7 Mon Sep 17 00:00:00 2001 From: vchikalkin Date: Thu, 26 Jun 2025 13:23:03 +0300 Subject: [PATCH] create useIsMaster hook to prevent duplication --- apps/web/components/orders/order-buttons.tsx | 8 +++----- .../components/orders/orders-list/date-select.tsx | 6 ++---- apps/web/components/orders/orders-list/index.tsx | 6 ++---- apps/web/components/profile/links-card/index.tsx | 11 +++-------- apps/web/components/profile/orders-list.tsx | 6 ++---- apps/web/hooks/api/customers.ts | 9 +++++++++ apps/web/package.json | 2 +- apps/web/stores/order/hooks.tsx | 15 ++++++--------- packages/utils/package.json | 3 ++- packages/utils/src/customer.ts | 5 +++++ pnpm-lock.yaml | 6 +++--- 11 files changed, 38 insertions(+), 39 deletions(-) create mode 100644 packages/utils/src/customer.ts diff --git a/apps/web/components/orders/order-buttons.tsx b/apps/web/components/orders/order-buttons.tsx index 4e332fe..4ed46d3 100644 --- a/apps/web/components/orders/order-buttons.tsx +++ b/apps/web/components/orders/order-buttons.tsx @@ -2,14 +2,12 @@ 'use client'; import FloatingActionPanel from '../shared/action-panel'; import { type OrderComponentProps } from './types'; -import { useCustomerQuery } from '@/hooks/api/customers'; +import { useIsMaster } from '@/hooks/api/customers'; import { useOrderMutation, useOrderQuery } from '@/hooks/api/orders'; -import { Enum_Customer_Role, Enum_Order_State } from '@repo/graphql/types'; +import { Enum_Order_State } from '@repo/graphql/types'; export function OrderButtons({ documentId }: Readonly) { - const { data: { customer } = {} } = useCustomerQuery(); - - const isMaster = customer?.role === Enum_Customer_Role.Master; + const isMaster = useIsMaster(); const { data: { order } = {} } = useOrderQuery({ documentId }); diff --git a/apps/web/components/orders/orders-list/date-select.tsx b/apps/web/components/orders/orders-list/date-select.tsx index f0bfa0b..8fed90e 100644 --- a/apps/web/components/orders/orders-list/date-select.tsx +++ b/apps/web/components/orders/orders-list/date-select.tsx @@ -1,10 +1,8 @@ -/* eslint-disable canonical/id-match */ 'use client'; -import { useCustomerQuery } from '@/hooks/api/customers'; +import { useCustomerQuery, useIsMaster } from '@/hooks/api/customers'; import { useOrdersQuery } from '@/hooks/api/orders'; import { useDateTimeStore } from '@/stores/datetime'; -import { Enum_Customer_Role } from '@repo/graphql/types'; import { HorizontalCalendar } from '@repo/ui/components/ui/horizontal-calendar'; import dayjs from 'dayjs'; import { useState } from 'react'; @@ -12,7 +10,7 @@ import { useState } from 'react'; export function DateSelect() { const { data: { customer } = {} } = useCustomerQuery(); - const isMaster = customer?.role === Enum_Customer_Role.Master; + const isMaster = useIsMaster(); const [currentMonthDate, setCurrentMonthDate] = useState(new Date()); diff --git a/apps/web/components/orders/orders-list/index.tsx b/apps/web/components/orders/orders-list/index.tsx index 9f9d2c9..1285f6f 100644 --- a/apps/web/components/orders/orders-list/index.tsx +++ b/apps/web/components/orders/orders-list/index.tsx @@ -1,17 +1,15 @@ -/* eslint-disable canonical/id-match */ 'use client'; import { OrderCard } from '@/components/shared/order-card'; -import { useCustomerQuery } from '@/hooks/api/customers'; +import { useCustomerQuery, useIsMaster } from '@/hooks/api/customers'; import { useOrdersQuery } from '@/hooks/api/orders'; import { useDateTimeStore } from '@/stores/datetime'; -import { Enum_Customer_Role } from '@repo/graphql/types'; import { formatDate } from '@repo/utils/datetime-format'; export function ClientsOrdersList() { const { data: { customer } = {} } = useCustomerQuery(); - const isMaster = customer?.role === Enum_Customer_Role.Master; + const isMaster = useIsMaster(); const selectedDate = useDateTimeStore((store) => store.date); diff --git a/apps/web/components/profile/links-card/index.tsx b/apps/web/components/profile/links-card/index.tsx index b938d54..e2088bf 100644 --- a/apps/web/components/profile/links-card/index.tsx +++ b/apps/web/components/profile/links-card/index.tsx @@ -1,15 +1,10 @@ -/* eslint-disable canonical/id-match */ 'use client'; -import { type ProfileProps } from '../types'; import { LinkButton } from './link-button'; -import { useCustomerQuery } from '@/hooks/api/customers'; -import { Enum_Customer_Role } from '@repo/graphql/types'; +import { useIsMaster } from '@/hooks/api/customers'; -export function LinksCard({ telegramId }: Readonly) { - const { data: { customer } = {} } = useCustomerQuery({ telegramId }); - - const isMaster = customer?.role === Enum_Customer_Role.Master; +export function LinksCard() { + const isMaster = useIsMaster(); return (
diff --git a/apps/web/components/profile/orders-list.tsx b/apps/web/components/profile/orders-list.tsx index 1766971..e0e180b 100644 --- a/apps/web/components/profile/orders-list.tsx +++ b/apps/web/components/profile/orders-list.tsx @@ -1,15 +1,13 @@ -/* eslint-disable canonical/id-match */ 'use client'; import { OrderCard } from '../shared/order-card'; import { type ProfileProps } from './types'; -import { useCustomerQuery } from '@/hooks/api/customers'; +import { useCustomerQuery, useIsMaster } from '@/hooks/api/customers'; import { useOrdersQuery } from '@/hooks/api/orders'; -import { Enum_Customer_Role } from '@repo/graphql/types'; export function ProfileOrdersList({ telegramId }: Readonly) { const { data: { customer } = {} } = useCustomerQuery(); - const isMaster = customer?.role === Enum_Customer_Role.Master; + const isMaster = useIsMaster(); const { data: { customer: profile } = {} } = useCustomerQuery({ telegramId }); diff --git a/apps/web/hooks/api/customers.ts b/apps/web/hooks/api/customers.ts index 32f3b3f..afb12ac 100644 --- a/apps/web/hooks/api/customers.ts +++ b/apps/web/hooks/api/customers.ts @@ -1,6 +1,7 @@ 'use client'; import { getCustomer, updateCustomer } from '@/actions/api/customers'; +import { isCustomerMaster } from '@repo/utils/customer'; import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'; import { useSession } from 'next-auth/react'; @@ -15,6 +16,14 @@ export const useCustomerQuery = (variables?: Parameters[0]) }); }; +export const useIsMaster = () => { + const { data: { customer } = {} } = useCustomerQuery(); + + if (!customer) return false; + + return isCustomerMaster(customer); +}; + export const useCustomerMutation = () => { const { data: session } = useSession(); const telegramId = session?.user?.telegramId; diff --git a/apps/web/package.json b/apps/web/package.json index b008e96..8aa9d47 100644 --- a/apps/web/package.json +++ b/apps/web/package.json @@ -14,6 +14,7 @@ "test:e2e": "playwright test" }, "dependencies": { + "@repo/graphql": "workspace:*", "@repo/ui": "workspace:*", "@repo/utils": "workspace:", "@tanstack/react-query": "^5.64.1", @@ -35,7 +36,6 @@ "devDependencies": { "@playwright/test": "^1.49.1", "@repo/eslint-config": "workspace:*", - "@repo/graphql": "workspace:*", "@repo/lint-staged-config": "workspace:*", "@repo/typescript-config": "workspace:*", "@testing-library/react": "^16.1.0", diff --git a/apps/web/stores/order/hooks.tsx b/apps/web/stores/order/hooks.tsx index b64c07d..3e40a6d 100644 --- a/apps/web/stores/order/hooks.tsx +++ b/apps/web/stores/order/hooks.tsx @@ -1,9 +1,7 @@ -/* eslint-disable canonical/id-match */ 'use client'; import { useOrderStore } from './context'; import { type Steps } from './types'; -import { useCustomerQuery } from '@/hooks/api/customers'; -import { Enum_Customer_Role } from '@repo/graphql/types'; +import { useCustomerQuery, useIsMaster } from '@/hooks/api/customers'; import { useEffect } from 'react'; const STEPS: Steps[] = [ @@ -23,22 +21,21 @@ export function useInitOrderStore() { const setClientId = useOrderStore((store) => store.setClientId); const setStep = useOrderStore((store) => store.setStep); const setStepsSequence = useOrderStore((store) => store._setStepSequence); + const isMaster = useIsMaster(); useEffect(() => { - const role = customer?.role; - - if (role === Enum_Customer_Role.Master && customer) { + if (isMaster && customer) { setMasterId(customer?.documentId); } - if (role === Enum_Customer_Role.Client && customer) { + if (!isMaster && customer) { setClientId(customer?.documentId); } - const steps = role === Enum_Customer_Role.Master ? MASTER_STEPS : CLIENT_STEPS; + const steps = isMaster ? MASTER_STEPS : CLIENT_STEPS; const initialStep = steps[0] as Steps; setStepsSequence(steps); setStep(initialStep); - }, [customer, setClientId, setMasterId, setStep, setStepsSequence]); + }, [customer, isMaster, setClientId, setMasterId, setStep, setStepsSequence]); } diff --git a/packages/utils/package.json b/packages/utils/package.json index 9c2a5b7..d6b3729 100644 --- a/packages/utils/package.json +++ b/packages/utils/package.json @@ -7,7 +7,8 @@ "test:unit": "vitest" }, "exports": { - "./datetime-format": "./src/datetime-format.ts" + "./datetime-format": "./src/datetime-format.ts", + "./customer": "./src/customer.ts" }, "dependencies": { "dayjs": "catalog:", diff --git a/packages/utils/src/customer.ts b/packages/utils/src/customer.ts new file mode 100644 index 0000000..2b1686d --- /dev/null +++ b/packages/utils/src/customer.ts @@ -0,0 +1,5 @@ +import * as GQL from '../../graphql/types'; + +export function isCustomerMaster(customer: GQL.CustomerFieldsFragment) { + return customer?.role === GQL.Enum_Customer_Role.Master; +} diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 14a8d1e..79e8422 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -144,6 +144,9 @@ importers: apps/web: dependencies: + '@repo/graphql': + specifier: workspace:* + version: link:../../packages/graphql '@repo/ui': specifier: workspace:* version: link:../../packages/ui @@ -202,9 +205,6 @@ importers: '@repo/eslint-config': specifier: workspace:* version: link:../../packages/eslint-config - '@repo/graphql': - specifier: workspace:* - version: link:../../packages/graphql '@repo/lint-staged-config': specifier: workspace:* version: link:../../packages/lint-staged-config