Skip to content

Find wallets optimizations#16233

Merged
wackerow merged 22 commits into
devfrom
optimize-find-wallets
Sep 15, 2025
Merged

Find wallets optimizations#16233
wackerow merged 22 commits into
devfrom
optimize-find-wallets

Conversation

@pettinarip
Copy link
Copy Markdown
Member

@pettinarip pettinarip commented Sep 11, 2025

Description

This PR reworks the Find Wallets page to improve render performance and interaction responsiveness. It replaces the data table layout with a virtualized, accessible list; eliminates duplicated state that caused double renders; and reduces unnecessary component updates across filters and wallet rows.

Key changes

  • Virtualized list: replaced table with @tanstack/react-virtual.
  • Filters architecture: filters now single source of truth; presetFilters derived locally; unified update path; memoized Filter rows; removed hidden desktop duplication.
  • Wallet row perf: de-duplicated WalletInfo per device; reduced ChainImages layout shift; extracted PersonaTags.
  • Cleanup: refactored ProductTable with children render prop to let consumers use a List or a DataTable to render rows.

Preview link

https://deploy-preview-16233--ethereumorg.netlify.app/wallets/find-wallet

@netlify
Copy link
Copy Markdown

netlify Bot commented Sep 11, 2025

Deploy Preview for ethereumorg ready!

Name Link
🔨 Latest commit bcb9576
🔍 Latest deploy log https://app.netlify.com/projects/ethereumorg/deploys/68c80ce4dde0e6000839c7b0
😎 Deploy Preview https://deploy-preview-16233--ethereumorg.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@github-actions github-actions Bot added the dependencies 📦 Changes related to project dependencies label Sep 11, 2025
@github-actions github-actions Bot added the tooling 🔧 Changes related to tooling of the project label Sep 11, 2025
@pettinarip pettinarip marked this pull request as ready for review September 11, 2025 17:20
Copy link
Copy Markdown
Member

@wackerow wackerow left a comment

Choose a reason for hiding this comment

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

Couple tiny patch suggestions, otherwise this looks great! Solid work @pettinarip!

Comment thread src/components/FindWalletProductTable/index.tsx Outdated
Comment thread src/components/FindWalletProductTable/WalletInfo.tsx Outdated
Comment thread src/components/FindWalletProductTable/WalletInfo.tsx Outdated
Comment thread src/components/FindWalletProductTable/WalletInfo.tsx Outdated
Comment thread src/components/ProductTable/MobileFilters.tsx Outdated
@wackerow
Copy link
Copy Markdown
Member

@pettinarip Not sure if this would be an appropriate place to address it, but issue #14446 notes a bug where an "opened" wallet accordion acts funny when a user persona is selected once an accordion has been opened, where the accordion in the same position stays open even if it switches to another wallet.

PR #14466 is open attempting to address... perhaps you could take a look to see if that would help and could be used here, or if we should close and take another approach. 🙏 Thanks!

@wackerow wackerow merged commit 4d32c7c into dev Sep 15, 2025
6 of 7 checks passed
@wackerow wackerow deleted the optimize-find-wallets branch September 15, 2025 12:56
This was referenced Sep 17, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

dependencies 📦 Changes related to project dependencies tooling 🔧 Changes related to tooling of the project

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants