Dashboard: add On this day and Achievements toggles to Notifications Extras by alshakero · Pull Request #112442 · Automattic/wp-calypso

alshakero · 2026-07-08T20:56:33Z

Fixes phcsdm-PD-p2#comment-5237

Proposed Changes

Add an "On this day" toggle card to the Dashboard's Notifications → Extras screen, wired to the other.timeline.on_this_day field of the /me/notifications/settings endpoint (the same field the classic notification settings page saves).
Add an "Achievements" toggle card wired to the achievements-global-notifications user preference via userPreferenceQuery / userPreferenceOptimisticMutation (same storage as the classic page, so the two UIs stay in sync).
Both cards render in their own groups at the top of the Extras screen, before the "Email from WordPress.com" group. Labels and help text are copied verbatim from the classic UI, so no new translatable strings are introduced.
Saving shows the standard snackbar notices and records Tracks events (calypso_dashboard_notifications_timeline_settings_updated with setting_name: 'on_this_day', and calypso_dashboard_notifications_achievements_settings_updated).
Extend the Extras screen unit tests: four new tests covering rendering, saving each toggle, and the disabled-preference state, plus a /me/preferences mock for existing tests since the Achievements card now suspends on that endpoint.

Why are these changes being made?

The "On this day" and "Achievements" notification toggles currently only exist in the classic notification settings page. The new Dashboard's notification settings had no equivalent, so users managing notifications there couldn't control these two settings. This folds them into the Extras screen.

Testing Instructions

Run yarn test-client client/dashboard/me/notifications-extras.
Start the dashboard with yarn start-dashboard and go to Notifications → Extras.
Verify the "On this day" and "Achievements" cards appear above the "Email from WordPress.com" group.
Toggle each one: a "<name>" settings saved. snackbar should appear, and the state should match the corresponding toggles in the classic notification settings page after a reload of either page.

Pre-merge Checklist

github-actions · 2026-07-08T20:56:45Z

Calypso Live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-187352

Jetpack Cloud Live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-187352&env=jetpack

Automattic for Agencies Live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-187352&env=a8c-for-agencies

Dashboard Live (dotcom) (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-187352&env=dashboard

Dashboard Live (A4A) (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-187352&env=dashboard-a4a

…Extras

claude · 2026-07-08T21:04:08Z

+				} );
+			},
+		} );


[fix here] Issue: Error snackbar doesn't follow the project's "Failed to…" convention and is inconsistent with the existing error message in index.tsx line 85 ('Failed to save subscription settings.').

Error message should be helpful where possible, although it is not always possible. The message should begin with "Failed":
Failed to save {setting name}.

— typography-and-copy.md

Suggestion:

Suggested change

} );

},

} );

createErrorNotice(

sprintf(

/* translators: %s is the name of the setting */ __( 'Failed to save %s settings.' ),

__( 'Achievements' )

),

{ type: 'snackbar' }

);

Fixed in 9b5d579 — error notice now uses the Failed to save %s settings. pattern.

claude · 2026-07-08T21:04:11Z

+				},
+			}
+		);


[fix here] Issue: Same as achievements-card — error snackbar should begin with "Failed" per the project convention and to stay consistent with the existing error in this screen.

Error message should be helpful where possible, although it is not always possible. The message should begin with "Failed":
Failed to save {setting name}.

— typography-and-copy.md

Suggestion:

Suggested change

},

}

);

createErrorNotice(

sprintf(

/* translators: %s is the name of the setting */ __( 'Failed to save %s settings.' ),

__( 'On this day' )

),

{ type: 'snackbar' }

);

Fixed in 9b5d579 — error notice now uses the Failed to save %s settings. pattern.

claude · 2026-07-08T21:04:18Z

+	const { data: notifications } = useSuspenseQuery(
+		userPreferenceQuery( 'achievements-global-notifications' )
+	);


[fix here] Issue: useSuspenseQuery will suspend this component, but the route loader at app/router/me.tsx:1013 only prefetches userNotificationsSettingsQuery(). Because userPreferenceQuery isn't prefetched, there'll be a waterfall: the notification settings query resolves first, the component tree starts rendering, then this card suspends a second time to fetch preferences.

Data is prefetched through route loaders where possible

— data-library.md

A good strategy is to use a router's loader function to fetch just enough data to allow a component's layout to be rendered definitively.

— ui-components.md

Suggestion: Add rawUserPreferencesQuery() (or userPreferenceQuery('achievements-global-notifications')) to the route loader so both fetches run in parallel:

loader: async () => { await Promise.all( [ queryClient.ensureQueryData( userNotificationsSettingsQuery() ), queryClient.ensureQueryData( rawUserPreferencesQuery() ), ] ); },

Fixed in 9b5d579 — the Extras route loader now prefetches rawUserPreferencesQuery() in parallel with the notification settings query, so the Achievements card no longer causes a second suspense round-trip.

…tras route loader

alshakero · 2026-07-08T21:18:06Z

@Automattic/lego please feel free to review! I'll address in a follow up.

a8ci18n · 2026-07-08T22:22:31Z

This Pull Request is now available for translation here: https://translate.wordpress.com/deliverables/34249462

Some locales (Hebrew) have been temporarily machine-translated due to translator availability. All other translations are usually ready within a few days. Untranslated and machine-translated strings will be sent for translation next Monday and are expected to be completed by the following Friday.

Hi @alshakero, could you please edit the description of this PR and add a screenshot for our translators? Ideally it'd include this string: Failed to save %s settings.

Thank you in advance!

StevenDufresne · 2026-07-08T23:04:46Z

+					checked={ !! data.other.timeline.on_this_day }
+					disabled={ isMutating }
+					label={ __( 'On this day' ) }
+					help={ __( 'Reminders about your posts from past years' ) }


Nit: Should have a "." at the end.

Also, these are notifications in the Notification panel correct? The "Achievements" section makes that explicit: "Receive notifications when you unlock new achievements.". Should we be explicit for this one as well?

I guess it's confusing because we have "Extras" in the notifications section but then the section below is "Email from WordPress.com". I wonder why that section isn't in the me/notifications/emails section... Unrelated to this PR. I'll open an issue for that.

Frankly, I copied this as-is from /me/notifications just to fix the bug. @Copons probably understands this better.

Nit: Should have a "." at the end.

Fixed in #112464

@alshakero I think Steven was recommending to make the OTD copy more explicit. Something like this:

- Reminders about your posts from past years. + Receive notification reminders about your posts from past years.

Uh oh, my bad. I'll take a nap and check this out. Apparently I'm not functioning well.

My fault for rambling! Thanks for the updates!

StevenDufresne · 2026-07-08T23:11:57Z

+					disabled={ isPending }
+					label={ __( 'Achievements' ) }
+					help={ __(
+						'Receive notifications when you unlock new achievements. This setting overrides site-level settings.'


"This setting overrides site-level settings"? I don't quite understand this. I have site-level Achievements settings?

cc @Copons.

I have site-level Achievements settings?

@StevenDufresne yep!

In MSD, they have been moved to /me/notifications/sites. Just open a site and...

Thinking about it, when the global setting was originally introduced, it contained a link to /me/notifications:

https://github.com/Automattic/wp-calypso/pull/110110/changes#diff-9380b2a481cfab3dc49408e68c0b1b708fdd71519c3e3dc1a1d691e1e2d00ad7R149-R156

The link was dropped when the setting was moved out of the Achievements screen and into /me/notifications.

Now that we have separate Notifications -> Sites and -> Extras screens, it would make sense to restore the link. I'll look into it. 🙂

Thanks! Likely pedantic, but site-level threw me off a bit. That felt like something in wp-admin. Maybe it's just the way I think about levels.

Maybe it's easier to read as:

Receive notifications for new achievements. Site-specific achievement notification settings will be ignored.

Not pedantic at all! This was an RSM project, and we certainly didn't focus on a label copy. 😅

I don't know if "ignore" is correct.
Disabling achievement notifications globally certainly ignores any enabled site-specific notifications, but the opposite is not true. You can keep notifications on globally and disable them per-site.

The problem is that achievements can be about a specific site, but also about the user in general. "Old" achievements were most/all about a specific site, but those we introduced are largely about the user. Hence the reason for adding a global disable.

matticbot · 2026-07-09T11:14:08Z

Here is how your PR affects size of JS and CSS bundles shipped to the user's browser:

App Entrypoints (~0 bytes added 📈 [gzipped])

Details

name                    parsed_size           gzip_size
entry-dashboard-dotcom        +48 B  (+0.0%)       +0 B
entry-dashboard-ciab          +48 B  (+0.0%)       +0 B
entry-dashboard-a4a           +48 B  (+0.0%)       +0 B

Common code that is always downloaded and parsed every time the app is loaded, no matter which route is used.

Sections (~2 bytes added 📈 [gzipped])

Details

name                parsed_size           gzip_size
staging-site              +48 B  (+0.0%)       +2 B  (+0.0%)
sites-dashboard           +48 B  (+0.0%)       +2 B  (+0.0%)
site-settings             +48 B  (+0.0%)       +2 B  (+0.0%)
site-performance          +48 B  (+0.0%)       +2 B  (+0.0%)
site-monitoring           +48 B  (+0.0%)       +2 B  (+0.0%)
site-logs                 +48 B  (+0.0%)       +2 B  (+0.0%)
plans                     +48 B  (+0.0%)       +2 B  (+0.0%)
overview                  +48 B  (+0.0%)       +2 B  (+0.0%)
hosting                   +48 B  (+0.0%)       +2 B  (+0.0%)
github-deployments        +48 B  (+0.0%)       +2 B  (+0.0%)
domains                   +48 B  (+0.0%)       +2 B  (+0.0%)

Sections contain code specific for a given set of routes. Is downloaded and parsed only when a particular route is navigated to.

Async-loaded Components (~2 bytes added 📈 [gzipped])

Details

name                                                                   parsed_size           gzip_size
async-load-calypso-my-sites-customer-home-celebrate-site-launch-modal        +48 B  (+0.0%)       +2 B  (+0.0%)

React components that are loaded lazily, when a certain part of UI is displayed for the first time.

Legend

What is parsed and gzip size?

Parsed Size: Uncompressed size of the JS and CSS files. This much code needs to be parsed and stored in memory.
Gzip Size: Compressed size of the JS and CSS files. This much data needs to be downloaded over network.

Generated by performance advisor bot at iscalypsofastyet.com.

alshakero marked this pull request as ready for review July 8, 2026 20:58

alshakero requested a review from a team as a code owner July 8, 2026 20:58

matticbot added the [Status] Needs Review The PR is ready for review. This also triggers e2e canary tests and wp-desktop tests automatically. label Jul 8, 2026

Dashboard: add On this day and Achievements toggles to Notifications …

f0120fe

…Extras

alshakero force-pushed the update/dashboard-notifications-extras-toggles branch from e7e6a8f to f0120fe Compare July 8, 2026 20:59

claude Bot reviewed Jul 8, 2026

View reviewed changes

Address review: Failed-to-save error copy, prefetch preferences in Ex…

9b5d579

…tras route loader

alshakero enabled auto-merge July 8, 2026 21:18

alshakero added this pull request to the merge queue Jul 8, 2026

Merged via the queue into trunk with commit 4f612e9 Jul 8, 2026
26 checks passed

alshakero deleted the update/dashboard-notifications-extras-toggles branch July 8, 2026 21:30

github-actions Bot removed the [Status] Needs Review The PR is ready for review. This also triggers e2e canary tests and wp-desktop tests automatically. label Jul 8, 2026

StevenDufresne reviewed Jul 8, 2026

View reviewed changes

Copons mentioned this pull request Jul 9, 2026

MSD Notifications: Add a clarifying link to Sites notifications settings to the Achievements toggle #112466

Merged

10 tasks

-				} );
-			},
-		} );
+				createErrorNotice(
+					sprintf(
+						/* translators: %s is the name of the setting */ __( 'Failed to save %s settings.' ),
+						__( 'Achievements' )
+					),
+					{ type: 'snackbar' }
+				);

Uh oh!

Conversation

alshakero commented Jul 8, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Proposed Changes

Why are these changes being made?

Testing Instructions

Pre-merge Checklist

Uh oh!

github-actions Bot commented Jul 8, 2026 • edited by matticbot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

claude Bot Jul 8, 2026

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

claude Bot Jul 8, 2026

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

claude Bot Jul 8, 2026

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

alshakero commented Jul 8, 2026

Uh oh!

Uh oh!

a8ci18n commented Jul 8, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

matticbot commented Jul 9, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

alshakero commented Jul 8, 2026 •

edited

Loading

github-actions Bot commented Jul 8, 2026 •

edited by matticbot

Loading

a8ci18n commented Jul 8, 2026 •

edited

Loading

matticbot commented Jul 9, 2026 •

edited

Loading