From 7a5a5a7939bdcc76ffd033f428bb588a5f2be0de Mon Sep 17 00:00:00 2001
From: Sergey Biryukov <sergeybiryukov@git.wordpress.org>
Date: Wed, 27 Jan 2021 10:57:43 +0000
Subject: [PATCH] Plugins: Rotate the Updates icon in the admin bar when
 performing inline updates on the Plugins screen.

This provides better indication within the viewport about ongoing processes on the page when updating several plugins at the same time, but without using the bulk updater.

Props ravipatel, audrasjb, johnjamesjacoby, paaljoachim, hellofromTonya, sabernhardt, mdwolinski, karmatosed, SergeyBiryukov.
Fixes #51476.

git-svn-id: https://develop.svn.wordpress.org/trunk@50027 602fd350-edb4-49c9-b593-d223f7449a82
---
 src/js/_enqueues/wp/updates.js    | 15 ++++++++++++---
 src/wp-includes/css/admin-bar.css |  5 +++++
 2 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/src/js/_enqueues/wp/updates.js b/src/js/_enqueues/wp/updates.js
index bbb52a66a3..3371e84d27 100644
--- a/src/js/_enqueues/wp/updates.js
+++ b/src/js/_enqueues/wp/updates.js
@@ -443,7 +443,8 @@
 	 *                     decorated with an abort() method.
 	 */
 	wp.updates.updatePlugin = function( args ) {
-		var $updateRow, $card, $message, message;
+		var $updateRow, $card, $message, message,
+			$adminBarUpdates = $( '#wp-admin-bar-updates' );
 
 		args = _.extend( {
 			success: wp.updates.updatePluginSuccess,
@@ -471,6 +472,8 @@
 			$card.removeClass( 'plugin-card-update-failed' ).find( '.notice.notice-error' ).remove();
 		}
 
+		$adminBarUpdates.addClass( 'spin' );
+
 		if ( $message.html() !== __( 'Updating...' ) ) {
 			$message.data( 'originaltext', $message.html() );
 		}
@@ -499,7 +502,8 @@
 	 * @param {string} response.newVersion New version of the plugin.
 	 */
 	wp.updates.updatePluginSuccess = function( response ) {
-		var $pluginRow, $updateMessage, newText;
+		var $pluginRow, $updateMessage, newText,
+			$adminBarUpdates = $( '#wp-admin-bar-updates' );
 
 		if ( 'plugins' === pagenow || 'plugins-network' === pagenow ) {
 			$pluginRow     = $( 'tr[data-plugin="' + response.plugin + '"]' )
@@ -521,6 +525,8 @@
 				.addClass( 'button-disabled updated-message' );
 		}
 
+		$adminBarUpdates.removeClass( 'spin' );
+
 		$updateMessage
 			.attr(
 				'aria-label',
@@ -553,7 +559,8 @@
 	 * @param {string}  response.errorMessage The error that occurred.
 	 */
 	wp.updates.updatePluginError = function( response ) {
-		var $card, $message, errorMessage;
+		var $card, $message, errorMessage,
+			$adminBarUpdates = $( '#wp-admin-bar-updates' );
 
 		if ( ! wp.updates.isValidResponse( response, 'update' ) ) {
 			return;
@@ -631,6 +638,8 @@
 			} );
 		}
 
+		$adminBarUpdates.removeClass( 'spin' );
+
 		wp.a11y.speak( errorMessage, 'assertive' );
 
 		$document.trigger( 'wp-plugin-update-error', response );
diff --git a/src/wp-includes/css/admin-bar.css b/src/wp-includes/css/admin-bar.css
index 30a048ad5d..e6422db1cf 100644
--- a/src/wp-includes/css/admin-bar.css
+++ b/src/wp-includes/css/admin-bar.css
@@ -588,6 +588,11 @@ html:lang(he-il) .rtl #wpadminbar * {
 	top: 2px;
 }
 
+#wpadminbar #wp-admin-bar-updates.spin .ab-icon:before {
+	display: inline-block;
+	animation: rotation 2s infinite linear;
+}
+
 /**
  * Search
  */