UTM report.

src/app/(main)/reports/[reportId]/ReportPage.tsx

@@ -1,6 +1,27 @@
 'use client';
-import ReportDetails from './ReportDetails';
+import FunnelReport from '../funnel/FunnelReport';
+import EventDataReport from '../event-data/EventDataReport';
+import InsightsReport from '../insights/InsightsReport';
+import RetentionReport from '../retention/RetentionReport';
+import UTMReport from '../utm/UTMReport';
+import { useReport } from 'components/hooks';
 
-export default function ReportPage({ reportId }) {
-  return <ReportDetails reportId={reportId} />;
+const reports = {
+  funnel: FunnelReport,
+  'event-data': EventDataReport,
+  insights: InsightsReport,
+  retention: RetentionReport,
+  utm: UTMReport,
+};
+
+export default function ReportPage({ reportId }: { reportId: string }) {
+  const { report } = useReport(reportId);
+
+  if (!report) {
+    return null;
+  }
+
+  const ReportComponent = reports[report.type];
+
+  return <ReportComponent reportId={reportId} />;
 }