Skip to content

[Frontend] useSettings holds per-instance state with no shared store or storage listener - settings changes don't propagate across components/tabs #854

Description

@grantfox-oss

Telegram (ask questions / claim the issue here first): https://t.me/+DOylgFv1jyJlNzM0

Labels: bug, enhancement, frontend, Stellar Wave

Changing a setting on the Settings page doesn't update amounts that are already on screen, because every useSettings() call keeps its own private state.

In frontend/src/hooks/useSettings.ts:31-59, each caller does its own useState seeded from localStorage. The setters write to localStorage, but they only update the instance that called them. There's no Context and no storage event listener, so when you change decimalPlaces or amountFormat, other mounted components (and other tabs) keep showing the old formatting until they remount.

What the fix has to hold to

  • One shared source of truth (Context or an external store) so every consumer re-renders when a setting changes
  • A window storage listener so settings stay in sync across tabs

Done when

  • useSettings backed by a shared store, all consumers update on change
  • Cross-tab sync via a storage event listener
  • Test showing two consumers both reflect an updated decimalPlaces without remounting
  • lint + typecheck + tests green

Where to start
All in useSettings.ts. The Settings page's missing-dependency useEffect is a separate thing, leave it alone here.

Metadata

Metadata

Assignees

Labels

GrantFox OSSIssue tracked in GrantFox OSSMaybe RewardedIssue may be eligible for a GrantFox rewardOfficial Campaign | FWC26Campaign: Official Campaign | FWC26Stellar WaveIssues in the Stellar wave programbugSomething isn't workingenhancementNew feature or requestfrontendFrontend related tasks

Type

No type

Fields

No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions