65 lines
2.1 KiB
TypeScript
65 lines
2.1 KiB
TypeScript
'use client';
|
||
import { type ProfileProps } from '../types';
|
||
import { CheckboxWithText, DataField, ProfileCardHeader } from './components';
|
||
import { updateRole } from './lib/actions';
|
||
import { getProfile, updateProfile } from '@/actions/profile';
|
||
import { Button } from '@repo/ui/components/ui/button';
|
||
import { Card } from '@repo/ui/components/ui/card';
|
||
import { useQuery } from '@tanstack/react-query';
|
||
import Link from 'next/link';
|
||
|
||
export function ContactDataCard({ telegramId }: Readonly<ProfileProps>) {
|
||
const { data: customer } = useQuery({
|
||
queryFn: () => getProfile({ telegramId }),
|
||
queryKey: ['profile', 'telegramId', telegramId],
|
||
});
|
||
|
||
if (!customer) return null;
|
||
|
||
return (
|
||
<Card className="p-4">
|
||
<div className="flex flex-col gap-4">
|
||
<Link href={customer?.phone ? `tel:${customer?.phone}` : ''}>
|
||
<DataField id="phone" label="Телефон" readOnly value={customer?.phone ?? ''} />
|
||
</Link>
|
||
<Button asChild className="w-full bg-foreground">
|
||
<Link href={`https://t.me/${customer?.phone}`} rel="noopener noreferrer" target="_blank">
|
||
Написать в Telegram
|
||
</Link>
|
||
</Button>
|
||
</div>
|
||
</Card>
|
||
);
|
||
}
|
||
|
||
export function ProfileDataCard() {
|
||
const { data: customer } = useQuery({
|
||
queryFn: () => getProfile(),
|
||
queryKey: ['profile'],
|
||
});
|
||
|
||
if (!customer) return null;
|
||
|
||
return (
|
||
<Card className="p-4">
|
||
<div className="flex flex-col gap-4">
|
||
<ProfileCardHeader title="Ваши данные" />
|
||
<DataField
|
||
fieldName="name"
|
||
id="name"
|
||
label="Имя"
|
||
onChange={updateProfile}
|
||
value={customer?.name ?? ''}
|
||
/>
|
||
<DataField disabled id="phone" label="Телефон" readOnly value={customer?.phone ?? ''} />
|
||
<CheckboxWithText
|
||
checked={customer.role !== 'client'}
|
||
description="Разрешить другим пользователям записываться к вам"
|
||
onChange={updateRole}
|
||
text="Быть мастером"
|
||
/>
|
||
</div>
|
||
</Card>
|
||
);
|
||
}
|