Remove read item from counter after it was actually marked as read

We removed the item first from the 'unread' counter and then told
the API to mark it as read. The API, however, wisely first checks
if there is anything *to* mark as read, but by that point, the
unread count is zero, so it gracefully refuses and returns an
empty resolved promise.

That is clearly not the way to go. Remove the read item from its
smart unread counter only **after** it was sent to the API to be
marked as read.

Note: We shouldn't wait for the API promise to resolve to remove
the item from the counter, but the API should run its preliminary
tests before the item is removed.

Bug: T122087
Change-Id: Ia5fc35c7435db8c4742238897da67681cee23c41

modules/viewmodel/mw.echo.dm.NotificationsModel.js

@@ -175,7 +175,6 @@
 		// Update unread status and emit events
 		if ( unreadItem ) {
 			if ( isRead ) {
-				this.unreadNotifications.removeItems( [ unreadItem ] );
 				if ( !this.markingAllAsRead ) {
 					this.markItemReadInApi( id );
 				}
@@ -183,6 +182,10 @@
 					// Remove this notification from the model
 					this.removeItems( [ unreadItem ] );
 				}
+				// Remove the item from the counter after all other operations
+				// finished, since some of the operations check if there are any
+				// unread notifications to begin with.
+				this.unreadNotifications.removeItems( [ unreadItem ] );
 			} else {
 				this.unreadNotifications.addItems( [ unreadItem ] );
 			}