Skip to content

Display notification badge in the admin menu when there are recommendations #3001

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
wants to merge 8 commits into
base: feature/GOOWOO-172-pmax-assets-improvements
Choose a base branch
from

Conversation

jjgrainger
Copy link
Collaborator

Changes proposed in this Pull Request:

Closes https://linear.app/a8c/issue/GOOWOO-182/display-notification-badge-in-the-admin-menu-when-there-are

  • Adds a notification badge to the Marketing menu to alert users when there are recommendations.
  • Notification count is controlled by a google_for_woocommerce_admin_menu_notification_count filter.
  • Javascript is added to the Marketing and Analytics pages to position badge correctly when switching between menus.

Screenshots:

Marketing menu with notification badge.
Screenshot 2025-07-04 at 12 31 46

Marketing sub-menu with notification badge.
Screenshot 2025-07-04 at 12 31 21

Detailed test instructions:

  1. No notification badge is displayed when the google_for_woocommerce_admin_menu_notification_count filter returns 0. This is the default behaviour.
  2. Add a filter to return a count higher than 1 to simulate recommendations are available. add_filter('google_for_woocommerce_admin_menu_notification_count', function() { return 1; }
  3. Go to the WordPress admin and see the notification badge is shown on the Marketing menu.
  4. Go to the Marketing > Google for WooCommerce admin page and see the notification badge is attached to the Google for WooCommerce sub menu item.
  5. Go to Analytics or any of its sub menus and see the Notification badge is attached to the Marketing menu item.
  6. When switching between the Analytics and Marketing menus the badge is repositioned in the correct location.
    7. When the Marketing menu is collapsed, the badge appears on the Marketing menu item.
    8. When the Marketing menu is expanded, the badge appears on the Google for WooCommerce sub menu item.

Additional details:

Changelog entry

@jjgrainger jjgrainger requested a review from ankitrox July 4, 2025 11:41
@github-actions github-actions bot added the changelog: update Big changes to something that wasn't broken. label Jul 4, 2025
Copy link

codecov bot commented Jul 4, 2025

Codecov Report

Attention: Patch coverage is 0% with 93 lines in your changes missing coverage. Please review.

Project coverage is 66.0%. Comparing base (f2a6084) to head (e33d10e).
Report is 134 commits behind head on feature/GOOWOO-172-pmax-assets-improvements.

Files with missing lines Patch % Lines
src/Menu/NotificationManager.php 0.0% 91 Missing ⚠️
...rnal/DependencyManagement/AdminServiceProvider.php 0.0% 1 Missing ⚠️
src/Menu/Dashboard.php 0.0% 1 Missing ⚠️
Additional details and impacted files

Impacted file tree graph

@@                               Coverage Diff                                @@
##             feature/GOOWOO-172-pmax-assets-improvements   #3001      +/-   ##
================================================================================
- Coverage                                           66.4%   66.0%    -0.4%     
- Complexity                                             0    4849    +4849     
================================================================================
  Files                                                335     835     +500     
  Lines                                               5194   25894   +20700     
  Branches                                            1269    1291      +22     
================================================================================
+ Hits                                                3449   17093   +13644     
- Misses                                              1592    8647    +7055     
- Partials                                             153     154       +1     
Flag Coverage Δ
js-unit-tests 66.6% <ø> (+0.2%) ⬆️
php-unit-tests 65.8% <0.0%> (?)

Flags with carried forward coverage won't be shown. Click here to find out more.

Files with missing lines Coverage Δ
...rnal/DependencyManagement/AdminServiceProvider.php 0.0% <0.0%> (ø)
src/Menu/Dashboard.php 0.0% <0.0%> (ø)
src/Menu/NotificationManager.php 0.0% <0.0%> (ø)

... and 530 files with indirect coverage changes

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

Copy link
Collaborator

@mukeshpanchal27 mukeshpanchal27 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the PR. Left some initial feedbacks

);

$page_controller_pages = PageController::get_instance()->get_pages();
$marketing_menu_slug = 'woocommerce-marketing';
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
$marketing_menu_slug = 'woocommerce-marketing';
$marketing_menu_slug = Dashboard::MARKETING_MENU_SLUG;


$marketing_menu_pages = array_filter(
$page_controller_pages,
function ( $page ) use ( $marketing_menu_slug ) {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
function ( $page ) use ( $marketing_menu_slug ) {
static function ( $page ) use ( $marketing_menu_slug ) {

Use static that improve performance.

const subMenu = document.querySelector('[href="admin.php?page=wc-admin&path=%2Fgoogle%2Fdashboard"]');

if (subMenu && !subMenu.contains(badge)) {
// Ensure there is white space betweem the bade and menu title for visual consistency.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
// Ensure there is white space betweem the bade and menu title for visual consistency.
// Ensure there is white space between the badge and menu title for visual consistency.

subMenu.textContent.trimEnd();
subMenu.textContent += ' ';

// Move the bade to the correct location.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
// Move the bade to the correct location.
// Move the badge to the correct location.

}
} else {
if (topMenu && !topMenu.contains(badge)) {
// Ensure there is white space betweem the bade and menu title for visual consistency.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
// Ensure there is white space betweem the bade and menu title for visual consistency.
// Ensure there is white space between the badge and menu title for visual consistency.

topMenu.textContent.trimEnd();
topMenu.textContent += ' ';

// Move the bade to the correct location.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
// Move the bade to the correct location.
// Move the badge to the correct location.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
changelog: update Big changes to something that wasn't broken.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants