site-kit-wp icon indicating copy to clipboard operation
site-kit-wp copied to clipboard

Improve already subscribed state in frequency selector component

Open benbowler opened this issue 1 month ago • 1 comments

Feature Description

Update the frequency selector component to make it clear that you are already subscribed (Figma)


Do not alter or remove anything below. The following sections will be managed by moderators only.

Acceptance criteria

  • When the user is subscribed and a saved email reporting frequency exists, above frequency cards a “Current subscription” pill is shown matching the Figma design
    • The prior checkmark indicator on the card is removed.
  • The selected card remains visually selected (existing selected background state stays) and the new pill replaces the checkmark as the only saved indicator.
  • If the user is not subscribed or no saved frequency is present, no “Current subscription” pill is shown.

Implementation Brief

  • [ ] Update assets/js/components/email-reporting/FrequencySelector.js:
    • Remove the tick/checkmark saved indicator logic.
    • Render a new badge element (e.g., div.googlesitekit-frequency-selector__current-subscription) when savedFrequency has value, placed near the top of the cards wrapper; keep existing selected styling for the card. But remove the current checkmark from individual card when saved.
  • [ ] Update styles in assets/sass/components/email-reporting/_googlesitekit-frequency-selector.scss:
    • Add styling for .googlesitekit-frequency-selector__current-subscription as a small pill matching the Figma
    • Remove styles for the old .googlesitekit-frequency-selector__saved-indicator since the checkmark is gone.
  • [ ] Ensure the new badge is only rendered when user is subscribed.

Test Coverage

  • Update assets/js/components/email-reporting/FrequencySelector.test.js snapshots and expectations:
    • Replace saved-indicator assertions with checks for .googlesitekit-frequency-selector__current-subscription when subscribed.
    • Ensure no badge renders when not subscribed

QA Brief

Changelog entry

benbowler avatar Nov 27 '25 16:11 benbowler