@checkstack/dependency-frontend 0.5.3 → 0.5.5

package/CHANGELOG.md

@@ -1,5 +1,89 @@
 # @checkstack/dependency-frontend
 
+## 0.5.5
+
+### Patch Changes
+
+- 56e7c75: Hide navigation, actions and links that the current user cannot use, so anonymous
+  and read-only users no longer see entries that lead to "Access Denied" or to
+  actions the server would reject.
+
+  - **Sidebar**: a nav entry can now declare a dynamic `nav.isVisible({ accessRules, isAuthenticated })` predicate (in addition to the static `accessRule`). A group whose every entry is filtered out is no longer rendered. The filtering/grouping logic is extracted to a pure, unit-tested helper.
+  - **Infrastructure**: its sidebar entry is shown only when the user can READ at least one contributed tab (queue, cache, …), instead of always (it previously had no static rule because tabs are contributed at runtime).
+  - **Notification Settings**: hidden from anonymous users - notifications are per-user, so an anonymous visitor can't have any.
+  - **Anomaly Mute / Suppress**: the "Mute" / "Mute all" controls (a per-user preference) are hidden from anonymous visitors; the "Suppress" control is gated on `anomalyAccess.feed.manage`. Both were previously always visible.
+  - **Dashboard**: the "Open Catalog" actions (which open the manage-only Catalog config page) are hidden from users without `catalogAccess.system.manage`, and the "View catalog" link is gated on `catalogAccess.system.read`.
+  - **Dashboard status signals**: the per-system status rows contributed by plugins (`SystemSignalsSlot`) now render as a LINK only when the user can open the target, and as plain text otherwise. `SystemSignal` gains an optional `accessRule`; the healthcheck, anomaly, and dependency fillers set it for their gated targets (check-history / assignments / dependency-map). Signals pointing at ungated pages (incident / maintenance / SLO detail) stay links.
+  - **Plugin Manager**: the "Install plugin" button (which opens the install-gated page) is hidden from users with only `plugin` view access.
+  - **Satellites**: the page is entirely manage-gated, but its route/sidebar entry was gated on `read`, so read-only users saw the nav item and hit "Access Denied" on click. The route and nav entry now require `satellite.manage`.
+
+  The `@checkstack/ai-backend` bump is only the regenerated bundled docs index
+  (the frontend routing guide gained the `nav.isVisible` section); no code change.
+
+  **BREAKING (`@checkstack/frontend-api`):** the `AccessApi` interface gains a
+  required `useIsAuthenticated()` method. Custom `AccessApi` implementations must
+  add it (it returns `{ loading, isAuthenticated }`). The built-in auth
+  implementation and the no-auth fallback already do. `NavEntry` also gains an
+  optional `isVisible` predicate (purely additive).
+
+- Updated dependencies [460ffd6]
+- Updated dependencies [56e7c75]
+- Updated dependencies [56e7c75]
+  - @checkstack/dashboard-frontend@0.8.5
+  - @checkstack/frontend-api@0.9.0
+  - @checkstack/catalog-common@2.3.4
+  - @checkstack/ui@1.15.1
+  - @checkstack/common@0.15.0
+  - @checkstack/dependency-common@1.2.4
+  - @checkstack/gitops-common@0.6.3
+  - @checkstack/healthcheck-common@1.5.4
+  - @checkstack/gitops-frontend@0.5.5
+  - @checkstack/signal-frontend@0.2.4
+
+## 0.5.4
+
+### Patch Changes
+
+- 50123c7: Fix the dependency map page's scrolling and make its header consistent with the
+  rest of the app. The page sized its canvas with a fixed `calc(100vh - 12rem)`,
+  which could overshoot the available space (double-scroll) depending on viewport
+  chrome, and it used a bespoke `<h1>` header with no icon. It now renders through
+  `PageLayout` (with the `GitBranch` nav icon and `fillHeight`), so the React Flow
+  canvas fills the app shell's bounded flex content area and only it scrolls/pans -
+  the page itself never scrolls.
+- fb705df: Upgrade React 18 to React 19 across the platform.
+
+  **BREAKING (runtime frontend plugins):** React is shared as a Module Federation
+  singleton, so the host now provides **React 19** to every runtime plugin.
+  Frontend plugins built against React 18 must be rebuilt against React 19
+  (`react` / `react-dom` `^19`). The scaffold templates and the host/plugin MF
+  `requiredVersion` are updated to `^19`. `react` (and now `react-dom`) are pinned
+  to a single version across the workspace via syncpack so the singleton can never
+  skew (react and react-dom must match exactly).
+
+  The React 19 removed-API surface was audited - the codebase used only no-arg
+  `useRef()` (now `useRef<T | undefined>(undefined)`); no `ReactDOM.render`,
+  legacy context, string refs, or function-component `defaultProps`. This also
+  clears the `IMPORT_IS_UNDEFINED` build warnings for `React.use` /
+  `React.useOptimistic` (react-router 7 feature-detection), which React 19 exports.
+
+  The downstream `*-frontend` packages (and `@checkstack/infrastructure-common`)
+  receive only the mechanical `react` dependency bump (`patch`); the framework
+  packages carrying the shared-singleton change are bumped `minor`.
+
+- Updated dependencies [9d8961c]
+- Updated dependencies [fb705df]
+  - @checkstack/ui@1.15.0
+  - @checkstack/frontend-api@0.8.0
+  - @checkstack/dashboard-frontend@0.8.4
+  - @checkstack/gitops-frontend@0.5.4
+  - @checkstack/signal-frontend@0.2.3
+  - @checkstack/catalog-common@2.3.3
+  - @checkstack/dependency-common@1.2.3
+  - @checkstack/common@0.14.1
+  - @checkstack/gitops-common@0.6.2
+  - @checkstack/healthcheck-common@1.5.3
+
 ## 0.5.3
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@checkstack/dependency-frontend",
-  "version": "0.5.3",
+  "version": "0.5.5",
   "license": "Elastic-2.0",
   "type": "module",
   "main": "src/index.tsx",
@@ -13,25 +13,25 @@
     "lint:code": "eslint . --max-warnings 0"
   },
   "dependencies": {
-    "@checkstack/catalog-common": "2.3.2",
-    "@checkstack/common": "0.14.1",
-    "@checkstack/dashboard-frontend": "0.8.3",
-    "@checkstack/dependency-common": "1.2.2",
-    "@checkstack/frontend-api": "0.7.2",
-    "@checkstack/gitops-common": "0.6.2",
-    "@checkstack/gitops-frontend": "0.5.3",
-    "@checkstack/healthcheck-common": "1.5.2",
-    "@checkstack/signal-frontend": "0.2.2",
-    "@checkstack/ui": "1.14.0",
+    "@checkstack/catalog-common": "2.3.4",
+    "@checkstack/common": "0.15.0",
+    "@checkstack/dashboard-frontend": "0.8.5",
+    "@checkstack/dependency-common": "1.2.4",
+    "@checkstack/frontend-api": "0.9.0",
+    "@checkstack/gitops-common": "0.6.3",
+    "@checkstack/gitops-frontend": "0.5.5",
+    "@checkstack/healthcheck-common": "1.5.4",
+    "@checkstack/signal-frontend": "0.2.4",
+    "@checkstack/ui": "1.15.1",
     "@xyflow/react": "^12.11.0",
     "lucide-react": "^1.17.0",
-    "react": "^18.3.1",
+    "react": "19.2.7",
     "react-router-dom": "^7.16.0"
   },
   "devDependencies": {
     "typescript": "^5.0.0",
-    "@types/react": "^18.2.0",
+    "@types/react": "^19.0.0",
     "@checkstack/tsconfig": "0.0.7",
-    "@checkstack/scripts": "0.5.0"
+    "@checkstack/scripts": "0.6.1"
   }
 }

package/src/components/DependencyMapPage.tsx

@@ -26,11 +26,12 @@ import {
   Button,
   Badge,
   LoadingSpinner,
+  PageLayout,
   useToast,
   usePerformance,
   cn,
 } from "@checkstack/ui";
-import { Maximize2, Save, RefreshCw, Trash2 } from "lucide-react";
+import { Maximize2, Save, RefreshCw, Trash2, GitBranch } from "lucide-react";
 import type { ImpactType } from "@checkstack/dependency-common";
 import { DependencyEdgeForm } from "./DependencyEdgeForm";
 import { useProvenanceLocks } from "@checkstack/gitops-frontend";
@@ -96,7 +97,9 @@ function DependencyMapContent() {
   const [nodes, setNodes, onNodesChange] = useNodesState<SystemNode>([]);
   const [edges, setEdges, onEdgesChange] = useEdgesState<DependencyEdge>([]);
   const [hasUnsaved, setHasUnsaved] = useState(false);
-  const saveTimeoutRef = useRef<ReturnType<typeof setTimeout>>();
+  const saveTimeoutRef = useRef<ReturnType<typeof setTimeout> | undefined>(
+    undefined,
+  );
 
   // Edge editor state
   const [selectedEdge, setSelectedEdge] = useState<
@@ -409,14 +412,14 @@ function DependencyMapContent() {
 
   if (loading) {
     return (
-      <div className="h-[calc(100vh-12rem)] flex items-center justify-center">
+      <div className="flex-1 min-h-0 flex items-center justify-center">
         <LoadingSpinner />
       </div>
     );
   }
 
   return (
-    <div className="h-[calc(100vh-12rem)] rounded-xl border border-border overflow-hidden bg-background/50">
+    <div className="flex-1 min-h-0 rounded-xl border border-border overflow-hidden bg-background/50">
       <ReactFlow<SystemNode, DependencyEdge>
         nodes={nodes}
         edges={edges}
@@ -699,24 +702,22 @@ function DependencyMapContent() {
 }
 
 /**
- * Dependency Map page — wrapped in ReactFlowProvider and Suspense.
+ * Dependency Map page — standard PageLayout header (matching the GitBranch nav
+ * icon), full-height so the canvas fills the viewport. Wrapped in
+ * ReactFlowProvider and Suspense.
  */
 const DependencyMapPageContent = () => {
   return (
-    <div className="space-y-4">
-      <div className="flex items-center justify-between">
-        <div>
-          <h1 className="text-2xl font-bold text-foreground">Dependency Map</h1>
-          <p className="text-sm text-muted-foreground mt-1">
-            Interactive topology view of system dependencies. Drag nodes to
-            rearrange — positions auto-save.
-          </p>
-        </div>
-      </div>
+    <PageLayout
+      title="Dependency Map"
+      subtitle="Interactive topology view of system dependencies. Drag nodes to rearrange; positions auto-save."
+      icon={GitBranch}
+      fillHeight
+    >
       <ReactFlowProvider>
         <DependencyMapContent />
       </ReactFlowProvider>
-    </div>
+    </PageLayout>
   );
 };
 

package/src/components/DependencySignalsFiller.tsx

@@ -9,6 +9,7 @@ import {
 import {
   DependencyApi,
   dependencyRoutes,
+  dependencyAccess,
   type DerivedState,
 } from "@checkstack/dependency-common";
 
@@ -63,6 +64,8 @@ export const DependencySignalsFiller: React.FC<Props> = ({
             ? `${upstreamCount} upstream ${upstreamCount === 1 ? "system" : "systems"} affected`
             : undefined,
         href: resolveRoute(dependencyRoutes.routes.map),
+        // The dependency map is gated; render as text for users without access.
+        accessRule: dependencyAccess.dependency.read,
         iconName: "GitBranch",
       };
       result[systemId] = [signal];