106fdc0da5
- Removed unnecessary data fetching and hydration logic from the main profile page. - Updated the rendering of components to improve clarity and performance. - Enhanced loading states in various profile components for better user experience. - Refactored service list handling to utilize telegramId instead of masterId for consistency.
75 lines
2.4 KiB
TypeScript
75 lines
2.4 KiB
TypeScript
'use client';
|
||
|
||
import { type ProfileProps } from '../types';
|
||
import { DataNotFound } from '@/components/shared/alert';
|
||
import { ServiceCard } from '@/components/shared/service-card';
|
||
import { useCustomerQuery } from '@/hooks/api/customers';
|
||
import { useServicesQuery } from '@/hooks/api/services';
|
||
import { LoadingSpinner } from '@repo/ui/components/ui/spinner';
|
||
import Link from 'next/link';
|
||
|
||
// Компонент для отображения услуг мастера (без ссылок, только просмотр)
|
||
export function ReadonlyServicesList({ telegramId }: Readonly<ProfileProps>) {
|
||
const { isLoading, services } = useServices(telegramId);
|
||
|
||
return (
|
||
<div className="space-y-2 px-4">
|
||
<h1 className="font-bold">Услуги</h1>
|
||
{isLoading && <LoadingSpinner />}
|
||
{!isLoading && !services?.length ? <DataNotFound title="Услуги не найдены" /> : null}
|
||
{services?.map(
|
||
(service) =>
|
||
service?.active && (
|
||
<div key={service.documentId}>
|
||
<ServiceCard {...service} />
|
||
</div>
|
||
),
|
||
)}
|
||
</div>
|
||
);
|
||
}
|
||
|
||
// Компонент для отображения услуг текущего пользователя (с ссылками)
|
||
export function ServicesList() {
|
||
const { isLoading, services } = useServices();
|
||
|
||
return (
|
||
<div className="space-y-2 px-4">
|
||
{isLoading && <LoadingSpinner />}
|
||
{!isLoading && !services?.length ? <DataNotFound title="Услуги не найдены" /> : null}
|
||
{services?.map(
|
||
(service) =>
|
||
service && (
|
||
<div key={service.documentId}>
|
||
<Link href={`/profile/services/${service.documentId}`}>
|
||
<ServiceCard key={service.documentId} {...service} />
|
||
</Link>
|
||
</div>
|
||
),
|
||
)}
|
||
</div>
|
||
);
|
||
}
|
||
|
||
function useServices(telegramId?: Readonly<ProfileProps>['telegramId']) {
|
||
const { data: { customer } = {}, isLoading: isLoadingCustomer } = useCustomerQuery();
|
||
|
||
// Используем переданный masterId или текущего пользователя
|
||
const targetTelegramId = telegramId || customer?.telegramId;
|
||
|
||
const { data: { services } = {}, isLoading: isLoadingServices } = useServicesQuery({
|
||
filters: {
|
||
master: {
|
||
telegramId: {
|
||
eq: targetTelegramId,
|
||
},
|
||
},
|
||
},
|
||
});
|
||
|
||
return {
|
||
isLoading: isLoadingCustomer || isLoadingServices,
|
||
services,
|
||
};
|
||
}
|