WordPress / WordPress/create-block-theme

Foundation + Color tab fully wired

Open
#838 0 comments 0 reactions 0 assignees View on GitHub

@bph is already working on this.

Since May 21, 2026.

  • #845 by @bph — open
Edit Theme settings enhancement
Dominant language
JavaScript
Stars
417
Forks
66
PR merge metrics
No merged PRs in 30d

Description

Part of #836. First feature PR after the endpoint lands. Wires the modal's Color tab end-to-end so users can persist palette / gradient / duotone / default-toggle changes to theme.json. Other tabs continue rendering but their Update is a no-op until subsequent PRs.

Depends on #837.

Scope

Files
  • src/resolvers.js — add postUpdateThemeSettings(payload) mirroring postUpdateThemeMetadata.
  • src/editor-sidebar/edit-theme-settings-modal.js — lift Color-tab state to modal level, wire handleUpdateClick to call the resolver, add loading / success-notice / error-notice / refresh.
  • src/plugin-styles.scss — any save-state styling adjustments (loading indicator on the footer button).
Behavior
  • Update button enabled when there are pending changes; disabled + spinner during save.
  • Success: surface createSuccessNotice, refresh the theme entity record (panels' useEffect resets local state from new server data automatically). Modal stays open by default.
  • Error: surface createErrorNotice with the WP_Error message.
State lifting

Modal owns:

  • colorSettings (defaults flags + custom flags + link)
  • palette / gradients / duotone arrays

Passed to ColorSettingsPanel / PalettePanel / GradientPanel / DuotonePanel as value + onChange. Tabs other than Color keep their existing local state for now.

Acceptance criteria

  • Edit any Color sub-panel value, click Update — value persists to theme.json on disk.
  • Reload editor — change is reflected.
  • Failure (e.g. 500) surfaces an error notice; modal stays open.
  • Update button shows loading state during save and is disabled when there are no pending changes.
  • Other tabs (Dimensions / Typography / Shadows / Templates) still render and do not error.
  • e2e smoke test for the Color save path (if e2e infra is in place per #811).

Out of scope

  • Other tabs' persistence (subsequent PRs, see #836).
  • WP-CLI command.
  • Documentation in readme.txt — fold into this PR if user-visible documentation is desired before further tabs land; otherwise the final per-tab PR.

References

  • Tracking issue: #836
  • Endpoint sub-issue: #837
  • Pattern mirrored for save UX: metadata-editor-modal.js.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with src/editor-sidebar/edit-theme-settings-modal.js and compare its save UX with metadata-editor-modal.js, then trace postUpdateThemeMetadata in src/resolvers.js. Review the Color panel state flow and the theme entity refresh behavior before checking the relevant e2e setup from #811. Done means Color changes persist and reload correctly, notices and loading states work, and other tabs still render without errors.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, wordpress
Domain
api, frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.