Refactor `AdBlockingRecoverySetupSuccessBannerNotification` to use the new Notifications datastore

[zutigrm]

Feature Description

This issue should refactor AdBlockingRecoverySetupSuccessBannerNotification so that it uses the new datastore infrastructure to register and queue the notification. It should also incorporate a new "layout".

---

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

Acceptance criteria

• The AdBlockingRecoverySetupSuccessBannerNotification component should be refactored so that it is registered and rendered (queued) using the new core/notifications datastore.
• This notification component should not be called directly (i.e. in BannerNotifications) but only via the generic getQueuedNotifications selector.
• The refactored component should not contain any business logic that hides it / prevents it from rendering. This logic should be contained in a callback function defined during registration.
• The component should not use the bloated BannerNotification component. Instead, it should be rendered using the new Notification component wrapper and a simpler "layout" component that solely encapsulates its structure and design.

Implementation Brief

• [ ] Update assets/js/components/notifications/AdBlockingRecoverySetupSuccessBannerNotification.js:

  • The component should take new props { id, Notification }.
  • Move the following rendering logic from this component in register-defaults.js below:
  • https://github.com/google/site-kit-wp/blob/cc981876c3b654437e965cb66f8a09c9d110dba1/assets/js/components/notifications/AdBlockingRecoverySetupSuccessBannerNotification.js#L52-L54
  • https://github.com/google/site-kit-wp/blob/cc981876c3b654437e965cb66f8a09c9d110dba1/assets/js/components/notifications/AdBlockingRecoverySetupSuccessBannerNotification.js#L90-L96
  • Wrap the component with Notification component passed as the prop.
  • Replace the use of the BannerNotication component with the shared notification layout assets/js/components/notifications/layout/NotificationWithSVG.js created in #9293.

• [ ] Update assets/js/googlesitekit/notifications/register-defaults.js, registering the component with the new patern:

  • checkRequirements should take the render logic removed above.
  • isDismissible should be true.
  • For priority, bump it by 10 from the last added general notification (not including the error type notification which start from 150).
  • Use NOTIFICATION_AREAS.BANNERS_ABOVE_NAV for areaSlug.

• [ ] Remove all references to AdBlockingRecoverySetupSuccessBannerNotification in assets/js/components/notifications/BannerNotifications.js

Test Coverage

• Update assets/js/components/notifications/AdBlockingRecoverySetupSuccessBannerNotification.stories.js to render the notification banner as before with the new use of the notifications store.

QA Brief

Changelog entry

[eugene-manuilov]

AC ✔️

[benbowler]

I added #9293 as a blocker so that this ticket can share the new assets/js/components/notifications/layout/NotificationWithSVG.js layout created there.