From a5f3acac2f6a1d5d81a54933e9a8ef69c98c1f37 Mon Sep 17 00:00:00 2001
From: Jake Howell <jacob@coder.com>
Date: Tue, 17 Feb 2026 13:46:40 +1100
Subject: [PATCH] fix: permissions check on `<TemplateInsightsPage />` (#22110)

Closes #20859

This page previously wasn't rendered to the user, however, there is a
possibility that they can navigate to this page and things will end up
in `<Spinner />`s until the requests ultimately fail. We can mitigate
this problem by showing them the `<RequirePermission />` modal.

<img width="1456" height="861" alt="image"
src="https://github.com/user-attachments/assets/57195643-ad55-4340-9c97-f8247b05a13b"
/>
---
 .../TemplateInsightsPage.tsx                  | 25 ++++++++++++++-----
 1 file changed, 19 insertions(+), 6 deletions(-)

diff --git a/site/src/pages/TemplatePage/TemplateInsightsPage/TemplateInsightsPage.tsx b/site/src/pages/TemplatePage/TemplateInsightsPage/TemplateInsightsPage.tsx
index 76e4c27e23..c32da8e268 100644
--- a/site/src/pages/TemplatePage/TemplateInsightsPage/TemplateInsightsPage.tsx
+++ b/site/src/pages/TemplatePage/TemplateInsightsPage/TemplateInsightsPage.tsx
@@ -40,6 +40,7 @@ import {
 	CircleXIcon,
 	SquareArrowOutUpRightIcon,
 } from "lucide-react";
+import { RequirePermission } from "modules/permissions/RequirePermission";
 import { useTemplateLayoutContext } from "pages/TemplatePage/TemplateLayout";
 import {
 	type FC,
@@ -69,7 +70,7 @@ import { numberOfWeeksOptions, WeekPicker } from "./WeekPicker";
 const DEFAULT_NUMBER_OF_WEEKS = numberOfWeeksOptions[0];
 
 export default function TemplateInsightsPage() {
-	const { template } = useTemplateLayoutContext();
+	const { template, permissions } = useTemplateLayoutContext();
 	const [searchParams, setSearchParams] = useSearchParams();
 
 	const defaultInterval = getDefaultInterval(template);
@@ -92,13 +93,25 @@ export default function TemplateInsightsPage() {
 		end_time: toISOLocal(dateRange.endDate, baseOffset),
 	};
 
+	const canViewInsights =
+		permissions.canUpdateTemplate || permissions.canReadInsights;
+
 	const insightsFilter = { ...commonFilters, interval };
-	const templateInsights = useQuery(insightsTemplate(insightsFilter));
-	const userLatency = useQuery(insightsUserLatency(commonFilters));
-	const userActivity = useQuery(insightsUserActivity(commonFilters));
+	const templateInsights = useQuery({
+		...insightsTemplate(insightsFilter),
+		enabled: canViewInsights,
+	});
+	const userLatency = useQuery({
+		...insightsUserLatency(commonFilters),
+		enabled: canViewInsights,
+	});
+	const userActivity = useQuery({
+		...insightsUserActivity(commonFilters),
+		enabled: canViewInsights,
+	});
 
 	return (
-		<>
+		<RequirePermission isFeatureVisible={canViewInsights}>
 			<title>{getTemplatePageTitle("Insights", template)}</title>
 
 			<TemplateInsightsPageView
@@ -116,7 +129,7 @@ export default function TemplateInsightsPage() {
 				userActivity={userActivity}
 				interval={interval}
 			/>
-		</>
+		</RequirePermission>
 	);
 }