@checkstack/infrastructure-frontend 0.2.2 → 0.2.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +263 -0
- package/package.json +9 -8
- package/src/components/UserMenuItems.tsx +18 -7
- package/src/index.tsx +1 -0
- package/src/pages/InfrastructureConfigPage.tsx +35 -30
- package/tsconfig.json +14 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,268 @@
|
|
|
1
1
|
# @checkstack/infrastructure-frontend
|
|
2
2
|
|
|
3
|
+
## 0.2.4
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- aa89bc5: Replace the bespoke `registerInfrastructureTab()` registry with a standard
|
|
8
|
+
slot-extension contract (`InfrastructureTabsSlot` from
|
|
9
|
+
`@checkstack/infrastructure-common`). Plugins now contribute infrastructure
|
|
10
|
+
tabs via `createSlotExtension`, depending only on the slot owner.
|
|
11
|
+
|
|
12
|
+
The slot system in `@checkstack/frontend-api` gains a second type parameter
|
|
13
|
+
on `createSlot<TContext, TMetadata>` so extensions can declare typed static
|
|
14
|
+
metadata at registration time (label, icon, access rules, ordering for the
|
|
15
|
+
infrastructure tab bar). A new `useSlotExtensions(slot)` hook returns typed
|
|
16
|
+
extensions and subscribes to plugin lifecycle changes.
|
|
17
|
+
|
|
18
|
+
Each tab body now stacks a **Runtime** sub-section (live state, read-only)
|
|
19
|
+
on top of a **Configuration** sub-section (settings, gated by `canUpdate`).
|
|
20
|
+
|
|
21
|
+
**Queue runtime panel.** Surfaces aggregated counts (pending / processing /
|
|
22
|
+
completed / failed) plus three sub-tabs of recent jobs: **Active**, **Recent
|
|
23
|
+
failed** (with the failure message), and **Recent completed** (with
|
|
24
|
+
duration). Job payloads are deliberately not surfaced — they may carry
|
|
25
|
+
secrets and need a separate manage-access gate to be shown.
|
|
26
|
+
|
|
27
|
+
To support this, `Queue<T>` gains a required `listJobs(opts)` method
|
|
28
|
+
returning `JobSummary[]` (no payloads), and `QueueStats` gains a
|
|
29
|
+
`scope: "instance" | "cluster"` field. The in-memory queue keeps rolling
|
|
30
|
+
ring buffers (200 entries) for completed/failed history and tracks active
|
|
31
|
+
jobs by id; BullMQ uses native `getJobs`. `QueueManager.listJobs` aggregates
|
|
32
|
+
across queues and sorts (most-recent-first for terminal states, FIFO for
|
|
33
|
+
active/waiting/delayed).
|
|
34
|
+
|
|
35
|
+
**Cache runtime panel.** Lists the top N entries by size (or by recency) so
|
|
36
|
+
operators can debug a cache filling up. Values are deliberately omitted —
|
|
37
|
+
PII / secret risk. Backends opt in via an optional `listEntries?` method on
|
|
38
|
+
`CacheProvider`; non-supporting backends return `{ supported: false }` and
|
|
39
|
+
the UI renders a "not supported by this backend" hint. The in-memory cache
|
|
40
|
+
implements it using its existing per-entry byte tracking.
|
|
41
|
+
|
|
42
|
+
`CacheStats` also gains `scope: "instance" | "cluster"`.
|
|
43
|
+
|
|
44
|
+
**Multi-instance scope warning.** A new `<InstanceScopeBanner>` component in
|
|
45
|
+
`@checkstack/ui` renders a yellow banner above any runtime panel whose
|
|
46
|
+
backend reports `scope: "instance"` — i.e. in-memory queue or cache running
|
|
47
|
+
in a horizontally scaled deployment. The banner explains the metrics are
|
|
48
|
+
local to the responding replica and recommends switching to a clustered
|
|
49
|
+
backend (Redis-backed queue / cache) for cluster-wide visibility.
|
|
50
|
+
|
|
51
|
+
**Bug fix — stable cache provider proxy.** `CacheManagerImpl.getProvider()`
|
|
52
|
+
now returns a single stable proxy that delegates to whatever provider is
|
|
53
|
+
currently active. Previously, consumers of `createCachedScope` (and any
|
|
54
|
+
direct `cacheManager.getProvider()` caller) captured the active provider
|
|
55
|
+
reference at plugin-init time. After any `setActiveBackend` call — including
|
|
56
|
+
saving the same memory config in the new Cache tab, which reconstructs the
|
|
57
|
+
in-memory cache — those scopes wrote to an orphaned old provider while the
|
|
58
|
+
runtime panel read stats from the new (empty) one, making the runtime panel
|
|
59
|
+
appear to report 0 keys. With the proxy, all consumers share a single stable
|
|
60
|
+
identity and writes always land in the active provider.
|
|
61
|
+
|
|
62
|
+
**Bytes tracking on the in-memory cache.** `InMemoryCache.getStats().sizeBytes`
|
|
63
|
+
now returns a running approximation (UTF-8 bytes of the key plus
|
|
64
|
+
`v8.serialize(value).byteLength`, with a JSON fallback) that's kept in sync
|
|
65
|
+
across all eviction paths. Treat the number as a sanity gauge; it doesn't
|
|
66
|
+
include `Map` per-entry overhead.
|
|
67
|
+
|
|
68
|
+
**Pagination.** Both `Queue<T>.listJobs` and `CacheProvider.listEntries?`
|
|
69
|
+
are offset-paginated. Inputs gain an `offset: number`; outputs change to
|
|
70
|
+
`{ items, total: number | null, hasMore: boolean }`. `total` is nullable
|
|
71
|
+
so backends that can't compute it cheaply still paginate via `hasMore`.
|
|
72
|
+
The UI uses the existing `<Pagination>` component with a 25-row default
|
|
73
|
+
page size. `QueueManager.listJobs` aggregates by over-fetching
|
|
74
|
+
`[0, offset+limit)` per queue, merge-sorting, then slicing the window —
|
|
75
|
+
optimal for the single-queue case, acceptable for the multi-queue case
|
|
76
|
+
within the UI's reasonable page-depth bounds. BullMQ uses native offset
|
|
77
|
+
ranges via `getJobs(types, start, end)` plus `getJobCounts` for `total`.
|
|
78
|
+
|
|
79
|
+
**Pending tab.** The Queue runtime panel exposes a virtual `"pending"`
|
|
80
|
+
state (waiting ∪ delayed, FIFO). It's now the default sub-tab, since
|
|
81
|
+
"what's queued up?" is the most common question. Per-row state is shown
|
|
82
|
+
when viewing the combined list.
|
|
83
|
+
|
|
84
|
+
**Recurring schedules visible under Pending.** Cron- and interval-based
|
|
85
|
+
recurring jobs (e.g. healthchecks) are surfaced under Pending/Delayed
|
|
86
|
+
between fires, with a `nextRunAt` countdown column and a "(recurring)"
|
|
87
|
+
label. `JobSummary` gains optional `nextRunAt: Date` and `recurring:
|
|
88
|
+
boolean` fields. The in-memory queue synthesises these rows from its
|
|
89
|
+
`recurringJobs` registry; BullMQ already materialises the next fire of
|
|
90
|
+
each scheduler as a delayed job and we now surface its trigger time and
|
|
91
|
+
the `repeatJobKey`-derived `recurring` flag.
|
|
92
|
+
|
|
93
|
+
**Bug fix — drop hook emits with no listeners.** `EventBus.emit` no
|
|
94
|
+
longer enqueues a job when zero listeners (distributed or instance-local)
|
|
95
|
+
are registered for the hook. Previously, hooks like
|
|
96
|
+
`core.plugin.initialized` — emitted on every plugin init but subscribed
|
|
97
|
+
to by nothing in the core repo — accumulated one waiting job per emit
|
|
98
|
+
forever. The in-memory queue's `processNext` short-circuits when there
|
|
99
|
+
are zero consumer groups, so its post-loop cleanup never ran for these
|
|
100
|
+
orphaned jobs. The fix drops the emit at the source and logs a debug
|
|
101
|
+
line. Note: in distributed deployments using a Redis-backed queue, this
|
|
102
|
+
means a subscriber on another replica won't receive an event if no
|
|
103
|
+
replica that emits it has a local listener. Plugins needing cross-process
|
|
104
|
+
delivery must register their listener on every replica that should
|
|
105
|
+
receive the hook.
|
|
106
|
+
|
|
107
|
+
**Breaking notes (treated as minor under beta semantics)**:
|
|
108
|
+
|
|
109
|
+
- `@checkstack/infrastructure-common` removes `registerInfrastructureTab`
|
|
110
|
+
and `getInfrastructureTabs`; former callers must register an extension
|
|
111
|
+
into `InfrastructureTabsSlot`.
|
|
112
|
+
- `@checkstack/queue-api`'s `Queue<T>` interface requires the new
|
|
113
|
+
`listJobs(opts)` method returning `ListJobsResult` (paginated). Both
|
|
114
|
+
bundled queue backends (memory, BullMQ) are updated; out-of-tree
|
|
115
|
+
implementations will need to add it.
|
|
116
|
+
- `QueueStats` and `CacheStats` add a required `scope` field.
|
|
117
|
+
- `CacheProvider.listEntries?` (when implemented) now returns
|
|
118
|
+
`ListEntriesResult` instead of `CacheEntrySummary[]`.
|
|
119
|
+
- `JobState` adds a `"pending"` variant.
|
|
120
|
+
|
|
121
|
+
- 950d6ec: Fix mobile UserMenu items rendering at zero height, group menu items by
|
|
122
|
+
section, and unstack cramped card headers on small viewports.
|
|
123
|
+
|
|
124
|
+
- **UserMenu mobile bug**: On mobile, the user-menu Sheet rendered every
|
|
125
|
+
menu item as a grid row, which combined with `flex-shrink: 1` on each
|
|
126
|
+
item collapsed the buttons whose internal layout uses `display: flex`
|
|
127
|
+
(the items registered with `useNavigate` rather than `<Link>`) to zero
|
|
128
|
+
content height. Switched the mobile container to a flex column with
|
|
129
|
+
`[&>*]:shrink-0` and added `min-h-0` so the sheet scrolls correctly
|
|
130
|
+
when the list overflows.
|
|
131
|
+
|
|
132
|
+
- **UserMenu grouping**: Slot extensions now accept an optional `group`
|
|
133
|
+
field. The user menu buckets `UserMenuItemsSlot` extensions by `group`
|
|
134
|
+
and renders each group under a labeled header (`Workspace`,
|
|
135
|
+
`Reliability`, `Configuration`, `Documentation`, `Account`). Existing
|
|
136
|
+
core plugins are tagged with the appropriate group; third-party plugins
|
|
137
|
+
can pick any of these or supply their own label. Untagged extensions
|
|
138
|
+
render last with no header. `UserMenuItemsBottomSlot` is unaffected.
|
|
139
|
+
|
|
140
|
+
- **Card header responsiveness**: `CardHeaderRow` (the primitive shared by
|
|
141
|
+
Incident, Maintenance, Auth, Catalog, GitOps and other config cards) now
|
|
142
|
+
stacks vertically on narrow viewports and only switches to a single row
|
|
143
|
+
at the `sm` breakpoint, so titles and adjacent filter controls (e.g.
|
|
144
|
+
status `Select`, "Show resolved" checkbox) no longer cram together on
|
|
145
|
+
mobile. Refactored the Incident and Maintenance config pages to use the
|
|
146
|
+
primitive instead of a hand-rolled `flex items-center justify-between`
|
|
147
|
+
row, and made their `Select` triggers full-width on mobile.
|
|
148
|
+
|
|
149
|
+
- Updated dependencies [42abfff]
|
|
150
|
+
- Updated dependencies [3547670]
|
|
151
|
+
- Updated dependencies [1ef2e79]
|
|
152
|
+
- Updated dependencies [aa89bc5]
|
|
153
|
+
- Updated dependencies [950d6ec]
|
|
154
|
+
- Updated dependencies [3547670]
|
|
155
|
+
- @checkstack/common@0.9.0
|
|
156
|
+
- @checkstack/ui@1.8.0
|
|
157
|
+
- @checkstack/frontend-api@0.5.0
|
|
158
|
+
- @checkstack/infrastructure-common@0.3.0
|
|
159
|
+
|
|
160
|
+
## 0.2.3
|
|
161
|
+
|
|
162
|
+
### Patch Changes
|
|
163
|
+
|
|
164
|
+
- 50e5f5f: Runtime plugin system: install + uninstall plugins from npm, GitHub releases
|
|
165
|
+
(including private GitHub Enterprise instances), or tarball uploads at
|
|
166
|
+
runtime, with multi-package bundles, dependency-derived compatibility checks,
|
|
167
|
+
multi-instance coordination via a Postgres artifact store, and
|
|
168
|
+
single-coordinator destructive cleanup.
|
|
169
|
+
|
|
170
|
+
Highlights:
|
|
171
|
+
|
|
172
|
+
- New `PluginSource` discriminated union and `PluginInstaller` /
|
|
173
|
+
`PluginInstallerRegistry` interfaces in `@checkstack/backend-api`. The
|
|
174
|
+
GitHub variant accepts an optional `apiBaseUrl` so deployments backed by
|
|
175
|
+
GitHub Enterprise can install from `https://ghe.example.com/api/v3`
|
|
176
|
+
instead of `api.github.com`.
|
|
177
|
+
- New `installPackageMetadataSchema` (Zod) in `@checkstack/common` validates
|
|
178
|
+
every plugin's `package.json` at install time. Required fields: `name`,
|
|
179
|
+
`version`, `description`, `author`, `license`, `checkstack.type`,
|
|
180
|
+
`checkstack.pluginId`. Optional: `checkstack.bundle`,
|
|
181
|
+
`checkstack.usageInstructions`, `checkstack.allowInstallScripts`.
|
|
182
|
+
- New `pluginManagerContract` in `@checkstack/pluginmanager-common` with
|
|
183
|
+
`list`, `previewInstall`, `install`, `previewUninstall`, `uninstall`, and
|
|
184
|
+
`events` procedures.
|
|
185
|
+
- New `@checkstack/pluginmanager-frontend` admin UI: installed-plugins list
|
|
186
|
+
with per-row uninstall (typed-confirmation modal, schema/configs/cascade
|
|
187
|
+
toggles), install page with NPM / Tarball Upload / GitHub Release tabs
|
|
188
|
+
(Catalog tab disabled — coming soon), and an events page surfacing the
|
|
189
|
+
install/uninstall audit log.
|
|
190
|
+
- New `bunx @checkstack/scripts plugin-pack` CLI for plugin authors —
|
|
191
|
+
per-package mode produces an npm-shaped tarball; `--bundle` mode produces
|
|
192
|
+
an outer tarball containing every sibling declared in
|
|
193
|
+
`package.json#checkstack.bundle`. Published to npm so external authors
|
|
194
|
+
can `bunx` it directly without a workspace checkout.
|
|
195
|
+
- Compatibility derived from `package.json#dependencies` ranges
|
|
196
|
+
(`semver.satisfies` against the platform's loaded `@checkstack/*`
|
|
197
|
+
versions) — no separate `compatibility` field.
|
|
198
|
+
- Multi-instance: originator persists artifacts + `plugins` rows + broadcasts
|
|
199
|
+
install/uninstall; receiving instances do in-process register/unregister
|
|
200
|
+
only. Destructive ops (drop schema, delete plugin_configs, delete
|
|
201
|
+
artifacts, delete `plugins` rows) run exactly once on the originator.
|
|
202
|
+
- Fresh-instance bootstrap: `loadPlugins()` hydrates any
|
|
203
|
+
`is_uninstallable=true` plugin missing from `node_modules` from the
|
|
204
|
+
artifact store before normal Phase 1 register.
|
|
205
|
+
- New schema: `plugin_artifacts` (tarball storage), `plugin_install_events`
|
|
206
|
+
(audit/error log). `plugins` extended with `version`, `metadata`,
|
|
207
|
+
`source`, `bundle_id`, `is_primary`. Local plugin sync now writes
|
|
208
|
+
`version` from each plugin's `package.json` so the admin UI shows real
|
|
209
|
+
versions instead of `—`.
|
|
210
|
+
- Tarball-upload endpoint (`POST /api/pluginmanager/upload-tarball`) for
|
|
211
|
+
the install UI; access-gated by `pluginmanager.plugin.manage`.
|
|
212
|
+
- Plugin Manager menu link added to the user menu (main grid, alongside
|
|
213
|
+
Profile / Notification Settings / etc.).
|
|
214
|
+
|
|
215
|
+
Cross-cutting changes:
|
|
216
|
+
|
|
217
|
+
- Backend request/response logging now flows through `rootLogger` (winston)
|
|
218
|
+
instead of `hono/logger`. 5xx responses include the response body inline
|
|
219
|
+
so swallowed early-return errors are visible in the log.
|
|
220
|
+
- The `/api/:pluginId/*` dispatcher now logs which core service is missing
|
|
221
|
+
or which `pluginId` had no metadata when it 500s.
|
|
222
|
+
- New `registerCorePluginMetadata` on `PluginManager` for core routers
|
|
223
|
+
(like the plugin manager itself) that need their metadata visible to the
|
|
224
|
+
RPC dispatcher without going through the full plugin lifecycle.
|
|
225
|
+
- ESLint: `unicorn/no-null` is now disabled globally. Drizzle distinguishes
|
|
226
|
+
between `null` (writes a real SQL NULL) and `undefined` (skip the column
|
|
227
|
+
on insert), so treating them as interchangeable produced latent bugs at
|
|
228
|
+
the persistence boundary. The bulk of the patch-bumped packages above
|
|
229
|
+
reflect lint-fix touches that landed when this rule was relaxed.
|
|
230
|
+
- Workspace-wide license normalization to `Elastic-2.0` (matches
|
|
231
|
+
`LICENSE.md`). Every `package.json` in the workspace now declares the
|
|
232
|
+
same SPDX identifier; the patch bumps capture this.
|
|
233
|
+
|
|
234
|
+
Plugin packages (every `plugins/*`): added a `pack` npm script
|
|
235
|
+
(`bunx @checkstack/scripts plugin-pack`), mirrored each plugin's
|
|
236
|
+
`pluginId` from `plugin-metadata.ts` into `package.json#checkstack.pluginId`
|
|
237
|
+
so install-time validation passes, stubbed any missing required metadata
|
|
238
|
+
fields (`description`, `author`, `license`), and added
|
|
239
|
+
`checkstack.bundle` to multi-package plugin primaries (telegram, rcon, ssh,
|
|
240
|
+
jira, queue-bullmq, queue-memory, cache-memory).
|
|
241
|
+
|
|
242
|
+
Breaking changes:
|
|
243
|
+
|
|
244
|
+
- The legacy single-method `PluginInstaller` interface (`install(packageName)`)
|
|
245
|
+
is removed. Callers must use `coreServices.pluginInstallerRegistry`.
|
|
246
|
+
- The old `pluginAdminContract` and `createPluginAdminRouter` are removed.
|
|
247
|
+
Replaced by `pluginManagerContract` in `@checkstack/pluginmanager-common`
|
|
248
|
+
and `createPluginManagerRouter` in `core/backend`.
|
|
249
|
+
- `@checkstack/test-utils-backend` no longer exports
|
|
250
|
+
`createMockPluginInstaller` / `MockPluginInstaller` (the legacy interface
|
|
251
|
+
it shimmed is gone).
|
|
252
|
+
|
|
253
|
+
Note: bumps are limited to `minor` (for packages with new public API
|
|
254
|
+
surface) and `patch` (for downstream consumers, license normalization,
|
|
255
|
+
and lint fixes). No `major` bumps despite the `PluginInstaller` removal —
|
|
256
|
+
the legacy interface had no third-party consumers in the wild before this
|
|
257
|
+
runtime plugin system landed, and the contract surface is the same shape
|
|
258
|
+
modulo the rename.
|
|
259
|
+
|
|
260
|
+
- Updated dependencies [50e5f5f]
|
|
261
|
+
- @checkstack/common@0.8.0
|
|
262
|
+
- @checkstack/ui@1.7.1
|
|
263
|
+
- @checkstack/frontend-api@0.4.2
|
|
264
|
+
- @checkstack/infrastructure-common@0.2.3
|
|
265
|
+
|
|
3
266
|
## 0.2.2
|
|
4
267
|
|
|
5
268
|
### Patch Changes
|
package/package.json
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@checkstack/infrastructure-frontend",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.4",
|
|
4
|
+
"license": "Elastic-2.0",
|
|
4
5
|
"type": "module",
|
|
5
6
|
"main": "./dist/index.js",
|
|
6
7
|
"checkstack": {
|
|
@@ -15,15 +16,15 @@
|
|
|
15
16
|
"scripts": {
|
|
16
17
|
"build": "tsc",
|
|
17
18
|
"dev": "tsc --watch",
|
|
18
|
-
"typecheck": "
|
|
19
|
+
"typecheck": "tsgo -b",
|
|
19
20
|
"lint": "bun run lint:code",
|
|
20
21
|
"lint:code": "eslint . --max-warnings 0"
|
|
21
22
|
},
|
|
22
23
|
"dependencies": {
|
|
23
|
-
"@checkstack/common": "0.
|
|
24
|
-
"@checkstack/frontend-api": "0.4.
|
|
25
|
-
"@checkstack/infrastructure-common": "0.2.
|
|
26
|
-
"@checkstack/ui": "1.
|
|
24
|
+
"@checkstack/common": "0.8.0",
|
|
25
|
+
"@checkstack/frontend-api": "0.4.2",
|
|
26
|
+
"@checkstack/infrastructure-common": "0.2.3",
|
|
27
|
+
"@checkstack/ui": "1.7.1",
|
|
27
28
|
"lucide-react": "^0.468.0",
|
|
28
29
|
"react": "^18.3.1",
|
|
29
30
|
"react-router-dom": "^7.1.1"
|
|
@@ -31,7 +32,7 @@
|
|
|
31
32
|
"devDependencies": {
|
|
32
33
|
"@types/react": "^18.3.18",
|
|
33
34
|
"typescript": "^5.7.2",
|
|
34
|
-
"@checkstack/tsconfig": "0.0.
|
|
35
|
-
"@checkstack/scripts": "0.
|
|
35
|
+
"@checkstack/tsconfig": "0.0.7",
|
|
36
|
+
"@checkstack/scripts": "0.3.0"
|
|
36
37
|
}
|
|
37
38
|
}
|
|
@@ -1,26 +1,37 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { Link } from "react-router-dom";
|
|
3
3
|
import { Server } from "lucide-react";
|
|
4
|
-
import
|
|
4
|
+
import {
|
|
5
|
+
type UserMenuItemsContext,
|
|
6
|
+
pluginRegistry,
|
|
7
|
+
} from "@checkstack/frontend-api";
|
|
5
8
|
import { DropdownMenuItem } from "@checkstack/ui";
|
|
6
9
|
import { resolveRoute } from "@checkstack/common";
|
|
7
10
|
import {
|
|
8
11
|
infrastructureRoutes,
|
|
9
|
-
|
|
12
|
+
InfrastructureTabsSlot,
|
|
13
|
+
type InfrastructureTabMetadata,
|
|
10
14
|
} from "@checkstack/infrastructure-common";
|
|
11
15
|
|
|
12
16
|
/**
|
|
13
17
|
* User menu item pointing to Infrastructure Settings.
|
|
14
18
|
* Only visible if the user has read access to at least one infrastructure tab.
|
|
19
|
+
*
|
|
20
|
+
* The check is best-effort/synchronous: it uses the user's pre-fetched
|
|
21
|
+
* access-rule list rather than calling `useAccess`, which avoids hooks in a
|
|
22
|
+
* component that may be rendered without a Suspense boundary.
|
|
15
23
|
*/
|
|
16
24
|
export const InfrastructureUserMenuItems = ({
|
|
17
25
|
accessRules: userPerms,
|
|
18
26
|
}: UserMenuItemsContext) => {
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
const canReadAny = tabs.some((
|
|
22
|
-
const
|
|
23
|
-
|
|
27
|
+
const tabs = pluginRegistry.getExtensions(InfrastructureTabsSlot.id);
|
|
28
|
+
|
|
29
|
+
const canReadAny = tabs.some((ext) => {
|
|
30
|
+
const meta = ext.metadata as InfrastructureTabMetadata | undefined;
|
|
31
|
+
if (!meta) return false;
|
|
32
|
+
return (
|
|
33
|
+
userPerms.includes("*") || userPerms.includes(meta.readAccess.id)
|
|
34
|
+
);
|
|
24
35
|
});
|
|
25
36
|
|
|
26
37
|
if (!canReadAny) {
|
package/src/index.tsx
CHANGED
|
@@ -3,36 +3,44 @@ import {
|
|
|
3
3
|
wrapInSuspense,
|
|
4
4
|
accessApiRef,
|
|
5
5
|
useApi,
|
|
6
|
+
useSlotExtensions,
|
|
6
7
|
} from "@checkstack/frontend-api";
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
9
|
-
PageLayout,
|
|
10
|
-
cn,
|
|
11
|
-
} from "@checkstack/ui";
|
|
8
|
+
import { InfrastructureTabsSlot } from "@checkstack/infrastructure-common";
|
|
9
|
+
import { PageLayout, cn } from "@checkstack/ui";
|
|
12
10
|
import { Server, ShieldOff } from "lucide-react";
|
|
13
11
|
|
|
14
12
|
/**
|
|
15
|
-
* Infrastructure
|
|
13
|
+
* Infrastructure Settings page — IDE Editor pattern.
|
|
16
14
|
*
|
|
17
15
|
* Renders a vertical tab bar on the left with content area on the right.
|
|
18
|
-
* Each tab is
|
|
19
|
-
*
|
|
16
|
+
* Each tab is contributed by a plugin (queue, cache, …) via an extension
|
|
17
|
+
* registered into `InfrastructureTabsSlot`. The shell page is plugin-agnostic
|
|
18
|
+
* and only depends on the slot contract in `@checkstack/infrastructure-common`.
|
|
20
19
|
*/
|
|
21
20
|
const InfrastructureConfigPageContent = () => {
|
|
22
21
|
const accessApi = useApi(accessApiRef);
|
|
23
|
-
const
|
|
22
|
+
const tabs = useSlotExtensions(InfrastructureTabsSlot);
|
|
23
|
+
|
|
24
|
+
const sortedTabs = useMemo(
|
|
25
|
+
() =>
|
|
26
|
+
tabs.toSorted(
|
|
27
|
+
(a, b) => (a.metadata.order ?? 100) - (b.metadata.order ?? 100),
|
|
28
|
+
),
|
|
29
|
+
[tabs],
|
|
30
|
+
);
|
|
24
31
|
|
|
25
|
-
//
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
32
|
+
// Per-tab access lookup (read + manage). Hooks must be called in stable
|
|
33
|
+
// order, so we map over `sortedTabs` — the registry is append-only during
|
|
34
|
+
// a session aside from explicit lifecycle changes, which trigger a full
|
|
35
|
+
// re-render via `useSlotExtensions`.
|
|
36
|
+
const tabAccess = sortedTabs.map((ext) => ({
|
|
37
|
+
extension: ext,
|
|
38
|
+
readResult: accessApi.useAccess(ext.metadata.readAccess),
|
|
39
|
+
manageResult: accessApi.useAccess(ext.metadata.manageAccess),
|
|
30
40
|
}));
|
|
31
41
|
|
|
32
|
-
// Filter to visible tabs
|
|
33
42
|
const visibleTabs = useMemo(
|
|
34
|
-
() =>
|
|
35
|
-
tabAccess.filter(({ readResult }) => readResult.allowed),
|
|
43
|
+
() => tabAccess.filter(({ readResult }) => readResult.allowed),
|
|
36
44
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
37
45
|
[tabAccess.map(({ readResult }) => readResult.allowed).join(",")],
|
|
38
46
|
);
|
|
@@ -41,11 +49,10 @@ const InfrastructureConfigPageContent = () => {
|
|
|
41
49
|
const hasAnyAccess = visibleTabs.length > 0;
|
|
42
50
|
|
|
43
51
|
const [activeTabId, setActiveTabId] = useState<string>();
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
const effectiveActiveTabId = activeTabId ?? visibleTabs[0]?.tab.id;
|
|
52
|
+
const effectiveActiveTabId =
|
|
53
|
+
activeTabId ?? visibleTabs[0]?.extension.id;
|
|
47
54
|
const activeTabEntry = visibleTabs.find(
|
|
48
|
-
(t) => t.
|
|
55
|
+
(t) => t.extension.id === effectiveActiveTabId,
|
|
49
56
|
);
|
|
50
57
|
|
|
51
58
|
if (!isLoading && !hasAnyAccess) {
|
|
@@ -77,15 +84,14 @@ const InfrastructureConfigPageContent = () => {
|
|
|
77
84
|
allowed={hasAnyAccess}
|
|
78
85
|
>
|
|
79
86
|
<div className="flex gap-6 min-h-[600px]">
|
|
80
|
-
{/* Tab Bar */}
|
|
81
87
|
<nav className="flex flex-col gap-1 w-52 shrink-0 border-r border-border pr-4">
|
|
82
|
-
{visibleTabs.map(({
|
|
83
|
-
const Icon =
|
|
84
|
-
const isActive =
|
|
88
|
+
{visibleTabs.map(({ extension }) => {
|
|
89
|
+
const Icon = extension.metadata.icon;
|
|
90
|
+
const isActive = extension.id === effectiveActiveTabId;
|
|
85
91
|
return (
|
|
86
92
|
<button
|
|
87
|
-
key={
|
|
88
|
-
onClick={() => setActiveTabId(
|
|
93
|
+
key={extension.id}
|
|
94
|
+
onClick={() => setActiveTabId(extension.id)}
|
|
89
95
|
className={cn(
|
|
90
96
|
"flex items-center gap-3 rounded-lg px-3 py-2.5 text-sm font-medium transition-colors text-left",
|
|
91
97
|
isActive
|
|
@@ -94,16 +100,15 @@ const InfrastructureConfigPageContent = () => {
|
|
|
94
100
|
)}
|
|
95
101
|
>
|
|
96
102
|
<Icon className="h-4 w-4 shrink-0" />
|
|
97
|
-
{
|
|
103
|
+
{extension.metadata.label}
|
|
98
104
|
</button>
|
|
99
105
|
);
|
|
100
106
|
})}
|
|
101
107
|
</nav>
|
|
102
108
|
|
|
103
|
-
{/* Tab Content */}
|
|
104
109
|
<div className="flex-1 min-w-0">
|
|
105
110
|
{activeTabEntry && (
|
|
106
|
-
<activeTabEntry.
|
|
111
|
+
<activeTabEntry.extension.component
|
|
107
112
|
canUpdate={activeTabEntry.manageResult.allowed}
|
|
108
113
|
/>
|
|
109
114
|
)}
|
package/tsconfig.json
CHANGED
|
@@ -2,5 +2,19 @@
|
|
|
2
2
|
"extends": "@checkstack/tsconfig/frontend.json",
|
|
3
3
|
"include": [
|
|
4
4
|
"src"
|
|
5
|
+
],
|
|
6
|
+
"references": [
|
|
7
|
+
{
|
|
8
|
+
"path": "../common"
|
|
9
|
+
},
|
|
10
|
+
{
|
|
11
|
+
"path": "../frontend-api"
|
|
12
|
+
},
|
|
13
|
+
{
|
|
14
|
+
"path": "../infrastructure-common"
|
|
15
|
+
},
|
|
16
|
+
{
|
|
17
|
+
"path": "../ui"
|
|
18
|
+
}
|
|
5
19
|
]
|
|
6
20
|
}
|