3589ab974a
* refactor components/navigation * refactor components/orders * refactor components/profile * refactor components/schedule * remove components/common/spinner
31 lines
1018 B
TypeScript
31 lines
1018 B
TypeScript
'use client';
|
|
|
|
import { type ProfileProps } from './types';
|
|
import { useCustomerQuery } from '@/hooks/api/customers';
|
|
import { Avatar, AvatarFallback, AvatarImage } from '@repo/ui/components/ui/avatar';
|
|
import { Card } from '@repo/ui/components/ui/card';
|
|
import { LoadingSpinner } from '@repo/ui/components/ui/spinner';
|
|
|
|
export function PersonCard({ telegramId }: Readonly<ProfileProps>) {
|
|
const { data: { customer } = {}, isLoading } = useCustomerQuery({ telegramId });
|
|
|
|
if (isLoading || !customer)
|
|
return (
|
|
<div className="p-4">
|
|
<LoadingSpinner />
|
|
</div>
|
|
);
|
|
|
|
return (
|
|
<Card className="bg-transparent p-4 shadow-none">
|
|
<div className="flex flex-col items-center space-y-2">
|
|
<Avatar className="size-20">
|
|
<AvatarImage alt={customer?.name} src={customer.photoUrl || ''} />
|
|
<AvatarFallback>{customer?.name.charAt(0)}</AvatarFallback>
|
|
</Avatar>
|
|
<h2 className="text-2xl font-bold">{customer?.name}</h2>
|
|
</div>
|
|
</Card>
|
|
);
|
|
}
|