import dynamic from "next/dynamic";

import { CustomerPageShell } from "@/app/customer/_components/customer-page-shell";
import { CUSTOMER_ROUTE_KEYS } from "@/config/customer-route-keys";
import { ReportPageGuard } from "@/app/customer/[tenant]/reports/_shared/components/report-page-guard";

const PortfolioAnalyticsView = dynamic(
  () =>
    import("./_components/portfolio-analytics-report/portfolio-analytics-view").then(
      (mod) => mod.PortfolioAnalyticsView,
    ),
  { loading: () => <div className="p-6 text-muted-foreground text-sm">Loading portfolio analytics…</div> },
);

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

export default async function PortfolioAnalyticsReportPage({ params }: PageProps) {
  const { tenant } = await params;
  return (
    <CustomerPageShell>
      <ReportPageGuard tenant={tenant} routeKeys={CUSTOMER_ROUTE_KEYS.portfolioAnalytics} label="Portfolio Analytics Report">
        <PortfolioAnalyticsView />
      </ReportPageGuard>
    </CustomerPageShell>
  );
}