refactor(contacts): update grid components and improve customer role handling

- Renamed InvitedByGrid to MastersGrid and InvitedGrid to ClientsGrid for clarity.
- Enhanced customer role checks by using documentId for identifying the current user.
- Updated the contacts passed to grid components to reflect the new naming and role structure.
- Adjusted titles in grid components for better user experience.

apps/web/components/orders/order-form/contacts-grid.tsx

@@ -1,13 +1,15 @@
+/* eslint-disable canonical/id-match */
 'use client';
 
 import { CardSectionHeader } from '@/components/ui';
 import { ContactsContextProvider } from '@/context/contacts';
 import { useCustomerContacts } from '@/hooks/api/contacts';
+import { useCustomerQuery } from '@/hooks/api/customers';
 // eslint-disable-next-line import/extensions
 import AvatarPlaceholder from '@/public/avatar/avatar_placeholder.png';
 import { useOrderStore } from '@/stores/order';
 import { withContext } from '@/utils/context';
-import { type CustomerFieldsFragment } from '@repo/graphql/types';
+import { type CustomerFieldsFragment, Enum_Customer_Role } from '@repo/graphql/types';
 import { Card } from '@repo/ui/components/ui/card';
 import { Label } from '@repo/ui/components/ui/label';
 import { LoadingSpinner } from '@repo/ui/components/ui/spinner';
@@ -23,6 +25,8 @@ type ContactsGridProps = {
 };
 
 export function ContactsGridBase({ contacts, onSelect, selected, title }: ContactsGridProps) {
+  const { data: { customer } = {} } = useCustomerQuery();
+
   return (
     <Card className="p-4">
       <div className="flex flex-col gap-4">
@@ -31,7 +35,7 @@ export function ContactsGridBase({ contacts, onSelect, selected, title }: Contac
           {contacts.map((contact) => {
             if (!contact) return null;
 
-            const isCurrentUser = contact?.name === 'Я';
+            const isCurrentUser = contact?.documentId === customer?.documentId;
 
             return (
               <Label
@@ -86,11 +90,14 @@ export function ContactsGridBase({ contacts, onSelect, selected, title }: Contac
   );
 }
 
-export const InvitedByGrid = withContext(ContactsContextProvider)(function () {
-  const { contacts, isLoading, setFilter } = useCustomerContacts();
+export const MastersGrid = withContext(ContactsContextProvider)(function () {
+  const { data: { customer } = {}, isLoading: isLoadingCustomer } = useCustomerQuery();
+  const { contacts, isLoading: isLoadingContacts, setFilter } = useCustomerContacts();
   const masterId = useOrderStore((store) => store.masterId);
   const setMasterId = useOrderStore((store) => store.setMasterId);
 
+  const isLoading = isLoadingContacts || isLoadingCustomer;
+
   useEffect(() => {
     setFilter('invitedBy');
   }, [setFilter]);
@@ -99,15 +106,17 @@ export const InvitedByGrid = withContext(ContactsContextProvider)(function () {
 
   return (
     <ContactsGridBase
-      contacts={contacts}
+      contacts={(customer ? [{ ...customer, name: 'Я' }] : []).concat(
+        contacts.filter((contact) => contact.role === Enum_Customer_Role.Master),
+      )}
       onSelect={(contactId) => setMasterId(contactId)}
       selected={masterId}
-      title="Кто пригласил"
+      title="Выбор мастера"
     />
   );
 });
 
-export const InvitedGrid = withContext(ContactsContextProvider)(function () {
+export const ClientsGrid = withContext(ContactsContextProvider)(function () {
   const { contacts, isLoading, setFilter } = useCustomerContacts();
   const clientId = useOrderStore((store) => store.clientId);
   const setClientId = useOrderStore((store) => store.setClientId);
@@ -123,7 +132,7 @@ export const InvitedGrid = withContext(ContactsContextProvider)(function () {
       contacts={contacts}
       onSelect={(contactId) => setClientId(contactId)}
       selected={clientId}
-      title="Приглашенные"
+      title="Выбор клиента"
     />
   );
 });

apps/web/components/orders/order-form/index.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { BackButton } from './back-button';
-import { InvitedByGrid, InvitedGrid } from './contacts-grid';
+import { ClientsGrid, MastersGrid } from './contacts-grid';
 import { DateTimeSelect } from './datetime-select';
 import { NextButton } from './next-button';
 import { ErrorPage, SuccessPage } from './result';
@@ -15,10 +15,10 @@ import { LoadingSpinner } from '@repo/ui/components/ui/spinner';
 import { type JSX } from 'react';
 
 const STEP_COMPONENTS: Record<string, JSX.Element> = {
-  'client-select': <InvitedGrid />,
+  'client-select': <ClientsGrid />,
   'datetime-select': <DateTimeSelect />,
   error: <ErrorPage />,
-  'master-select': <InvitedByGrid />,
+  'master-select': <MastersGrid />,
   'service-select': <ServicesSelect />,
   success: <SuccessPage />,
 };