Merge "Add PLURAL support for "mark all as read" buttons"

i18n/en.json

@@ -247,9 +247,9 @@
 	"echo-notification-notice-text-only": "Notices",
 	"echo-overlay-link": "All notifications",
 	"echo-overlay-title": "<b>Notifications</b>",
-	"echo-mark-all-as-read": "Mark all as read",
+	"echo-mark-all-as-read": "Mark {{PLURAL:$1|all}} as read",
 	"echo-mark-all-as-read-confirmation": "$1 {{PLURAL:$1|notification|notifications}} marked as read",
-	"echo-mark-wiki-as-read": "Mark all as read in selected wiki: $1",
+	"echo-mark-wiki-as-read": "Mark {{PLURAL:$2|all}} as read in selected wiki: $1",
 	"echo-displaysnippet-title": "New notification",
 	"echo-date-today": "Today",
 	"echo-date-yesterday": "Yesterday",

i18n/qqq.json

@@ -251,9 +251,9 @@
 	"echo-notification-notice-text-only": "Label for notice notifications tab in Echo overlay without notice notification count next to it. That label groups all notifications less important than the ones displayed in \"alerts\".\n{{Identical|Notice}}",
 	"echo-overlay-link": "Link to \"all notifications\" at the bottom of the overlay.\n{{Identical|All notifications}}",
 	"echo-overlay-title": "Title at the top of the notifications overlay. Should include bold tags.\n{{Identical|Notification}}",
-	"echo-mark-all-as-read": "Text for button that marks all unread notifications as read. Keep this as short as possible.\n{{Identical|Mark all as read}}",
+	"echo-mark-all-as-read": "Text for button that marks all unread notifications as read. Keep this as short as possible.\n\nParameters:\n* $1 - The number of unread notifications\n{{Identical|Mark all as read}}",
 	"echo-mark-all-as-read-confirmation": "Text for the confirmation message that appers after the user marks all unread notifications as read, as used on mobile. Keep this as short as possible\n\nParameters:\n* $1 - The number of notifications that were marked as read",
-	"echo-mark-wiki-as-read": "Text for button that marks all unread notifications as read in a specific wiki. Keep this as short as possible.\n\nParameters:\n* $1 - The human readable name of the selected wiki",
+	"echo-mark-wiki-as-read": "Text for button that marks all unread notifications as read in a specific wiki. Keep this as short as possible.\n\nParameters:\n* $1 - The human readable name of the selected wiki\n* $2 - The number of unread notifications",
 	"echo-displaysnippet-title": "The header text for notification snippets displayed in a corner of the screen when the user receives a new notification",
 	"echo-date-today": "The header text for today's notification section.\n{{Identical|Today}}",
 	"echo-date-yesterday": "The header text for yesterday's notification section.\n{{Identical|Yesterday}}",

includes/Special/SpecialNotifications.php

@@ -7,6 +7,7 @@ use EchoSeenTime;
 use Html;
 use MediaWiki\Extension\Notifications\OOUI\LabelIconWidget;
 use MWEchoEventLogging;
+use MWEchoNotifUser;
 use OOUI;
 use SpecialPage;
 
@@ -121,8 +122,13 @@ class SpecialNotifications extends SpecialPage {
 		if ( $anyUnread ) {
 			$markReadSpecialPage = new SpecialNotificationsMarkRead();
 			$markReadSpecialPage->setContext( $this->getContext() );
+			$notifUser = MWEchoNotifUser::newFromUser( $user );
+			$unreadCount = $notifUser->getAlertCount() + $notifUser->getMessageCount();
 
-			$markAllAsReadText = $this->msg( 'echo-mark-all-as-read' )->text();
+			$markAllAsReadText = $this
+				->msg( 'echo-mark-all-as-read' )
+				->numParams( $unreadCount )
+				->text();
 			$markAllAsReadLabelIcon = new LabelIconWidget( [
 				'label' => $markAllAsReadText,
 				'icon' => 'checkAll',

modules/mobile/list.js

@@ -38,6 +38,9 @@ function notificationsList( echo, markAllReadButton, onCountChange, onNotificati
 			markAllReadButton.toggle(
 				controller.manager.hasLocalUnread()
 			);
+			markAllReadButton.setTitle(
+				mw.msg( 'echo-mark-all-as-read', unreadCounter.getCount() )
+			);
 		},
 		// Create a container which will be revealed when "more options" (...)
 		// is clicked on a notification. Hidden by default.

modules/mobile/overlay.js

@@ -42,8 +42,7 @@ function notificationsOverlay( onCountChange, onNotificationListRendered, onBefo
 	var markAllReadButton, overlay,
 		oouiPromise = mw.loader.using( 'oojs-ui' ).then( function () {
 			markAllReadButton = new OO.ui.ButtonWidget( {
-				icon: 'checkAll',
-				title: mw.msg( 'echo-mark-all-as-read' )
+				icon: 'checkAll'
 			} );
 			return View.make(
 				{ class: 'notifications-overlay-header-markAllRead' },

modules/ui/mw.echo.ui.NotificationBadgeWidget.js

@@ -143,9 +143,10 @@
 		this.setPendingElement( this.popup.$head );
 
 		// Mark all as read button
+		this.markAllReadLabel = mw.msg( 'echo-mark-all-as-read', config.convertedNumber );
 		this.markAllReadButton = new OO.ui.ButtonWidget( {
 			framed: false,
-			label: mw.msg( 'echo-mark-all-as-read' ),
+			label: this.markAllReadLabel,
 			classes: [ 'mw-echo-ui-notificationsWidget-markAllReadButton' ]
 		} );
 
@@ -243,11 +244,14 @@
 	 * Update the badge state and label based on changes to the model
 	 */
 	mw.echo.ui.NotificationBadgeWidget.prototype.updateBadge = function () {
-		var unreadCount, cappedUnreadCount, badgeLabel;
+		var unreadCount, cappedUnreadCount, badgeLabel, convertedCount;
 
 		unreadCount = this.manager.getUnreadCounter().getCount();
 		cappedUnreadCount = this.manager.getUnreadCounter().getCappedNotificationCount( unreadCount );
-		badgeLabel = mw.msg( 'echo-badge-count', mw.language.convertNumber( cappedUnreadCount ) );
+		convertedCount = mw.language.convertNumber( cappedUnreadCount );
+		badgeLabel = mw.msg( 'echo-badge-count', convertedCount );
+		this.markAllReadLabel = mw.msg( 'echo-mark-all-as-read', convertedCount );
+		this.markAllReadButton.setLabel( this.markAllReadLabel );
 
 		this.badgeButton.setLabel( badgeLabel );
 		this.badgeButton.setCount( unreadCount, badgeLabel );

modules/ui/mw.echo.ui.SpecialHelpMenuWidget.js

@@ -26,7 +26,9 @@
 
 		this.markAllReadOption = new OO.ui.MenuOptionWidget( {
 			icon: 'checkAll',
-			label: this.getMarkAllReadOptionLabel(),
+			label: this.getMarkAllReadOptionLabel(
+				this.manager.getPaginationModel().getCurrentPageItemCount()
+			),
 			data: 'markAllRead'
 		} );
 		this.markAllReadOption.toggle( false );
@@ -73,7 +75,15 @@
 	 * Respond to source page change
 	 */
 	mw.echo.ui.SpecialHelpMenuWidget.prototype.onSourcePageUpdate = function () {
-		this.markAllReadOption.setLabel( this.getMarkAllReadOptionLabel() );
+		var sourcePagesModel = this.manager.getFiltersModel().getSourcePagesModel(),
+			source = sourcePagesModel.getCurrentSource(),
+			sourcePages = sourcePagesModel.getSourcePages( source ),
+			currentPage = sourcePagesModel.getCurrentPage(),
+			currentCount = currentPage ?
+				sourcePages[ currentPage ].count :
+				sourcePagesModel.getSourceTotalCount( source );
+
+		this.markAllReadOption.setLabel( this.getMarkAllReadOptionLabel( currentCount ) );
 	};
 
 	/**
@@ -82,6 +92,7 @@
 	 * @param {number} count New count
 	 */
 	mw.echo.ui.SpecialHelpMenuWidget.prototype.onLocalCountChange = function ( count ) {
+		this.markAllReadOption.setLabel( this.getMarkAllReadOptionLabel( count ) );
 		this.markAllReadOption.toggle( count > 0 );
 	};
 
@@ -111,16 +122,17 @@
 	/**
 	 * Build the button label
 	 *
+	 * @param {number} count Number of unread notifications
 	 * @return {string} Mark all read button label
 	 */
-	mw.echo.ui.SpecialHelpMenuWidget.prototype.getMarkAllReadOptionLabel = function () {
+	mw.echo.ui.SpecialHelpMenuWidget.prototype.getMarkAllReadOptionLabel = function ( count ) {
 		var pageModel = this.manager.getFiltersModel().getSourcePagesModel(),
 			source = pageModel.getCurrentSource(),
 			sourceTitle = pageModel.getSourceTitle( source );
 
 		return sourceTitle ?
-			mw.msg( 'echo-mark-wiki-as-read', sourceTitle ) :
-			mw.msg( 'echo-mark-all-as-read' );
+			mw.msg( 'echo-mark-wiki-as-read', sourceTitle, count ) :
+			mw.msg( 'echo-mark-all-as-read', count );
 	};
 
 }() );