- Converted several async components to synchronous functions, including `Layout`, `AddOrdersPage`, `ProfilePage`, `SlotPage`, and `ServicePage`, enhancing rendering efficiency. - Removed unnecessary prefetching logic and hydration boundaries, simplifying component structure and improving maintainability. - Updated the `TelegramProvider` to return null during the initial mount instead of a loading message, streamlining the loading state handling. - Enhanced loading state management in order-related components by adding loading spinners and data not found alerts, improving user experience during data fetching.
23 lines
850 B
TypeScript
23 lines
850 B
TypeScript
'use client';
|
||
|
||
import { DataNotFound } from '../shared/alert';
|
||
import { ServiceCard } from '../shared/service-card';
|
||
import { type OrderComponentProps } from './types';
|
||
import { useOrderQuery } from '@/hooks/api/orders';
|
||
import { LoadingSpinner } from '@repo/ui/components/ui/spinner';
|
||
|
||
export function OrderServices({ documentId }: Readonly<OrderComponentProps>) {
|
||
const { data: { order } = {}, isLoading } = useOrderQuery({ documentId });
|
||
|
||
return (
|
||
<div className="flex flex-col space-y-2">
|
||
<h1 className="font-bold">Услуги</h1>
|
||
{isLoading && <LoadingSpinner />}
|
||
{!isLoading && !order?.services?.length ? <DataNotFound title="Услуги не найдены" /> : null}
|
||
{order?.services?.map(
|
||
(service) => service && <ServiceCard key={service.documentId} {...service} />,
|
||
)}
|
||
</div>
|
||
);
|
||
}
|