Optimistically update only for inbox

Author: simison

projects/packages/forms/src/dashboard/inbox/dataviews/actions.js

@@ -312,13 +312,16 @@ export const markAsReadAction = {
 	async callback( items, { registry } ) {
 		const { editEntityRecord } = registry.dispatch( coreStore );
 		const { createSuccessNotice, createErrorNotice } = registry.dispatch( noticesStore );
+
 		const promises = await Promise.allSettled(
-			items.map( async ( { id } ) => {
+			items.map( async ( { id, status } ) => {
 				// Update entity in store
 				editEntityRecord( 'postType', 'feedback', id, { is_unread: false } );
 
-				// Immediately update menu counters optimistically to avoid delays
-				updateMenuCounterOptimistically( -items.length );
+				// Immediately update menu counters optimistically to avoid delays, but only for inbox
+				if ( status === 'publish' ) {
+					updateMenuCounterOptimistically( -1 );
+				}
 
 				// Update on server
 				return apiFetch( {
@@ -327,15 +330,17 @@ export const markAsReadAction = {
 					data: { is_unread: false },
 				} )
 					.then( ( { count } ) => {
-						// Update the unread count in the menu.
+						// Update menu counter with accurate count from server.
 						updateMenuCounter( count );
 					} )
 					.catch( () => {
 						// Revert the change in the store if the server update fails.
 						editEntityRecord( 'postType', 'feedback', id, { is_unread: true } );
 
-						// Revert the change in the sidebar
-						updateMenuCounterOptimistically( items.length );
+						// Revert the optimistic change in the sidebar.
+						if ( status === 'publish' ) {
+							updateMenuCounterOptimistically( 1 );
+						}
 
 						throw new Error( 'Failed to mark as read' );
 					} );
@@ -386,12 +391,14 @@ export const markAsUnreadAction = {
 		const { editEntityRecord } = registry.dispatch( coreStore );
 		const { createSuccessNotice, createErrorNotice } = registry.dispatch( noticesStore );
 		const promises = await Promise.allSettled(
-			items.map( async ( { id } ) => {
+			items.map( async ( { id, status } ) => {
 				// Update entity in store
 				editEntityRecord( 'postType', 'feedback', id, { is_unread: true } );
 
-				// Immediately update menu counters optimistically to avoid delays
-				updateMenuCounterOptimistically( items.length );
+				// Immediately update menu counters optimistically to avoid delays, but only for inbox
+				if ( status === 'publish' ) {
+					updateMenuCounterOptimistically( 1 );
+				}
 
 				// Update on server
 				return apiFetch( {
@@ -400,15 +407,17 @@ export const markAsUnreadAction = {
 					data: { is_unread: true },
 				} )
 					.then( ( { count } ) => {
-						// Update the unread count in the menu.
+						// Update menu counter with accurate count from server.
 						updateMenuCounter( count );
 					} )
 					.catch( () => {
 						// Revert the change in the store if the server update fails.
 						editEntityRecord( 'postType', 'feedback', id, { is_unread: false } );
 
-						// Revert the change in the sidebar
-						updateMenuCounterOptimistically( -items.length );
+						// Revert the optimistic change in the sidebar.
+						if ( status === 'publish' ) {
+							updateMenuCounterOptimistically( -1 );
+						}
 
 						throw new Error( 'Failed to mark as unread' );
 					} );

projects/packages/forms/src/dashboard/inbox/response.js

@@ -547,7 +547,9 @@ const InboxResponse = ( {
 		} );
 
 		// Immediately update menu counters optimistically to avoid delays
-		updateMenuCounterOptimistically( -1 );
+		if ( response.status === 'publish' ) {
+			updateMenuCounterOptimistically( -1 );
+		}
 
 		// Then update on server
 		apiFetch( {
@@ -566,7 +568,9 @@ const InboxResponse = ( {
 				} );
 
 				// Revert the change in the sidebar
-				updateMenuCounterOptimistically( 1 );
+				if ( response.status === 'publish' ) {
+					updateMenuCounterOptimistically( 1 );
+				}
 			} );
 	}, [ response, editEntityRecord, hasMarkedSelfAsRead ] );