Skip to content

Show the transaction id on an expanded wallet activity - #3509

Merged
feruzm merged 2 commits into
developmentfrom
feature/wallet-transaction-id
Aug 17, 2026
Merged

Show the transaction id on an expanded wallet activity#3509
feruzm merged 2 commits into
developmentfrom
feature/wallet-transaction-id

Conversation

@feruzm

@feruzm feruzm commented Aug 17, 2026

Copy link
Copy Markdown
Member

Closes #3506

Tapping a wallet activity expands it to show the counterparty and the memo. It now also shows the Hive transaction id, with a copy button that puts https://hivexplorer.com/tx/{id} on the clipboard.

The id never reached the component: the SDK maps trx_id onto every history row, and groomingTransactionData built a fresh CoinActivity without it. Same for Hive Engine, where convertEngineHistory already carried transactionId and groomingEngineHistory kept only _id.

Rows that have no transaction

resolveTrxId returns undefined and the row renders as it did before, with no id and no copy button:

  • A virtual operation (author_reward, curation_reward, fill_order, fill_vesting_withdraw, ...) is emitted by the chain rather than broadcast, so get_account_history gives it a trx_id of 40 zeroes. On the HIVE tab of the reporting account these were 5 of 33 rows.
  • A Hive Engine row carries <hive-trx-id>-<op index> when it rode in on a custom_json, which is trimmed to the transaction, and <block>-<index> when a contract generated it with nothing to link to. Both shapes appear in one account's history: 184 of 500 rows sampled were not a bare transaction id.

Points activities have no chain transaction and are untouched.

Verified

https://hivexplorer.com/tx/<40 hex> answers 200 for a real transaction id from the account's history. The id shapes in the tests are real values taken from live condenser_api.get_account_history and history.hive-engine.com responses.

Wants a device pass: expand a transfer and confirm the copied link opens that transaction, then expand an author reward and confirm there is no copy button.

Summary by CodeRabbit

  • New Features

    • Transaction details now display a valid transaction ID when available.
    • Added one-click copying of transaction IDs and explorer links with success or failure feedback.
    • Added links to view transactions in the blockchain explorer.
    • Added accessible copy controls to wallet activity items.
  • Bug Fixes

    • Improved transaction ID handling for legacy, virtual, and Hive Engine activity.
    • Invalid or unavailable transaction IDs no longer produce misleading explorer links.
  • Tests

    • Added coverage for transaction ID extraction, normalization, validation, and explorer URL generation.

Adds the Hive transaction id to the expanded row, with a copy button that puts
the hivexplorer.com link on the clipboard.

The id was being dropped in grooming, so it is carried through for both the chain
and the Hive Engine histories. Neither always has one: a virtual operation is
emitted by the chain rather than broadcast and carries 40 zeroes, and a Hive
Engine row a contract generated carries a block reference instead of a
transaction. Those rows show no id and no copy button rather than a dead link.
@qodo-free-for-open-source-projects

qodo-free-for-open-source-projects Bot commented Aug 17, 2026

Copy link
Copy Markdown

Code Review by Qodo

🐞 Bugs (0) 📘 Rule violations (2) 📎 Requirement gaps (0) 🎨 UX issues (0) 🔗 Cross-repo conflicts (0) 📜 Skill insights (0)

Grey Divider


Action required

1. Hardcoded #c1c5c7 icon color ✓ Resolved 📜 Skill insight ⚙ Maintainability
Description
The new copy button uses a hardcoded hex color (#c1c5c7) instead of an EStyleSheet theme variable.
This violates the styling compliance rule and makes theming/dark-mode consistency harder to
maintain.
Code

src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx[R142-145]

+              onPress={() => {
+                onCopyPress();
+              }}
+              color="#c1c5c7"
Relevance

●●● Strong

Hardcoded hex colors are routinely replaced with theme tokens for theming consistency.

PR-#3110

ⓘ Recommendations generated based on similar findings in past PRs

Evidence
PR Compliance ID 2667943 requires using EStyleSheet theme variables instead of hardcoded colors. The
new onCopyPress IconButton passes color="#c1c5c7" in the added block.

src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx[136-149]
Skill: add-feature: Skill: add-feature: Skill: add-feature: Skill: add-feature

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
A newly added `IconButton` uses a hardcoded color value (`#c1c5c7`) instead of using an EStyleSheet theme variable.
## Issue Context
This repo already defines theme variables (e.g., `$iconColor`) and the component already imports `EStyleSheet`, so the icon color should be sourced from the theme.
## Fix Focus Areas
- src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx[136-149]

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


2. Hardcoded #c1c5c7 icon color ✓ Resolved 📜 Skill insight ⚙ Maintainability
Description
The new copy button uses a hardcoded hex color (#c1c5c7) instead of an EStyleSheet theme variable.
This violates the styling compliance rule and makes theming/dark-mode consistency harder to
maintain.
Code

src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx[R142-145]

+              onPress={() => {
+                onCopyPress();
+              }}
+              color="#c1c5c7"
Relevance

●●● Strong

Hardcoded hex colors are routinely replaced with theme tokens for theming consistency.

PR-#3110

ⓘ Recommendations generated based on similar findings in past PRs

Evidence
PR Compliance ID 2667943 requires using EStyleSheet theme variables instead of hardcoded colors. The
new onCopyPress IconButton passes color="#c1c5c7" in the added block.

src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx[136-149]
Skill: add-feature: Skill: add-feature

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
A newly added `IconButton` uses a hardcoded color value (`#c1c5c7`) instead of using an EStyleSheet theme variable.
## Issue Context
This repo already defines theme variables (e.g., `$iconColor`) and the component already imports `EStyleSheet`, so the icon color should be sourced from the theme.
## Fix Focus Areas
- src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx[136-149]

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools



Remediation recommended

3. Lines exceed 100 characters 📘 Rule violation ⚙ Maintainability
Description
New test lines exceed the 100 character limit, reducing readability and violating the line-length
policy. Wrap these expectations across multiple lines to keep each non-comment line within 100
characters.
Code

src/utils/transactionExplorer.test.ts[R60-61]

+  it('offers no link where there is no transaction', () => {
+    expect(getTransactionExplorerUrl('0000000000000000000000000000000000000000')).toBeUndefined();
Relevance

●●● Strong

Low-effort formatting change to comply with 100-char line rule; likely enforced/expected.

ⓘ Recommendations generated based on similar findings in past PRs

Evidence
PR Compliance ID 2667847 limits non-comment lines to 100 characters. The added expect(...) lines
in the new/updated tests include long string literals that push the line length past 100 characters.

Rule 2667847: Limit line length to 100 characters
src/utils/transactionExplorer.test.ts[60-63]
src/utils/wallet.test.ts[417-424]

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
Some newly added non-comment lines exceed 100 characters.
## Issue Context
The project compliance rule requires keeping non-comment, non-whitespace lines at or under 100 characters unless an approved exception mechanism is used.
## Fix Focus Areas
- src/utils/transactionExplorer.test.ts[60-63]
- src/utils/wallet.test.ts[417-424]

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


4. Clipboard errors unhandled ✓ Resolved 🐞 Bug ☼ Reliability
Description
TransactionView._onCopyTrxIdPress awaits writeToClipboard() without handling rejection; if the
clipboard API throws, this can surface as an unhandled promise rejection and the copy action fails
silently. Add error handling and surface failure to the user.
Code

src/components/transaction/transactionView.tsx[R62-70]

+  const _onCopyTrxIdPress = async () => {
+    if (!explorerUrl) {
+      return;
+    }
+
+    const copied = await writeToClipboard(explorerUrl);
+    if (copied) {
+      dispatch(toastNotification(intl.formatMessage({ id: 'alert.copied' })));
+    }
Relevance

●●● Strong

Repo previously tightened clipboard copy flows (checking success) and generally accepts defensive
error handling.

PR-#3405

ⓘ Recommendations generated based on similar findings in past PRs

Evidence
The new copy handler directly awaits writeToClipboard with no error handling, while
writeToClipboard itself awaits Clipboard.setString without a try/catch; any exception would
bubble out of the async onPress handler.

src/components/transaction/transactionView.tsx[60-71]
src/utils/clipboard.ts[10-17]

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
`_onCopyTrxIdPress` awaits `writeToClipboard(explorerUrl)` without a `try/catch`. If `Clipboard.setString(...)` throws/rejects (permissions/device clipboard issues), the async handler can produce an unhandled rejection and the user receives no failure feedback.
### Issue Context
`writeToClipboard` does not handle exceptions internally; it only returns `false` for empty input.
### Fix Focus Areas
- src/components/transaction/transactionView.tsx[60-71]
- src/utils/clipboard.ts[10-17]
### Suggested fix
- Wrap the `await writeToClipboard(explorerUrl)` call in `try/catch`.
- On error, either:
- dispatch a failure toast (e.g. `alert.fail`), and/or
- update `writeToClipboard` to catch and return `false` on exceptions so callers can reliably gate the success toast.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


5. Copy button unlabeled ✓ Resolved 🐞 Bug ⚙ Maintainability
Description
The new icon-only copy button is rendered without accessibilityLabel/accessibilityHint, leaving
screen readers with an unlabeled control. Provide a localized accessible label for the copy action.
Code

src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx[R136-144]

+          {!!onCopyPress && (
+            <IconButton
+              backgroundColor="transparent"
+              name="content-copy"
+              iconType="MaterialIcons"
+              size={18}
+              onPress={() => {
+                onCopyPress();
+              }}
Relevance

●●● Strong

Team has repeatedly accepted adding accessibility labels/roles for icon-only controls.

PR-#3185
PR-#3288

ⓘ Recommendations generated based on similar findings in past PRs

Evidence
WalletLineItem renders the new copy IconButton without accessibility props, while IconButton
explicitly supports accessibilityLabel/accessibilityHint and uses them when provided.

src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx[136-149]
src/components/iconButton/view/iconButtonView.tsx[42-74]

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
The new `IconButton` used for copy (`name="content-copy"`) is icon-only and is created without an accessible name. This makes the action hard/impossible to discover with screen readers.
### Issue Context
`IconButton` already supports `accessibilityLabel` and `accessibilityHint`, but this call site does not provide them.
### Fix Focus Areas
- src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx[136-149]
- src/components/transaction/transactionView.tsx[113-122]
### Suggested fix
- Add props to `WalletLineItem` for copy accessibility (e.g. `copyAccessibilityLabel`, `copyAccessibilityHint`) and pass them through to the copy `IconButton`.
- In `TransactionView`, pass a localized label/hint (e.g. `intl.formatMessage({ id: 'wallet.copy_transaction_link' })` or similar), and add the corresponding i18n key(s) to `en-US.json`.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


View medium (3)
6. Clipboard errors unhandled ✓ Resolved 🐞 Bug ☼ Reliability
Description
TransactionView._onCopyTrxIdPress awaits writeToClipboard() without handling rejection; if the
clipboard API throws, this can surface as an unhandled promise rejection and the copy action fails
silently. Add error handling and surface failure to the user.
Code

src/components/transaction/transactionView.tsx[R62-70]

+  const _onCopyTrxIdPress = async () => {
+    if (!explorerUrl) {
+      return;
+    }
+
+    const copied = await writeToClipboard(explorerUrl);
+    if (copied) {
+      dispatch(toastNotification(intl.formatMessage({ id: 'alert.copied' })));
+    }
Relevance

●●● Strong

Repo previously tightened clipboard copy flows (checking success) and generally accepts defensive
error handling.

PR-#3405

ⓘ Recommendations generated based on similar findings in past PRs

Evidence
The new copy handler directly awaits writeToClipboard with no error handling, while
writeToClipboard itself awaits Clipboard.setString without a try/catch; any exception would
bubble out of the async onPress handler.

src/components/transaction/transactionView.tsx[60-71]
src/utils/clipboard.ts[10-17]

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
`_onCopyTrxIdPress` awaits `writeToClipboard(explorerUrl)` without a `try/catch`. If `Clipboard.setString(...)` throws/rejects (permissions/device clipboard issues), the async handler can produce an unhandled rejection and the user receives no failure feedback.
### Issue Context
`writeToClipboard` does not handle exceptions internally; it only returns `false` for empty input.
### Fix Focus Areas
- src/components/transaction/transactionView.tsx[60-71]
- src/utils/clipboard.ts[10-17]
### Suggested fix
- Wrap the `await writeToClipboard(explorerUrl)` call in `try/catch`.
- On error, either:
- dispatch a failure toast (e.g. `alert.fail`), and/or
- update `writeToClipboard` to catch and return `false` on exceptions so callers can reliably gate the success toast.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


7. Copy button unlabeled ✓ Resolved 🐞 Bug ⚙ Maintainability
Description
The new icon-only copy button is rendered without accessibilityLabel/accessibilityHint, leaving
screen readers with an unlabeled control. Provide a localized accessible label for the copy action.
Code

src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx[R136-144]

+          {!!onCopyPress && (
+            <IconButton
+              backgroundColor="transparent"
+              name="content-copy"
+              iconType="MaterialIcons"
+              size={18}
+              onPress={() => {
+                onCopyPress();
+              }}
Relevance

●●● Strong

Team has repeatedly accepted adding accessibility labels/roles for icon-only controls.

PR-#3185
PR-#3288

ⓘ Recommendations generated based on similar findings in past PRs

Evidence
WalletLineItem renders the new copy IconButton without accessibility props, while IconButton
explicitly supports accessibilityLabel/accessibilityHint and uses them when provided.

src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx[136-149]
src/components/iconButton/view/iconButtonView.tsx[42-74]

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
The new `IconButton` used for copy (`name="content-copy"`) is icon-only and is created without an accessible name. This makes the action hard/impossible to discover with screen readers.
### Issue Context
`IconButton` already supports `accessibilityLabel` and `accessibilityHint`, but this call site does not provide them.
### Fix Focus Areas
- src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx[136-149]
- src/components/transaction/transactionView.tsx[113-122]
### Suggested fix
- Add props to `WalletLineItem` for copy accessibility (e.g. `copyAccessibilityLabel`, `copyAccessibilityHint`) and pass them through to the copy `IconButton`.
- In `TransactionView`, pass a localized label/hint (e.g. `intl.formatMessage({ id: 'wallet.copy_transaction_link' })` or similar), and add the corresponding i18n key(s) to `en-US.json`.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


8. Lines exceed 100 characters 📘 Rule violation ⚙ Maintainability
Description
New test lines exceed the 100 character limit, reducing readability and violating the line-length
policy. Wrap these expectations across multiple lines to keep each non-comment line within 100
characters.
Code

src/utils/transactionExplorer.test.ts[R60-61]

+  it('offers no link where there is no transaction', () => {
+    expect(getTransactionExplorerUrl('0000000000000000000000000000000000000000')).toBeUndefined();
Relevance

●●● Strong

Low-effort formatting change to comply with 100-char line rule; likely enforced/expected.

ⓘ Recommendations generated based on similar findings in past PRs

Evidence
PR Compliance ID 2667847 limits non-comment lines to 100 characters. The added expect(...) lines
in the new/updated tests include long string literals that push the line length past 100 characters.

Rule 2667847: Limit line length to 100 characters
src/utils/transactionExplorer.test.ts[60-63]
src/utils/wallet.test.ts[417-424]

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
Some newly added non-comment lines exceed 100 characters.
## Issue Context
The project compliance rule requires keeping non-comment, non-whitespace lines at or under 100 characters unless an approved exception mechanism is used.
## Fix Focus Areas
- src/utils/transactionExplorer.test.ts[60-63]
- src/utils/wallet.test.ts[417-424]

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


Grey Divider

Tip of the day
💡 Did you know, you can route each action level your way: inline, summary, both, or drop

More tips ↗ | Customize Qodo ↗ | Qodo docs ↗

Grey Divider

Qodo Logo

@qodo-free-for-open-source-projects

qodo-free-for-open-source-projects Bot commented Aug 17, 2026

Copy link
Copy Markdown

PR Summary by Qodo

Display and copy Hive transaction IDs in expanded wallet activity rows

✨ Enhancement 🐞 Bug fix 🧪 Tests 🕐 40+ Minutes

Grey Divider

AI Description

• Show transaction ID in expanded wallet activity, with a copy-to-clipboard explorer link.
• Preserve/normalize trx IDs during chain + Hive Engine grooming; omit virtual/contract-only rows.
• Add transaction-id resolver utility and tests covering real-world ID formats.
Diagram

graph TD
  A["Wallet history APIs"] --> B["wallet.ts grooming"] --> C["CoinActivity.trxId"] --> D["TransactionView"] --> E["WalletLineItemView"] --> F["Clipboard + toast"]
  D --> G{{"hivexplorer.com"}}
Loading
High-Level Assessment

The following are alternative approaches to this PR:

1. Open explorer directly (tap-to-open) instead of copy
  • ➕ Fewer steps for users who want to verify immediately
  • ➕ No need to switch apps to paste
  • ➖ Harder to share the link with someone else
  • ➖ Requires navigation/Linking behavior and error handling (no browser, deep-link policies)
2. Show/copy raw trxId only (no URL)
  • ➕ Avoids hardcoding explorer base URL
  • ➕ Keeps UI minimal
  • ➖ Less useful for sharing/verification (requires recipients to construct URL)
  • ➖ More friction for typical user intent (opening an explorer)

Recommendation: Current approach (display id + copy the hivexplorer URL) is a good default for sharing and verification, while safely suppressing non-actionable IDs (virtual ops / contract-only engine rows). If UX feedback suggests, a follow-up could add an optional tap-to-open alongside copy.

Files changed (8) +254 / -8

Enhancement (4) +111 / -8
walletLineItemView.tsxAdd optional copy icon button to wallet line items +16/-0

Add optional copy icon button to wallet line items

• Extends WalletLineItem to accept an onCopyPress callback. When provided, renders a MaterialIcons content-copy IconButton styled like existing action buttons.

src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx

transactionView.tsxRender transaction ID row in expanded activity and copy explorer URL +43/-8

Render transaction ID row in expanded activity and copy explorer URL

• Computes an explorer URL from item.trxId and conditionally renders a new 'Transaction ID' line when expanded. Adds copy handler that writes the explorer link to clipboard and dispatches a 'copied' toast.

src/components/transaction/transactionView.tsx

walletReducer.tsAdd optional trxId to CoinActivity model +6/-0

Add optional trxId to CoinActivity model

• Extends the CoinActivity interface with an optional trxId field and documents when it is absent (virtual ops and some Hive Engine rows).

src/redux/reducers/walletReducer.ts

transactionExplorer.tsIntroduce resolver for valid Hive transaction IDs and explorer URLs +46/-0

Introduce resolver for valid Hive transaction IDs and explorer URLs

• Adds resolveTrxId to normalize and validate trx ids (40-hex, non-zero, strips Hive Engine op index). Adds getTransactionExplorerUrl to produce a hivexplorer.com link only when a valid transaction id exists.

src/utils/transactionExplorer.ts

Bug fix (1) +9 / -0
wallet.tsPreserve resolved transaction IDs during chain and Hive Engine grooming +9/-0

Preserve resolved transaction IDs during chain and Hive Engine grooming

• Uses resolveTrxId to carry a validated trxId into CoinActivity for chain history and Hive Engine history. Ensures virtual ops and contract-only engine entries keep trxId undefined to avoid dead explorer links.

src/utils/wallet.ts

Tests (2) +133 / -0
transactionExplorer.test.tsAdd tests for transaction id resolution and explorer link building +65/-0

Add tests for transaction id resolution and explorer link building

• Covers broadcast IDs, virtual-operation zero IDs, missing IDs, Hive Engine op-index suffixes, contract-generated block-index shapes, and normalization (case/whitespace).

src/utils/transactionExplorer.test.ts

wallet.test.tsExtend wallet grooming tests to assert trxId propagation for chain and engine rows +68/-0

Extend wallet grooming tests to assert trxId propagation for chain and engine rows

• Adds groomingTransactionData coverage for broadcast vs virtual operations and legacy tuple shapes. Adds groomingEngineHistory coverage for stripping op-index suffix and rejecting contract-generated rows.

src/utils/wallet.test.ts

Other (1) +1 / -0
en-US.jsonAdd i18n string for Transaction ID label +1/-0

Add i18n string for Transaction ID label

• Introduces wallet.transaction_id = "Transaction ID" used by the expanded transaction id row.

src/config/locales/en-US.json

@coderabbitai

coderabbitai Bot commented Aug 17, 2026

Copy link
Copy Markdown

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 15d6ea2d-cf46-46e3-a93a-9b13b9c1a089

📥 Commits

Reviewing files that changed from the base of the PR and between 2f8c39b and 64bf286.

📒 Files selected for processing (3)
  • src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx
  • src/components/transaction/transactionView.tsx
  • src/config/locales/en-US.json
🚧 Files skipped from review as they are similar to previous changes (3)
  • src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx
  • src/config/locales/en-US.json
  • src/components/transaction/transactionView.tsx

Included review availability: Your plan includes up to 2 reviews per rolling hour; 0 remain after this review.


📝 Walkthrough

Walkthrough

The change carries valid Hive transaction IDs through wallet activity data, derives Hive Explorer links, and adds conditional transaction-ID display with copy-to-clipboard feedback in expanded wallet activity details.

Changes

Wallet transaction explorer links

Layer / File(s) Summary
Normalize and propagate transaction IDs
src/utils/transactionExplorer.ts, src/utils/wallet.ts, src/redux/reducers/walletReducer.ts, src/utils/transactionExplorer.test.ts, src/utils/wallet.test.ts
Transaction IDs are validated, normalized, and stripped of Hive Engine suffixes. Valid IDs are stored on CoinActivity; virtual and contract-generated rows omit them. Tests cover both transaction formats and invalid IDs.
Render and copy transaction links
src/components/transaction/transactionView.tsx, src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx, src/config/locales/en-US.json
Expanded transaction details show a valid transaction ID and provide a copy button. Copying the derived Hive Explorer URL displays localized success or failure notifications.

Estimated code review effort: 3 (Moderate) | ~20 minutes

Merge Risk: ⚪ Minimal · up to 64bf2

The change adds transaction IDs and copyable explorer links to expanded wallet activity rows while preserving behavior for rows without transactions; no actionable merge-blocking risk remains after normal checks and review.

Sequence Diagram(s)

sequenceDiagram
  participant TransactionView
  participant WalletLineItem
  participant ClipboardUtility
  participant ToastDispatcher
  TransactionView->>TransactionView: derive explorer URL from item.trxId
  TransactionView->>WalletLineItem: provide copy callback
  WalletLineItem->>TransactionView: invoke onCopyPress
  TransactionView->>ClipboardUtility: writeToClipboard(explorer URL)
  ClipboardUtility-->>TransactionView: return copy result
  TransactionView->>ToastDispatcher: dispatch localized success or failure notification
Loading

Possibly related PRs

Poem

A rabbit checks each transaction trail,
Valid IDs guide the Explorer sail.
A copy button hops into view,
And sends the right link through.
Virtual rows remain link-free,
Neat as carrots under a tree.

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title clearly describes the primary change: showing the transaction ID in expanded wallet activity.
Linked Issues check ✅ Passed The changes satisfy issue #3506 by preserving valid IDs, displaying them with copyable explorer links, and hiding invalid or absent IDs.
Out of Scope Changes check ✅ Passed The changes are limited to transaction ID propagation, explorer-link utilities, wallet display behavior, localization, and related tests.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch feature/wallet-transaction-id

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@qodo-code-review

qodo-code-review Bot commented Aug 17, 2026

Copy link
Copy Markdown

Code Review by Qodo

🐞 Bugs (0) 📘 Rule violations (1) 📜 Skill insights (0)

Grey Divider


Action required

1. Hardcoded #c1c5c7 icon color ✓ Resolved 📜 Skill insight ⚙ Maintainability
Description
The new copy button uses a hardcoded hex color (#c1c5c7) instead of an EStyleSheet theme variable.
This violates the styling compliance rule and makes theming/dark-mode consistency harder to
maintain.
Code

src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx[R142-145]

+              onPress={() => {
+                onCopyPress();
+              }}
+              color="#c1c5c7"
Relevance

●●● Strong

Hardcoded hex colors are routinely replaced with theme tokens for theming consistency.

PR-#3110

ⓘ Recommendations generated based on similar findings in past PRs

Evidence
PR Compliance ID 2667943 requires using EStyleSheet theme variables instead of hardcoded colors. The
new onCopyPress IconButton passes color="#c1c5c7" in the added block.

src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx[136-149]
Skill: add-feature

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
A newly added `IconButton` uses a hardcoded color value (`#c1c5c7`) instead of using an EStyleSheet theme variable.

## Issue Context
This repo already defines theme variables (e.g., `$iconColor`) and the component already imports `EStyleSheet`, so the icon color should be sourced from the theme.

## Fix Focus Areas
- src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx[136-149]

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools



Remediation recommended

2. Clipboard errors unhandled ✓ Resolved 🐞 Bug ☼ Reliability
Description
TransactionView._onCopyTrxIdPress awaits writeToClipboard() without handling rejection; if the
clipboard API throws, this can surface as an unhandled promise rejection and the copy action fails
silently. Add error handling and surface failure to the user.
Code

src/components/transaction/transactionView.tsx[R62-70]

+  const _onCopyTrxIdPress = async () => {
+    if (!explorerUrl) {
+      return;
+    }
+
+    const copied = await writeToClipboard(explorerUrl);
+    if (copied) {
+      dispatch(toastNotification(intl.formatMessage({ id: 'alert.copied' })));
+    }
Relevance

●●● Strong

Repo previously tightened clipboard copy flows (checking success) and generally accepts defensive
error handling.

PR-#3405

ⓘ Recommendations generated based on similar findings in past PRs

Evidence
The new copy handler directly awaits writeToClipboard with no error handling, while
writeToClipboard itself awaits Clipboard.setString without a try/catch; any exception would
bubble out of the async onPress handler.

src/components/transaction/transactionView.tsx[60-71]
src/utils/clipboard.ts[10-17]

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

### Issue description
`_onCopyTrxIdPress` awaits `writeToClipboard(explorerUrl)` without a `try/catch`. If `Clipboard.setString(...)` throws/rejects (permissions/device clipboard issues), the async handler can produce an unhandled rejection and the user receives no failure feedback.

### Issue Context
`writeToClipboard` does not handle exceptions internally; it only returns `false` for empty input.

### Fix Focus Areas
- src/components/transaction/transactionView.tsx[60-71]
- src/utils/clipboard.ts[10-17]

### Suggested fix
- Wrap the `await writeToClipboard(explorerUrl)` call in `try/catch`.
- On error, either:
 - dispatch a failure toast (e.g. `alert.fail`), and/or
 - update `writeToClipboard` to catch and return `false` on exceptions so callers can reliably gate the success toast.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


3. Copy button unlabeled ✓ Resolved 🐞 Bug ⚙ Maintainability
Description
The new icon-only copy button is rendered without accessibilityLabel/accessibilityHint, leaving
screen readers with an unlabeled control. Provide a localized accessible label for the copy action.
Code

src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx[R136-144]

+          {!!onCopyPress && (
+            <IconButton
+              backgroundColor="transparent"
+              name="content-copy"
+              iconType="MaterialIcons"
+              size={18}
+              onPress={() => {
+                onCopyPress();
+              }}
Relevance

●●● Strong

Team has repeatedly accepted adding accessibility labels/roles for icon-only controls.

PR-#3185
PR-#3288

ⓘ Recommendations generated based on similar findings in past PRs

Evidence
WalletLineItem renders the new copy IconButton without accessibility props, while IconButton
explicitly supports accessibilityLabel/accessibilityHint and uses them when provided.

src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx[136-149]
src/components/iconButton/view/iconButtonView.tsx[42-74]

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

### Issue description
The new `IconButton` used for copy (`name="content-copy"`) is icon-only and is created without an accessible name. This makes the action hard/impossible to discover with screen readers.

### Issue Context
`IconButton` already supports `accessibilityLabel` and `accessibilityHint`, but this call site does not provide them.

### Fix Focus Areas
- src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx[136-149]
- src/components/transaction/transactionView.tsx[113-122]

### Suggested fix
- Add props to `WalletLineItem` for copy accessibility (e.g. `copyAccessibilityLabel`, `copyAccessibilityHint`) and pass them through to the copy `IconButton`.
- In `TransactionView`, pass a localized label/hint (e.g. `intl.formatMessage({ id: 'wallet.copy_transaction_link' })` or similar), and add the corresponding i18n key(s) to `en-US.json`.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


4. Lines exceed 100 characters 📘 Rule violation ⚙ Maintainability
Description
New test lines exceed the 100 character limit, reducing readability and violating the line-length
policy. Wrap these expectations across multiple lines to keep each non-comment line within 100
characters.
Code

src/utils/transactionExplorer.test.ts[R60-61]

+  it('offers no link where there is no transaction', () => {
+    expect(getTransactionExplorerUrl('0000000000000000000000000000000000000000')).toBeUndefined();
Relevance

●●● Strong

Low-effort formatting change to comply with 100-char line rule; likely enforced/expected.

ⓘ Recommendations generated based on similar findings in past PRs

Evidence
PR Compliance ID 2667847 limits non-comment lines to 100 characters. The added expect(...) lines
in the new/updated tests include long string literals that push the line length past 100 characters.

Rule 2667847: Limit line length to 100 characters
src/utils/transactionExplorer.test.ts[60-63]
src/utils/wallet.test.ts[417-424]

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
Some newly added non-comment lines exceed 100 characters.

## Issue Context
The project compliance rule requires keeping non-comment, non-whitespace lines at or under 100 characters unless an approved exception mechanism is used.

## Fix Focus Areas
- src/utils/transactionExplorer.test.ts[60-63]
- src/utils/wallet.test.ts[417-424]

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


Grey Divider

Context
✅ Compliance rules (platform): 43 rules
✅ Skills: 5 invoked
  add-feature
  add-mutation
  add-query
  add-sheet
  code-review
Review mode: ⚖️ Balanced: This is a cross-cutting behavioral UI/data change spanning transaction normalization, wallet state, clipboard/toast interaction, and multiple history shapes; it carries enough independent logic and user-visible risk for a careful single-pass review.

Grey Divider

Tip of the day
💡 Did you know, you can route each action level your way: inline, summary, both, or drop

More tips ↗ | Customize Qodo ↗ | Qodo docs ↗

Grey Divider

Qodo Logo

Comment thread src/components/basicUIElements/view/walletLineItem/walletLineItemView.tsx Outdated
Comment on lines +60 to +61
it('offers no link where there is no transaction', () => {
expect(getTransactionExplorerUrl('0000000000000000000000000000000000000000')).toBeUndefined();

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Remediation recommended

2. Lines exceed 100 characters 📘 Rule violation ⚙ Maintainability

New test lines exceed the 100 character limit, reducing readability and violating the line-length
policy. Wrap these expectations across multiple lines to keep each non-comment line within 100
characters.
Agent Prompt
## Issue description
Some newly added non-comment lines exceed 100 characters.

## Issue Context
The project compliance rule requires keeping non-comment, non-whitespace lines at or under 100 characters unless an approved exception mechanism is used.

## Fix Focus Areas
- src/utils/transactionExplorer.test.ts[60-63]
- src/utils/wallet.test.ts[417-424]

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools

Comment thread src/components/transaction/transactionView.tsx
Theme the copy icon instead of hardcoding the light-theme grey its siblings use,
label it for screen readers and handle a clipboard rejection so an onPress
handler cannot leave an unhandled promise rejection and a silent failure.
@feruzm

feruzm commented Aug 17, 2026

Copy link
Copy Markdown
Member Author

Three of four taken, in 64bf286.

1. Hardcoded #c1c5c7 — fixed, now EStyleSheet.value('$iconColor'). Worth noting the finding understates it: #c1c5c7 is the light theme value of that very variable, so the literal renders a light-grey icon on the dark theme. The cancel and repeat buttons directly above have the same bug and are deliberately left alone here, since changing them alters existing UI beyond this PR.

2. Lines exceed 100 characters — not reproducible. awk 'length>100' over the added files returns nothing and eslint reports no max-len warning on transactionExplorer.test.ts. Prettier had already collapsed the line in question before the commit under review.

3. Clipboard errors unhandled — fixed. _onCopyTrxIdPress is an onPress handler, so a rejection was fire-and-forget. Now wrapped, and a failed copy raises alert.fail instead of doing nothing visible.

4. Copy button unlabeled — fixed. IconButton already accepted accessibilityLabel, so it is passed through from WalletLineItem with a new localized string, wallet.copy_transaction_id.

@feruzm
feruzm merged commit 6af3ec4 into development Aug 17, 2026
14 checks passed
@feruzm
feruzm deleted the feature/wallet-transaction-id branch August 17, 2026 06:48
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Show the transaction id with a copy-explorer-link button on an expanded wallet activity

1 participant