Skip to content

refactor: extract theme-detector into useThemeDetector hook (Closes #950) - #1031

Open
waterWang wants to merge 1 commit into
CredenceOrg:mainfrom
waterWang:refactor/theme-detector-hook
Open

refactor: extract theme-detector into useThemeDetector hook (Closes #950)#1031
waterWang wants to merge 1 commit into
CredenceOrg:mainfrom
waterWang:refactor/theme-detector-hook

Conversation

@waterWang

Copy link
Copy Markdown
Contributor

Summary

Extract the theme-application logic from SettingsContext's inline useEffect into a dedicated useThemeDetector hook under src/hooks/.

Changes

  • New: src/hooks/useThemeDetector.ts — A hook that accepts a ThemeMode ('light' | 'dark' | 'system') and:
    • Resolves the effective theme (queries prefers-color-scheme in system mode)
    • Writes data-theme on document.documentElement
    • Subscribes to OS preference changes when mode is 'system'
    • Cleans up the listener on mode switch or unmount
  • Updated: src/context/SettingsContext.tsx — Replaced inline useEffect with useThemeDetector(themeMode)

Verification

  • ✅ All 23 theme-specific tests in SettingsContext.theme.test.tsx pass
  • ✅ Behavior is identical — the change is a pure no-op refactor
  • ✅ No new dependencies

Closes #950

Move the theme-application logic (data-theme sync, matchMedia listener
management for system mode) from SettingsContext's inline useEffect
into a dedicated useThemeDetector hook under src/hooks/.

The hook accepts a ThemeMode ('light' | 'dark' | 'system') and handles:
- Resolving the effective theme (querying prefers-color-scheme in system mode)
- Writing data-theme on document.documentElement
- Subscribing to OS preference changes when mode is 'system'
- Cleaning up the listener on mode switch or unmount

Behavior is identical — the change is a no-op refactor.

Closes CredenceOrg#950
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.

Refactor: extract the theme-detector into a hook

1 participant