Gate heatmaps report on UMAMI_SELF_RECORD.

src/app/(main)/websites/[websiteId]/(reports)/heatmaps/page.tsx

@@ -1,7 +1,12 @@
 import type { Metadata } from 'next';
+import { notFound } from 'next/navigation';
 import { HeatmapsPage } from './HeatmapsPage';
 
 export default async function ({ params }: { params: Promise<{ websiteId: string }> }) {
+  if (!process.env.UMAMI_SELF_RECORD) {
+    notFound();
+  }
+
   const { websiteId } = await params;
 
   return <HeatmapsPage websiteId={websiteId} />;

src/app/api/config/route.ts

@@ -14,6 +14,7 @@ export async function GET(request: Request) {
     linksUrl: process.env.LINKS_URL,
     pixelsUrl: process.env.PIXELS_URL,
     privateMode: !!process.env.PRIVATE_MODE,
+    selfRecordEnabled: !!process.env.UMAMI_SELF_RECORD,
     telemetryDisabled: !!process.env.DISABLE_TELEMETRY,
     trackerScriptName: process.env.TRACKER_SCRIPT_NAME,
     updatesDisabled: !!process.env.DISABLE_UPDATES,

src/app/api/reports/heatmap/route.ts

@@ -1,10 +1,14 @@
 import { parseRequest, setWebsiteDate } from '@/lib/request';
-import { json, unauthorized } from '@/lib/response';
+import { forbidden, json, unauthorized } from '@/lib/response';
 import { reportResultSchema } from '@/lib/schema';
 import { canViewWebsite } from '@/permissions';
 import { getHeatmap, type HeatmapParameters } from '@/queries/sql';
 
 export async function POST(request: Request) {
+  if (!process.env.UMAMI_SELF_RECORD) {
+    return forbidden({ message: 'Heatmap recording is disabled.' });
+  }
+
   const { auth, body, error } = await parseRequest(request, reportResultSchema);
 
   if (error) {

src/components/hooks/useConfig.ts

@@ -8,6 +8,7 @@ export type Config = {
   linksUrl?: string;
   pixelsUrl?: string;
   privateMode: boolean;
+  selfRecordEnabled: boolean;
   telemetryDisabled: boolean;
   trackerScriptName?: string;
   updatesDisabled: boolean;

src/components/hooks/useWebsiteNavItems.tsx

@@ -11,12 +11,14 @@ import {
   Video,
 } from '@/components/icons';
 import { Funnel, Gauge, Lightning, Magnet, Money, Network, Path, Target } from '@/components/svg';
+import { useConfig } from './useConfig';
 import { useMessages } from './useMessages';
 import { useNavigation } from './useNavigation';
 
 export function useWebsiteNavItems(websiteId: string) {
   const { t, labels } = useMessages();
   const { pathname, renderUrl } = useNavigation();
+  const config = useConfig();
 
   const renderPath = (path: string) =>
     renderUrl(`/websites/${websiteId}${path}`, {
@@ -108,12 +110,16 @@ export function useWebsiteNavItems(websiteId: string) {
           icon: <Video />,
           path: renderPath('/replays'),
         },
-        {
+        ...(config?.selfRecordEnabled
-          id: 'heatmaps',
+          ? [
-          label: t(labels.heatmaps),
+              {
-          icon: <Flame />,
+                id: 'heatmaps',
-          path: renderPath('/heatmaps'),
+                label: t(labels.heatmaps),
-        },
+                icon: <Flame />,
+                path: renderPath('/heatmaps'),
+              },
+            ]
+          : []),
       ],
     },
     {