diff --git a/ui/pages/notifications/notifications-list.test.tsx b/ui/pages/notifications/notifications-list.test.tsx
index 366d3d2261ff..a48e5be37845 100644
--- a/ui/pages/notifications/notifications-list.test.tsx
+++ b/ui/pages/notifications/notifications-list.test.tsx
@@ -51,6 +51,7 @@ describe('NotificationsList', () => {
notifications={[]}
isLoading={false}
isError={false}
+ notificationsCount={0}
/>
diff --git a/ui/pages/notifications/notifications-list.tsx b/ui/pages/notifications/notifications-list.tsx
index cc1c2a40a4ec..500b7ef210aa 100644
--- a/ui/pages/notifications/notifications-list.tsx
+++ b/ui/pages/notifications/notifications-list.tsx
@@ -23,6 +23,7 @@ export type NotificationsListProps = {
notifications: NotificationType[];
isLoading: boolean;
isError: boolean;
+ notificationsCount: number;
};
function LoadingContent() {
@@ -120,7 +121,7 @@ export function NotificationsList(props: NotificationsListProps) {
{/* Read All Button */}
- {props.notifications.length > 0 ? (
+ {props.notifications.length > 0 && props.notificationsCount > 0 ? (
) : null}
diff --git a/ui/pages/notifications/notifications.tsx b/ui/pages/notifications/notifications.tsx
index 5b5d89e6645a..bdefd020ca42 100644
--- a/ui/pages/notifications/notifications.tsx
+++ b/ui/pages/notifications/notifications.tsx
@@ -16,6 +16,7 @@ import {
import { NotificationsPage } from '../../components/multichain';
import { Content, Header } from '../../components/multichain/pages/page';
import { useMetamaskNotificationsContext } from '../../contexts/metamask-notifications/metamask-notifications';
+import { useCounter } from '../../hooks/metamask-notifications/useCounter';
import { getNotifications, getNotifySnaps } from '../../selectors';
import {
selectIsFeatureAnnouncementsEnabled,
@@ -165,6 +166,7 @@ export default function Notifications() {
const [activeTab, setActiveTab] = useState(TAB_KEYS.ALL);
const combinedNotifications = useCombinedNotifications();
+ const { notificationsCount } = useCounter();
const filteredNotifications = useMemo(
() => filterNotifications(activeTab, combinedNotifications),
[activeTab, combinedNotifications],
@@ -248,6 +250,7 @@ export default function Notifications() {
notifications={filteredNotifications}
isLoading={isLoading}
isError={Boolean(error)}
+ notificationsCount={notificationsCount}
/>