fix: qr-based bridge (#37549)

<!--
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**
This fixes bridging when using a QR-based hardware device like Keystone
3 Pro. Without it, bridging was stuck after the approval.

<!--
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?
-->

[![Open in GitHub
Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/MetaMask/metamask-extension/pull/37549?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: Fixed bridging with qr-based wallets

## **Related issues**

Fixes:

## **Manual testing steps**

1. Bridge some ERC20 token from BSC to Linea for example, using a
Keystone wallet
2. Make sure the Bridge works

## **Screenshots/Recordings**

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

### **Before**


https://github.com/user-attachments/assets/ceac8327-b557-45fe-a1a2-180d041914ff

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

### **After**


https://github.com/user-attachments/assets/150d2f57-6bff-4274-bfbb-ab0386c89ff1


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

## **Pre-merge author checklist**

- [x] 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).
- [x] I've completed the PR template to the best of my ability
- [x] I’ve included tests if applicable
- [x] I’ve documented my code using [JSDoc](https://jsdoc.app/) format
if applicable
- [x] 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]
> Resets the QR hardware sign flow to `play` when a new request arrives
by adding a `useEffect` tied to `request.requestId`.
> 
> - **UI**
> -
**`ui/components/app/qr-hardware-popover/qr-hardware-sign-request/qr-hardware-sign-request.component.js`**:
> - Add `useEffect` to reset `status` to `play` when `request.requestId`
changes.
>     - Import `useEffect` to support the new behavior.
> 
> <sup>Written by [Cursor
Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
7cc4861. This will update automatically
on new commits. Configure
[here](https://cursor.com/dashboard?tab=bugbot).</sup>
<!-- /CURSOR_SUMMARY -->

Author: klejeune

ui/components/app/qr-hardware-popover/qr-hardware-sign-request/qr-hardware-sign-request.component.js

@@ -1,4 +1,4 @@
-import React, { useCallback, useState } from 'react';
+import React, { useCallback, useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import { useDispatch } from 'react-redux';
 import { completeQrCodeScan } from '../../../../store/actions';
@@ -9,6 +9,11 @@ const QRHardwareSignRequest = ({ request, handleCancel, setErrorTitle }) => {
   const dispatch = useDispatch();
   const [status, setStatus] = useState('play');
 
+  // Reset to 'play' mode when a new transaction request comes in
+  useEffect(() => {
+    setStatus('play');
+  }, [request.requestId]);
+
   const toRead = useCallback(() => setStatus('read'), []);
 
   const handleSuccess = useCallback(