feat: Add non-navigable alert modals (#37425)

<!--
Please submit this PR as a draft initially.
Do not mark it as "Ready for review" until the template has been
completely filled out, and PR status checks have passed at least once.
-->

## **Description**

<!--
Write a short description of the changes included in this pull request,
also include relevant motivation and context. Have in mind the following
questions:
1. What is the reason for the change?
2. What is the improvement/solution?
-->

Introduces a new optional alert property to hide navigation for this
alert.

[![Open in GitHub
Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/MetaMask/metamask-extension/pull/37425?quickstart=1)

## **Changelog**

<!--
If this PR is not End-User-Facing and should not show up in the
CHANGELOG, you can choose to either:
1. Write `CHANGELOG entry: null`
2. Label with `no-changelog`

If this PR is End-User-Facing, please write a short User-Facing
description in the past tense like:
`CHANGELOG entry: Added a new tab for users to see their NFTs`
`CHANGELOG entry: Fixed a bug that was causing some NFTs to flicker`

(This helps the Release Engineer do their job more quickly and
accurately)
-->

CHANGELOG entry:

## **Related issues**

Fixes:

## **Manual testing steps**

1. Go to this page...
2.
3.

## **Screenshots/Recordings**

<!-- If applicable, add screenshots and/or recordings to visualize the
before and after of your change. -->

### **Before**

<!-- [screenshots/recordings] -->

### **After**

<!-- [screenshots/recordings] -->



https://github.com/user-attachments/assets/249abb46-f295-4035-b838-5e1843658410



## **Pre-merge author checklist**

- [ ] I've followed [MetaMask Contributor
Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask
Extension Coding
Standards](https://github.com/MetaMask/metamask-extension/blob/main/.github/guidelines/CODING_GUIDELINES.md).
- [ ] I've completed the PR template to the best of my ability
- [ ] I’ve included tests if applicable
- [ ] I’ve documented my code using [JSDoc](https://jsdoc.app/) format
if applicable
- [ ] I’ve applied the right labels on the PR (see [labeling
guidelines](https://github.com/MetaMask/metamask-extension/blob/main/.github/guidelines/LABELING_GUIDELINES.md)).
Not required for external contributors.

## **Pre-merge reviewer checklist**

- [ ] I've manually tested the PR (e.g. pull and build branch, run the
app, test code being changed).
- [ ] I confirm that this PR addresses all acceptance criteria described
in the ticket it closes and includes the necessary testing evidence such
as recordings and or screenshots.

<!-- CURSOR_SUMMARY -->
---

> [!NOTE]
> Adds `hideFromAlertNavigation` to alerts and updates hooks/modal to
skip these in navigation, with tests and usage updates.
> 
> - **Alert Model**:
>   - Add optional `hideFromAlertNavigation` to `Alert`.
> - **Hooks (`useAlerts`)**:
> - Return `navigableAlerts`, `navigableFieldAlerts`,
`navigableGeneralAlerts`, and `getNavigableFieldAlerts`, excluding
alerts with `hideFromAlertNavigation`.
>   - Ensure severity sorting is non-mutating.
> - **UI – MultipleAlertModal**:
>   - Drive selection by `alertKey` with robust syncing/fallback logic.
> - Navigate only through `navigable*` alerts; hide nav controls if
current alert sets `hideFromAlertNavigation` or when skipping is
requested.
>   - Acknowledge just triggers `onFinalAcknowledgeClick` (no cycling).
> - **UI – ConfirmInfoAlertRow**:
> - Derive `selectedAlert` once; pass `skipAlertNavigation` based on
`hideFromAlertNavigation`.
> - **Alerts – Shield Coverage**:
>   - Mark shield coverage alert with `hideFromAlertNavigation: true`.
> - **Tests**:
> - Update/extend tests for severity ordering, navigable alert
filtering, modal navigation hiding/skipping, and selection behavior.
> 
> <sup>Written by [Cursor
Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
22c7214. This will update automatically
on new commits. Configure
[here](https://cursor.com/dashboard?tab=bugbot).</sup>
<!-- /CURSOR_SUMMARY -->

Author: pedronfigueiredo

ui/components/app/alert-system/multiple-alert-modal/multiple-alert-modal.test.tsx

@@ -23,6 +23,7 @@ describe('MultipleAlertModal', () => {
   const FROM_ALERT_KEY_MOCK = 'from';
   const CONTRACT_ALERT_KEY_MOCK = 'contract';
   const DATA_ALERT_KEY_MOCK = 'data';
+  const HIDDEN_ALERT_KEY_MOCK = 'hidden';
   const onAcknowledgeClickMock = jest.fn();
   const onCloseMock = jest.fn();
 
@@ -158,15 +159,20 @@ describe('MultipleAlertModal', () => {
     expect(onAcknowledgeClickMock).toHaveBeenCalledTimes(1);
   });
 
-  it('renders the next alert when the "Got it" button is clicked', () => {
-    const { getByTestId, getByText } = renderWithProvider(
+  it('does not change the alert when the "Got it" button is clicked', () => {
+    onAcknowledgeClickMock.mockReset();
+    const { getByTestId, getByText, queryByText } = renderWithProvider(
       <MultipleAlertModal {...defaultProps} alertKey={DATA_ALERT_KEY_MOCK} />,
       mockStoreAcknowledgeAlerts,
     );
 
+    expect(getByText(alertsMock[1].message)).toBeInTheDocument();
+
     fireEvent.click(getByTestId('alert-modal-button'));
 
+    expect(onAcknowledgeClickMock).toHaveBeenCalledTimes(1);
     expect(getByText(alertsMock[1].message)).toBeInTheDocument();
+    expect(queryByText(alertsMock[2].message)).not.toBeInTheDocument();
   });
 
   it('closes modal when the "Got it" button is clicked', () => {
@@ -185,20 +191,6 @@ describe('MultipleAlertModal', () => {
     expect(onAcknowledgeClickMock).toHaveBeenCalledTimes(1);
   });
 
-  it('resets to the first alert if there are unconfirmed alerts and the final alert is acknowledged', () => {
-    const { getByTestId, getByText } = renderWithProvider(
-      <MultipleAlertModal
-        {...defaultProps}
-        alertKey={CONTRACT_ALERT_KEY_MOCK}
-      />,
-      mockStore,
-    );
-
-    fireEvent.click(getByTestId('alert-modal-button'));
-
-    expect(getByText(alertsMock[0].message)).toBeInTheDocument();
-  });
-
   describe('FieldAlerts not present', () => {
     const alertsMockWithoutField = [
       {
@@ -279,7 +271,101 @@ describe('MultipleAlertModal', () => {
 
       fireEvent.click(getByTestId('alert-modal-back-button'));
 
-      expect(getByText(alertsMock[1].message)).toBeInTheDocument();
+      expect(getByText(alertsMock[0].message)).toBeInTheDocument();
+    });
+  });
+
+  describe('Alerts hidden from navigation', () => {
+    const alertsWithHiddenNavigationMock = [
+      {
+        key: FROM_ALERT_KEY_MOCK,
+        field: FROM_ALERT_KEY_MOCK,
+        severity: Severity.Warning,
+        message: 'Alert 1',
+        reason: 'Reason 1',
+        alertDetails: ['Detail 1', 'Detail 2'],
+      },
+      {
+        key: HIDDEN_ALERT_KEY_MOCK,
+        field: HIDDEN_ALERT_KEY_MOCK,
+        severity: Severity.Danger,
+        message: 'Hidden Alert',
+        hideFromAlertNavigation: true,
+      },
+      {
+        key: CONTRACT_ALERT_KEY_MOCK,
+        field: CONTRACT_ALERT_KEY_MOCK,
+        severity: Severity.Info,
+        message: 'Alert 3',
+      },
+    ];
+
+    const mockStoreWithHiddenNavigation = configureMockStore([])({
+      ...STATE_MOCK,
+      confirmAlerts: {
+        alerts: { [OWNER_ID_MOCK]: alertsWithHiddenNavigationMock },
+        confirmed: {
+          [OWNER_ID_MOCK]: {
+            [FROM_ALERT_KEY_MOCK]: false,
+            [HIDDEN_ALERT_KEY_MOCK]: false,
+            [CONTRACT_ALERT_KEY_MOCK]: false,
+          },
+        },
+      },
+    });
+
+    const mockStoreWithHiddenNavigationConfirmed = configureMockStore([])({
+      ...STATE_MOCK,
+      confirmAlerts: {
+        alerts: { [OWNER_ID_MOCK]: alertsWithHiddenNavigationMock },
+        confirmed: {
+          [OWNER_ID_MOCK]: {
+            [FROM_ALERT_KEY_MOCK]: true,
+            [HIDDEN_ALERT_KEY_MOCK]: true,
+            [CONTRACT_ALERT_KEY_MOCK]: true,
+          },
+        },
+      },
+    });
+
+    it('does not render navigation controls when the selected alert hides navigation', () => {
+      const { queryByTestId } = renderWithProvider(
+        <MultipleAlertModal
+          {...defaultProps}
+          alertKey={HIDDEN_ALERT_KEY_MOCK}
+        />,
+        mockStoreWithHiddenNavigation,
+      );
+
+      expect(queryByTestId('alert-modal-next-button')).toBeNull();
+      expect(queryByTestId('alert-modal-back-button')).toBeNull();
+    });
+
+    it('skips alerts hidden from navigation when cycling forward', () => {
+      const { getByTestId, getByText, queryByText } = renderWithProvider(
+        <MultipleAlertModal {...defaultProps} />,
+        mockStoreWithHiddenNavigation,
+      );
+
+      fireEvent.click(getByTestId('alert-modal-next-button'));
+
+      expect(queryByText('Hidden Alert')).not.toBeInTheDocument();
+      expect(getByText('Alert 3')).toBeInTheDocument();
+    });
+
+    it('acknowledges an alert that hides navigation without cycling', () => {
+      onAcknowledgeClickMock.mockReset();
+      const { getByTestId } = renderWithProvider(
+        <MultipleAlertModal
+          {...defaultProps}
+          alertKey={HIDDEN_ALERT_KEY_MOCK}
+        />,
+        mockStoreWithHiddenNavigationConfirmed,
+      );
+
+      fireEvent.click(getByTestId('alert-modal-button'));
+
+      expect(onAcknowledgeClickMock).toHaveBeenCalledTimes(1);
     });
   });
 });