feat(terminal): match terminal color scheme to app theme automatically#3345
Merged
gregpriday merged 4 commits intodevelopfrom Mar 16, 2026
Merged
Conversation
This was referenced Mar 16, 2026
Collaborator
Author
|
Review status: Ready (rebase needed after #3343) 11 new terminal color schemes with proper attribution. Cross-PR note: This PR conflicts with PR #3343 in Recommended merge order: #3343 → #3344 → #3345 (rebase first) |
- Add 10 new curated terminal color schemes: Tokyo Night, Gruvbox Dark, Everforest Dark, Oceanic Next, Kanagawa Dragon, Tomorrow Night, Rosé Pine Dawn, Catppuccin Latte, Atom One Light, Gruvbox Light, Ayu Light - Add APP_THEME_TERMINAL_SCHEME_MAP mapping all 12 app themes to terminal schemes - Update getEffectiveTheme() to resolve mapped scheme when "canopy" (Match App Theme) is selected - Update selectWrapperBackground() to return mapped scheme background - Add app theme subscription to useTerminalConfig hook for live updates - Update ColorSchemePicker to dynamically preview mapped scheme colors - Update tests for new scheme count, mapping coverage, and store behavior
- Split !scheme and scheme.id === DEFAULT_SCHEME_ID conditions in selectWrapperBackground and getEffectiveTheme - Unknown scheme IDs now correctly fall back to CSS variable/CSS theme - Fix test count from 18 to 19 built-in schemes
- Fix XtermAdapter wrapper background not updating on app theme change by computing it in useMemo with both store dependencies - Add test for canopy with unmapped custom app theme (getEffectiveTheme and selectWrapperBackground fallback paths) - Reset appThemeStore fully in beforeEach (customSchemes, colorVisionMode)
Use direct store subscription instead of useMemo with external deps to trigger re-renders on app theme change. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
gregpriday
force-pushed
the
feature/issue-3338-match-terminal-color-scheme
branch
from
f75de7d to
94a378a
Compare
gregpriday
added a commit
that referenced
this pull request
Mar 16, 2026
- Add module-level cache to selectEffectiveTheme so it returns a stable object reference; was creating new objects every call causing Zustand to trigger infinite re-renders in XtermAdapter - Add dedicated "daintree" built-in terminal scheme derived from the Daintree app theme tokens (green accent, dark canvas) to restore the original terminal appearance lost in PR #3345 - Map daintree → "daintree" in APP_THEME_TERMINAL_SCHEME_MAP instead of catppuccin-mocha - Update tests to reflect new scheme count (20) and daintree colors
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Resolves #3338
Changes
src/config/terminalColorSchemes.ts— added 7 new schemes with attribution comments; addedAPP_THEME_TERMINAL_MAPmapping each app theme ID to its designated terminal schemesrc/store/terminalColorSchemeStore.ts— addedresolvedSchemeselector that returns the designated scheme for the current app theme when the user is on "Match App Theme";hasUserOverrideflag tracks whether the user has explicitly chosen a schemesrc/components/Settings/ColorSchemePicker.tsx— updated picker to show the resolved scheme name alongside "Match App Theme" so users can see which palette is activesrc/components/Terminal/XtermAdapter.tsx— usesresolvedSchemeso the terminal always renders with the correct colorsTesting
Unit tests pass (
npm run checkclean at 298 warnings, 0 errors, matching the ratchet baseline). The mapping covers all 12 app themes, light themes map to light-background terminal schemes, dark themes to dark-background schemes. Override persistence was tested via the store tests.