Skip to content

fix: update transaction details bottom sheet status in real-time#26306

Merged
vinnyhoward merged 4 commits into
mainfrom
fix-tmcu-426-transaction-details-sheet-live-status
Feb 20, 2026
Merged

fix: update transaction details bottom sheet status in real-time#26306
vinnyhoward merged 4 commits into
mainfrom
fix-tmcu-426-transaction-details-sheet-live-status

Conversation

@vinnyhoward

@vinnyhoward vinnyhoward commented Feb 19, 2026 •
edited by cursor Bot
Loading

Copy link
Copy Markdown
Contributor

Description

The transaction details bottom sheet was displaying a stale transaction status when opened while a transaction was pending. The TransactionDetailsSheet received the tx object as a static snapshot via navigation route params, so the status field never updated after the sheet was opened, leaving it stuck on "Pending" even after the transaction confirmed.

The fix subscribes to live Redux state using selectTransactionMetadataById with the transaction ID. currentTx uses the live data when available and falls back to the static route param (e.g. if the transaction is no longer in the store).

Changelog

CHANGELOG entry: Fixed a bug where the transaction details bottom sheet would show a stale "Pending" status even after the transaction was confirmed.

Related issues

Fixes: https://consensyssoftware.atlassian.net/browse/TMCU-426

Manual testing steps

Feature: Transaction details bottom sheet live status

  Scenario: user opens transaction details while transaction is pending
    Given a transaction is submitted and in pending state
    And the Activity screen is visible

    When user taps the pending transaction to open the details bottom sheet
    And the transaction is confirmed on-chain while the bottom sheet is open

    Then the status in the bottom sheet updates from "Pending" to "Confirmed"
    And the user does not need to close and reopen the sheet to see the updated status

Screenshots/Recordings

~

Before

before1.mov

After

after1.mov

Pre-merge author checklist

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.

Note

Low Risk
Small UI data-source change limited to the transaction details sheet; main risk is regressions if the selector returns undefined or the shape differs from the route param.

Overview
The transaction details bottom sheet now subscribes to Redux for the latest transaction metadata via selectTransactionMetadataById, and uses this live object (falling back to the route param when missing).

TransactionDetailsSheet is updated to render the header timestamp and pass transactionObject from this live currentTx, fixing cases where the sheet previously stayed stuck on stale pending state while open.

Written by Cursor Bugbot for commit 310ab63. This will update automatically on new commits. Configure here.

@vinnyhoward vinnyhoward requested a review from a team as a code owner February 19, 2026 23:04
@github-actions

github-actions Bot commented Feb 19, 2026

Copy link
Copy Markdown
Contributor

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

@metamaskbot metamaskbot added the team-mobile-ux Mobile UX team label Feb 19, 2026
cursor[bot]
cursor Bot reviewed Feb 19, 2026
View reviewed changes

@cursor cursor Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cursor Bugbot has reviewed your changes and found 1 potential issue.

Comment thread app/components/UI/TransactionElement/TransactionDetailsSheet/TransactionDetailsSheet.tsx Outdated
PatrykLucka
PatrykLucka reviewed Feb 20, 2026
View reviewed changes
Comment thread app/components/UI/TransactionElement/TransactionDetailsSheet/TransactionDetailsSheet.tsx Outdated
const liveTransaction = useSelector((state: RootState) =>
selectTransactionMetadataById(state, tx.id),
);
const currentTx = liveTransaction

@PatrykLucka PatrykLucka Feb 20, 2026

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It might be worth to wrap it with useMemo

@vinnyhoward vinnyhoward Feb 20, 2026

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good catch

@github-actions

github-actions Bot commented Feb 20, 2026

Copy link
Copy Markdown
Contributor

🔍 Smart E2E Test Selection

  • Selected E2E tags: SmokeWalletPlatform, SmokeConfirmations
  • Selected Performance tags: None (no tests recommended)
  • Risk Level: medium
  • AI Confidence: 80%
click to see 🤖 AI reasoning details

E2E Test Selection:
The change modifies TransactionDetailsSheet.tsx to use live Redux state for transaction data instead of stale route params. This enables real-time updates when transaction status changes (e.g., pending to confirmed).

Key changes:

  1. Added useSelector hook to fetch live transaction data via selectTransactionMetadataById
  2. Created memoized currentTx that prefers live data over route params
  3. Updated component to use currentTx for time display and TransactionDetails prop

Impact areas:

  • Transaction history/activities view (SmokeWalletPlatform) - The component displays transaction details when users tap on transactions in their activity list
  • Transaction confirmations flow (SmokeConfirmations) - Transaction details are shown after submitting transactions

The change is contained to a single UI component but affects a core user flow (viewing transaction details). The selector used (selectTransactionMetadataById) is an existing, tested selector from transactionController.ts. The risk is medium because while the change is localized, it modifies how transaction data is sourced which could affect display correctness.

Performance Test Selection:
The change adds a Redux selector with useMemo for transaction data fetching. The selector uses createDeepEqualSelector which is already optimized for performance. The change is unlikely to significantly impact app performance as it's a targeted optimization to show live transaction data rather than adding new heavy computations or rendering. No performance tests are needed for this change.

View GitHub Actions results

@sonarqubecloud

sonarqubecloud Bot commented Feb 20, 2026

Copy link
Copy Markdown

Quality Gate Passed Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

@vinnyhoward vinnyhoward added this pull request to the merge queue Feb 20, 2026
Merged via the queue into main with commit d7503d9 Feb 20, 2026
97 checks passed
@vinnyhoward vinnyhoward deleted the fix-tmcu-426-transaction-details-sheet-live-status branch February 20, 2026 17:45
@github-actions github-actions Bot locked and limited conversation to collaborators Feb 20, 2026
@metamaskbot metamaskbot added the release-7.68.0 Issue or pull request that will be included in release 7.68.0 label Feb 20, 2026
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Reviewers

@cursor cursor[bot] cursor[bot] left review comments

@PatrykLucka PatrykLucka PatrykLucka approved these changes

Assignees

No one assigned

Labels

release-7.68.0 Issue or pull request that will be included in release 7.68.0 size-S team-mobile-ux Mobile UX team

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@vinnyhoward @PatrykLucka @metamaskbot