refactor: handle from/to addresses in multiview (mobile views)

[patricio0312rev]

[portfolio] handle from/to addresses in multi-view

Summary

• This first part is only focused on 320px, 640px and 768px views.
• The TransactionRow and TransactionRowMobile components have been refactored to support the hideSender prop, which activates/deactivates the advanced mode of the addressing column.
• TransactionRowAddressing has been refactored to support variant and isAdvanced props. When the user has selected more than 1 wallet, the advanced mode of the addressing column activates and two of these components will render, the first always for the sender and the second one always for the recipient.
• TransactionRowAddressing has been refactored and subdivided into child components for better readability and reduce the complexity when working with this component.
• Unit tests have been updated to support these changes.
• The transaction table's Value header has been renamed Amount to match the designs.

Screenshots

• 320px

• 640px

• 768px

Checklist

• My changes look good in both light AND dark mode
• The change is not hardcoded to a single network, but has multi-asset in mind
• I checked my changes for obvious issues, debug statements and commented code
• Documentation (if necessary)
• Tests (if necessary)
• Ready to be merged

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
arkvault	✅ Ready (Inspect)	Visit Preview	Feb 3, 2025 1:36pm

[goga-m]

Hey @patricio0312rev one conflict appeared after merging the accent color removal.

[patricio0312rev]

@samharperpittam should be ready now 🌟

[samharperpittam]

@patricio0312rev

These all read Value (ARK) now instead of Amount (ARK). Can you check if it's the same for you please?

[patricio0312rev]

@samharperpittam sorry, got confused by the mockup, should be fixed now 🌟

[samharperpittam]

@patricio0312rev - last change request from me. In Multiwallet view, the "Amount" value shouldn't have the green/yellow/grey background and the text should be black.

Design

Implementation

[patricio0312rev]

@samharperpittam yup, no worries my man, that's part of #930