30 lines
874 B
TypeScript
30 lines
874 B
TypeScript
'use client';
|
||
import { type OrderComponentProps } from './types';
|
||
import { useOrderQuery } from '@/hooks/api/orders';
|
||
import { type ServiceFieldsFragment } from '@repo/graphql/types';
|
||
|
||
type ServiceCardProps = Pick<ServiceFieldsFragment, 'name'>;
|
||
|
||
export function OrderServices({ documentId }: Readonly<OrderComponentProps>) {
|
||
const { data: { order } = {} } = useOrderQuery({ documentId });
|
||
|
||
if (!order) return null;
|
||
|
||
return (
|
||
<div className="flex flex-col space-y-2">
|
||
<h1 className="font-bold">Услуги</h1>
|
||
{order.services?.map(
|
||
(service) => service && <ServiceCard key={service.documentId} {...service} />,
|
||
)}
|
||
</div>
|
||
);
|
||
}
|
||
|
||
function ServiceCard({ name }: Readonly<ServiceCardProps>) {
|
||
return (
|
||
<div className="flex items-center justify-between rounded-2xl border-2 bg-background p-4 px-6">
|
||
{name}
|
||
</div>
|
||
);
|
||
}
|