import { getCustomer } from '@/actions/api/customers';
import { getSessionUser } from '@/actions/session';
import { Container } from '@/components/layout';
import { LinksCard, PersonCard, ProfileDataCard } from '@/components/profile';
import { dehydrate, HydrationBoundary, QueryClient } from '@tanstack/react-query';

export default async function ProfilePage() {
  const queryClient = new QueryClient();

  const { telegramId } = await getSessionUser();

  await queryClient.prefetchQuery({
    queryFn: () => getCustomer({ telegramId }),
    queryKey: ['customer', telegramId],
  });

  return (
    <HydrationBoundary state={dehydrate(queryClient)}>
      <Container className="px-0">
        <PersonCard />
        <ProfileDataCard />
        <LinksCard />
      </Container>
    </HydrationBoundary>
  );
}