Update the admin's menu remaining tasks bubble CSS class and loosen the query selector for handling the runtime update (#39273)

* Modify dom structure, add a specific class and alter the querySelector

* Select all bubbles instead of only the first one

* Add changelog

* Cleanup

* Cleanup
This commit is contained in:
Chris Lilitsas 2023-08-01 13:02:09 +03:00 committed by GitHub
parent 2ffdf6f968
commit b8c0e273bc
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 18 additions and 10 deletions

View File

@ -32,21 +32,25 @@ export const Task: React.FC< TaskProps > = ( { query, task } ) => {
useDispatch( ONBOARDING_STORE_NAME );
const updateBadge = useCallback( () => {
const badgeElement: HTMLElement | null = document.querySelector(
'.toplevel_page_woocommerce .remaining-tasks-badge'
const badgeElements: Array< HTMLElement > | null = Array.from(
document.querySelectorAll(
'#adminmenu .woocommerce-task-list-remaining-tasks-badge'
)
);
if ( ! badgeElement ) {
if ( ! badgeElements?.length ) {
return;
}
const currentBadgeCount = Number( badgeElement.innerText );
badgeElements.forEach( ( badgeElement ) => {
const currentBadgeCount = Number( badgeElement.innerText );
if ( currentBadgeCount === 1 ) {
badgeElement.remove();
}
badgeElement.innerHTML = String( currentBadgeCount - 1 );
if ( currentBadgeCount === 1 ) {
badgeElement.remove();
} else {
badgeElement.innerHTML = String( currentBadgeCount - 1 );
}
} );
}, [] );
const onComplete = useCallback(

View File

@ -0,0 +1,4 @@
Significance: minor
Type: enhancement
Update the admin's menu remaining tasks bubble CSS class and handling

View File

@ -431,7 +431,7 @@ class TaskLists {
foreach ( $submenu['woocommerce'] as $key => $menu_item ) {
if ( 0 === strpos( $menu_item[0], _x( 'Home', 'Admin menu name', 'woocommerce' ) ) ) {
$submenu['woocommerce'][ $key ][0] .= ' <span class="awaiting-mod update-plugins remaining-tasks-badge count-' . esc_attr( $tasks_count ) . '">' . number_format_i18n( $tasks_count ) . '</span>'; // phpcs:ignore WordPress.WP.GlobalVariablesOverride.Prohibited
$submenu['woocommerce'][ $key ][0] .= ' <span class="awaiting-mod update-plugins remaining-tasks-badge woocommerce-task-list-remaining-tasks-badge"><span class="count-' . esc_attr( $tasks_count ) . '">' . absint( $tasks_count ) . '</span></span>'; // phpcs:ignore WordPress.WP.GlobalVariablesOverride.Prohibited
break;
}
}