Skip to content

fix(settings): persist API key, provider, model, and integrations#1

Open
NewCoder3294 wants to merge 1 commit into
mainfrom
fix/settings-persistence
Open

fix(settings): persist API key, provider, model, and integrations#1
NewCoder3294 wants to merge 1 commit into
mainfrom
fix/settings-persistence

Conversation

@NewCoder3294

Copy link
Copy Markdown
Collaborator

Summary

  • The settings page was a static mockup — every input was a presentational component with no state, no onChange, and no persistence. A user pasting an Anthropic key into API_KEY.SAV saw it sit in the field briefly and vanish on reload.
  • Adds a zustand+persist store at web/src/lib/settings-store.ts that caches provider, apiKey, model, and the three integration fields to localStorage under prometheus-settings-v1.
  • Rewires web/src/app/settings/page.tsx to be controlled (provider buttons toggle the store, inputs are value/onChange-bound), with a hydration guard so values don't flash empty after reload, plus a new "Reset all" affordance.

Scope

  • UI-only. Nothing leaves the browser. The Go API still reads its provider key from PROMETHEUS_ORCHESTRATOR_API_KEY at server boot — this store is the UI's working copy until a server-side settings endpoint exists.
  • No backend changes. No new dependencies (zustand was already in web/package.json).
  • Hydration is handled via the standard Next.js useEffect-on-mount pattern; SSR renders empty inputs and localStorage rehydrates client-side.

Test plan

  • cd web && npm install && npm run dev — settings page loads.
  • Paste a key into API_KEY.SAV, refresh — value persists.
  • Click a different provider — selection persists across reloads.
  • Click "Reset all" — all fields clear.
  • Open in a private window — fields start blank (per-browser cache).

🤖 Generated with Claude Code

The settings page was a static mockup — every input was a presentational
component with no state, no onChange, and no persistence. A user pasting
their Anthropic key into API_KEY.SAV saw it sit in the field briefly and
then vanish on reload.

Adds a zustand store (web/src/lib/settings-store.ts) backed by the
persist middleware, so the provider, API key, model, and integration
fields cache to localStorage under "prometheus-settings-v1" and survive
reloads, HMR, and browser restarts. The Go API still reads its own
provider key from PROMETHEUS_ORCHESTRATOR_API_KEY at server boot — this
store is the UI's working copy until a server-side settings endpoint
exists. Nothing leaves the browser.

The settings page is now controlled (provider buttons toggle the store,
inputs are value/onChange-bound), guards against the SSR-vs-localStorage
hydration mismatch, and adds a "Reset all" affordance for cache clearing.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant