From 5a03ec302dd6bacf035efa16daab9ac6b51430ea Mon Sep 17 00:00:00 2001
From: Danielle Maywood <danielle@themaywoods.com>
Date: Tue, 24 Mar 2026 22:08:05 +0000
Subject: [PATCH] fix(site): show Agents tab on dev builds without page refresh
 (#23512)

---
 .../modules/dashboard/Navbar/NavbarView.stories.tsx    |  1 +
 site/src/modules/dashboard/Navbar/NavbarView.tsx       | 10 ++++------
 2 files changed, 5 insertions(+), 6 deletions(-)

diff --git a/site/src/modules/dashboard/Navbar/NavbarView.stories.tsx b/site/src/modules/dashboard/Navbar/NavbarView.stories.tsx
index d9f65c9a2a..6c06241411 100644
--- a/site/src/modules/dashboard/Navbar/NavbarView.stories.tsx
+++ b/site/src/modules/dashboard/Navbar/NavbarView.stories.tsx
@@ -15,6 +15,7 @@ const meta: Meta<typeof NavbarView> = {
 	parameters: {
 		chromatic: chromaticWithTablet,
 		layout: "fullscreen",
+		experiments: ["agents"],
 		queries: [
 			{
 				key: ["tasks", tasksFilter],
diff --git a/site/src/modules/dashboard/Navbar/NavbarView.tsx b/site/src/modules/dashboard/Navbar/NavbarView.tsx
index 09409318a3..011dc6088c 100644
--- a/site/src/modules/dashboard/Navbar/NavbarView.tsx
+++ b/site/src/modules/dashboard/Navbar/NavbarView.tsx
@@ -2,10 +2,12 @@ import { API } from "api/api";
 import type * as TypesGen from "api/typesGenerated";
 import type { ProxyContextValue } from "contexts/ProxyContext";
 import { useEmbeddedMetadata } from "hooks/useEmbeddedMetadata";
+import { useDashboard } from "modules/dashboard/useDashboard";
 import { NotificationsInbox } from "modules/notifications/NotificationsInbox/NotificationsInbox";
 import type { FC } from "react";
 import { useQuery } from "react-query";
 import { NavLink, useLocation } from "react-router";
+import { isDevBuild } from "utils/buildInfo";
 import { cn } from "utils/cn";
 import { Badge } from "#/components/Badge/Badge";
 import { Button } from "#/components/Button/Button";
@@ -230,12 +232,8 @@ function idleTasksLabel(count: number) {
 }
 
 const AgentsNavItem: FC = () => {
-	const { metadata } = useEmbeddedMetadata();
-	const canSeeAgents = Boolean(
-		metadata["agents-tab-visible"].value ||
-			process.env.NODE_ENV === "development" ||
-			process.env.STORYBOOK,
-	);
+	const { experiments, buildInfo } = useDashboard();
+	const canSeeAgents = experiments.includes("agents") || isDevBuild(buildInfo);
 
 	if (!canSeeAgents) {
 		return null;