From 3cf3708dd2723dd006d33b764d5410d823abb0f4 Mon Sep 17 00:00:00 2001 From: Claude Date: Fri, 26 Jun 2026 09:33:47 +0000 Subject: [PATCH 1/2] feat: surface GramFrame version as Pan button tooltip Hovering the Pan button now shows "GramFrame vX.Y.Z" via a native title tooltip, giving support a subtle way to read an instance's version from the browser UI without adding permanent on-screen chrome. The tooltip is readable even while the button is disabled (before the user has zoomed in), so it can be checked on request at any time. Version comes from the existing getVersion(). Co-Authored-By: Claude Opus 4.8 Claude-Session: https://claude.ai/code/session_01UrV8WBAsULghxpC6j7d9J5 --- src/components/ModeButtons.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/components/ModeButtons.js b/src/components/ModeButtons.js index 0735142..5bf3dbf 100644 --- a/src/components/ModeButtons.js +++ b/src/components/ModeButtons.js @@ -7,6 +7,7 @@ /// import { getModeDisplayName } from '../utils/calculations.js' +import { getVersion } from '../utils/version.js' /** * Create mode switching UI with buttons and guidance panel @@ -55,6 +56,13 @@ export function createModeSwitchingUI(modeCell, state, modeSwitchCallback, modes button.className = 'gram-frame-mode-btn' button.textContent = getModeDisplayName(modeType) button.dataset.mode = modeType + + // Subtle version surface for debugging: hovering the Pan button reveals the + // GramFrame version. The tooltip shows even while the button is disabled + // (before the user has zoomed in), so it is always available on request. + if (modeType === 'pan') { + button.title = `GramFrame v${getVersion()}` + } // Set active state for current mode if (modeType === state.mode) { From 1d6cb7c187e54fe6cb6245971ab954f67cac9096 Mon Sep 17 00:00:00 2001 From: Claude Date: Fri, 26 Jun 2026 09:38:24 +0000 Subject: [PATCH 2/2] fix: single version source of truth + embed version in demo/preview builds - state.js: replace the stale hardcoded version '0.0.1' with getVersion() so state.version tracks package.json like the Pan button tooltip does. - pr-preview.yml: run `yarn generate-version` before build:standalone in both the deploy-main and deploy-preview jobs. Previously only release.yml embedded the real version, so the live GitHub Pages demo and PR previews both showed "vDEV". Now they show the actual package.json version. Co-Authored-By: Claude Opus 4.8 Claude-Session: https://claude.ai/code/session_01UrV8WBAsULghxpC6j7d9J5 --- .github/workflows/pr-preview.yml | 6 ++++++ src/core/state.js | 3 ++- 2 files changed, 8 insertions(+), 1 deletion(-) diff --git a/.github/workflows/pr-preview.yml b/.github/workflows/pr-preview.yml index b5e748e..b29a975 100644 --- a/.github/workflows/pr-preview.yml +++ b/.github/workflows/pr-preview.yml @@ -28,6 +28,9 @@ jobs: - name: Install dependencies run: yarn install --frozen-lockfile + - name: Embed version from package.json + run: yarn generate-version + - name: Build standalone bundle run: yarn build:standalone @@ -109,6 +112,9 @@ jobs: - name: Install dependencies run: yarn install --frozen-lockfile + - name: Embed version from package.json + run: yarn generate-version + - name: Build standalone bundle run: | yarn build:standalone diff --git a/src/core/state.js b/src/core/state.js index f234f54..cb4fe0a 100644 --- a/src/core/state.js +++ b/src/core/state.js @@ -11,6 +11,7 @@ import { AnalysisMode } from '../modes/analysis/AnalysisMode.js' import { HarmonicsMode } from '../modes/harmonics/HarmonicsMode.js' import { DopplerMode } from '../modes/doppler/DopplerMode.js' import { PanMode } from '../modes/pan/PanMode.js' +import { getVersion } from '../utils/version.js' /** * Build mode-specific initial state by collecting from all mode classes @@ -34,7 +35,7 @@ function buildModeInitialState() { * @type {GramFrameState} */ export const initialState = { - version: '0.0.1', + version: getVersion(), timestamp: new Date().toISOString(), instanceId: '', mode: 'analysis', // 'analysis', 'harmonics', 'doppler', 'pan'