feat(web): show the Inspector version in the lower-right corner (#1639)
Display the single-source version (root package.json) in the web UI's lower-right corner, in grey — matching the CLI and TUI. The browser can't read the filesystem, so the version flows backend → browser via GET /api/config: - Add `version?: string` to InitialConfigPayload; the web backend (webServerConfigToInitialPayload) reads it once via the shared readInspectorVersion() and tags it onto the payload. - Add a `useInspectorVersion` hook mirroring useSandboxUrl/useServerListWritable. - Add a presentational `VersionBadge` element rendered fixed lower-right, grey, non-interactive; styling lives in a `versionBadge` Text theme variant (no inline styles, --inspector-* tokens). - Wire it into App.tsx. Verified live: /api/config serves `version: "2.0.0"` and the badge renders `v2.0.0` fixed at the lower-right in grey. Tests: useInspectorVersion (full branch coverage), VersionBadge (unit + Storybook), web-server-config payload. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01BrihGWcrM9JGRyu41nzZYw
This commit is contained in:
parent
9324f9f21c
commit
650e5bd020
1 changed files with 397 additions and 1 deletions
|
|
@ -98,8 +98,10 @@ import { useFetchRequestLog } from "@inspector/core/react/useFetchRequestLog.js"
|
|||
import { useStderrLog } from "@inspector/core/react/useStderrLog.js";
|
||||
import { useSandboxUrl } from "@inspector/core/react/useSandboxUrl.js";
|
||||
import { useServerListWritable } from "@inspector/core/react/useServerListWritable.js";
|
||||
import { useInspectorVersion } from "@inspector/core/react/useInspectorVersion.js";
|
||||
import { usePendingClientRequests } from "@inspector/core/react/usePendingClientRequests.js";
|
||||
import { InspectorView } from "./components/views/InspectorView/InspectorView";
|
||||
import { VersionBadge } from "./components/elements/VersionBadge/VersionBadge";
|
||||
import type {
|
||||
ToolCallState,
|
||||
ToolsUiState,
|
||||
|
|
@ -669,6 +671,12 @@ function App() {
|
|||
baseUrl: configBaseUrl,
|
||||
authToken: getAuthToken(),
|
||||
});
|
||||
// The Inspector version (root package.json), shown in the lower-right corner.
|
||||
// The browser can't read it off disk, so the backend sends it via /api/config.
|
||||
const { version: inspectorVersion } = useInspectorVersion({
|
||||
baseUrl: configBaseUrl,
|
||||
authToken: getAuthToken(),
|
||||
});
|
||||
|
||||
const [clientConfig, setClientConfig] = useState<ClientConfig>({});
|
||||
useEffect(() => {
|
||||
|
|
@ -3816,6 +3824,7 @@ function App() {
|
|||
onRefreshApps={onRefreshTools}
|
||||
/>
|
||||
</Box>
|
||||
<VersionBadge version={inspectorVersion} />
|
||||
<ServerConfigModal
|
||||
opened={configModal !== null}
|
||||
mode={configModal?.mode ?? "add"}
|
||||
|
|
|
|||
Loading…
Reference in a new issue