import { HydrationBoundary, dehydrate } from '@tanstack/react-query';
import PageContainer from '@/components/layout/page-container';
import { enquiryByIdOptions } from '@/features/crm-demo/api/queries';
import { EnquiryDetailPage } from '@/features/crm-demo/components/enquiry-detail';
import { getQueryClient } from '@/lib/query-client';

type PageProps = { params: Promise<{ id: string }> };

export default async function EnquiryDetailRoute({ params }: PageProps) {
  const { id } = await params;
  const queryClient = getQueryClient();
  void queryClient.prefetchQuery(enquiryByIdOptions(id));

  return (
    <PageContainer
      pageTitle='Enquiry Detail'
      pageDescription='Header summary, customer/contact, requirement summary, timeline, and related quotations'
    >
      <HydrationBoundary state={dehydrate(queryClient)}>
        <EnquiryDetailPage id={id} />
      </HydrationBoundary>
    </PageContainer>
  );
}
