import { getProfile } from '@/actions/profile';
import { ProfileCard } from '@/components/profile/profile-card';
import { dehydrate, HydrationBoundary, QueryClient } from '@tanstack/react-query';

type Props = {
  params: Promise<{
    telegramId: string;
  }>;
};

export default async function ProfilePage(props: Readonly<Props>) {
  const parameters = await props.params;
  const { telegramId } = parameters;

  const queryClient = new QueryClient();

  await queryClient.prefetchQuery({
    queryFn: () => getProfile({ telegramId }),
    queryKey: telegramId ? ['profile', 'telegramId', telegramId] : ['profile'],
  });

  return (
    <HydrationBoundary state={dehydrate(queryClient)}>
      <ProfileCard telegramId={telegramId} />
    </HydrationBoundary>
  );
}