Update the sidebar counter to match

Replaces legacy unread feedback count logic with new static methods in Contact_Form_Plugin and Feedback classes, storing the count in a new option. Updates backend to recalculate and return the unread count after marking feedback as read/unread. Frontend now updates the admin menu counter dynamically using the new count from the server, improving accuracy and consistency.

Author: enejb

projects/packages/forms/src/contact-form/class-contact-form-endpoint.php

@@ -1091,6 +1091,7 @@ public function update_read_status( $request ) {
 
 		$success = $is_unread ? $feedback_response->mark_as_unread() : $feedback_response->mark_as_read();
 
+		Contact_Form_Plugin::recalculate_unread_count();
 		if ( ! $success ) {
 			return new WP_Error(
 				'rest_cannot_update',
@@ -1103,6 +1104,7 @@ public function update_read_status( $request ) {
 			array(
 				'id'        => $post_id,
 				'is_unread' => $feedback_response->is_unread(),
+				'count'     => Contact_Form_Plugin::get_unread_count(),
 			)
 		);
 	}

projects/packages/forms/src/contact-form/class-contact-form-plugin.php

@@ -1406,70 +1406,91 @@ public function allow_feedback_rest_api_type( $post_types ) {
 	 * Display the count of new feedback entries received. It's reset when user visits the Feedback screen.
 	 *
 	 * @since 4.1.0
-	 *
-	 * @param object $screen Information about the current screen.
 	 */
-	public function unread_count( $screen ) {
-		if ( isset( $screen->post_type ) && 'feedback' === $screen->post_type || $screen->id === 'jetpack_page_jetpack-forms-admin' ) {
-			update_option( 'feedback_unread_count', 0 );
-		} else {
-			global $submenu, $menu;
-			if ( apply_filters( 'jetpack_forms_use_new_menu_parent', true ) && current_user_can( 'edit_pages' ) ) {
-				// show the count on Jetpack and Jetpack → Forms
-				$unread = get_option( 'feedback_unread_count', 0 );
-
-				if ( $unread > 0 && isset( $submenu['jetpack'] ) && is_array( $submenu['jetpack'] ) && ! empty( $submenu['jetpack'] ) ) {
-					$forms_unread_count_tag = " <span class='count-{$unread} awaiting-mod'><span>" . number_format_i18n( $unread ) . '</span></span>';
-					$jetpack_badge_count    = $unread;
-
-					// Main menu entries
-					foreach ( $menu as $index => $main_menu_item ) {
-						if ( isset( $main_menu_item[1] ) && 'jetpack_admin_page' === $main_menu_item[1] ) {
-							// Parse the menu item
-							$jetpack_menu_item = $this->parse_menu_item( $menu[ $index ][0] );
-
-							if ( isset( $jetpack_menu_item['badge'] ) && is_numeric( $jetpack_menu_item['badge'] ) && intval( $jetpack_menu_item['badge'] ) ) {
-								$jetpack_badge_count += intval( $jetpack_menu_item['badge'] );
-							}
+	public function unread_count() {
 
-							if ( isset( $jetpack_menu_item['count'] ) && is_numeric( $jetpack_menu_item['count'] ) && intval( $jetpack_menu_item['count'] ) ) {
-								$jetpack_badge_count += intval( $jetpack_menu_item['count'] );
-							}
+		global $submenu, $menu;
+		if ( apply_filters( 'jetpack_forms_use_new_menu_parent', true ) && current_user_can( 'edit_pages' ) ) {
+			// show the count on Jetpack and Jetpack → Forms
+			$unread = self::get_unread_count();
 
-							$jetpack_unread_tag = " <span class='count-{$jetpack_badge_count} awaiting-mod'><span>" . number_format_i18n( $jetpack_badge_count ) . '</span></span>';
+			if ( $unread > 0 && isset( $submenu['jetpack'] ) && is_array( $submenu['jetpack'] ) && ! empty( $submenu['jetpack'] ) ) {
+				$forms_unread_count_tag = " <span class='jp-feedback-unread-counter count-{$unread} awaiting-mod'><span class='feedback-unread-counter'>" . number_format_i18n( $unread ) . '</span></span>';
+				$jetpack_badge_count    = $unread;
 
-							// phpcs:ignore WordPress.WP.GlobalVariablesOverride.Prohibited
-							$menu[ $index ][0] = $jetpack_menu_item['title'] . ' ' . $jetpack_unread_tag;
+				// Main menu entries
+				foreach ( $menu as $index => $main_menu_item ) {
+					if ( isset( $main_menu_item[1] ) && 'jetpack_admin_page' === $main_menu_item[1] ) {
+						// Parse the menu item
+						$jetpack_menu_item = $this->parse_menu_item( $menu[ $index ][0] );
+
+						if ( isset( $jetpack_menu_item['badge'] ) && is_numeric( $jetpack_menu_item['badge'] ) && intval( $jetpack_menu_item['badge'] ) ) {
+							$jetpack_badge_count += intval( $jetpack_menu_item['badge'] );
 						}
-					}
 
-					// Jetpack submenu entries
-					foreach ( $submenu['jetpack'] as $index => $menu_item ) {
-						if ( 'jetpack-forms-admin' === $menu_item[2] ) {
-							// phpcs:ignore WordPress.WP.GlobalVariablesOverride.Prohibited
-							$submenu['jetpack'][ $index ][0] .= $forms_unread_count_tag;
+						if ( isset( $jetpack_menu_item['count'] ) && is_numeric( $jetpack_menu_item['count'] ) && intval( $jetpack_menu_item['count'] ) ) {
+							$jetpack_badge_count += intval( $jetpack_menu_item['count'] );
 						}
+
+						$jetpack_unread_tag = " <span data-unread-diff='" . ( $jetpack_badge_count - $unread ) . "' class='jp-feedback-unread-counter count-{$jetpack_badge_count} awaiting-mod'><span class='feedback-unread-counter'>" . number_format_i18n( $jetpack_badge_count ) . '</span></span>';
+
+						// phpcs:ignore WordPress.WP.GlobalVariablesOverride.Prohibited
+						$menu[ $index ][0] = $jetpack_menu_item['title'] . ' ' . $jetpack_unread_tag;
+					}
+				}
+
+				// Jetpack submenu entries
+				foreach ( $submenu['jetpack'] as $index => $menu_item ) {
+					if ( 'jetpack-forms-admin' === $menu_item[2] ) {
+						// phpcs:ignore WordPress.WP.GlobalVariablesOverride.Prohibited
+						$submenu['jetpack'][ $index ][0] .= $forms_unread_count_tag;
 					}
 				}
-				return;
 			}
-			if ( isset( $submenu['feedback'] ) && is_array( $submenu['feedback'] ) && ! empty( $submenu['feedback'] ) ) {
-				foreach ( $submenu['feedback'] as $index => $menu_item ) {
-					if ( 'edit.php?post_type=feedback' === $menu_item[2] ) {
-						$unread = get_option( 'feedback_unread_count', 0 );
-						if ( $unread > 0 ) {
-							$unread_count = current_user_can( 'publish_pages' ) ? " <span class='feedback-unread count-{$unread} awaiting-mod'><span class='feedback-unread-count'>" . number_format_i18n( $unread ) . '</span></span>' : '';
-
-							// phpcs:ignore WordPress.WP.GlobalVariablesOverride.Prohibited
-							$submenu['feedback'][ $index ][0] .= $unread_count;
-						}
-						break;
+			return;
+		}
+
+		if ( isset( $submenu['feedback'] ) && is_array( $submenu['feedback'] ) && ! empty( $submenu['feedback'] ) ) {
+			foreach ( $submenu['feedback'] as $index => $menu_item ) {
+				if ( 'edit.php?post_type=feedback' === $menu_item[2] ) {
+					$unread = self::get_unread_count();
+
+					if ( $unread > 0 ) {
+						$unread_count = current_user_can( 'publish_pages' ) ? " <span class='feedback-unread jp-feedback-unread-counter count-{$unread} awaiting-mod'><span class='feedback-unread-count'>" . number_format_i18n( $unread ) . '</span></span>' : '';
+
+						// phpcs:ignore WordPress.WP.GlobalVariablesOverride.Prohibited
+						$submenu['feedback'][ $index ][0] .= $unread_count;
 					}
+					break;
 				}
 			}
 		}
 	}
 
+	/**
+	 * Get the count of unread feedback entries.
+	 *
+	 * @since $$next-version$$
+	 *
+	 * @return int The count of unread feedback entries.
+	 */
+	public static function get_unread_count() {
+		return (int) get_option( 'feedback_unread_count_v2', 0 );
+	}
+
+	/**
+	 * Recalculate the count of unread feedback entries.
+	 *
+	 * @since $$next-version$$
+	 *
+	 * @return int The count of unread feedback entries.
+	 */
+	public static function recalculate_unread_count() {
+		$count = Feedback::get_unread_count();
+		update_option( 'feedback_unread_count_v2', $count );
+		return $count;
+	}
+
 	/**
 	 * Handles all contact-form POST submissions
 	 *

projects/packages/forms/src/contact-form/class-contact-form.php

@@ -1929,9 +1929,7 @@ public function process_submission() {
 		update_post_meta( $post_id, '_feedback_extra_fields', $this->addslashes_deep( $extra_values ) );
 
 		if ( 'publish' === $feedback_status ) {
-			// Increase count of unread feedback.
-			$unread = (int) get_option( 'feedback_unread_count', 0 ) + 1;
-			update_option( 'feedback_unread_count', $unread );
+			Contact_Form_Plugin::recalculate_unread_count();
 		}
 
 		if ( defined( 'AKISMET_VERSION' ) ) {

projects/packages/forms/src/contact-form/class-feedback.php

@@ -795,6 +795,24 @@ public function mark_as_unread() {
 		return false;
 	}
 
+	/**
+	 * Get the count of unread feedback entries.
+	 *
+	 * @return int
+	 */
+	public static function get_unread_count() {
+		$query = new \WP_Query(
+			array(
+				'post_type'      => self::POST_TYPE,
+				'post_status'    => 'publish',
+				'comment_status' => self::STATUS_UNREAD,
+				'posts_per_page' => -1,
+				'fields'         => 'ids',
+			)
+		);
+		return (int) $query->found_posts;
+	}
+
 	/**
 	 * Get the uploaded files from the feedback entry.
 	 *

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

@@ -7,6 +7,24 @@ import { store as noticesStore } from '@wordpress/notices';
 import { notSpam, spam } from '../../icons';
 import { store as dashboardStore } from '../../store';
 import InboxResponse from '../response';
+/**
+ * Update the unread count in the admin menu.
+ *
+ * @param {number} count - The new unread count.
+ */
+export const updateMenuCounter = count => {
+	// iterate over all elements with the class 'feedback-unread-counter' and update their text content
+	document.querySelectorAll( '.jp-feedback-unread-counter' ).forEach( item => {
+		if ( item.dataset.unreadDiff ) {
+			const newCount = parseInt( item.dataset.unreadDiff, 10 ) + count;
+			item.textContent = newCount > 0 ? newCount : '';
+			item.style.display = newCount > 0 ? '' : 'none';
+		} else {
+			item.textContent = count > 0 ? count : '';
+			item.style.display = count > 0 ? '' : 'none';
+		}
+	} );
+};
 
 export const BULK_ACTIONS = {
 	markAsSpam: 'mark_as_spam',
@@ -320,7 +338,16 @@ export const markAsReadAction = {
 					path: `/wp/v2/feedback/${ id }/read`,
 					method: 'POST',
 					data: { is_unread: false },
-				} );
+				} )
+					.then( ( { count } ) => {
+						// Update the unread count in the store.
+						updateMenuCounter( count );
+					} )
+					.catch( () => {
+						// Revert the change in the store if the server update fails.
+						editEntityRecord( 'postType', 'feedback', id, { is_unread: true } );
+						throw new Error( 'Failed to mark as read' );
+					} );
 			} )
 		);
 		if ( promises.every( ( { status } ) => status === 'fulfilled' ) ) {
@@ -376,7 +403,16 @@ export const markAsUnreadAction = {
 					path: `/wp/v2/feedback/${ id }/read`,
 					method: 'POST',
 					data: { is_unread: true },
-				} );
+				} )
+					.then( ( { count } ) => {
+						// Update the unread count in the store.
+						updateMenuCounter( count );
+					} )
+					.catch( () => {
+						// Revert the change in the store if the server update fails.
+						editEntityRecord( 'postType', 'feedback', id, { is_unread: false } );
+						throw new Error( 'Failed to mark as unread' );
+					} );
 			} )
 		);
 		if ( promises.every( ( { status } ) => status === 'fulfilled' ) ) {

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

@@ -27,6 +27,7 @@ import clsx from 'clsx';
 import CopyClipboardButton from '../components/copy-clipboard-button';
 import Gravatar from '../components/gravatar';
 import { useMarkAsSpam } from '../hooks/use-mark-as-spam';
+import { updateMenuCounter } from './dataviews/actions';
 import { getPath } from './utils';
 
 const getDisplayName = response => {
@@ -320,10 +321,15 @@ const InboxResponse = ( { response, loading, onModalStateChange } ) => {
 			path: `/wp/v2/feedback/${ response.id }/read`,
 			method: 'POST',
 			data: { is_unread: false },
-		} ).catch( error => {
-			// eslint-disable-next-line no-console
-			console.error( 'Failed to mark feedback as read:', error );
-		} );
+		} )
+			.then( ( { count } ) => {
+				updateMenuCounter( count );
+			} )
+			.catch( () => {
+				editEntityRecord( 'postType', 'feedback', response.id, {
+					is_unread: true,
+				} );
+			} );
 	}, [ response, editEntityRecord ] );
 
 	const handelImageLoaded = useCallback( () => {

projects/packages/forms/tests/php/contact-form/Contact_Form_Endpoint_Test.php

@@ -738,10 +738,12 @@ public function test_mark_feedback_as_read() {
 		$response = $this->server->dispatch( $request );
 		$data     = $response->get_data();
 		$this->assertFalse( $data['is_unread'] );
+		$this->assertIsInt( 0, Contact_Form_Plugin::get_unread_count() );
 
 		// Verify Feedback class method
 		$feedback = \Automattic\Jetpack\Forms\ContactForm\Feedback::get( $post_id );
 		$this->assertFalse( $feedback->is_unread() );
+		$this->assertIsInt( 1, Contact_Form_Plugin::get_unread_count() );
 	}
 
 	/**