import { HydrationBoundary, dehydrate } from '@tanstack/react-query';
import PageContainer from '@/components/layout/page-container';
import { crmReferenceQueryOptions } from '@/features/crm/api/queries';
import { TemplatesPage } from '@/features/crm/components/settings-page';
import { getQueryClient } from '@/lib/query-client';

export default function TemplatesRoute() {
  const queryClient = getQueryClient();
  void queryClient.prefetchQuery(crmReferenceQueryOptions());

  return (
    <PageContainer
      pageTitle='Quotation Templates'
      pageDescription='Mock quotation template, version และ placeholder mappings สำหรับต่อยอด PDF preview'
    >
      <HydrationBoundary state={dehydrate(queryClient)}>
        <TemplatesPage />
      </HydrationBoundary>
    </PageContainer>
  );
}