@elevasis/ui 2.21.0 → 2.22.0

package/dist/{chunk-LQU62KHD.js → chunk-IBUYJXA3.js}

@@ -1,19 +1,19 @@
 import { ChatHeader, ChatSidebar } from './chunk-ROSMICXG.js';
 import { SubshellSidebarLoader, SubshellLoader } from './chunk-3JCMO7SD.js';
-import { BaseNode, useGraphTheme, BaseEdge, FormFieldRenderer, ExecutionStats, UnifiedWorkflowGraph, WorkflowExecutionTimeline, AgentExecutionVisualizer, AgentExecutionTimeline, GraphBackground, GraphFitViewButton, GraphFitViewHandler } from './chunk-EGKNRM6P.js';
-import { ResourceHealthPanel } from './chunk-I5WRKH25.js';
+import { BaseNode, useGraphTheme, BaseEdge, FormFieldRenderer, ExecutionStats, UnifiedWorkflowGraph, WorkflowExecutionTimeline, AgentExecutionVisualizer, AgentExecutionTimeline, GraphBackground, GraphFitViewButton, GraphFitViewHandler } from './chunk-LKVBEE63.js';
+import { ResourceHealthPanel } from './chunk-GJ7EIABJ.js';
 import { useCyberColors, CyberDonut } from './chunk-TSSKOQBX.js';
 import { AppShellLoader } from './chunk-M25JL54Z.js';
 import { PageContainer } from './chunk-BZZCNLT6.js';
 import { SubshellSidebarSection } from './chunk-IIMU5YAJ.js';
-import { CustomModal, ConfirmationModal } from './chunk-GBMNCNHX.js';
+import { CustomModal, ConfirmationModal } from './chunk-KVJ3LFH2.js';
 import { getResourceStatusColor, useTimelineData, useAgentIterationData, getStatusIcon } from './chunk-E4WQGJNS.js';
-import { useErrorDetail, useExecution, useArchivedLogs, useDeleteExecution, useRetryExecution, useCancelExecution, useCommandQueueTotals, useStatusFilter, useResourceSearch, useResourcesDomainFilters, usePaginationState, useResources, useRecentExecutionsByResource, filterByDomainFilters, collectResourceFilterFacets, useExecuteAsync, useResourceDefinition, isSessionCapable, useDeleteTask, useCommandQueue, useSubmitAction, useCommandViewData, useCommandViewStats, useCommandViewStore, useResourceExecutions, useCheckpointTasks, useExecutionPanelState, useDeleteSession, useCreateSession, useSessions, useSessionExecutions, useSession, useBulkDeleteExecutions } from './chunk-7GG6OSD7.js';
+import { useErrorDetail, useExecution, useArchivedLogs, useDeleteExecution, useRetryExecution, useCancelExecution, useCommandQueueTotals, useStatusFilter, useResourceSearch, useResourcesDomainFilters, usePaginationState, useResources, useRecentExecutionsByResource, filterByDomainFilters, collectResourceFilterFacets, useExecuteAsync, useResourceDefinition, isSessionCapable, useDeleteTask, useCommandQueue, useSubmitAction, useCommandViewData, useCommandViewStats, useCommandViewStore, useResourceExecutions, useCheckpointTasks, COMMAND_VIEW_VISUALIZATION_MODES, useExecutionPanelState, useDeleteSession, useCreateSession, useSessions, useSessionExecutions, useSession, useBulkDeleteExecutions, getCommandViewGraphPositions } from './chunk-B4FHWKEF.js';
 import { showApiErrorNotification, showSuccessNotification } from './chunk-Z6FAH4XV.js';
 import { useGraphHighlighting, calculateGraphHeight, Graph_module_css_default, GRAPH_CONSTANTS } from './chunk-22UVE3RA.js';
 import { useMergedExecution } from './chunk-3ZMAGTWF.js';
-import { useOptionalElevasisFeatures, useElevasisFeatures } from './chunk-VQESMHQV.js';
-import { SubshellContentContainer } from './chunk-RX4UWZZR.js';
+import { useOptionalElevasisFeatures, useElevasisFeatures } from './chunk-LJWV4TWV.js';
+import { SubshellContentContainer } from './chunk-TKAYX2SP.js';
 import { JsonViewer, CardHeader, PageTitleCaption, CollapsibleSection, TabCountBadge, ResourceCard, ContextViewer, EmptyState, APIErrorAlert } from './chunk-XUYBOO32.js';
 import { StyledMarkdown } from './chunk-3KMDHCAR.js';
 import { NavigationButton } from './chunk-NYBEU5TE.js';
@@ -25,7 +25,7 @@ import { ResourceStatusColors, toWorkflowLogMessages } from './chunk-KRWALB24.js
 import { useInitialization } from './chunk-DK2HVHCY.js';
 import { useOrganization } from './chunk-DD3CCMCZ.js';
 import { z } from 'zod';
-import { Stack, Group, Text, Badge, Title, Textarea, Alert, Button, ActionIcon, Collapse, Card, ThemeIcon, SimpleGrid, Divider, Paper, Space, CopyButton, Center, Tooltip, Code, Menu, useMantineTheme, UnstyledButton, Select, RangeSlider, Box, Progress, Tabs, Pagination, TextInput, Modal, LoadingOverlay, Loader, SegmentedControl, Switch, ScrollArea, MultiSelect } from '@mantine/core';
+import { Stack, Group, Text, Badge, Title, Textarea, Alert, Button, ActionIcon, Collapse, Card, ThemeIcon, SimpleGrid, Divider, Paper, Space, CopyButton, Center, Tooltip, Code, Menu, useMantineTheme, UnstyledButton, Select, RangeSlider, Box, Progress, Tabs, Pagination, TextInput, Modal, LoadingOverlay, Loader, SegmentedControl, ScrollArea, Checkbox, MultiSelect, Switch } from '@mantine/core';
 import { IconBrain, IconFileText, IconMail, IconSend, IconClock, IconArrowUp, IconMessageCircle, IconRocket, IconEye, IconEdit, IconAlertTriangle, IconRefresh, IconX, IconCheck, IconCode, IconAlertCircle, IconChevronRight, IconTool, IconSettings, IconCpu, IconClockHour4, IconVersions, IconPlayerPlay, IconNetwork, IconSitemap, IconCopy, IconPlayerStop, IconReload, IconTrash, IconTerminal2, IconBug, IconChevronDown, IconMessage, IconArrowLeft, IconRobot, IconGitBranch, IconDotsVertical, IconFilter, IconCircleCheck, IconCategory, IconDatabase, IconApps, IconRoute, IconAdjustmentsHorizontal, IconSearch, IconCircleX, IconCircleDashed, IconExternalLink, IconFolders, IconBraces, IconBolt, IconTopologyStar3, IconInfoCircle, IconPlus, IconLayoutSidebarRightExpand, IconNote, IconArchive, IconDownload, IconTimeline, IconActivityHeartbeat, IconClockPause, IconArrowsMaximize, IconShare2, IconHistory } from '@tabler/icons-react';
 import { useForm } from '@mantine/form';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
@@ -84,7 +84,22 @@ DisplayMetadataSchema.extend({
   techStack: TechStackEntrySchema.optional()
 });
 
-// ../core/src/organization-model/domains/branding.ts
+// ../core/src/organization-model/domains/features.ts
+var NodeIdPathSchema = z.string().trim().min(1).max(100).regex(/^([a-z0-9-]+)(\.[a-z0-9-]+)*$/, "Node IDs must be lowercase dotted paths");
+z.string().trim().min(1).max(200).regex(/^[a-z]+:([a-z0-9-]+)(\.[a-z0-9-]+)*$/, "Node references must use kind:dotted-path");
+var UiPositionSchema = z.enum(["sidebar-primary", "sidebar-bottom"]);
+var FeatureSchema = z.object({
+  id: NodeIdPathSchema,
+  label: LabelSchema,
+  description: DescriptionSchema.optional(),
+  enabled: z.boolean().default(true),
+  path: PathSchema.optional(),
+  icon: IconNameSchema.optional(),
+  color: ColorTokenSchema.optional(),
+  uiPosition: UiPositionSchema.optional(),
+  requiresAdmin: z.boolean().optional(),
+  devOnly: z.boolean().optional()
+});
 var OrganizationModelBrandingSchema = z.object({
   organizationName: LabelSchema,
   productName: LabelSchema,
@@ -127,21 +142,6 @@ var OrganizationModelProjectsSchema = z.object({
   milestoneStatuses: z.array(ProjectsDomainStateSchema).min(1),
   taskStatuses: z.array(ProjectsDomainStateSchema).min(1)
 });
-var NodeIdPathSchema = z.string().trim().min(1).max(100).regex(/^([a-z0-9-]+)(\.[a-z0-9-]+)*$/, "Node IDs must be lowercase dotted paths");
-z.string().trim().min(1).max(200).regex(/^[a-z]+:([a-z0-9-]+)(\.[a-z0-9-]+)*$/, "Node references must use kind:dotted-path");
-var UiPositionSchema = z.enum(["sidebar-primary", "sidebar-bottom"]);
-var FeatureSchema = z.object({
-  id: NodeIdPathSchema,
-  label: LabelSchema,
-  description: DescriptionSchema.optional(),
-  enabled: z.boolean().default(true),
-  path: PathSchema.optional(),
-  icon: IconNameSchema.optional(),
-  color: ColorTokenSchema.optional(),
-  uiPosition: UiPositionSchema.optional(),
-  requiresAdmin: z.boolean().optional(),
-  devOnly: z.boolean().optional()
-});
 var ProspectingLifecycleStageSchema = DisplayMetadataSchema.extend({
   id: ModelIdSchema,
   order: z.number().int().min(0)
@@ -162,6 +162,7 @@ var SurfaceDefinitionSchema = z.object({
   surfaceType: SurfaceTypeSchema,
   description: DescriptionSchema.optional(),
   enabled: z.boolean().default(true),
+  devOnly: z.boolean().optional(),
   icon: IconNameSchema.optional(),
   featureId: ModelIdSchema.optional(),
   featureIds: ReferenceIdsSchema,
@@ -562,6 +563,8 @@ var OrganizationModelSchema = OrganizationModelSchemaBase.superRefine((model, ct
     }
   });
 });
+
+// ../core/src/organization-model/graph/schema.ts
 var OrganizationGraphNodeKindSchema = z.enum([
   "organization",
   "feature",
@@ -5211,6 +5214,83 @@ function filterOrganizationGraph(graph, filters, options) {
     edges: visibleEdges
   };
 }
+function getCommandViewResourceCategory(node, commandViewData) {
+  return getCommandViewNodeForGraphNode(node, commandViewData)?.category ?? null;
+}
+function getConnectedHiddenResourceIds(graph, nodeId2, hiddenIds) {
+  if (!nodeId2) {
+    return /* @__PURE__ */ new Set();
+  }
+  const nodesById = new Map(graph.nodes.map((node) => [node.id, node]));
+  const connectedIds = /* @__PURE__ */ new Set();
+  for (const edge of graph.edges) {
+    const neighborId = edge.sourceId === nodeId2 ? edge.targetId : edge.targetId === nodeId2 ? edge.sourceId : null;
+    if (!neighborId || !hiddenIds.has(neighborId)) {
+      continue;
+    }
+    if (nodesById.get(neighborId)?.kind === "resource") {
+      connectedIds.add(neighborId);
+    }
+  }
+  return connectedIds;
+}
+function getCommandViewVisibilityProjection({
+  graph,
+  commandViewData,
+  resourcesHidden,
+  diagnosticsHidden,
+  diagnosticCategories,
+  revealedIds = /* @__PURE__ */ new Set(),
+  mode
+}) {
+  const hiddenIds = /* @__PURE__ */ new Set();
+  const hiddenEdgeIds = /* @__PURE__ */ new Set();
+  const diagnosticCategorySet = new Set(diagnosticCategories);
+  let totalResourceCount = 0;
+  let hiddenDiagnosticResourceCount = 0;
+  if (mode === "trace" || mode === "impact") {
+    const resourceCount = graph.nodes.filter((node) => node.kind === "resource").length;
+    return {
+      hiddenIds,
+      hiddenEdgeIds,
+      totalResourceCount: resourceCount,
+      visibleResourceCount: resourceCount,
+      hiddenResourceCount: 0,
+      hiddenDiagnosticResourceCount: 0
+    };
+  }
+  for (const node of graph.nodes) {
+    if (node.kind !== "resource") {
+      continue;
+    }
+    totalResourceCount += 1;
+    const category = getCommandViewResourceCategory(node, commandViewData);
+    const isDiagnostic = Boolean(category && diagnosticCategorySet.has(category));
+    if (isDiagnostic && diagnosticsHidden) {
+      hiddenDiagnosticResourceCount += 1;
+    }
+    if (revealedIds.has(node.id)) {
+      continue;
+    }
+    if (resourcesHidden || diagnosticsHidden && isDiagnostic) {
+      hiddenIds.add(node.id);
+    }
+  }
+  for (const edge of graph.edges) {
+    if (hiddenIds.has(edge.sourceId) || hiddenIds.has(edge.targetId)) {
+      hiddenEdgeIds.add(edge.id);
+    }
+  }
+  const hiddenResourceCount = hiddenIds.size;
+  return {
+    hiddenIds,
+    hiddenEdgeIds,
+    totalResourceCount,
+    visibleResourceCount: totalResourceCount - hiddenResourceCount,
+    hiddenResourceCount,
+    hiddenDiagnosticResourceCount
+  };
+}
 function isOrganizationGraphFilterPristine(filters) {
   return normalizeOrganizationGraphSearch(filters.search) === "" && filters.nodeKinds.length === 0 && filters.topologyPresence === DEFAULT_ORGANIZATION_GRAPH_FILTERS.topologyPresence && filters.environmentStatus === DEFAULT_ORGANIZATION_GRAPH_FILTERS.environmentStatus && filters.resourceTypes.length === 0 && filters.showIntegrations === DEFAULT_ORGANIZATION_GRAPH_FILTERS.showIntegrations && !hasActiveDomainFilters(filters.domainFilters);
 }
@@ -5418,7 +5498,14 @@ function useOrganizationGraphFilters(initialFilters) {
 }
 
 // src/features/operations/organization-graph/lenses.ts
-var COMMAND_VIEW_NODE_KINDS = ["resource"];
+var COMMAND_VIEW_NODE_KINDS = [
+  "organization",
+  "feature",
+  "surface",
+  "entity",
+  "capability",
+  "resource"
+];
 function getOrganizationGraphLensConfig(lens) {
   if (lens === "command-view") {
     return {
@@ -5427,9 +5514,9 @@ function getOrganizationGraphLensConfig(lens) {
       initialMode: "map",
       initialFilters: {
         nodeKinds: COMMAND_VIEW_NODE_KINDS,
-        topologyPresence: "topology-only"
+        topologyPresence: "all"
       },
-      filterSummary: "Command View lens starts from topology-focused resource nodes so operational traces stay readable inside the broader organization graph."
+      filterSummary: "Command View lens keeps the organization structure visible while resource visibility is controlled progressively."
     };
   }
   return {
@@ -5748,77 +5835,263 @@ function buildCommandViewDrillDownSections({
 }
 var cellStyle = {
   padding: "var(--mantine-spacing-sm) var(--mantine-spacing-md)",
-  borderRight: "1px solid var(--color-border)",
   display: "flex",
   alignItems: "center",
   gap: "var(--mantine-spacing-sm)",
   minWidth: 0
 };
-var lastCellStyle = {
-  ...cellStyle,
-  borderRight: "none"
-};
 function CommandViewHealthStrip({
   overview,
   hotspots,
   visibleResources,
+  hiddenResources = 0,
+  resourcesHidden,
   selectedLabel,
   onFocusHotspot,
+  onResourcesHiddenChange,
   onResetFocus
 }) {
-  return /* @__PURE__ */ jsxs(
-    Paper,
+  return /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between" }, children: [
+    /* @__PURE__ */ jsxs("div", { style: cellStyle, children: [
+      /* @__PURE__ */ jsx(IconActivityHeartbeat, { size: 16, style: { flexShrink: 0, color: "var(--color-text-dimmed)" } }),
+      /* @__PURE__ */ jsx(Text, { size: "sm", fw: 700, style: { flexShrink: 0 }, children: overview?.successRate == null ? "N/A" : `${Math.round(overview.successRate)}%` }),
+      /* @__PURE__ */ jsxs(Group, { gap: 4, wrap: "nowrap", children: [
+        /* @__PURE__ */ jsx(Badge, { variant: "light", color: "green", size: "xs", children: overview?.successCount ?? 0 }),
+        /* @__PURE__ */ jsx(Badge, { variant: "light", color: "red", size: "xs", children: overview?.failureCount ?? 0 }),
+        /* @__PURE__ */ jsx(Badge, { variant: "light", color: "yellow", size: "xs", children: overview?.warningCount ?? 0 })
+      ] }),
+      /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", truncate: true, style: { flexShrink: 1, minWidth: 0 }, children: overview ? `${overview.totalRuns} runs / ${overview.trackedResources} resources` : "" })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { style: cellStyle, children: [
+      /* @__PURE__ */ jsx(IconAlertTriangle, { size: 16, style: { flexShrink: 0, color: "var(--color-text-dimmed)" } }),
+      hotspots.length > 0 ? /* @__PURE__ */ jsx(Group, { gap: "xs", wrap: "nowrap", style: { minWidth: 0, overflow: "hidden" }, children: hotspots.map((hotspot) => /* @__PURE__ */ jsx(Group, { gap: 4, wrap: "nowrap", children: /* @__PURE__ */ jsx(
+        Badge,
+        {
+          variant: "light",
+          color: "red",
+          size: "xs",
+          style: { cursor: "pointer", flexShrink: 0 },
+          onClick: () => onFocusHotspot(hotspot.resourceId),
+          children: hotspot.label
+        }
+      ) }, hotspot.nodeId)) }) : /* @__PURE__ */ jsx(Badge, { variant: "light", color: "green", size: "xs", leftSection: /* @__PURE__ */ jsx(IconCircleCheck, { size: 10 }), children: "No hotspots" })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { style: cellStyle, children: [
+      /* @__PURE__ */ jsx(IconClockPause, { size: 16, style: { flexShrink: 0, color: "var(--color-text-dimmed)" } }),
+      /* @__PURE__ */ jsx(Text, { size: "sm", fw: 700, style: { flexShrink: 0 }, children: overview?.pendingApprovals ?? 0 }),
+      /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", truncate: true, children: [
+        "pending / ",
+        overview?.activeHumanCheckpoints ?? 0,
+        " queues"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { style: cellStyle, children: [
+      /* @__PURE__ */ jsx(IconTopologyStar3, { size: 16, style: { flexShrink: 0, color: "var(--color-text-dimmed)" } }),
+      /* @__PURE__ */ jsx(Text, { size: "xs", fw: 600, truncate: true, style: { minWidth: 0 }, children: selectedLabel ?? `${visibleResources} visible / ${hiddenResources} hidden` }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          size: "compact-xs",
+          variant: resourcesHidden ? "light" : "subtle",
+          onClick: () => onResourcesHiddenChange(!resourcesHidden),
+          style: { flexShrink: 0 },
+          children: resourcesHidden ? "Show resources" : "Hide resources"
+        }
+      ),
+      /* @__PURE__ */ jsx(Button, { size: "compact-xs", variant: "subtle", onClick: onResetFocus, style: { flexShrink: 0 }, children: "Reset" })
+    ] })
+  ] });
+}
+var FILTER_STATE_ICONS2 = {
+  neutral: IconCircleDashed,
+  include: IconCircleCheck,
+  exclude: IconCircleX
+};
+var FILTER_STATE_COLORS2 = {
+  neutral: "var(--color-text-dimmed)",
+  include: "var(--mantine-color-green-6)",
+  exclude: "var(--mantine-color-red-6)"
+};
+var FILTER_STATE_LABELS2 = {
+  neutral: "Not filtered",
+  include: "Include only",
+  exclude: "Exclude"
+};
+function getCommandViewResources(commandViewData) {
+  if (!commandViewData) {
+    return [];
+  }
+  return [
+    ...commandViewData.agents,
+    ...commandViewData.workflows,
+    ...commandViewData.triggers,
+    ...commandViewData.integrations,
+    ...commandViewData.externalResources,
+    ...commandViewData.humanCheckpoints
+  ];
+}
+function nextDomainFilterState(current) {
+  if (current === "neutral") return "include";
+  if (current === "include") return "exclude";
+  return "neutral";
+}
+function FilterPanel({
+  filters,
+  onChangeFilters,
+  resetValue,
+  disabled = false,
+  commandViewData,
+  lens,
+  resourcesHidden,
+  diagnosticsHidden,
+  onResourcesHiddenChange,
+  onDiagnosticsHiddenChange,
+  onRevealResources,
+  onResetFilters,
+  visibilityCounts,
+  graph,
+  baseGraph,
+  layout = "grid"
+}) {
+  const resourceFacets = collectResourceFilterFacets(getCommandViewResources(commandViewData));
+  const Section = ({ children }) => layout === "stack" ? /* @__PURE__ */ jsx(
+    Stack,
     {
-      withBorder: true,
+      gap: "sm",
+      pb: "sm",
       style: {
-        display: "grid",
-        gridTemplateColumns: "auto 1fr auto auto",
-        background: "var(--color-surface)",
-        boxShadow: "var(--card-shadow)",
-        overflow: "hidden"
+        borderBottom: "1px solid var(--color-border)"
       },
-      children: [
-        /* @__PURE__ */ jsxs("div", { style: cellStyle, children: [
-          /* @__PURE__ */ jsx(IconActivityHeartbeat, { size: 16, style: { flexShrink: 0, color: "var(--color-text-dimmed)" } }),
-          /* @__PURE__ */ jsx(Text, { size: "sm", fw: 700, style: { flexShrink: 0 }, children: overview?.successRate == null ? "N/A" : `${Math.round(overview.successRate)}%` }),
-          /* @__PURE__ */ jsxs(Group, { gap: 4, wrap: "nowrap", children: [
-            /* @__PURE__ */ jsx(Badge, { variant: "light", color: "green", size: "xs", children: overview?.successCount ?? 0 }),
-            /* @__PURE__ */ jsx(Badge, { variant: "light", color: "red", size: "xs", children: overview?.failureCount ?? 0 }),
-            /* @__PURE__ */ jsx(Badge, { variant: "light", color: "yellow", size: "xs", children: overview?.warningCount ?? 0 })
+      children
+    }
+  ) : /* @__PURE__ */ jsx(Paper, { withBorder: true, p: "md", radius: "md", style: { background: "var(--color-surface)" }, children });
+  const updateDomainFilter = (domainId) => {
+    const current = filters.domainFilters[domainId] ?? "neutral";
+    onChangeFilters({
+      ...filters,
+      domainFilters: {
+        ...filters.domainFilters,
+        [domainId]: nextDomainFilterState(current)
+      }
+    });
+  };
+  const handleResourceVisibilityAction = () => {
+    if (resourcesHidden) {
+      onRevealResources();
+      return;
+    }
+    onResourcesHiddenChange(true);
+  };
+  const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Section, { children: /* @__PURE__ */ jsxs(Stack, { gap: "sm", children: [
+      /* @__PURE__ */ jsx(Text, { size: "sm", fw: 700, children: "Filters" }),
+      /* @__PURE__ */ jsx(
+        OrganizationGraphFilterToolbar,
+        {
+          value: filters,
+          onChange: onChangeFilters,
+          disabled,
+          resetValue
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ jsx(Section, { children: /* @__PURE__ */ jsxs(Stack, { gap: "sm", children: [
+      /* @__PURE__ */ jsxs(Group, { justify: "space-between", align: "center", children: [
+        /* @__PURE__ */ jsx(Text, { size: "sm", fw: 700, children: "Visibility" }),
+        /* @__PURE__ */ jsxs(Badge, { variant: "light", children: [
+          visibilityCounts.visibleResourceCount,
+          "/",
+          visibilityCounts.totalResourceCount,
+          " resources"
+        ] })
+      ] }),
+      lens === "command-view" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(
+          Checkbox,
+          {
+            label: "Hide resource nodes",
+            description: "Keep the organization structure readable and reveal resource nodes as needed.",
+            checked: resourcesHidden,
+            onChange: (event) => onResourcesHiddenChange(event.currentTarget.checked),
+            disabled
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Checkbox,
+          {
+            label: "Hide diagnostic and testing resources",
+            description: "Diagnostics stay available through filters, trace, impact, and contextual reveal.",
+            checked: diagnosticsHidden,
+            onChange: (event) => onDiagnosticsHiddenChange(event.currentTarget.checked),
+            disabled
+          }
+        ),
+        /* @__PURE__ */ jsxs(Group, { gap: "xs", wrap: "wrap", children: [
+          /* @__PURE__ */ jsxs(Badge, { variant: "light", color: visibilityCounts.hiddenResourceCount > 0 ? "yellow" : "green", children: [
+            visibilityCounts.hiddenResourceCount,
+            " hidden"
           ] }),
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", truncate: true, style: { flexShrink: 1, minWidth: 0 }, children: overview ? `${overview.totalRuns} runs / ${overview.trackedResources} resources` : "" })
+          /* @__PURE__ */ jsxs(Badge, { variant: "light", color: visibilityCounts.hiddenDiagnosticResourceCount > 0 ? "yellow" : "gray", children: [
+            visibilityCounts.hiddenDiagnosticResourceCount,
+            " diagnostic/testing"
+          ] })
         ] }),
-        /* @__PURE__ */ jsxs("div", { style: cellStyle, children: [
-          /* @__PURE__ */ jsx(IconAlertTriangle, { size: 16, style: { flexShrink: 0, color: "var(--color-text-dimmed)" } }),
-          hotspots.length > 0 ? /* @__PURE__ */ jsx(Group, { gap: "xs", wrap: "nowrap", style: { minWidth: 0, overflow: "hidden" }, children: hotspots.map((hotspot) => /* @__PURE__ */ jsx(Group, { gap: 4, wrap: "nowrap", children: /* @__PURE__ */ jsx(
-            Badge,
+        /* @__PURE__ */ jsxs(Group, { justify: "space-between", children: [
+          /* @__PURE__ */ jsx(Button, { size: "xs", variant: "light", onClick: handleResourceVisibilityAction, disabled, children: resourcesHidden ? "Reveal resources" : "Hide resources" }),
+          /* @__PURE__ */ jsx(
+            Button,
             {
-              variant: "light",
-              color: "red",
               size: "xs",
-              style: { cursor: "pointer", flexShrink: 0 },
-              onClick: () => onFocusHotspot(hotspot.resourceId),
-              children: hotspot.label
+              variant: "subtle",
+              leftSection: /* @__PURE__ */ jsx(IconRefresh, { size: 14 }),
+              onClick: onResetFilters,
+              disabled,
+              children: "Reset filters"
             }
-          ) }, hotspot.nodeId)) }) : /* @__PURE__ */ jsx(Badge, { variant: "light", color: "green", size: "xs", leftSection: /* @__PURE__ */ jsx(IconCircleCheck, { size: 10 }), children: "No hotspots" })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { style: cellStyle, children: [
-          /* @__PURE__ */ jsx(IconClockPause, { size: 16, style: { flexShrink: 0, color: "var(--color-text-dimmed)" } }),
-          /* @__PURE__ */ jsx(Text, { size: "sm", fw: 700, style: { flexShrink: 0 }, children: overview?.pendingApprovals ?? 0 }),
-          /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", truncate: true, children: [
-            "pending / ",
-            overview?.activeHumanCheckpoints ?? 0,
-            " queues"
-          ] })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { style: lastCellStyle, children: [
-          /* @__PURE__ */ jsx(IconTopologyStar3, { size: 16, style: { flexShrink: 0, color: "var(--color-text-dimmed)" } }),
-          /* @__PURE__ */ jsx(Text, { size: "xs", fw: 600, truncate: true, style: { minWidth: 0 }, children: selectedLabel ?? `${visibleResources} resources` }),
-          /* @__PURE__ */ jsx(Button, { size: "compact-xs", variant: "subtle", onClick: onResetFocus, style: { flexShrink: 0 }, children: "Reset" })
+          )
         ] })
-      ]
-    }
-  );
+      ] }) : /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "Visibility controls are available in the Command View lens." })
+    ] }) }),
+    /* @__PURE__ */ jsx(Section, { children: /* @__PURE__ */ jsxs(Stack, { gap: "sm", children: [
+      /* @__PURE__ */ jsx(Text, { size: "sm", fw: 700, children: "Resource Facets" }),
+      resourceFacets.length > 0 ? /* @__PURE__ */ jsx(Stack, { gap: 4, children: resourceFacets.map((facet) => {
+        const filterState = filters.domainFilters[facet.id] ?? "neutral";
+        const StateIcon = FILTER_STATE_ICONS2[filterState];
+        return /* @__PURE__ */ jsx(
+          UnstyledButton,
+          {
+            title: FILTER_STATE_LABELS2[filterState],
+            onClick: () => updateDomainFilter(facet.id),
+            disabled,
+            style: {
+              border: "1px solid var(--color-border)",
+              borderRadius: "var(--mantine-radius-sm)",
+              padding: "6px 8px"
+            },
+            children: /* @__PURE__ */ jsxs(Group, { gap: "xs", wrap: "nowrap", children: [
+              /* @__PURE__ */ jsx(StateIcon, { size: 16, style: { color: FILTER_STATE_COLORS2[filterState], flexShrink: 0 } }),
+              /* @__PURE__ */ jsx(Text, { size: "sm", truncate: true, c: filterState === "neutral" ? "dimmed" : void 0, children: facet.label })
+            ] })
+          },
+          facet.id
+        );
+      }) }) : /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "No resource facets are available for the current topology." }),
+      /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
+        "Showing ",
+        graph?.nodes.length ?? 0,
+        " nodes and ",
+        graph?.edges.length ?? 0,
+        " edges from",
+        " ",
+        baseGraph?.nodes.length ?? 0,
+        " total nodes."
+      ] })
+    ] }) })
+  ] });
+  if (layout === "stack") {
+    return /* @__PURE__ */ jsx(Stack, { gap: "sm", children: content });
+  }
+  return /* @__PURE__ */ jsx(SimpleGrid, { cols: { base: 1, lg: 3 }, spacing: "md", children: content });
 }
 
 // src/features/operations/organization-graph/commandViewGraphHealth.ts
@@ -6312,6 +6585,8 @@ var EMPTY_TRACE_SELECTION = {
   sourceId: null,
   targetId: null
 };
+var EMPTY_GRAPH_HIDDEN_IDS = /* @__PURE__ */ new Set();
+var EMPTY_GRAPH_HIDDEN_EDGE_IDS = /* @__PURE__ */ new Set();
 var FALLBACK_GRAPH_THEME = {
   primary: "#4a6e8e",
   background: "#030507",
@@ -6324,6 +6599,12 @@ var FALLBACK_GRAPH_THEME = {
   warning: "#ffb74d",
   error: "#ff5252"
 };
+function truncateGraphLabel(value, maxLength) {
+  if (value.length <= maxLength) {
+    return value;
+  }
+  return `${value.slice(0, Math.max(0, maxLength - 3))}...`;
+}
 function parseColor(input) {
   const value = input.trim();
   if (value.startsWith("#")) {
@@ -6455,12 +6736,12 @@ function getEdgeColor(edge, tokens) {
 }
 function getNodeSize(kind) {
   if (kind === "organization") {
-    return { width: 280, height: 112 };
+    return { width: 230, height: 88 };
   }
   if (kind === "resource") {
-    return { width: 208, height: 84 };
+    return { width: 154, height: 54 };
   }
-  return { width: 220, height: 92 };
+  return { width: 174, height: 66 };
 }
 function getNodeScore(node, graph) {
   const relationshipCount = graph.edges.filter((edge) => edge.sourceId === node.id || edge.targetId === node.id).length;
@@ -6479,8 +6760,13 @@ function getCommandViewRingColor(level, tokens) {
       return mixColors(tokens.textDimmed, tokens.border, 0.6);
   }
 }
-function toCytoscapeElementsWithHealth(graph, tokens, commandViewHealthByNodeId) {
+function toCytoscapeElementsWithHealth(graph, tokens, commandViewHealthByNodeId, visualizationMode, selectedElement) {
   const nodeThemeByKind = getNodeThemeByKind(tokens);
+  const presetPositions = getCommandViewGraphPositions({
+    graph,
+    visualizationMode,
+    selectedNodeId: selectedElement?.type === "node" ? selectedElement.id : null
+  });
   return [
     ...graph.nodes.map((node) => {
       const size = getNodeSize(node.kind);
@@ -6488,19 +6774,22 @@ function toCytoscapeElementsWithHealth(graph, tokens, commandViewHealthByNodeId)
       const health = commandViewHealthByNodeId?.get(node.id) ?? null;
       const fillColor = health && node.kind === "resource" ? mixColors(tokens.surfaceHover, tokens.background, 0.76) : theme.background;
       const borderColor = health ? getCommandViewRingColor(health.healthLevel, tokens) : theme.border;
-      const label = health ? `${node.label}
-${health.summaryLabel}` : node.label;
+      const maxLabelLength = node.kind === "resource" ? 22 : 30;
+      const label = truncateGraphLabel(node.label, maxLabelLength);
+      const displayLabel = health ? `${label}
+${health.summaryLabel}` : label;
       return {
         data: {
           ...node,
           width: size.width,
           height: size.height,
           score: getNodeScore(node, graph),
-          label,
+          label: displayLabel,
           fillColor,
           borderColor,
           textColor: health ? tokens.text : theme.color
-        }
+        },
+        position: presetPositions.get(node.id)
       };
     }),
     ...graph.edges.map((edge) => ({
@@ -6526,9 +6815,9 @@ function getLayoutOptions(mode, selectedElement, traceResult) {
       name: "concentric",
       fit: true,
       animate: true,
-      animationDuration: 280,
-      padding: 56,
-      spacingFactor: 1.1,
+      animationDuration: 220,
+      padding: 48,
+      spacingFactor: 1,
       concentric: (node) => {
         if (node.id() === impactRootId) {
           return 20;
@@ -6543,24 +6832,19 @@ function getLayoutOptions(mode, selectedElement, traceResult) {
       name: "breadthfirst",
       fit: true,
       animate: true,
-      animationDuration: 280,
+      animationDuration: 220,
       directed: true,
       circle: false,
-      spacingFactor: 1.25,
-      padding: 56,
+      spacingFactor: 1.08,
+      padding: 48,
       roots
     };
   }
   return {
-    name: "cose",
+    name: "preset",
     fit: true,
-    animate: true,
-    animationDuration: 280,
-    padding: 56,
-    nodeRepulsion: 72e4,
-    idealEdgeLength: 160,
-    edgeElasticity: 120,
-    gravity: 0.3
+    animate: false,
+    padding: 48
   };
 }
 function createCytoscapeStyle(tokens) {
@@ -6580,13 +6864,13 @@ function createCytoscapeStyle(tokens) {
         "border-style": "solid",
         "border-color": "data(borderColor)",
         color: "data(textColor)",
-        "font-size": 12,
+        "font-size": 10,
         "font-weight": 700,
         "text-wrap": "wrap",
-        "text-max-width": "150px",
+        "text-max-width": "120px",
         "text-valign": "center",
         "text-halign": "center",
-        padding: "14px",
+        padding: "10px",
         "overlay-opacity": 0,
         "text-outline-width": 0
       }
@@ -6596,14 +6880,25 @@ function createCytoscapeStyle(tokens) {
       style: {
         shape: "cut-rectangle",
         "border-width": 3,
-        "font-size": 15
+        "font-size": 13
+      }
+    },
+    {
+      selector: 'node[kind = "resource"]',
+      style: {
+        "border-width": 1.5,
+        "font-size": 8,
+        "font-weight": 650,
+        "text-max-width": "104px",
+        "background-opacity": 0.82,
+        "min-zoomed-font-size": 7
       }
     },
     {
       selector: "edge",
       style: {
-        width: 2,
-        label: "data(label)",
+        width: 1.25,
+        label: "",
         color: tokens.text,
         "font-size": 10,
         "font-weight": 700,
@@ -6618,20 +6913,26 @@ function createCytoscapeStyle(tokens) {
         "text-border-opacity": 0,
         "text-rotation": "autorotate",
         "overlay-opacity": 0,
-        "line-opacity": 0.9
+        "line-opacity": 0.38
+      }
+    },
+    {
+      selector: ".is-hidden",
+      style: {
+        display: "none"
       }
     },
     {
       selector: 'edge[relationshipType = "triggers"]',
       style: {
-        width: 2.8,
+        width: 1.9,
         "line-style": "dashed"
       }
     },
     {
       selector: ".is-faded",
       style: {
-        opacity: 0.18
+        opacity: 0.1
       }
     },
     {
@@ -6644,7 +6945,8 @@ function createCytoscapeStyle(tokens) {
       selector: "edge.is-connected",
       style: {
         opacity: 1,
-        width: 3.4
+        width: 2.9,
+        "line-opacity": 0.9
       }
     },
     {
@@ -6652,7 +6954,8 @@ function createCytoscapeStyle(tokens) {
       style: {
         opacity: 1,
         "border-color": selectedBorder,
-        "border-width": 3
+        "border-width": 3.5,
+        "background-opacity": 1
       }
     },
     {
@@ -6675,7 +6978,9 @@ function createCytoscapeStyle(tokens) {
       selector: "edge.is-selected",
       style: {
         opacity: 1,
-        width: 4.2
+        width: 4.2,
+        "line-opacity": 1,
+        label: "data(label)"
       }
     },
     {
@@ -6683,6 +6988,8 @@ function createCytoscapeStyle(tokens) {
       style: {
         opacity: 1,
         width: 4.6,
+        "line-opacity": 1,
+        label: "data(label)",
         "line-color": traceBorder,
         "target-arrow-color": traceBorder,
         "line-style": "solid"
@@ -6690,11 +6997,23 @@ function createCytoscapeStyle(tokens) {
     }
   ];
 }
-function syncGraphClasses(cy, selectedElement, traceResult) {
+function syncGraphClasses(cy, selectedElement, traceResult, hiddenIds, hiddenEdgeIds) {
   cy.batch(() => {
     cy.elements().removeClass(
-      "is-faded is-context is-selected is-connected is-trace-node is-trace-edge is-trace-endpoint"
+      "is-hidden is-faded is-context is-selected is-connected is-trace-node is-trace-edge is-trace-endpoint"
     );
+    for (const nodeId2 of hiddenIds) {
+      const node = cy.getElementById(nodeId2);
+      if (!node.empty()) {
+        node.addClass("is-hidden");
+      }
+    }
+    for (const edgeId2 of hiddenEdgeIds) {
+      const edge2 = cy.getElementById(edgeId2);
+      if (!edge2.empty()) {
+        edge2.addClass("is-hidden");
+      }
+    }
     const hasTrace = Boolean(
       traceResult && (traceResult.highlightNodeIds.length > 0 || traceResult.highlightEdgeIds.length > 0)
     );
@@ -6748,24 +7067,56 @@ function syncGraphClasses(cy, selectedElement, traceResult) {
     edge.connectedNodes().addClass("is-selected");
   });
 }
+function syncCytoscapeElements(cy, elements) {
+  const nextIds = new Set(elements.map((element) => element.data.id));
+  cy.batch(() => {
+    cy.elements().forEach((element) => {
+      if (!nextIds.has(element.id())) {
+        element.remove();
+      }
+    });
+    for (const element of elements) {
+      const id = element.data.id;
+      const existing = cy.getElementById(id);
+      if (existing.empty()) {
+        cy.add(element);
+        continue;
+      }
+      existing.data(element.data);
+      if ("position" in element && element.position && existing.isNode()) {
+        existing.position(element.position);
+      }
+    }
+  });
+}
 function OrganizationGraphCanvas({
   graph,
   mode,
+  visualizationMode,
   selectedElement,
   traceResult,
+  hiddenIds,
+  hiddenEdgeIds,
   themeTokens,
   commandViewHealthByNodeId,
   focusRequest,
+  toolbar,
   onSelectElement
 }) {
   const containerRef = useRef(null);
   const cytoscapeRef = useRef(null);
   const previousModeRef = useRef(mode);
+  const onSelectElementRef = useRef(onSelectElement);
+  const lastSizeRef = useRef(null);
+  const layoutSelectedElement = visualizationMode === "focus" ? selectedElement : null;
   const elements = useMemo(
-    () => toCytoscapeElementsWithHealth(graph, themeTokens, commandViewHealthByNodeId),
-    [commandViewHealthByNodeId, graph, themeTokens]
+    () => toCytoscapeElementsWithHealth(graph, themeTokens, commandViewHealthByNodeId, visualizationMode, layoutSelectedElement),
+    [commandViewHealthByNodeId, graph, layoutSelectedElement, themeTokens, visualizationMode]
   );
   const cytoscapeStyle = useMemo(() => createCytoscapeStyle(themeTokens), [themeTokens]);
+  useEffect(() => {
+    onSelectElementRef.current = onSelectElement;
+  }, [onSelectElement]);
   useEffect(() => {
     if (!containerRef.current) {
       return;
@@ -6777,32 +7128,52 @@ function OrganizationGraphCanvas({
       layout: getLayoutOptions(mode, null, traceResult),
       minZoom: 0.22,
       maxZoom: 1.6,
-      wheelSensitivity: 0.45
+      wheelSensitivity: 1.35
     });
     cytoscapeRef.current = cy;
     cy.on("tap", "node", (event) => {
-      onSelectElement({ type: "node", id: event.target.id() });
+      onSelectElementRef.current({ type: "node", id: event.target.id() });
     });
     cy.on("tap", "edge", (event) => {
-      onSelectElement({ type: "edge", id: event.target.id() });
+      onSelectElementRef.current({ type: "edge", id: event.target.id() });
     });
     cy.on("tap", (event) => {
       if (event.target === cy) {
-        onSelectElement(null);
+        onSelectElementRef.current(null);
       }
     });
-    const resizeObserver = new ResizeObserver(() => {
-      cy.resize();
-      cy.fit(void 0, 56);
+    const resizeObserver = new ResizeObserver(([entry]) => {
+      const { width, height } = entry.contentRect;
+      const lastSize = lastSizeRef.current;
+      if (lastSize && Math.abs(lastSize.width - width) < 1 && Math.abs(lastSize.height - height) < 1) {
+        return;
+      }
+      lastSizeRef.current = { width, height };
+      window.requestAnimationFrame(() => {
+        if (cy.destroyed()) {
+          return;
+        }
+        cy.resize();
+        cy.fit(void 0, 44);
+      });
     });
     resizeObserver.observe(containerRef.current);
-    syncGraphClasses(cy, selectedElement, traceResult);
+    syncGraphClasses(cy, selectedElement, traceResult, hiddenIds, hiddenEdgeIds);
     return () => {
       resizeObserver.disconnect();
       cy.destroy();
       cytoscapeRef.current = null;
     };
-  }, [cytoscapeStyle, elements, onSelectElement]);
+  }, [cytoscapeStyle]);
+  useEffect(() => {
+    const cy = cytoscapeRef.current;
+    if (!cy) {
+      return;
+    }
+    syncCytoscapeElements(cy, elements);
+    cy.layout(getLayoutOptions(mode, selectedElement, traceResult)).run();
+    syncGraphClasses(cy, selectedElement, traceResult, hiddenIds, hiddenEdgeIds);
+  }, [elements]);
   useEffect(() => {
     const cy = cytoscapeRef.current;
     if (!cy) {
@@ -6810,7 +7181,7 @@ function OrganizationGraphCanvas({
     }
     const modeChanged = previousModeRef.current !== mode;
     previousModeRef.current = mode;
-    if (!modeChanged && mode === "map" && selectedElement) {
+    if (!modeChanged && mode === "map") {
       return;
     }
     cy.layout(getLayoutOptions(mode, selectedElement, traceResult)).run();
@@ -6820,8 +7191,27 @@ function OrganizationGraphCanvas({
     if (!cy) {
       return;
     }
-    syncGraphClasses(cy, selectedElement, traceResult);
-  }, [selectedElement, traceResult]);
+    syncGraphClasses(cy, selectedElement, traceResult, hiddenIds, hiddenEdgeIds);
+    if (mode === "map" && selectedElement?.type === "node") {
+      const node = cy.getElementById(selectedElement.id);
+      if (!node.empty()) {
+        const visibleNeighborhood = node.closedNeighborhood().not(".is-hidden");
+        cy.stop();
+        cy.animate(
+          {
+            fit: {
+              eles: visibleNeighborhood.empty() ? node : visibleNeighborhood,
+              padding: 72
+            },
+            duration: 220
+          },
+          {
+            easing: "ease-out-cubic"
+          }
+        );
+      }
+    }
+  }, [hiddenEdgeIds, hiddenIds, mode, selectedElement, traceResult]);
   useEffect(() => {
     const cy = cytoscapeRef.current;
     if (!cy || !focusRequest) {
@@ -6831,13 +7221,15 @@ function OrganizationGraphCanvas({
     if (node.empty()) {
       return;
     }
+    const visibleNeighborhood = node.closedNeighborhood().not(".is-hidden");
+    cy.stop();
     cy.animate(
       {
         fit: {
-          eles: node.closedNeighborhood(),
-          padding: 96
+          eles: visibleNeighborhood.empty() ? node : visibleNeighborhood,
+          padding: 72
         },
-        duration: 280
+        duration: 220
       },
       {
         easing: "ease-out-cubic"
@@ -6858,25 +7250,39 @@ function OrganizationGraphCanvas({
       },
       children: [
         /* @__PURE__ */ jsx(Box, { ref: containerRef, style: { width: "100%", height: "100%" } }),
-        /* @__PURE__ */ jsx(Tooltip, { label: "Fit graph to view", children: /* @__PURE__ */ jsx(
-          ActionIcon,
+        /* @__PURE__ */ jsxs(
+          Group,
           {
-            variant: "light",
-            radius: "xl",
-            size: "lg",
+            gap: "xs",
+            wrap: "nowrap",
             style: {
               position: "absolute",
               top: 12,
               right: 12,
               zIndex: 2,
-              background: "var(--glass-background)",
-              backdropFilter: "var(--glass-blur)",
-              color: "var(--color-text)"
+              maxWidth: "calc(100% - 24px)"
             },
-            onClick: () => cytoscapeRef.current?.fit(void 0, 56),
-            children: /* @__PURE__ */ jsx(IconArrowsMaximize, { size: 18 })
+            children: [
+              toolbar,
+              /* @__PURE__ */ jsx(Tooltip, { label: "Fit graph to view", children: /* @__PURE__ */ jsx(
+                ActionIcon,
+                {
+                  variant: "light",
+                  radius: "xl",
+                  size: "lg",
+                  style: {
+                    background: "var(--glass-background)",
+                    backdropFilter: "var(--glass-blur)",
+                    color: "var(--color-text)",
+                    flexShrink: 0
+                  },
+                  onClick: () => cytoscapeRef.current?.fit(void 0, 44),
+                  children: /* @__PURE__ */ jsx(IconArrowsMaximize, { size: 18 })
+                }
+              ) })
+            ]
           }
-        ) })
+        )
       ]
     }
   );
@@ -6884,23 +7290,67 @@ function OrganizationGraphCanvas({
 function getGraphCountByKind(graph, kind) {
   return graph?.nodes.filter((node) => node.kind === kind).length ?? 0;
 }
-function formatGeneratedTimestamp(value) {
-  if (!value) return "unavailable";
-  return new Intl.DateTimeFormat("en-US", {
-    month: "short",
-    day: "numeric",
-    hour: "numeric",
-    minute: "2-digit"
-  }).format(new Date(value));
-}
-function OrganizationGraphPage({ lens = "default", timeRange = "30d" }) {
-  const { organizationModel, organizationGraph } = useElevasisFeatures();
-  const { data: commandViewData, isLoading, error } = useCommandViewData();
+function getCommandViewRenderableGraph(graph) {
+  if (!graph) {
+    return null;
+  }
+  const hasSpecificParentByNodeId = /* @__PURE__ */ new Set();
+  const hasOperationalEdgeByResourceId = /* @__PURE__ */ new Set();
+  for (const edge of graph.edges) {
+    if (edge.kind === "contains" && edge.sourceId !== ORGANIZATION_NODE_ID) {
+      hasSpecificParentByNodeId.add(edge.targetId);
+    }
+    if (edge.kind !== "contains") {
+      hasOperationalEdgeByResourceId.add(edge.sourceId);
+      hasOperationalEdgeByResourceId.add(edge.targetId);
+    }
+  }
+  return {
+    ...graph,
+    edges: graph.edges.filter((edge) => {
+      if (edge.kind !== "contains" || edge.sourceId !== ORGANIZATION_NODE_ID) {
+        return true;
+      }
+      const targetNode = graph.nodes.find((node) => node.id === edge.targetId);
+      if (!targetNode) {
+        return false;
+      }
+      if (targetNode.kind === "resource") {
+        return !hasOperationalEdgeByResourceId.has(targetNode.id);
+      }
+      return !hasSpecificParentByNodeId.has(targetNode.id);
+    })
+  };
+}
+function formatGeneratedTimestamp(value) {
+  if (!value) return "unavailable";
+  return new Intl.DateTimeFormat("en-US", {
+    month: "short",
+    day: "numeric",
+    hour: "numeric",
+    minute: "2-digit"
+  }).format(new Date(value));
+}
+function OrganizationGraphPage({ lens = "default", timeRange = "30d" }) {
+  const { organizationModel } = useElevasisFeatures();
+  const { data: commandViewData, isLoading, error } = useCommandViewData();
   const { data: commandViewStats } = useCommandViewStats(timeRange, { enabled: lens === "command-view" });
   const setSelectedNodeId = useCommandViewStore((state) => state.setSelectedNodeId);
+  const visualizationMode = useCommandViewStore((state) => state.visualizationMode);
+  const setVisualizationMode = useCommandViewStore((state) => state.setVisualizationMode);
+  const effectiveVisualizationMode = visualizationMode === "spatial" ? "network" : visualizationMode;
+  const resourcesHidden = useCommandViewStore((state) => state.resourcesHidden);
+  const setResourcesHidden = useCommandViewStore((state) => state.setResourcesHidden);
+  const diagnosticsHidden = useCommandViewStore((state) => state.diagnosticsHidden);
+  const setDiagnosticsHidden = useCommandViewStore((state) => state.setDiagnosticsHidden);
+  const diagnosticCategories = useCommandViewStore((state) => state.diagnosticCategories);
+  const revealedIds = useCommandViewStore((state) => state.revealedIds);
+  const setRevealedIds = useCommandViewStore((state) => state.setRevealedIds);
+  const clearRevealedIds = useCommandViewStore((state) => state.clearRevealedIds);
+  const markVisibilityInteraction = useCommandViewStore((state) => state.markVisibilityInteraction);
   const lensConfig = useMemo(() => getOrganizationGraphLensConfig(lens), [lens]);
   const [mode, setMode] = useState(lensConfig.initialMode);
-  const [activePanelTab, setActivePanelTab] = useState("controls");
+  const [activePanelTab, setActivePanelTab] = useState(lens === "command-view" ? "details" : "controls");
   const [selectedElement, setSelectedElement] = useState(null);
   const [focusRequest, setFocusRequest] = useState(null);
   const [pathTraceSelection, setPathTraceSelection] = useState(EMPTY_TRACE_SELECTION);
@@ -6913,6 +7363,11 @@ function OrganizationGraphPage({ lens = "default", timeRange = "30d" }) {
   const rawThemeTokens = readGraphThemeTokens();
   const themeSignature = Object.values(rawThemeTokens).join("|");
   const themeTokens = useMemo(() => rawThemeTokens, [themeSignature]);
+  useEffect(() => {
+    if (visualizationMode === "spatial") {
+      setVisualizationMode("network");
+    }
+  }, [setVisualizationMode, visualizationMode]);
   const baseGraph = useMemo(() => {
     if (!organizationModel) {
       return null;
@@ -6930,12 +7385,48 @@ function OrganizationGraphPage({ lens = "default", timeRange = "30d" }) {
       commandViewData
     });
   }, [baseGraph, commandViewData, deferredFilters]);
+  const visibilityProjection = useMemo(() => {
+    if (!graph || lens !== "command-view") {
+      const resourceCount = getGraphCountByKind(graph, "resource");
+      return {
+        hiddenIds: /* @__PURE__ */ new Set(),
+        hiddenEdgeIds: /* @__PURE__ */ new Set(),
+        totalResourceCount: resourceCount,
+        visibleResourceCount: resourceCount,
+        hiddenResourceCount: 0,
+        hiddenDiagnosticResourceCount: 0
+      };
+    }
+    return getCommandViewVisibilityProjection({
+      graph,
+      commandViewData,
+      resourcesHidden,
+      diagnosticsHidden,
+      diagnosticCategories,
+      revealedIds,
+      mode
+    });
+  }, [commandViewData, diagnosticCategories, diagnosticsHidden, graph, lens, mode, resourcesHidden, revealedIds]);
+  const visibleGraph = useMemo(() => {
+    if (!graph || visibilityProjection.hiddenIds.size === 0) {
+      return graph;
+    }
+    return {
+      ...graph,
+      nodes: graph.nodes.filter((node) => !visibilityProjection.hiddenIds.has(node.id)),
+      edges: graph.edges.filter((edge) => !visibilityProjection.hiddenEdgeIds.has(edge.id))
+    };
+  }, [graph, visibilityProjection]);
+  const renderGraph = useMemo(
+    () => lens === "command-view" ? getCommandViewRenderableGraph(visibleGraph) : visibleGraph,
+    [lens, visibleGraph]
+  );
   const selectedGraphNode = useMemo(() => {
-    if (!graph || !selectedElement || selectedElement.type !== "node") {
+    if (!visibleGraph || !selectedElement || selectedElement.type !== "node") {
       return null;
     }
-    return graph.nodes.find((node) => node.id === selectedElement.id) ?? null;
-  }, [graph, selectedElement]);
+    return visibleGraph.nodes.find((node) => node.id === selectedElement.id) ?? null;
+  }, [selectedElement, visibleGraph]);
   const selectedCommandViewResourceId = selectedGraphNode?.kind === "resource" ? selectedGraphNode.sourceId ?? null : null;
   const isExecutableSelection = lens === "command-view" && selectedGraphNode?.kind === "resource" && (selectedGraphNode.resourceType === "agent" || selectedGraphNode.resourceType === "workflow") && Boolean(selectedCommandViewResourceId);
   const isCheckpointSelection = lens === "command-view" && selectedGraphNode?.kind === "resource" && selectedGraphNode.resourceType === "human_checkpoint" && Boolean(selectedCommandViewResourceId);
@@ -6949,11 +7440,11 @@ function OrganizationGraphPage({ lens = "default", timeRange = "30d" }) {
     enabled: isCheckpointSelection
   });
   const traceResult = useMemo(() => {
-    if (!graph) {
+    if (!visibleGraph) {
       return null;
     }
-    return resolveOrganizationGraphPathTrace(graph, pathTraceSelection);
-  }, [graph, pathTraceSelection]);
+    return resolveOrganizationGraphPathTrace(visibleGraph, pathTraceSelection);
+  }, [pathTraceSelection, visibleGraph]);
   const activeTraceResult = mode === "trace" ? traceResult : null;
   const operationalOverview = useMemo(
     () => lens === "command-view" ? getCommandViewOperationalOverview(commandViewData, commandViewStats) : null,
@@ -6977,8 +7468,8 @@ function OrganizationGraphPage({ lens = "default", timeRange = "30d" }) {
     [baseGraph, commandViewStats, lens]
   );
   const visibleCommandViewHealth = useMemo(
-    () => graph && commandViewHealthByNodeId ? graph.nodes.map((node) => commandViewHealthByNodeId.get(node.id) ?? null).filter((entry) => entry !== null) : [],
-    [commandViewHealthByNodeId, graph]
+    () => visibleGraph && commandViewHealthByNodeId ? visibleGraph.nodes.map((node) => commandViewHealthByNodeId.get(node.id) ?? null).filter((entry) => entry !== null) : [],
+    [commandViewHealthByNodeId, visibleGraph]
   );
   const visibleHotspots = useMemo(() => rankCommandViewHotspots(visibleCommandViewHealth), [visibleCommandViewHealth]);
   const pendingCheckpointHotspot = useMemo(
@@ -6986,11 +7477,11 @@ function OrganizationGraphPage({ lens = "default", timeRange = "30d" }) {
     [visibleCommandViewHealth]
   );
   const jumpToResourceOptions = useMemo(
-    () => (graph?.nodes ?? []).filter((node) => node.kind === "resource").map((node) => ({
+    () => (visibleGraph?.nodes ?? []).filter((node) => node.kind === "resource").map((node) => ({
       value: node.id,
       label: node.label
     })).sort((left, right) => left.label.localeCompare(right.label)),
-    [graph]
+    [visibleGraph]
   );
   const focusGraphNode = useEffectEvent((nodeId2) => {
     setFocusRequest({
@@ -6999,7 +7490,7 @@ function OrganizationGraphPage({ lens = "default", timeRange = "30d" }) {
     });
   });
   const focusCommandViewResource = useEffectEvent((resourceId) => {
-    const focusNode = graph?.nodes.find((node) => node.kind === "resource" && node.sourceId === resourceId);
+    const focusNode = visibleGraph?.nodes.find((node) => node.kind === "resource" && node.sourceId === resourceId);
     if (!focusNode) {
       return;
     }
@@ -7007,26 +7498,64 @@ function OrganizationGraphPage({ lens = "default", timeRange = "30d" }) {
     setSelectedElement({ type: "node", id: focusNode.id });
     focusGraphNode(focusNode.id);
   });
+  const handleResetFilters = useEffectEvent(() => {
+    resetFilters();
+    clearRevealedIds();
+    setSelectedElement(null);
+    setPathTraceSelection(EMPTY_TRACE_SELECTION);
+  });
+  const handleResourcesHiddenChange = useEffectEvent((value) => {
+    setResourcesHidden(value);
+    if (value) {
+      clearRevealedIds();
+      setSelectedElement(null);
+    }
+  });
+  const handleDiagnosticsHiddenChange = useEffectEvent((value) => {
+    setDiagnosticsHidden(value);
+    if (value) {
+      clearRevealedIds();
+    }
+  });
+  const revealAllResources = useEffectEvent(() => {
+    setResourcesHidden(false);
+    setDiagnosticsHidden(false);
+    clearRevealedIds();
+  });
   const handleSelectElement = useEffectEvent((element) => {
     if (!element) {
+      if (!selectedElement && revealedIds.size === 0) {
+        return;
+      }
       setSelectedElement(null);
+      clearRevealedIds();
       return;
     }
     if (mode === "map" && element.type === "node" && selectedElement?.type === "node" && selectedElement.id === element.id) {
       setActivePanelTab("details");
       return;
     }
+    if (lens === "command-view" && element.type === "node" && graph) {
+      const connectedHiddenIds = getConnectedHiddenResourceIds(graph, element.id, visibilityProjection.hiddenIds);
+      setRevealedIds(connectedHiddenIds);
+      if (connectedHiddenIds.size > 0) {
+        markVisibilityInteraction();
+      }
+    } else {
+      clearRevealedIds();
+    }
     setSelectedElement(element);
   });
   useEffect(() => {
     if (!graph || !selectedElement) {
       return;
     }
-    const elementExists = selectedElement.type === "node" ? graph.nodes.some((node) => node.id === selectedElement.id) : graph.edges.some((edge) => edge.id === selectedElement.id);
+    const elementExists = selectedElement.type === "node" ? Boolean(visibleGraph?.nodes.some((node) => node.id === selectedElement.id)) : Boolean(visibleGraph?.edges.some((edge) => edge.id === selectedElement.id));
     if (!elementExists) {
       setSelectedElement(null);
+      clearRevealedIds();
     }
-  }, [graph, selectedElement]);
+  }, [clearRevealedIds, selectedElement, visibleGraph]);
   useEffect(() => {
     if (lens !== "command-view") {
       return;
@@ -7049,7 +7578,7 @@ function OrganizationGraphPage({ lens = "default", timeRange = "30d" }) {
       });
       return;
     }
-    const visibleNodeIds = new Set(graph.nodes.map((node) => node.id));
+    const visibleNodeIds = new Set(visibleGraph?.nodes.map((node) => node.id) ?? []);
     setPathTraceSelection((current) => {
       const sourceId = current.sourceId && visibleNodeIds.has(current.sourceId) ? current.sourceId : null;
       const targetId = current.targetId && visibleNodeIds.has(current.targetId) ? current.targetId : null;
@@ -7058,14 +7587,14 @@ function OrganizationGraphPage({ lens = "default", timeRange = "30d" }) {
       }
       return { sourceId, targetId };
     });
-  }, [graph]);
+  }, [graph, visibleGraph]);
   if (!organizationModel) {
     return /* @__PURE__ */ jsxs(Stack, { children: [
       /* @__PURE__ */ jsx(
         PageTitleCaption,
         {
-          title: "Organization Graph",
-          caption: "The shared graph surface needs an organization model before it can render."
+          title: lens === "command-view" ? "Command View" : "Operations Graph",
+          caption: "This surface needs an organization model before it can render."
         }
       ),
       /* @__PURE__ */ jsx(Paper, { withBorder: true, p: "xl", children: /* @__PURE__ */ jsx(
@@ -7078,363 +7607,357 @@ function OrganizationGraphPage({ lens = "default", timeRange = "30d" }) {
       ) })
     ] });
   }
-  return /* @__PURE__ */ jsx(Stack, { gap: "lg", style: { flex: 1, minHeight: 0, overflowX: "hidden", overflowY: "auto" }, children: /* @__PURE__ */ jsxs(Tabs, { value: activePanelTab, onChange: setActivePanelTab, keepMounted: false, children: [
-    lens === "command-view" ? /* @__PURE__ */ jsx(Box, { mb: "sm", children: /* @__PURE__ */ jsx(
-      CommandViewHealthStrip,
-      {
-        overview: operationalOverview,
-        hotspots: visibleHotspots,
-        visibleResources: getGraphCountByKind(graph, "resource"),
-        selectedLabel: selectedGraphNode?.label ?? null,
-        onFocusHotspot: focusCommandViewResource,
-        onResetFocus: () => {
-          setMode("map");
-          setSelectedElement(null);
-        }
-      }
-    ) }) : null,
-    /* @__PURE__ */ jsxs(
-      Paper,
-      {
-        withBorder: true,
-        style: {
-          display: "flex",
-          flexDirection: "column",
-          background: "var(--glass-background)",
-          backdropFilter: "var(--glass-blur)",
-          boxShadow: "var(--card-shadow)"
-        },
-        children: [
-          /* @__PURE__ */ jsx(Box, { style: { height: "65vh", minHeight: 560, position: "relative" }, children: graph && graph.nodes.length > 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(Stack, { gap: "lg", style: { flex: 1, minHeight: 0 }, children: /* @__PURE__ */ jsx(Tabs, { value: activePanelTab, onChange: setActivePanelTab, keepMounted: false, children: /* @__PURE__ */ jsxs(
+    Paper,
+    {
+      withBorder: true,
+      radius: "md",
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        minHeight: 0,
+        background: "var(--color-surface)",
+        boxShadow: "var(--card-shadow)",
+        overflow: "hidden"
+      },
+      children: [
+        lens === "command-view" ? /* @__PURE__ */ jsx(
+          CommandViewHealthStrip,
+          {
+            overview: operationalOverview,
+            hotspots: visibleHotspots,
+            visibleResources: visibilityProjection.visibleResourceCount,
+            hiddenResources: visibilityProjection.hiddenResourceCount,
+            resourcesHidden,
+            selectedLabel: selectedGraphNode?.label ?? null,
+            onFocusHotspot: focusCommandViewResource,
+            onResourcesHiddenChange: handleResourcesHiddenChange,
+            onResetFocus: () => {
+              setMode("map");
+              setSelectedElement(null);
+              clearRevealedIds();
+            }
+          }
+        ) : null,
+        /* @__PURE__ */ jsx(
+          Box,
+          {
+            style: {
+              height: lens === "command-view" ? "54vh" : "62vh",
+              minHeight: lens === "command-view" ? 420 : 520,
+              maxHeight: lens === "command-view" ? 620 : void 0,
+              position: "relative"
+            },
+            children: renderGraph && renderGraph.nodes.length > 0 ? /* @__PURE__ */ jsx(
               OrganizationGraphCanvas,
               {
-                graph,
+                graph: renderGraph,
                 mode,
+                visualizationMode: lens === "command-view" ? effectiveVisualizationMode : "network",
                 selectedElement,
                 traceResult: activeTraceResult,
+                hiddenIds: EMPTY_GRAPH_HIDDEN_IDS,
+                hiddenEdgeIds: EMPTY_GRAPH_HIDDEN_EDGE_IDS,
                 themeTokens,
                 commandViewHealthByNodeId,
                 focusRequest,
+                toolbar: /* @__PURE__ */ jsxs(Group, { gap: 4, wrap: "nowrap", children: [
+                  lens === "command-view" ? /* @__PURE__ */ jsx(
+                    SegmentedControl,
+                    {
+                      value: effectiveVisualizationMode,
+                      onChange: (value) => setVisualizationMode(value),
+                      size: "xs",
+                      data: COMMAND_VIEW_VISUALIZATION_MODES
+                    }
+                  ) : null,
+                  /* @__PURE__ */ jsx(
+                    SegmentedControl,
+                    {
+                      value: mode,
+                      onChange: (value) => setMode(value),
+                      size: "xs",
+                      data: [
+                        { label: "Map", value: "map" },
+                        { label: "Trace", value: "trace" },
+                        { label: "Impact", value: "impact" }
+                      ]
+                    }
+                  )
+                ] }),
                 onSelectElement: handleSelectElement
               }
+            ) : /* @__PURE__ */ jsx(
+              EmptyState,
+              {
+                icon: IconTopologyStar3,
+                title: "No graph elements match the current filters",
+                description: lens === "command-view" && visibilityProjection.hiddenResourceCount > 0 ? "Reveal resources or adjust filters to bring graph elements back into view." : "Adjust the graph controls to bring semantic nodes, topology nodes, or relationship matches back into view."
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx(Box, { p: "xs", children: /* @__PURE__ */ jsxs(Group, { justify: "space-between", align: "center", wrap: "wrap", children: [
+          /* @__PURE__ */ jsxs(Group, { gap: "sm", wrap: "wrap", children: [
+            /* @__PURE__ */ jsx(Text, { fw: 700, size: "sm", children: lens === "command-view" ? "Command View" : lensConfig.title }),
+            /* @__PURE__ */ jsxs(Tabs.List, { children: [
+              lens === "command-view" ? null : /* @__PURE__ */ jsx(Tabs.Tab, { value: "controls", children: "Controls" }),
+              /* @__PURE__ */ jsx(Tabs.Tab, { value: "trace", children: "Trace" }),
+              /* @__PURE__ */ jsx(Tabs.Tab, { value: "details", children: "Details" }),
+              /* @__PURE__ */ jsx(Tabs.Tab, { value: "runtime", children: "Runtime" })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs(Group, { gap: "xs", wrap: "wrap", children: [
+            /* @__PURE__ */ jsx(
+              Select,
+              {
+                placeholder: "Jump to resource",
+                searchable: true,
+                clearable: true,
+                size: "xs",
+                data: jumpToResourceOptions,
+                value: selectedElement?.type === "node" ? selectedElement.id : null,
+                onChange: (value) => {
+                  if (!value) {
+                    return;
+                  }
+                  setMode("map");
+                  setSelectedElement({ type: "node", id: value });
+                  focusGraphNode(value);
+                },
+                styles: {
+                  root: { minWidth: 220 }
+                },
+                nothingFoundMessage: "No matching resource"
+              }
             ),
             /* @__PURE__ */ jsx(
-              Box,
+              Button,
               {
-                style: {
-                  position: "absolute",
-                  top: 16,
-                  right: 16,
-                  zIndex: 3,
-                  maxWidth: "calc(100% - 320px)"
+                size: "xs",
+                variant: "subtle",
+                onClick: () => {
+                  setSelectedElement(null);
+                  clearRevealedIds();
                 },
-                children: /* @__PURE__ */ jsx(
-                  SegmentedControl,
-                  {
-                    value: mode,
-                    onChange: (value) => setMode(value),
-                    size: "xs",
-                    data: [
-                      { label: "Map", value: "map" },
-                      { label: "Trace", value: "trace" },
-                      { label: "Impact", value: "impact" }
-                    ]
-                  }
-                )
+                disabled: !selectedElement,
+                children: "Clear selection"
               }
-            )
-          ] }) : /* @__PURE__ */ jsx(
-            EmptyState,
-            {
-              icon: IconTopologyStar3,
-              title: "No graph elements match the current filters",
-              description: "Adjust the graph controls to bring semantic nodes, topology nodes, or relationship matches back into view."
-            }
-          ) }),
-          /* @__PURE__ */ jsxs(
-            Box,
-            {
-              style: {
-                marginLeft: "calc(var(--mantine-spacing-md) * -1)",
-                marginRight: "calc(var(--mantine-spacing-md) * -1)",
-                marginBottom: "calc(var(--mantine-spacing-md) * -1)",
-                marginTop: "var(--mantine-spacing-md)",
-                borderTop: "1px solid var(--color-border)"
-              },
-              children: [
-                /* @__PURE__ */ jsx(Box, { p: "sm", children: /* @__PURE__ */ jsxs(Group, { justify: "space-between", align: "center", wrap: "wrap", children: [
-                  /* @__PURE__ */ jsxs(Group, { gap: "sm", wrap: "wrap", children: [
-                    /* @__PURE__ */ jsx(Text, { fw: 700, size: "sm", children: lens === "command-view" ? "Command View" : lensConfig.title }),
-                    /* @__PURE__ */ jsxs(Tabs.List, { children: [
-                      /* @__PURE__ */ jsx(Tabs.Tab, { value: "controls", children: "Controls" }),
-                      /* @__PURE__ */ jsx(Tabs.Tab, { value: "trace", children: "Trace" }),
-                      /* @__PURE__ */ jsx(Tabs.Tab, { value: "details", children: "Details" }),
-                      /* @__PURE__ */ jsx(Tabs.Tab, { value: "runtime", children: "Runtime" })
-                    ] })
-                  ] }),
-                  /* @__PURE__ */ jsxs(Group, { gap: "xs", wrap: "wrap", children: [
-                    /* @__PURE__ */ jsx(
-                      Select,
-                      {
-                        placeholder: "Jump to resource",
-                        searchable: true,
-                        clearable: true,
-                        size: "xs",
-                        data: jumpToResourceOptions,
-                        value: selectedElement?.type === "node" ? selectedElement.id : null,
-                        onChange: (value) => {
-                          if (!value) {
-                            return;
-                          }
-                          setMode("map");
-                          setSelectedElement({ type: "node", id: value });
-                          focusGraphNode(value);
-                        },
-                        styles: {
-                          root: { minWidth: 220 }
-                        },
-                        nothingFoundMessage: "No matching resource"
-                      }
-                    ),
-                    /* @__PURE__ */ jsx(
-                      Button,
-                      {
-                        size: "xs",
-                        variant: "subtle",
-                        onClick: () => setSelectedElement(null),
-                        disabled: !selectedElement,
-                        children: "Clear selection"
-                      }
-                    ),
-                    /* @__PURE__ */ jsx(
-                      Button,
-                      {
-                        size: "xs",
-                        variant: "subtle",
-                        onClick: () => setPathTraceSelection(EMPTY_TRACE_SELECTION),
-                        disabled: !pathTraceSelection.sourceId && !pathTraceSelection.targetId,
-                        children: "Clear trace"
-                      }
-                    ),
-                    /* @__PURE__ */ jsx(Button, { size: "xs", variant: "subtle", onClick: resetFilters, children: "Reset filters" })
-                  ] })
-                ] }) }),
-                /* @__PURE__ */ jsxs(
-                  Box,
+            ),
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                size: "xs",
+                variant: "subtle",
+                onClick: () => setPathTraceSelection(EMPTY_TRACE_SELECTION),
+                disabled: !pathTraceSelection.sourceId && !pathTraceSelection.targetId,
+                children: "Clear trace"
+              }
+            ),
+            /* @__PURE__ */ jsx(Button, { size: "xs", variant: "subtle", onClick: handleResetFilters, children: "Reset filters" })
+          ] })
+        ] }) }),
+        /* @__PURE__ */ jsxs(
+          Box,
+          {
+            p: "xs",
+            className: HIDE_SCROLLBAR_CLASS_NAME,
+            style: {
+              padding: "var(--mantine-spacing-md)",
+              paddingTop: 0
+            },
+            children: [
+              lens === "command-view" ? null : /* @__PURE__ */ jsx(Tabs.Panel, { value: "controls", pt: 0, children: /* @__PURE__ */ jsxs(Stack, { gap: "md", children: [
+                /* @__PURE__ */ jsx(
+                  FilterPanel,
                   {
-                    className: HIDE_SCROLLBAR_CLASS_NAME,
-                    style: {
-                      padding: "var(--mantine-spacing-md)",
-                      paddingTop: 0
-                    },
-                    children: [
-                      /* @__PURE__ */ jsx(Tabs.Panel, { value: "controls", pt: 0, children: /* @__PURE__ */ jsxs(Stack, { gap: "md", children: [
-                        /* @__PURE__ */ jsxs(SimpleGrid, { cols: { base: 1, lg: 3 }, spacing: "md", children: [
-                          /* @__PURE__ */ jsx(
-                            Paper,
-                            {
-                              withBorder: true,
-                              p: "md",
-                              radius: "lg",
-                              style: { background: "var(--color-surface)", boxShadow: "var(--card-shadow)" },
-                              children: /* @__PURE__ */ jsxs(Stack, { gap: "sm", children: [
-                                /* @__PURE__ */ jsx(Text, { size: "sm", fw: 700, children: "Filters" }),
-                                /* @__PURE__ */ jsx(
-                                  OrganizationGraphFilterToolbar,
-                                  {
-                                    value: filters,
-                                    onChange: updateFilters,
-                                    disabled: !baseGraph,
-                                    resetValue: toolbarResetValue
-                                  }
-                                )
-                              ] })
-                            }
-                          ),
-                          /* @__PURE__ */ jsxs(SimpleGrid, { cols: { base: 1, sm: 2 }, spacing: "md", style: { gridColumn: "span 2" }, children: [
-                            /* @__PURE__ */ jsxs(
-                              Card,
-                              {
-                                withBorder: true,
-                                radius: "lg",
-                                style: { background: "var(--color-surface)", boxShadow: "var(--card-shadow)" },
-                                children: [
-                                  /* @__PURE__ */ jsx(Text, { size: "xs", tt: "uppercase", fw: 700, c: "dimmed", children: lens === "command-view" ? "Tracked runs" : "Visible nodes" }),
-                                  /* @__PURE__ */ jsx(Text, { size: "xl", fw: 700, children: lens === "command-view" ? operationalOverview?.totalRuns ?? 0 : graph?.nodes.length ?? 0 }),
-                                  /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: lens === "command-view" ? `${timeRange} execution window` : `of ${baseGraph?.nodes.length ?? 0} total` })
-                                ]
-                              }
-                            ),
-                            /* @__PURE__ */ jsxs(
-                              Card,
-                              {
-                                withBorder: true,
-                                radius: "lg",
-                                style: { background: "var(--color-surface)", boxShadow: "var(--card-shadow)" },
-                                children: [
-                                  /* @__PURE__ */ jsx(Text, { size: "xs", tt: "uppercase", fw: 700, c: "dimmed", children: lens === "command-view" ? "Success rate" : "Visible edges" }),
-                                  /* @__PURE__ */ jsx(Text, { size: "xl", fw: 700, children: lens === "command-view" ? `${Math.round(operationalOverview?.successRate ?? 0)}%` : graph?.edges.length ?? 0 }),
-                                  /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: lens === "command-view" ? `${operationalOverview?.successCount ?? 0} successful runs` : `of ${baseGraph?.edges.length ?? 0} total` })
-                                ]
-                              }
-                            ),
-                            /* @__PURE__ */ jsxs(
-                              Card,
-                              {
-                                withBorder: true,
-                                radius: "lg",
-                                style: { background: "var(--color-surface)", boxShadow: "var(--card-shadow)" },
-                                children: [
-                                  /* @__PURE__ */ jsx(Text, { size: "xs", tt: "uppercase", fw: 700, c: "dimmed", children: lens === "command-view" ? "Failing resources" : "Visible features" }),
-                                  /* @__PURE__ */ jsx(Text, { size: "xl", fw: 700, children: lens === "command-view" ? operationalOverview?.topFailingResources.length ?? 0 : getGraphCountByKind(graph, "feature") }),
-                                  /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: lens === "command-view" ? operationalOverview?.topFailingResources.length ? operationalOverview.topFailingResources.map((resource) => `${resource.label} (${resource.failureCount})`).join(", ") : "No failing resources in the current window" : `of ${getGraphCountByKind(baseGraph, "feature")} total` })
-                                ]
-                              }
-                            ),
-                            /* @__PURE__ */ jsxs(
-                              Card,
-                              {
-                                withBorder: true,
-                                radius: "lg",
-                                style: { background: "var(--color-surface)", boxShadow: "var(--card-shadow)" },
-                                children: [
-                                  /* @__PURE__ */ jsx(Text, { size: "xs", tt: "uppercase", fw: 700, c: "dimmed", children: lens === "command-view" ? "Pending approvals" : "Visible resources" }),
-                                  /* @__PURE__ */ jsx(Text, { size: "xl", fw: 700, children: lens === "command-view" ? operationalOverview?.pendingApprovals ?? 0 : getGraphCountByKind(graph, "resource") }),
-                                  /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: lens === "command-view" ? `${operationalOverview?.activeHumanCheckpoints ?? 0} active checkpoint queues` : `of ${getGraphCountByKind(baseGraph, "resource")} total` })
-                                ]
-                              }
-                            )
-                          ] })
-                        ] }),
-                        /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
-                          /* @__PURE__ */ jsx(Badge, { variant: "light", children: lens === "command-view" ? "Operations lens" : "Shared graph" }),
-                          /* @__PURE__ */ jsx(
-                            Badge,
-                            {
-                              variant: "light",
-                              color: organizationGraph.available ? "var(--color-success)" : "var(--color-text-subtle)",
-                              children: organizationGraph.available ? "Provider graph surface ready" : "Provider graph surface missing"
-                            }
-                          ),
-                          /* @__PURE__ */ jsx(
-                            Badge,
-                            {
-                              variant: "light",
-                              color: commandViewData ? "var(--color-primary)" : "var(--color-text-subtle)",
-                              children: commandViewData ? "Topology bridged" : isLoading ? "Topology loading" : "Semantic only"
-                            }
-                          ),
-                          error ? /* @__PURE__ */ jsx(Badge, { variant: "light", color: "var(--color-error)", children: "Topology unavailable" }) : null
-                        ] }),
+                    filters,
+                    onChangeFilters: updateFilters,
+                    resetValue: toolbarResetValue,
+                    disabled: !baseGraph,
+                    commandViewData,
+                    lens,
+                    resourcesHidden,
+                    diagnosticsHidden,
+                    onResourcesHiddenChange: handleResourcesHiddenChange,
+                    onDiagnosticsHiddenChange: handleDiagnosticsHiddenChange,
+                    onRevealResources: revealAllResources,
+                    onResetFilters: handleResetFilters,
+                    visibilityCounts: visibilityProjection,
+                    graph: visibleGraph,
+                    baseGraph
+                  }
+                ),
+                /* @__PURE__ */ jsxs(SimpleGrid, { cols: { base: 1, sm: 2, lg: 4 }, spacing: "md", children: [
+                  /* @__PURE__ */ jsxs(
+                    Card,
+                    {
+                      withBorder: true,
+                      radius: "lg",
+                      style: { background: "var(--color-surface)", boxShadow: "var(--card-shadow)" },
+                      children: [
+                        /* @__PURE__ */ jsx(Text, { size: "xs", tt: "uppercase", fw: 700, c: "dimmed", children: "Visible nodes" }),
+                        /* @__PURE__ */ jsx(Text, { size: "xl", fw: 700, children: visibleGraph?.nodes.length ?? 0 }),
                         /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
-                          "Showing ",
-                          graph?.nodes.length ?? 0,
-                          " nodes and ",
-                          graph?.edges.length ?? 0,
-                          " edges in the current projection. In map mode, single-click isolates a node neighborhood and clicking another node pivots the focus."
+                          "of ",
+                          baseGraph?.nodes.length ?? 0,
+                          " total"
                         ] })
-                      ] }) }),
-                      /* @__PURE__ */ jsx(Tabs.Panel, { value: "trace", pt: 0, children: /* @__PURE__ */ jsxs(Stack, { gap: "md", children: [
-                        /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "Trace mode resolves shortest directed paths inside the current filtered graph." }),
-                        graph ? /* @__PURE__ */ jsx(
-                          OrganizationGraphPathTraceControls,
-                          {
-                            graph,
-                            value: pathTraceSelection,
-                            onChange: setPathTraceSelection,
-                            disabled: graph.nodes.length === 0
-                          }
-                        ) : /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "Graph data is not available yet." })
-                      ] }) }),
-                      /* @__PURE__ */ jsx(Tabs.Panel, { value: "details", pt: 0, children: /* @__PURE__ */ jsx(
-                        OrganizationGraphDetailPanel,
-                        {
-                          graph,
-                          selectedElement,
-                          supplementalSummary: selectionOperationalSummary,
-                          followUpSections,
-                          onClearSelection: () => setSelectedElement(null)
-                        }
-                      ) }),
-                      /* @__PURE__ */ jsx(Tabs.Panel, { value: "runtime", pt: 0, children: /* @__PURE__ */ jsxs(Stack, { gap: "sm", children: [
-                        /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
-                          "Active Lens: ",
-                          lens
-                        ] }),
-                        /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
-                          "Feature ID: ",
-                          organizationGraph.featureId ?? "unresolved"
-                        ] }),
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs(
+                    Card,
+                    {
+                      withBorder: true,
+                      radius: "lg",
+                      style: { background: "var(--color-surface)", boxShadow: "var(--card-shadow)" },
+                      children: [
+                        /* @__PURE__ */ jsx(Text, { size: "xs", tt: "uppercase", fw: 700, c: "dimmed", children: "Visible edges" }),
+                        /* @__PURE__ */ jsx(Text, { size: "xl", fw: 700, children: visibleGraph?.edges.length ?? 0 }),
                         /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
-                          "Feature Path: ",
-                          organizationGraph.featurePath ?? "unresolved"
-                        ] }),
+                          "of ",
+                          baseGraph?.edges.length ?? 0,
+                          " total"
+                        ] })
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs(
+                    Card,
+                    {
+                      withBorder: true,
+                      radius: "lg",
+                      style: { background: "var(--color-surface)", boxShadow: "var(--card-shadow)" },
+                      children: [
+                        /* @__PURE__ */ jsx(Text, { size: "xs", tt: "uppercase", fw: 700, c: "dimmed", children: "Visible features" }),
+                        /* @__PURE__ */ jsx(Text, { size: "xl", fw: 700, children: getGraphCountByKind(visibleGraph, "feature") }),
                         /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
-                          "Active Mode: ",
-                          mode
-                        ] }),
-                        operationalOverview ? /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
-                          "Operational Snapshot: ",
-                          operationalOverview.trackedResources,
-                          " resources,",
-                          " ",
-                          operationalOverview.pendingApprovals,
-                          " pending approvals, generated",
-                          " ",
-                          formatGeneratedTimestamp(operationalOverview.generatedAt)
-                        ] }) : null,
-                        pendingCheckpointHotspot ? /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
-                          "Active queue hotspot: ",
-                          pendingCheckpointHotspot.resourceId,
-                          " with",
-                          " ",
-                          pendingCheckpointHotspot.pendingCount,
-                          " pending approvals."
-                        ] }) : null,
-                        /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "Graph Build: semantic derivation plus bridged Command View topology" }),
+                          "of ",
+                          getGraphCountByKind(baseGraph, "feature"),
+                          " total"
+                        ] })
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs(
+                    Card,
+                    {
+                      withBorder: true,
+                      radius: "lg",
+                      style: { background: "var(--color-surface)", boxShadow: "var(--card-shadow)" },
+                      children: [
+                        /* @__PURE__ */ jsx(Text, { size: "xs", tt: "uppercase", fw: 700, c: "dimmed", children: "Visible resources" }),
+                        /* @__PURE__ */ jsx(Text, { size: "xl", fw: 700, children: getGraphCountByKind(visibleGraph, "resource") }),
                         /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
-                          "Projection: ",
-                          graph?.nodes.length ?? 0,
-                          " visible nodes, ",
-                          graph?.edges.length ?? 0,
-                          " visible edges"
-                        ] }),
-                        isLoading ? /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "Topology bridge is still loading; semantic nodes remain available." }) : null,
-                        error ? /* @__PURE__ */ jsxs(Text, { size: "sm", c: "red", children: [
-                          "Topology bridge error: ",
-                          error.message
-                        ] }) : null
-                      ] }) })
-                    ]
+                          "of ",
+                          getGraphCountByKind(baseGraph, "resource"),
+                          " total"
+                        ] })
+                      ]
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
+                  /* @__PURE__ */ jsx(Badge, { variant: "light", children: "Command View graph" }),
+                  /* @__PURE__ */ jsx(
+                    Badge,
+                    {
+                      variant: "light",
+                      color: commandViewData ? "var(--color-primary)" : "var(--color-text-subtle)",
+                      children: commandViewData ? "Topology bridged" : isLoading ? "Topology loading" : "Semantic only"
+                    }
+                  ),
+                  error ? /* @__PURE__ */ jsx(Badge, { variant: "light", color: "var(--color-error)", children: "Topology unavailable" }) : null
+                ] }),
+                /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
+                  "Showing ",
+                  visibleGraph?.nodes.length ?? 0,
+                  " nodes and ",
+                  visibleGraph?.edges.length ?? 0,
+                  " edges in the current projection. In map mode, single-click isolates a node neighborhood and clicking another node pivots the focus."
+                ] })
+              ] }) }),
+              /* @__PURE__ */ jsx(Tabs.Panel, { value: "trace", pt: 0, children: /* @__PURE__ */ jsxs(Stack, { gap: "md", children: [
+                /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "Trace mode resolves shortest directed paths inside the current filtered graph." }),
+                visibleGraph ? /* @__PURE__ */ jsx(
+                  OrganizationGraphPathTraceControls,
+                  {
+                    graph: visibleGraph,
+                    value: pathTraceSelection,
+                    onChange: setPathTraceSelection,
+                    disabled: visibleGraph.nodes.length === 0
                   }
-                )
-              ]
-            }
-          )
-        ]
-      }
-    )
-  ] }) });
+                ) : /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "Graph data is not available yet." })
+              ] }) }),
+              /* @__PURE__ */ jsx(Tabs.Panel, { value: "details", pt: 0, children: /* @__PURE__ */ jsx(
+                OrganizationGraphDetailPanel,
+                {
+                  graph: visibleGraph,
+                  selectedElement,
+                  supplementalSummary: selectionOperationalSummary,
+                  followUpSections,
+                  onClearSelection: () => {
+                    setSelectedElement(null);
+                    clearRevealedIds();
+                  }
+                }
+              ) }),
+              /* @__PURE__ */ jsx(Tabs.Panel, { value: "runtime", pt: 0, children: /* @__PURE__ */ jsxs(Stack, { gap: "sm", children: [
+                /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
+                  "Active Lens: ",
+                  lens
+                ] }),
+                /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
+                  "Active Mode: ",
+                  mode
+                ] }),
+                lens === "command-view" ? /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
+                  "Visualization: ",
+                  effectiveVisualizationMode
+                ] }) : null,
+                operationalOverview ? /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
+                  "Operational Snapshot: ",
+                  operationalOverview.trackedResources,
+                  " resources,",
+                  " ",
+                  operationalOverview.pendingApprovals,
+                  " pending approvals, generated",
+                  " ",
+                  formatGeneratedTimestamp(operationalOverview.generatedAt)
+                ] }) : null,
+                pendingCheckpointHotspot ? /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
+                  "Active queue hotspot: ",
+                  pendingCheckpointHotspot.resourceId,
+                  " with",
+                  " ",
+                  pendingCheckpointHotspot.pendingCount,
+                  " pending approvals."
+                ] }) : null,
+                /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "Graph Build: semantic derivation plus bridged Command View topology" }),
+                /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
+                  "Projection: ",
+                  visibleGraph?.nodes.length ?? 0,
+                  " visible nodes, ",
+                  visibleGraph?.edges.length ?? 0,
+                  " visible edges"
+                ] }),
+                isLoading ? /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "Topology bridge is still loading; semantic nodes remain available." }) : null,
+                error ? /* @__PURE__ */ jsxs(Text, { size: "sm", c: "red", children: [
+                  "Topology bridge error: ",
+                  error.message
+                ] }) : null
+              ] }) })
+            ]
+          }
+        )
+      ]
+    }
+  ) }) });
 }
 function CommandViewPage({ timeRange }) {
   return /* @__PURE__ */ jsx(OrganizationGraphPage, { lens: "command-view", timeRange });
 }
-var FILTER_STATE_ICONS2 = {
-  neutral: IconCircleDashed,
-  include: IconCircleCheck,
-  exclude: IconCircleX
-};
-var FILTER_STATE_COLORS2 = {
-  neutral: "var(--color-surface-hover)",
-  include: "var(--mantine-color-green-6)",
-  exclude: "var(--mantine-color-red-6)"
-};
-var FILTER_STATE_LABELS2 = {
-  neutral: "Not filtered",
-  include: "Include only",
-  exclude: "Exclude"
-};
 var EXECUTION_SECTIONS = [
   { status: "failed", title: "Failed Executions", badgeColor: "red" },
   { status: "warning", title: "Warning Executions", badgeColor: "yellow" },
@@ -7488,22 +8011,21 @@ function ExecutionStatusSection({ executions, status, title, badgeColor, resourc
 function CommandViewSidebarContent({ timeRange }) {
   const theme = useMantineTheme();
   const colors = useCyberColors();
-  const lensConfig = getOrganizationGraphLensConfig("command-view");
+  const { organizationModel } = useElevasisFeatures();
+  const lensConfig = useMemo(() => getOrganizationGraphLensConfig("command-view"), []);
+  const { filters, resetFilters, updateFilters } = useOrganizationGraphFilters(lensConfig.initialFilters);
+  const toolbarResetValue = useMemo(
+    () => createOrganizationGraphFilters(lensConfig.initialFilters),
+    [lensConfig.initialFilters]
+  );
   const selectedNodeId = useCommandViewStore((s) => s.selectedNodeId);
-  const { filters, updateFilters } = useOrganizationGraphFilters(lensConfig.initialFilters);
-  const statusFilter = filters.environmentStatus;
-  const showIntegrations = filters.showIntegrations;
-  const domainFilters = filters.domainFilters;
-  const cycleDomainFilter = (domainId) => {
-    const current = domainFilters[domainId] ?? "neutral";
-    const nextState = current === "neutral" ? "include" : current === "include" ? "exclude" : "neutral";
-    updateFilters({
-      domainFilters: {
-        ...domainFilters,
-        [domainId]: nextState
-      }
-    });
-  };
+  const resourcesHidden = useCommandViewStore((s) => s.resourcesHidden);
+  const setResourcesHidden = useCommandViewStore((s) => s.setResourcesHidden);
+  const diagnosticsHidden = useCommandViewStore((s) => s.diagnosticsHidden);
+  const setDiagnosticsHidden = useCommandViewStore((s) => s.setDiagnosticsHidden);
+  const diagnosticCategories = useCommandViewStore((s) => s.diagnosticCategories);
+  const revealedIds = useCommandViewStore((s) => s.revealedIds);
+  const clearRevealedIds = useCommandViewStore((s) => s.clearRevealedIds);
   const { data, isLoading } = useCommandViewData();
   const { data: statsData } = useCommandViewStats(timeRange);
   const cleanData = data ?? null;
@@ -7512,33 +8034,85 @@ function CommandViewSidebarContent({ timeRange }) {
     if (!statsData) return cleanData;
     return mergeStatsWithTopology(cleanData, statsData);
   }, [cleanData, statsData]);
+  const baseGraph = useMemo(() => {
+    if (!organizationModel) {
+      return null;
+    }
+    return buildOrganizationGraph({
+      organizationModel,
+      commandViewData: cleanData ?? void 0
+    });
+  }, [cleanData, organizationModel]);
+  const graph = useMemo(() => {
+    if (!baseGraph) {
+      return null;
+    }
+    return filterOrganizationGraph(baseGraph, filters, {
+      commandViewData: cleanData
+    });
+  }, [baseGraph, cleanData, filters]);
+  const visibilityProjection = useMemo(() => {
+    if (!graph) {
+      return {
+        hiddenIds: /* @__PURE__ */ new Set(),
+        hiddenEdgeIds: /* @__PURE__ */ new Set(),
+        totalResourceCount: 0,
+        visibleResourceCount: 0,
+        hiddenResourceCount: 0,
+        hiddenDiagnosticResourceCount: 0
+      };
+    }
+    return getCommandViewVisibilityProjection({
+      graph,
+      commandViewData: cleanData,
+      resourcesHidden,
+      diagnosticsHidden,
+      diagnosticCategories,
+      revealedIds,
+      mode: "map"
+    });
+  }, [cleanData, diagnosticCategories, diagnosticsHidden, graph, resourcesHidden, revealedIds]);
+  const visibleGraph = useMemo(() => {
+    if (!graph || visibilityProjection.hiddenIds.size === 0) {
+      return graph;
+    }
+    return {
+      ...graph,
+      nodes: graph.nodes.filter((node) => !visibilityProjection.hiddenIds.has(node.id)),
+      edges: graph.edges.filter((edge) => !visibilityProjection.hiddenEdgeIds.has(edge.id))
+    };
+  }, [graph, visibilityProjection]);
+  const handleResetFilters = () => {
+    resetFilters();
+    clearRevealedIds();
+  };
+  const handleResourcesHiddenChange = (value) => {
+    setResourcesHidden(value);
+    if (value) {
+      clearRevealedIds();
+    }
+  };
+  const handleDiagnosticsHiddenChange = (value) => {
+    setDiagnosticsHidden(value);
+    if (value) {
+      clearRevealedIds();
+    }
+  };
+  const revealAllResources = () => {
+    setResourcesHidden(false);
+    setDiagnosticsHidden(false);
+    clearRevealedIds();
+  };
   const { donutSuccessCount, donutFailedCount } = useMemo(() => {
     if (!cleanData || !statsData) return { donutSuccessCount: 0, donutFailedCount: 0 };
-    const includes = Object.entries(domainFilters).filter(([, v]) => v === "include").map(([k]) => k);
-    const excludes = Object.entries(domainFilters).filter(([, v]) => v === "exclude").map(([k]) => k);
     const allResources = [
       ...cleanData.agents,
       ...cleanData.workflows,
       ...cleanData.triggers,
-      ...showIntegrations ? cleanData.integrations : [],
+      ...cleanData.integrations,
       ...cleanData.externalResources ?? [],
       ...cleanData.humanCheckpoints ?? []
-    ].filter((resource) => {
-      const facets = [
-        ...resource.category ? [`category:${resource.category}`] : [],
-        ...resource.links?.map((link) => link.nodeId) ?? []
-      ];
-      if (excludes.length > 0 && facets.some((d) => excludes.includes(d))) return false;
-      if (includes.length > 0 && !facets.some((d) => includes.includes(d))) return false;
-      if (statusFilter !== "all" && resource.status !== statusFilter) return false;
-      if (filters.resourceTypes.length > 0) {
-        const normalizedResourceType = resource.type === "human" ? "human_checkpoint" : resource.type;
-        if (!filters.resourceTypes.includes(normalizedResourceType)) {
-          return false;
-        }
-      }
-      return true;
-    });
+    ];
     const filteredIds = new Set(allResources.map((resource) => resource.resourceId));
     let success = 0;
     let failed = 0;
@@ -7549,18 +8123,7 @@ function CommandViewSidebarContent({ timeRange }) {
       }
     }
     return { donutSuccessCount: success, donutFailedCount: failed };
-  }, [cleanData, domainFilters, filters.resourceTypes, showIntegrations, statsData, statusFilter]);
-  const resourceFacets = useMemo(() => {
-    if (!cleanData) return [];
-    return collectResourceFilterFacets([
-      ...cleanData.agents,
-      ...cleanData.workflows,
-      ...cleanData.triggers,
-      ...cleanData.integrations,
-      ...cleanData.externalResources ?? [],
-      ...cleanData.humanCheckpoints ?? []
-    ]);
-  }, [cleanData]);
+  }, [cleanData, statsData]);
   const selectedNode = useMemo(() => {
     if (!selectedNodeId || !dataWithStats) return null;
     const allNodes = [
@@ -7624,17 +8187,18 @@ function CommandViewSidebarContent({ timeRange }) {
   if (isLoading && !data) {
     return /* @__PURE__ */ jsx(SubshellSidebarLoader, {});
   }
-  return /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(
     Box,
     {
       style: {
         flex: 1,
+        height: "100%",
         minHeight: 0,
         display: "flex",
         flexDirection: "column",
         overflow: "hidden"
       },
-      children: [
+      children: /* @__PURE__ */ jsxs("div", { style: { flex: 1, minHeight: 0, overflowY: "auto", overflowX: "hidden" }, children: [
         /* @__PURE__ */ jsx(SubshellSidebarSection, { icon: IconSitemap, label: "Command View" }),
         /* @__PURE__ */ jsx(Box, { style: { padding: theme.spacing.sm, paddingBottom: 0 }, children: /* @__PURE__ */ jsx(Box, { pb: "xs", mb: 4, children: /* @__PURE__ */ jsx(
           CyberDonut,
@@ -7648,165 +8212,105 @@ function CommandViewSidebarContent({ timeRange }) {
             colors
           }
         ) }) }),
-        /* @__PURE__ */ jsxs("div", { style: { flex: 1, overflow: "auto" }, children: [
-          /* @__PURE__ */ jsx(SubshellSidebarSection, { icon: IconAdjustmentsHorizontal, label: "Node Filters", withTopBorder: true }),
-          /* @__PURE__ */ jsxs(Stack, { gap: "sm", p: "sm", children: [
-            /* @__PURE__ */ jsxs("div", { children: [
-              /* @__PURE__ */ jsx(Text, { size: "sm", mb: 8, children: "Environment" }),
-              /* @__PURE__ */ jsx(
-                SegmentedControl,
-                {
-                  value: statusFilter,
-                  onChange: (value) => updateFilters({
-                    environmentStatus: value
-                  }),
-                  data: [
-                    { label: "All", value: "all" },
-                    { label: "Prod", value: "prod" },
-                    { label: "Dev", value: "dev" }
-                  ],
-                  size: "xs",
-                  fullWidth: true,
-                  color: "var(--color-primary)"
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsx(
-              Switch,
-              {
-                label: "Show Integrations",
-                description: "Toggle integration resources in the graph projection",
-                checked: showIntegrations,
-                onChange: (event) => updateFilters({
-                  showIntegrations: event.currentTarget.checked
-                }),
-                size: "sm"
-              }
-            ),
-            resourceFacets.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
-              /* @__PURE__ */ jsx(Text, { size: "sm", mb: 8, children: "Resource Facet" }),
-              /* @__PURE__ */ jsx(Stack, { gap: 2, children: resourceFacets.map((facet) => {
-                const filterState = domainFilters[facet.id] || "neutral";
-                const StateIcon = FILTER_STATE_ICONS2[filterState];
-                return /* @__PURE__ */ jsx(
-                  UnstyledButton,
-                  {
-                    title: FILTER_STATE_LABELS2[filterState],
-                    onClick: () => cycleDomainFilter(facet.id),
-                    py: 5,
-                    px: 6,
-                    style: {
-                      transition: "background-color var(--duration-fast) var(--easing)",
-                      "&:hover": { backgroundColor: "var(--color-surface-hover)" }
-                    },
-                    children: /* @__PURE__ */ jsxs(Group, { gap: 10, wrap: "nowrap", children: [
-                      /* @__PURE__ */ jsx(
-                        StateIcon,
-                        {
-                          size: 16,
-                          style: {
-                            color: FILTER_STATE_COLORS2[filterState],
-                            flexShrink: 0,
-                            transition: "color var(--duration-fast) var(--easing)"
-                          }
-                        }
-                      ),
-                      /* @__PURE__ */ jsx(
-                        Text,
-                        {
-                          size: "sm",
-                          truncate: true,
-                          fw: filterState !== "neutral" ? 500 : 400,
-                          c: filterState !== "neutral" ? void 0 : "dimmed",
-                          children: facet.label
-                        }
-                      )
-                    ] })
-                  },
-                  facet.id
-                );
-              }) })
-            ] })
-          ] }),
-          selectedNode && /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx(Divider, {}),
-            /* @__PURE__ */ jsxs(Stack, { gap: "xs", p: "sm", mt: 8, children: [
-              /* @__PURE__ */ jsx(Title, { order: 4, children: selectedNode.name }),
-              selectedNode.description && /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: selectedNode.description }),
-              (isNavigable || isHumanCheckpoint) && /* @__PURE__ */ jsxs(
-                Button,
-                {
-                  component: "a",
-                  href: getNavigationUrl() || "#",
-                  target: "_blank",
-                  rel: "noopener noreferrer",
-                  variant: "light",
-                  size: "xs",
-                  leftSection: /* @__PURE__ */ jsx(IconExternalLink, { size: 14 }),
-                  mt: 4,
-                  children: [
-                    "Go to",
-                    " ",
-                    selectedNode.type === "agent" ? "Agent" : selectedNode.type === "workflow" ? "Workflow" : "Queue"
-                  ]
-                }
-              ),
-              /* @__PURE__ */ jsx(Space, { h: "sm" })
-            ] })
-          ] }),
-          selectedNode && isNavigable && /* @__PURE__ */ jsx(Stack, { p: "sm", children: executionsLoading ? /* @__PURE__ */ jsx(Center, { py: "md", children: /* @__PURE__ */ jsx(Loader, { size: "sm" }) }) : executionsError ? /* @__PURE__ */ jsx(APIErrorAlert, { error: executionsError, title: "Failed to load executions" }) : executionsData && executionsData.executions.length > 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [
-            EXECUTION_SECTIONS.map((section) => /* @__PURE__ */ jsx(
-              ExecutionStatusSection,
-              {
-                executions: executionsData.executions,
-                status: section.status,
-                title: section.title,
-                badgeColor: section.badgeColor,
-                resourceUrl
-              },
-              section.status
-            )),
-            totalExecutionPages(executionsData.totalExecutions) > 1 && /* @__PURE__ */ jsx(Group, { justify: "center", children: /* @__PURE__ */ jsx(
-              Pagination,
-              {
-                size: "sm",
-                total: totalExecutionPages(executionsData.totalExecutions),
-                value: executionPage,
-                onChange: setExecutionPage,
-                boundaries: 1
-              }
-            ) })
-          ] }) : executionsData ? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "No executions in the selected time range" }) : null }),
-          selectedNode && isHumanCheckpoint && /* @__PURE__ */ jsx(Stack, { p: "sm", children: checkpointTasksLoading ? /* @__PURE__ */ jsx(Center, { py: "md", children: /* @__PURE__ */ jsx(Loader, { size: "sm" }) }) : checkpointTasksError ? /* @__PURE__ */ jsx(APIErrorAlert, { error: checkpointTasksError, title: "Failed to load pending tasks" }) : checkpointTasksData && checkpointTasksData.tasks.length > 0 ? /* @__PURE__ */ jsxs("div", { children: [
-            /* @__PURE__ */ jsxs(Group, { justify: "space-between", mb: 8, children: [
-              /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", fw: 600, tt: "uppercase", children: "Pending Tasks" }),
-              /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: checkpointTasksData.tasks.length })
-            ] }),
-            /* @__PURE__ */ jsx(Stack, { gap: "xs", children: checkpointTasksData.tasks.map((task) => /* @__PURE__ */ jsxs(
-              Card,
+        /* @__PURE__ */ jsx(Box, { p: "sm", children: /* @__PURE__ */ jsx(
+          FilterPanel,
+          {
+            filters,
+            onChangeFilters: updateFilters,
+            resetValue: toolbarResetValue,
+            disabled: !baseGraph,
+            commandViewData: cleanData,
+            lens: "command-view",
+            resourcesHidden,
+            diagnosticsHidden,
+            onResourcesHiddenChange: handleResourcesHiddenChange,
+            onDiagnosticsHiddenChange: handleDiagnosticsHiddenChange,
+            onRevealResources: revealAllResources,
+            onResetFilters: handleResetFilters,
+            visibilityCounts: visibilityProjection,
+            graph: visibleGraph,
+            baseGraph,
+            layout: "stack"
+          }
+        ) }),
+        selectedNode && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Divider, {}),
+          /* @__PURE__ */ jsxs(Stack, { gap: "xs", p: "sm", mt: 8, children: [
+            /* @__PURE__ */ jsx(Title, { order: 4, children: selectedNode.name }),
+            selectedNode.description && /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: selectedNode.description }),
+            (isNavigable || isHumanCheckpoint) && /* @__PURE__ */ jsxs(
+              Button,
               {
-                padding: "xs",
-                withBorder: true,
                 component: "a",
-                href: `/operations/command-queue?task=${task.id}`,
+                href: getNavigationUrl() || "#",
                 target: "_blank",
                 rel: "noopener noreferrer",
-                style: HOVER_CARD_STYLE,
-                onMouseEnter: handleHoverEnter,
-                onMouseLeave: handleHoverLeave,
+                variant: "light",
+                size: "xs",
+                leftSection: /* @__PURE__ */ jsx(IconExternalLink, { size: 14 }),
+                mt: 4,
                 children: [
-                  /* @__PURE__ */ jsxs(Group, { justify: "space-between", mb: task.description ? 4 : 0, children: [
-                    /* @__PURE__ */ jsx(Badge, { size: "xs", color: "orange", variant: "light", children: "pending" }),
-                    /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: formatRelativeTime3(task.createdAt) })
-                  ] }),
-                  task.description && /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", lineClamp: 2, children: task.description })
+                  "Go to",
+                  " ",
+                  selectedNode.type === "agent" ? "Agent" : selectedNode.type === "workflow" ? "Workflow" : "Queue"
                 ]
-              },
-              task.id
-            )) })
-          ] }) : checkpointTasksData ? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "No pending tasks" }) : null })
-        ] })
-      ]
+              }
+            ),
+            /* @__PURE__ */ jsx(Space, { h: "sm" })
+          ] })
+        ] }),
+        selectedNode && isNavigable && /* @__PURE__ */ jsx(Stack, { p: "sm", children: executionsLoading ? /* @__PURE__ */ jsx(Center, { py: "md", children: /* @__PURE__ */ jsx(Loader, { size: "sm" }) }) : executionsError ? /* @__PURE__ */ jsx(APIErrorAlert, { error: executionsError, title: "Failed to load executions" }) : executionsData && executionsData.executions.length > 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          EXECUTION_SECTIONS.map((section) => /* @__PURE__ */ jsx(
+            ExecutionStatusSection,
+            {
+              executions: executionsData.executions,
+              status: section.status,
+              title: section.title,
+              badgeColor: section.badgeColor,
+              resourceUrl
+            },
+            section.status
+          )),
+          totalExecutionPages(executionsData.totalExecutions) > 1 && /* @__PURE__ */ jsx(Group, { justify: "center", children: /* @__PURE__ */ jsx(
+            Pagination,
+            {
+              size: "sm",
+              total: totalExecutionPages(executionsData.totalExecutions),
+              value: executionPage,
+              onChange: setExecutionPage,
+              boundaries: 1
+            }
+          ) })
+        ] }) : executionsData ? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "No executions in the selected time range" }) : null }),
+        selectedNode && isHumanCheckpoint && /* @__PURE__ */ jsx(Stack, { p: "sm", children: checkpointTasksLoading ? /* @__PURE__ */ jsx(Center, { py: "md", children: /* @__PURE__ */ jsx(Loader, { size: "sm" }) }) : checkpointTasksError ? /* @__PURE__ */ jsx(APIErrorAlert, { error: checkpointTasksError, title: "Failed to load pending tasks" }) : checkpointTasksData && checkpointTasksData.tasks.length > 0 ? /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsxs(Group, { justify: "space-between", mb: 8, children: [
+            /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", fw: 600, tt: "uppercase", children: "Pending Tasks" }),
+            /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: checkpointTasksData.tasks.length })
+          ] }),
+          /* @__PURE__ */ jsx(Stack, { gap: "xs", children: checkpointTasksData.tasks.map((task) => /* @__PURE__ */ jsxs(
+            Card,
+            {
+              padding: "xs",
+              withBorder: true,
+              component: "a",
+              href: `/operations/command-queue?task=${task.id}`,
+              target: "_blank",
+              rel: "noopener noreferrer",
+              style: HOVER_CARD_STYLE,
+              onMouseEnter: handleHoverEnter,
+              onMouseLeave: handleHoverLeave,
+              children: [
+                /* @__PURE__ */ jsxs(Group, { justify: "space-between", mb: task.description ? 4 : 0, children: [
+                  /* @__PURE__ */ jsx(Badge, { size: "xs", color: "orange", variant: "light", children: "pending" }),
+                  /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: formatRelativeTime3(task.createdAt) })
+                ] }),
+                task.description && /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", lineClamp: 2, children: task.description })
+              ]
+            },
+            task.id
+          )) })
+        ] }) : checkpointTasksData ? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "No pending tasks" }) : null })
+      ] })
     }
   );
 }
@@ -9116,15 +9620,15 @@ var OperationsSidebar = () => {
 function CommandQueueShell({ children }) {
   return /* @__PURE__ */ jsx(SubshellContentContainer, { children });
 }
+var commandViewSidebarWidth = 320;
+var defaultOperationsSidebarWidth = 250;
 var operationsManifest = {
   key: "operations",
   featureId: "operations",
-  capabilityIds: ["operations.organization-graph", "operations.command-view"],
+  capabilityIds: ["operations.command-view"],
   icon: IconCode,
   sidebar: OperationsSidebar,
-  organizationGraph: {
-    featureId: "operations.graph"
-  }
+  sidebarWidth: ({ currentPath }) => currentPath.startsWith("/operations/command-view") ? commandViewSidebarWidth : defaultOperationsSidebarWidth
 };
 
 export { ActionModal, AgentDefinitionDisplay, AgentExecutionLogs, AgentExecutionPanel, AgentSessionGroup, BaseExecutionLogs, BaseExecutionLogsHeader, BaseExecutionLogsStates, CheckpointGroup, CollapsibleJsonSection, CommandQueueDetailPage, CommandQueuePage, CommandQueueShell, CommandQueueSidebar, CommandQueueSidebarMiddle, CommandQueueSidebarTop, CommandQueueTaskRow, CommandViewPage, CommandViewSidebarContent, ConfigCard, ContentSections, ContextUsageBadge, ContractDisplay, ExecuteWorkflowModal, ExecutionErrorSection, ExecutionPanel, LogEntry, LogGroup, NewKnowledgeMapEdge, NewKnowledgeMapGraph, NewKnowledgeMapNode, OperationsSidebar, OperationsSidebarMiddle, OperationsSidebarTop, OrganizationGraphPage, ResourceDefinitionSection, ResourceDetailPage, ResourceErrorState, ResourceExecuteDialog, ResourceExecuteForm, ResourceFilter, ResourceHeader, ResourceNotFoundState, ResourcesPage, ResourcesSidebar, SessionChatArea, SessionChatInterface, SessionChatPage, SessionDetailsSidebar, SessionExecutionLogs, SessionHeader, SessionListItem, SessionMemory, SessionsPage, SessionsSidebar, ToolsListDisplay, WorkflowDefinitionDisplay, WorkflowExecutionLogs, WorkflowExecutionPanel, getExecutionStatusConfig, getIcon, getLogLevelConfig, iconMap, operationsManifest, useNewKnowledgeMapLayout };