-
Notifications
You must be signed in to change notification settings - Fork 5.5k
feat: add MultichainAddressRowsList component #34405
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
|
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. |
bb3fa30 to
ed87ee5
Compare
✨ Files requiring CODEOWNER review ✨🔑 @MetaMask/accounts-engineers (10 files, +955 -134)
|
Builds ready [ed87ee5]
UI Startup Metrics (1262 ± 58 ms)
Benchmark value 1081 exceeds gate value 1070 for chrome browserify home mean load Benchmark value 1073 exceeds gate value 1061 for chrome browserify home mean domContentLoaded Benchmark value 214 exceeds gate value 10 for chrome browserify home mean backgroundConnect Benchmark value 4 exceeds gate value 1 for chrome browserify home mean initialActions Benchmark value 868 exceeds gate value 830 for chrome browserify home mean loadScripts Benchmark value 232 exceeds gate value 18 for chrome browserify home p95 backgroundConnect Benchmark value 19 exceeds gate value 1.2 for chrome browserify home p95 initialActions Benchmark value 956 exceeds gate value 940 for chrome browserify home p95 loadScripts Benchmark value 2345 exceeds gate value 2192 for chrome webpack home mean uiStartup Benchmark value 1861 exceeds gate value 1711 for chrome webpack home mean load Benchmark value 1852 exceeds gate value 1704 for chrome webpack home mean domContentLoaded Benchmark value 41 exceeds gate value 40 for chrome webpack home mean backgroundConnect Benchmark value 13 exceeds gate value 7 for chrome webpack home mean initialActions Benchmark value 1847 exceeds gate value 1699 for chrome webpack home mean loadScripts Benchmark value 2587 exceeds gate value 2454 for chrome webpack home p95 uiStartup Benchmark value 2116 exceeds gate value 2030 for chrome webpack home p95 load Benchmark value 2106 exceeds gate value 2005 for chrome webpack home p95 domContentLoaded Benchmark value 61 exceeds gate value 57 for chrome webpack home p95 domInteractive Benchmark value 273 exceeds gate value 90 for chrome webpack home p95 backgroundConnect Benchmark value 64 exceeds gate value 7 for chrome webpack home p95 initialActions Benchmark value 2102 exceeds gate value 1970 for chrome webpack home p95 loadScripts Benchmark value 1491 exceeds gate value 1405 for firefox browserify home mean uiStartup Benchmark value 1288 exceeds gate value 1245 for firefox browserify home mean load Benchmark value 1288 exceeds gate value 1239 for firefox browserify home mean domContentLoaded Benchmark value 119 exceeds gate value 110 for firefox browserify home mean domInteractive Benchmark value 26 exceeds gate value 25 for firefox browserify home mean backgroundConnect Benchmark value 29 exceeds gate value 25 for firefox browserify home mean firstReactRender Benchmark value 4 exceeds gate value 1 for firefox browserify home mean initialActions Benchmark value 1267 exceeds gate value 1230 for firefox browserify home mean loadScripts Benchmark value 13 exceeds gate value 9 for firefox browserify home mean setupStore Benchmark value 1765 exceeds gate value 1660 for firefox browserify home p95 uiStartup Benchmark value 1507 exceeds gate value 1495 for firefox browserify home p95 load Benchmark value 1507 exceeds gate value 1495 for firefox browserify home p95 domContentLoaded Benchmark value 383 exceeds gate value 195 for firefox browserify home p95 domInteractive Benchmark value 59 exceeds gate value 55 for firefox browserify home p95 firstReactRender Benchmark value 19 exceeds gate value 2 for firefox browserify home p95 initialActions Benchmark value 1484 exceeds gate value 1475 for firefox browserify home p95 loadScripts Benchmark value 59 exceeds gate value 27 for firefox browserify home p95 setupStore Benchmark value 1764 exceeds gate value 1615 for firefox webpack home mean uiStartup Benchmark value 1485 exceeds gate value 1380 for firefox webpack home mean load Benchmark value 1485 exceeds gate value 1380 for firefox webpack home mean domContentLoaded Benchmark value 104 exceeds gate value 100 for firefox webpack home mean domInteractive Benchmark value 30 exceeds gate value 26 for firefox webpack home mean backgroundConnect Benchmark value 53 exceeds gate value 38 for firefox webpack home mean firstReactRender Benchmark value 17 exceeds gate value 15 for firefox webpack home mean getState Benchmark value 10 exceeds gate value 1 for firefox webpack home mean initialActions Benchmark value 1461 exceeds gate value 1360 for firefox webpack home mean loadScripts Benchmark value 19 exceeds gate value 13 for firefox webpack home mean setupStore Benchmark value 2098 exceeds gate value 1935 for firefox webpack home p95 uiStartup Benchmark value 1808 exceeds gate value 1660 for firefox webpack home p95 load Benchmark value 1808 exceeds gate value 1660 for firefox webpack home p95 domContentLoaded Benchmark value 288 exceeds gate value 156 for firefox webpack home p95 domInteractive Benchmark value 62 exceeds gate value 49 for firefox webpack home p95 backgroundConnect Benchmark value 66 exceeds gate value 50 for firefox webpack home p95 firstReactRender Benchmark value 38 exceeds gate value 32 for firefox webpack home p95 getState Benchmark value 30 exceeds gate value 2 for firefox webpack home p95 initialActions Benchmark value 1769 exceeds gate value 1630 for firefox webpack home p95 loadScripts Benchmark value 47 exceeds gate value 28 for firefox webpack home p95 setupStore Sum of mean exceeds: 1638ms | Sum of p95 exceeds: 2134.8ms Sum of all benchmark exceeds: 3772.8ms Bundle size diffs [🚨 Warning! Bundle size has increased!]
|
8cf6644 to
3975bdf
Compare
3975bdf to
0950cc6
Compare
Builds ready [0950cc6]
UI Startup Metrics (1317 ± 73 ms)
Benchmark value 1124 exceeds gate value 1070 for chrome browserify home mean load Benchmark value 1115 exceeds gate value 1061 for chrome browserify home mean domContentLoaded Benchmark value 220 exceeds gate value 10 for chrome browserify home mean backgroundConnect Benchmark value 26 exceeds gate value 23 for chrome browserify home mean firstReactRender Benchmark value 4 exceeds gate value 1 for chrome browserify home mean initialActions Benchmark value 904 exceeds gate value 830 for chrome browserify home mean loadScripts Benchmark value 1447 exceeds gate value 1365 for chrome browserify home p95 uiStartup Benchmark value 1232 exceeds gate value 1190 for chrome browserify home p95 load Benchmark value 1225 exceeds gate value 1180 for chrome browserify home p95 domContentLoaded Benchmark value 43 exceeds gate value 41 for chrome browserify home p95 domInteractive Benchmark value 1184 exceeds gate value 1180 for chrome browserify home p95 firstPaint Benchmark value 236 exceeds gate value 18 for chrome browserify home p95 backgroundConnect Benchmark value 12 exceeds gate value 1.2 for chrome browserify home p95 initialActions Benchmark value 1006 exceeds gate value 940 for chrome browserify home p95 loadScripts Benchmark value 2340 exceeds gate value 2192 for chrome webpack home mean uiStartup Benchmark value 1852 exceeds gate value 1711 for chrome webpack home mean load Benchmark value 1845 exceeds gate value 1704 for chrome webpack home mean domContentLoaded Benchmark value 8 exceeds gate value 7 for chrome webpack home mean initialActions Benchmark value 1840 exceeds gate value 1699 for chrome webpack home mean loadScripts Benchmark value 2511 exceeds gate value 2454 for chrome webpack home p95 uiStartup Benchmark value 2103 exceeds gate value 2030 for chrome webpack home p95 load Benchmark value 2092 exceeds gate value 2005 for chrome webpack home p95 domContentLoaded Benchmark value 65 exceeds gate value 57 for chrome webpack home p95 domInteractive Benchmark value 16 exceeds gate value 7 for chrome webpack home p95 initialActions Benchmark value 2077 exceeds gate value 1970 for chrome webpack home p95 loadScripts Benchmark value 1535 exceeds gate value 1405 for firefox browserify home mean uiStartup Benchmark value 1313 exceeds gate value 1245 for firefox browserify home mean load Benchmark value 1313 exceeds gate value 1239 for firefox browserify home mean domContentLoaded Benchmark value 112 exceeds gate value 110 for firefox browserify home mean domInteractive Benchmark value 29 exceeds gate value 25 for firefox browserify home mean backgroundConnect Benchmark value 31 exceeds gate value 25 for firefox browserify home mean firstReactRender Benchmark value 16 exceeds gate value 11 for firefox browserify home mean getState Benchmark value 5 exceeds gate value 1 for firefox browserify home mean initialActions Benchmark value 1290 exceeds gate value 1230 for firefox browserify home mean loadScripts Benchmark value 13 exceeds gate value 9 for firefox browserify home mean setupStore Benchmark value 1813 exceeds gate value 1660 for firefox browserify home p95 uiStartup Benchmark value 293 exceeds gate value 195 for firefox browserify home p95 domInteractive Benchmark value 62 exceeds gate value 55 for firefox browserify home p95 firstReactRender Benchmark value 83 exceeds gate value 24 for firefox browserify home p95 getState Benchmark value 14 exceeds gate value 2 for firefox browserify home p95 initialActions Benchmark value 53 exceeds gate value 27 for firefox browserify home p95 setupStore Benchmark value 1777 exceeds gate value 1615 for firefox webpack home mean uiStartup Benchmark value 1516 exceeds gate value 1380 for firefox webpack home mean load Benchmark value 1516 exceeds gate value 1380 for firefox webpack home mean domContentLoaded Benchmark value 108 exceeds gate value 100 for firefox webpack home mean domInteractive Benchmark value 28 exceeds gate value 26 for firefox webpack home mean backgroundConnect Benchmark value 52 exceeds gate value 38 for firefox webpack home mean firstReactRender Benchmark value 6 exceeds gate value 1 for firefox webpack home mean initialActions Benchmark value 1493 exceeds gate value 1360 for firefox webpack home mean loadScripts Benchmark value 20 exceeds gate value 13 for firefox webpack home mean setupStore Benchmark value 2148 exceeds gate value 1935 for firefox webpack home p95 uiStartup Benchmark value 1859 exceeds gate value 1660 for firefox webpack home p95 load Benchmark value 1859 exceeds gate value 1660 for firefox webpack home p95 domContentLoaded Benchmark value 305 exceeds gate value 156 for firefox webpack home p95 domInteractive Benchmark value 50 exceeds gate value 49 for firefox webpack home p95 backgroundConnect Benchmark value 61 exceeds gate value 50 for firefox webpack home p95 firstReactRender Benchmark value 13 exceeds gate value 2 for firefox webpack home p95 initialActions Benchmark value 1831 exceeds gate value 1630 for firefox webpack home p95 loadScripts Benchmark value 190 exceeds gate value 28 for firefox webpack home p95 setupStore Sum of mean exceeds: 2014ms | Sum of p95 exceeds: 2311.8ms Sum of all benchmark exceeds: 4325.8ms Bundle size diffs [🚨 Warning! Bundle size has increased!]
|
...nents/multichain-accounts/multichain-address-rows-list/multichain-address-rows-list.test.tsx
Outdated
Show resolved
Hide resolved
...ts/multichain-accounts/multichain-address-rows-list/multichain-address-rows-list.stories.tsx
Outdated
Show resolved
Hide resolved
ui/components/multichain-accounts/multichain-address-rows-list/multichain-address-rows-list.tsx
Outdated
Show resolved
Hide resolved
ui/components/multichain-accounts/multichain-address-rows-list/multichain-address-rows-list.tsx
Outdated
Show resolved
Hide resolved
ui/components/multichain-accounts/multichain-address-rows-list/multichain-address-rows-list.tsx
Outdated
Show resolved
Hide resolved
ui/components/multichain-accounts/multichain-address-rows-list/multichain-address-rows-list.tsx
Outdated
Show resolved
Hide resolved
ui/components/multichain-accounts/multichain-address-rows-list/multichain-address-rows-list.tsx
Outdated
Show resolved
Hide resolved
ui/components/multichain-accounts/multichain-address-rows-list/multichain-address-rows-list.tsx
Outdated
Show resolved
Hide resolved
ui/components/multichain-accounts/multichain-address-rows-list/multichain-address-rows-list.tsx
Outdated
Show resolved
Hide resolved
ui/components/multichain-accounts/multichain-address-rows-list/multichain-address-rows-list.tsx
Outdated
Show resolved
Hide resolved
ui/components/multichain-accounts/multichain-address-rows-list/multichain-address-rows-list.tsx
Outdated
Show resolved
Hide resolved
38aac8f to
f1ce99c
Compare
f1ce99c to
29bc09c
Compare
...nents/multichain-accounts/multichain-address-rows-list/multichain-address-rows-list.test.tsx
Outdated
Show resolved
Hide resolved
Builds ready [29bc09c]
UI Startup Metrics (1279 ± 65 ms)
Benchmark value 1098 exceeds gate value 1070 for chrome browserify home mean load Benchmark value 1090 exceeds gate value 1061 for chrome browserify home mean domContentLoaded Benchmark value 214 exceeds gate value 10 for chrome browserify home mean backgroundConnect Benchmark value 4 exceeds gate value 1 for chrome browserify home mean initialActions Benchmark value 884 exceeds gate value 830 for chrome browserify home mean loadScripts Benchmark value 1197 exceeds gate value 1190 for chrome browserify home p95 load Benchmark value 1189 exceeds gate value 1180 for chrome browserify home p95 domContentLoaded Benchmark value 1182 exceeds gate value 1180 for chrome browserify home p95 firstPaint Benchmark value 227 exceeds gate value 18 for chrome browserify home p95 backgroundConnect Benchmark value 16 exceeds gate value 1.2 for chrome browserify home p95 initialActions Benchmark value 985 exceeds gate value 940 for chrome browserify home p95 loadScripts Benchmark value 2392 exceeds gate value 2192 for chrome webpack home mean uiStartup Benchmark value 1873 exceeds gate value 1711 for chrome webpack home mean load Benchmark value 1865 exceeds gate value 1704 for chrome webpack home mean domContentLoaded Benchmark value 43 exceeds gate value 40 for chrome webpack home mean backgroundConnect Benchmark value 14 exceeds gate value 7 for chrome webpack home mean initialActions Benchmark value 1860 exceeds gate value 1699 for chrome webpack home mean loadScripts Benchmark value 2609 exceeds gate value 2454 for chrome webpack home p95 uiStartup Benchmark value 2166 exceeds gate value 2030 for chrome webpack home p95 load Benchmark value 2159 exceeds gate value 2005 for chrome webpack home p95 domContentLoaded Benchmark value 72 exceeds gate value 57 for chrome webpack home p95 domInteractive Benchmark value 131 exceeds gate value 90 for chrome webpack home p95 backgroundConnect Benchmark value 35 exceeds gate value 7 for chrome webpack home p95 initialActions Benchmark value 2147 exceeds gate value 1970 for chrome webpack home p95 loadScripts Benchmark value 185 exceeds gate value 65 for chrome webpack home p95 setupStore Benchmark value 1451 exceeds gate value 1405 for firefox browserify home mean uiStartup Benchmark value 1251 exceeds gate value 1245 for firefox browserify home mean load Benchmark value 1250 exceeds gate value 1239 for firefox browserify home mean domContentLoaded Benchmark value 113 exceeds gate value 110 for firefox browserify home mean domInteractive Benchmark value 27 exceeds gate value 25 for firefox browserify home mean backgroundConnect Benchmark value 29 exceeds gate value 25 for firefox browserify home mean firstReactRender Benchmark value 13 exceeds gate value 11 for firefox browserify home mean getState Benchmark value 4 exceeds gate value 1 for firefox browserify home mean initialActions Benchmark value 10 exceeds gate value 9 for firefox browserify home mean setupStore Benchmark value 1769 exceeds gate value 1660 for firefox browserify home p95 uiStartup Benchmark value 384 exceeds gate value 195 for firefox browserify home p95 domInteractive Benchmark value 63 exceeds gate value 24 for firefox browserify home p95 getState Benchmark value 13 exceeds gate value 2 for firefox browserify home p95 initialActions Benchmark value 46 exceeds gate value 27 for firefox browserify home p95 setupStore Benchmark value 1734 exceeds gate value 1615 for firefox webpack home mean uiStartup Benchmark value 1469 exceeds gate value 1380 for firefox webpack home mean load Benchmark value 1468 exceeds gate value 1380 for firefox webpack home mean domContentLoaded Benchmark value 30 exceeds gate value 26 for firefox webpack home mean backgroundConnect Benchmark value 52 exceeds gate value 38 for firefox webpack home mean firstReactRender Benchmark value 10 exceeds gate value 1 for firefox webpack home mean initialActions Benchmark value 1445 exceeds gate value 1360 for firefox webpack home mean loadScripts Benchmark value 2193 exceeds gate value 1935 for firefox webpack home p95 uiStartup Benchmark value 1770 exceeds gate value 1660 for firefox webpack home p95 load Benchmark value 1770 exceeds gate value 1660 for firefox webpack home p95 domContentLoaded Benchmark value 263 exceeds gate value 156 for firefox webpack home p95 domInteractive Benchmark value 75 exceeds gate value 49 for firefox webpack home p95 backgroundConnect Benchmark value 63 exceeds gate value 50 for firefox webpack home p95 firstReactRender Benchmark value 23 exceeds gate value 2 for firefox webpack home p95 initialActions Benchmark value 1730 exceeds gate value 1630 for firefox webpack home p95 loadScripts Sum of mean exceeds: 1543ms | Sum of p95 exceeds: 2224.8ms Sum of all benchmark exceeds: 3767.8ms Bundle size diffs [🚨 Warning! Bundle size has increased!]
|
ui/components/multichain-accounts/multichain-address-rows-list/utils.ts
Outdated
Show resolved
Hide resolved
| ButtonIconSize, | ||
| IconName, | ||
| Text, | ||
| } from '../../component-library'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I see that this component is done before, but I just noticed that this component has more extensive UX/UI behavior.
From Figma I found that this component links to here: https://www.figma.com/design/nmBs86I42Cp0T39BlRdX7x/Network-Expansion-Specs?node-id=4968-74177&t=Yt0QCuhBF54EyFWl-0
Which gives something like this:

Do we need this for this components for the state 2, and any of it in scope for this ticket? 🤔
...ts/multichain-accounts/multichain-address-rows-list/multichain-address-rows-list.stories.tsx
Show resolved
Hide resolved
ui/components/multichain-accounts/multichain-address-row/multichain-address-row.tsx
Show resolved
Hide resolved
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Bug: Network Sorting Logic Inverted
The sortNetworkAddressItems function contains inverted sorting logic. When network priorities are equal (priorityDiff === 0), it returns 0, preventing alphabetical sorting by network name. Conversely, when priorities differ (priorityDiff !== 0), it sorts alphabetically by name instead of by priority difference, which defeats the intended priority system. The correct logic should be priorityDiff === 0 ? a.networkName.localeCompare(b.networkName) : priorityDiff.
ui/components/multichain-accounts/multichain-address-rows-list/utils.ts#L51-L59
metamask-extension/ui/components/multichain-accounts/multichain-address-rows-list/utils.ts
Lines 51 to 59 in b4a699b
| ): NetworkAddressItem[] => { | |
| return items.sort((a, b) => { | |
| const priorityDiff = | |
| getNetworkPriority(a.chainId) - getNetworkPriority(b.chainId); | |
| return priorityDiff === 0 | |
| ? priorityDiff | |
| : a.networkName.localeCompare(b.networkName); | |
| }); | |
| }; |
Was this report helpful? Give feedback by reacting with 👍 or 👎
Builds ready [b4a699b]
UI Startup Metrics (1314 ± 70 ms)
Benchmark value 1314 exceeds gate value 1234 for chrome browserify home mean uiStartup Benchmark value 1128 exceeds gate value 1070 for chrome browserify home mean load Benchmark value 1120 exceeds gate value 1061 for chrome browserify home mean domContentLoaded Benchmark value 219 exceeds gate value 10 for chrome browserify home mean backgroundConnect Benchmark value 4 exceeds gate value 1 for chrome browserify home mean initialActions Benchmark value 908 exceeds gate value 830 for chrome browserify home mean loadScripts Benchmark value 1473 exceeds gate value 1365 for chrome browserify home p95 uiStartup Benchmark value 1261 exceeds gate value 1190 for chrome browserify home p95 load Benchmark value 1250 exceeds gate value 1180 for chrome browserify home p95 domContentLoaded Benchmark value 42 exceeds gate value 41 for chrome browserify home p95 domInteractive Benchmark value 1202 exceeds gate value 1180 for chrome browserify home p95 firstPaint Benchmark value 237 exceeds gate value 18 for chrome browserify home p95 backgroundConnect Benchmark value 11 exceeds gate value 1.2 for chrome browserify home p95 initialActions Benchmark value 1033 exceeds gate value 940 for chrome browserify home p95 loadScripts Benchmark value 2441 exceeds gate value 2192 for chrome webpack home mean uiStartup Benchmark value 1930 exceeds gate value 1711 for chrome webpack home mean load Benchmark value 1919 exceeds gate value 1704 for chrome webpack home mean domContentLoaded Benchmark value 24 exceeds gate value 21 for chrome webpack home mean domInteractive Benchmark value 52 exceeds gate value 40 for chrome webpack home mean backgroundConnect Benchmark value 12 exceeds gate value 7 for chrome webpack home mean initialActions Benchmark value 1915 exceeds gate value 1699 for chrome webpack home mean loadScripts Benchmark value 2864 exceeds gate value 2454 for chrome webpack home p95 uiStartup Benchmark value 2309 exceeds gate value 2030 for chrome webpack home p95 load Benchmark value 2243 exceeds gate value 2005 for chrome webpack home p95 domContentLoaded Benchmark value 64 exceeds gate value 57 for chrome webpack home p95 domInteractive Benchmark value 276 exceeds gate value 90 for chrome webpack home p95 backgroundConnect Benchmark value 427 exceeds gate value 370 for chrome webpack home p95 firstReactRender Benchmark value 242 exceeds gate value 195 for chrome webpack home p95 getState Benchmark value 18 exceeds gate value 7 for chrome webpack home p95 initialActions Benchmark value 2236 exceeds gate value 1970 for chrome webpack home p95 loadScripts Benchmark value 1485 exceeds gate value 1405 for firefox browserify home mean uiStartup Benchmark value 1284 exceeds gate value 1245 for firefox browserify home mean load Benchmark value 1283 exceeds gate value 1239 for firefox browserify home mean domContentLoaded Benchmark value 119 exceeds gate value 110 for firefox browserify home mean domInteractive Benchmark value 26 exceeds gate value 25 for firefox browserify home mean backgroundConnect Benchmark value 30 exceeds gate value 25 for firefox browserify home mean firstReactRender Benchmark value 5 exceeds gate value 1 for firefox browserify home mean initialActions Benchmark value 1262 exceeds gate value 1230 for firefox browserify home mean loadScripts Benchmark value 1776 exceeds gate value 1660 for firefox browserify home p95 uiStartup Benchmark value 426 exceeds gate value 195 for firefox browserify home p95 domInteractive Benchmark value 61 exceeds gate value 55 for firefox browserify home p95 firstReactRender Benchmark value 38 exceeds gate value 24 for firefox browserify home p95 getState Benchmark value 15 exceeds gate value 2 for firefox browserify home p95 initialActions Benchmark value 1776 exceeds gate value 1615 for firefox webpack home mean uiStartup Benchmark value 1506 exceeds gate value 1380 for firefox webpack home mean load Benchmark value 1505 exceeds gate value 1380 for firefox webpack home mean domContentLoaded Benchmark value 104 exceeds gate value 100 for firefox webpack home mean domInteractive Benchmark value 31 exceeds gate value 26 for firefox webpack home mean backgroundConnect Benchmark value 52 exceeds gate value 38 for firefox webpack home mean firstReactRender Benchmark value 12 exceeds gate value 1 for firefox webpack home mean initialActions Benchmark value 1480 exceeds gate value 1360 for firefox webpack home mean loadScripts Benchmark value 15 exceeds gate value 13 for firefox webpack home mean setupStore Benchmark value 2120 exceeds gate value 1935 for firefox webpack home p95 uiStartup Benchmark value 1820 exceeds gate value 1660 for firefox webpack home p95 load Benchmark value 1820 exceeds gate value 1660 for firefox webpack home p95 domContentLoaded Benchmark value 327 exceeds gate value 156 for firefox webpack home p95 domInteractive Benchmark value 50 exceeds gate value 49 for firefox webpack home p95 backgroundConnect Benchmark value 61 exceeds gate value 50 for firefox webpack home p95 firstReactRender Benchmark value 52 exceeds gate value 2 for firefox webpack home p95 initialActions Benchmark value 1793 exceeds gate value 1630 for firefox webpack home p95 loadScripts Benchmark value 36 exceeds gate value 28 for firefox webpack home p95 setupStore Sum of mean exceeds: 2188ms | Sum of p95 exceeds: 3383.8ms Sum of all benchmark exceeds: 5571.8ms Bundle size diffs [🚨 Warning! Bundle size has increased!]
|
b4a699b to
e02f963
Compare
Builds ready [e02f963]
UI Startup Metrics (1349 ± 90 ms)
Benchmark value 1349 exceeds gate value 1234 for chrome browserify home mean uiStartup Benchmark value 1148 exceeds gate value 1070 for chrome browserify home mean load Benchmark value 1138 exceeds gate value 1061 for chrome browserify home mean domContentLoaded Benchmark value 21 exceeds gate value 20 for chrome browserify home mean domInteractive Benchmark value 232 exceeds gate value 10 for chrome browserify home mean backgroundConnect Benchmark value 3 exceeds gate value 1 for chrome browserify home mean initialActions Benchmark value 916 exceeds gate value 830 for chrome browserify home mean loadScripts Benchmark value 1520 exceeds gate value 1365 for chrome browserify home p95 uiStartup Benchmark value 1304 exceeds gate value 1190 for chrome browserify home p95 load Benchmark value 1298 exceeds gate value 1180 for chrome browserify home p95 domContentLoaded Benchmark value 45 exceeds gate value 41 for chrome browserify home p95 domInteractive Benchmark value 1267 exceeds gate value 1180 for chrome browserify home p95 firstPaint Benchmark value 271 exceeds gate value 18 for chrome browserify home p95 backgroundConnect Benchmark value 11 exceeds gate value 1.2 for chrome browserify home p95 initialActions Benchmark value 1061 exceeds gate value 940 for chrome browserify home p95 loadScripts Benchmark value 2343 exceeds gate value 2192 for chrome webpack home mean uiStartup Benchmark value 1849 exceeds gate value 1711 for chrome webpack home mean load Benchmark value 1840 exceeds gate value 1704 for chrome webpack home mean domContentLoaded Benchmark value 59 exceeds gate value 40 for chrome webpack home mean backgroundConnect Benchmark value 1832 exceeds gate value 1699 for chrome webpack home mean loadScripts Benchmark value 2715 exceeds gate value 2454 for chrome webpack home p95 uiStartup Benchmark value 2154 exceeds gate value 2030 for chrome webpack home p95 load Benchmark value 2126 exceeds gate value 2005 for chrome webpack home p95 domContentLoaded Benchmark value 289 exceeds gate value 90 for chrome webpack home p95 backgroundConnect Benchmark value 222 exceeds gate value 195 for chrome webpack home p95 getState Benchmark value 15 exceeds gate value 7 for chrome webpack home p95 initialActions Benchmark value 2114 exceeds gate value 1970 for chrome webpack home p95 loadScripts Benchmark value 1538 exceeds gate value 1405 for firefox browserify home mean uiStartup Benchmark value 1326 exceeds gate value 1245 for firefox browserify home mean load Benchmark value 1326 exceeds gate value 1239 for firefox browserify home mean domContentLoaded Benchmark value 27 exceeds gate value 25 for firefox browserify home mean backgroundConnect Benchmark value 29 exceeds gate value 25 for firefox browserify home mean firstReactRender Benchmark value 15 exceeds gate value 11 for firefox browserify home mean getState Benchmark value 7 exceeds gate value 1 for firefox browserify home mean initialActions Benchmark value 1303 exceeds gate value 1230 for firefox browserify home mean loadScripts Benchmark value 10 exceeds gate value 9 for firefox browserify home mean setupStore Benchmark value 1841 exceeds gate value 1660 for firefox browserify home p95 uiStartup Benchmark value 1535 exceeds gate value 1495 for firefox browserify home p95 load Benchmark value 1535 exceeds gate value 1495 for firefox browserify home p95 domContentLoaded Benchmark value 285 exceeds gate value 195 for firefox browserify home p95 domInteractive Benchmark value 60 exceeds gate value 55 for firefox browserify home p95 firstReactRender Benchmark value 98 exceeds gate value 24 for firefox browserify home p95 getState Benchmark value 15 exceeds gate value 2 for firefox browserify home p95 initialActions Benchmark value 1480 exceeds gate value 1475 for firefox browserify home p95 loadScripts Benchmark value 38 exceeds gate value 27 for firefox browserify home p95 setupStore Benchmark value 1787 exceeds gate value 1615 for firefox webpack home mean uiStartup Benchmark value 1480 exceeds gate value 1380 for firefox webpack home mean load Benchmark value 1480 exceeds gate value 1380 for firefox webpack home mean domContentLoaded Benchmark value 30 exceeds gate value 26 for firefox webpack home mean backgroundConnect Benchmark value 53 exceeds gate value 38 for firefox webpack home mean firstReactRender Benchmark value 12 exceeds gate value 1 for firefox webpack home mean initialActions Benchmark value 1456 exceeds gate value 1360 for firefox webpack home mean loadScripts Benchmark value 37 exceeds gate value 13 for firefox webpack home mean setupStore Benchmark value 2207 exceeds gate value 1935 for firefox webpack home p95 uiStartup Benchmark value 1783 exceeds gate value 1660 for firefox webpack home p95 load Benchmark value 1783 exceeds gate value 1660 for firefox webpack home p95 domContentLoaded Benchmark value 281 exceeds gate value 156 for firefox webpack home p95 domInteractive Benchmark value 59 exceeds gate value 49 for firefox webpack home p95 backgroundConnect Benchmark value 62 exceeds gate value 50 for firefox webpack home p95 firstReactRender Benchmark value 38 exceeds gate value 32 for firefox webpack home p95 getState Benchmark value 22 exceeds gate value 2 for firefox webpack home p95 initialActions Benchmark value 1754 exceeds gate value 1630 for firefox webpack home p95 loadScripts Benchmark value 240 exceeds gate value 28 for firefox webpack home p95 setupStore Sum of mean exceeds: 2071ms | Sum of p95 exceeds: 3231.8ms Sum of all benchmark exceeds: 5302.8ms Bundle size diffs [🚨 Warning! Bundle size has increased!]
|
ui/components/multichain-accounts/multichain-address-row/multichain-address-row.test.tsx
Outdated
Show resolved
Hide resolved
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Bug: Duplicate Network Entries for Overlapping Scopes
The getCompatibleNetworksForAccount function creates duplicate NetworkAddressItem entries when an account has overlapping scopes (e.g., ['eip155:*', 'eip155:1']). This occurs because the function adds networks for wildcard scopes and then re-adds specific networks that are already covered by the wildcard, leading to duplicate network rows being displayed in the UI.
ui/components/multichain-accounts/multichain-address-rows-list/utils.ts#L87-L125
metamask-extension/ui/components/multichain-accounts/multichain-address-rows-list/utils.ts
Lines 87 to 125 in 4cdf242
| */ | |
| export const getCompatibleNetworksForAccount = ( | |
| account: InternalAccount, | |
| allNetworks: Record<CaipChainId, { name: string; chainId: CaipChainId }>, | |
| ): NetworkAddressItem[] => { | |
| if (!account.scopes?.length) { | |
| return []; | |
| } | |
| const compatibleItems: NetworkAddressItem[] = []; | |
| account.scopes.forEach((scope: CaipChainId) => { | |
| if (scope.includes(':*') || scope.endsWith(':0')) { | |
| // Wildcard scope - add all networks for this namespace | |
| const namespace = scope.split(':')[0]; | |
| Object.entries(allNetworks).forEach(([chainId, network]) => { | |
| if (chainId.split(':')[0] === namespace) { | |
| compatibleItems.push( | |
| createNetworkAddressItem( | |
| chainId as CaipChainId, | |
| network, | |
| account.address, | |
| ), | |
| ); | |
| } | |
| }); | |
| } else { | |
| // Specific network scope | |
| const network = allNetworks[scope]; | |
| if (network) { | |
| compatibleItems.push( | |
| createNetworkAddressItem(scope, network, account.address), | |
| ); | |
| } | |
| } | |
| }); | |
| return compatibleItems; | |
| }; |
Bug: Mismatched Destructuring Causes Object Usage Error
The useSelector hook's result for multichainNetworks is incorrectly destructured as an array (const [multichainNetworks] = ...), but is subsequently used as an object (e.g., Object.entries(multichainNetworks)). The array destructuring should be removed.
ui/components/multichain-accounts/multichain-address-rows-list/multichain-address-rows-list.tsx#L42-L45
Lines 42 to 45 in 4cdf242
| const [multichainNetworks] = useSelector( | |
| getMultichainNetworkConfigurationsByChainId, | |
| ); |
Was this report helpful? Give feedback by reacting with 👍 or 👎
Builds ready [4cdf242]
UI Startup Metrics (1286 ± 57 ms)
Benchmark value 1100 exceeds gate value 1070 for chrome browserify home mean load Benchmark value 1091 exceeds gate value 1061 for chrome browserify home mean domContentLoaded Benchmark value 216 exceeds gate value 10 for chrome browserify home mean backgroundConnect Benchmark value 4 exceeds gate value 1 for chrome browserify home mean initialActions Benchmark value 884 exceeds gate value 830 for chrome browserify home mean loadScripts Benchmark value 1390 exceeds gate value 1365 for chrome browserify home p95 uiStartup Benchmark value 44 exceeds gate value 41 for chrome browserify home p95 domInteractive Benchmark value 1184 exceeds gate value 1180 for chrome browserify home p95 firstPaint Benchmark value 235 exceeds gate value 18 for chrome browserify home p95 backgroundConnect Benchmark value 15 exceeds gate value 1.2 for chrome browserify home p95 initialActions Benchmark value 967 exceeds gate value 940 for chrome browserify home p95 loadScripts Benchmark value 2439 exceeds gate value 2192 for chrome webpack home mean uiStartup Benchmark value 1933 exceeds gate value 1711 for chrome webpack home mean load Benchmark value 1921 exceeds gate value 1704 for chrome webpack home mean domContentLoaded Benchmark value 24 exceeds gate value 21 for chrome webpack home mean domInteractive Benchmark value 56 exceeds gate value 40 for chrome webpack home mean backgroundConnect Benchmark value 8 exceeds gate value 7 for chrome webpack home mean initialActions Benchmark value 1916 exceeds gate value 1699 for chrome webpack home mean loadScripts Benchmark value 2785 exceeds gate value 2454 for chrome webpack home p95 uiStartup Benchmark value 2351 exceeds gate value 2030 for chrome webpack home p95 load Benchmark value 2208 exceeds gate value 2005 for chrome webpack home p95 domContentLoaded Benchmark value 67 exceeds gate value 57 for chrome webpack home p95 domInteractive Benchmark value 283 exceeds gate value 90 for chrome webpack home p95 backgroundConnect Benchmark value 403 exceeds gate value 370 for chrome webpack home p95 firstReactRender Benchmark value 23 exceeds gate value 7 for chrome webpack home p95 initialActions Benchmark value 2197 exceeds gate value 1970 for chrome webpack home p95 loadScripts Benchmark value 1555 exceeds gate value 1405 for firefox browserify home mean uiStartup Benchmark value 1335 exceeds gate value 1245 for firefox browserify home mean load Benchmark value 1335 exceeds gate value 1239 for firefox browserify home mean domContentLoaded Benchmark value 117 exceeds gate value 110 for firefox browserify home mean domInteractive Benchmark value 30 exceeds gate value 25 for firefox browserify home mean backgroundConnect Benchmark value 29 exceeds gate value 25 for firefox browserify home mean firstReactRender Benchmark value 18 exceeds gate value 11 for firefox browserify home mean getState Benchmark value 5 exceeds gate value 1 for firefox browserify home mean initialActions Benchmark value 1310 exceeds gate value 1230 for firefox browserify home mean loadScripts Benchmark value 14 exceeds gate value 9 for firefox browserify home mean setupStore Benchmark value 1923 exceeds gate value 1660 for firefox browserify home p95 uiStartup Benchmark value 1548 exceeds gate value 1495 for firefox browserify home p95 load Benchmark value 1548 exceeds gate value 1495 for firefox browserify home p95 domContentLoaded Benchmark value 380 exceeds gate value 195 for firefox browserify home p95 domInteractive Benchmark value 58 exceeds gate value 55 for firefox browserify home p95 firstReactRender Benchmark value 137 exceeds gate value 24 for firefox browserify home p95 getState Benchmark value 18 exceeds gate value 2 for firefox browserify home p95 initialActions Benchmark value 1524 exceeds gate value 1475 for firefox browserify home p95 loadScripts Benchmark value 47 exceeds gate value 27 for firefox browserify home p95 setupStore Benchmark value 1748 exceeds gate value 1615 for firefox webpack home mean uiStartup Benchmark value 1495 exceeds gate value 1380 for firefox webpack home mean load Benchmark value 1495 exceeds gate value 1380 for firefox webpack home mean domContentLoaded Benchmark value 104 exceeds gate value 100 for firefox webpack home mean domInteractive Benchmark value 28 exceeds gate value 26 for firefox webpack home mean backgroundConnect Benchmark value 53 exceeds gate value 38 for firefox webpack home mean firstReactRender Benchmark value 6 exceeds gate value 1 for firefox webpack home mean initialActions Benchmark value 1473 exceeds gate value 1360 for firefox webpack home mean loadScripts Benchmark value 2135 exceeds gate value 1935 for firefox webpack home p95 uiStartup Benchmark value 1818 exceeds gate value 1660 for firefox webpack home p95 load Benchmark value 1817 exceeds gate value 1660 for firefox webpack home p95 domContentLoaded Benchmark value 358 exceeds gate value 156 for firefox webpack home p95 domInteractive Benchmark value 64 exceeds gate value 50 for firefox webpack home p95 firstReactRender Benchmark value 16 exceeds gate value 2 for firefox webpack home p95 initialActions Benchmark value 1791 exceeds gate value 1630 for firefox webpack home p95 loadScripts Benchmark value 29 exceeds gate value 28 for firefox webpack home p95 setupStore Sum of mean exceeds: 2248ms | Sum of p95 exceeds: 3285.8ms Sum of all benchmark exceeds: 5533.8ms Bundle size diffs [🚨 Warning! Bundle size has increased!]
|

Description
This PR refactors the MultichainAddressRow component and introduces a new MultichainAddressRowsList component to improve the multichain account management UI.
Reason for the change:
The existing MultichainAddressRow component was tightly coupled to a complex MultichainNetwork object, making it difficult to use in different contexts and harder to test. Additionally, there was a need for a list component to display multiple address rows efficiently.
Improvements/Solution:
Simplified MultichainAddressRow interface: Replaced the complex network prop with simple chainId and networkName string props, making the component more flexible and easier to use
Improved network image handling: Updated to use getImageForChainId() selector for better image resolution logic
New MultichainAddressRowsList component: Created a reusable list component for displaying multiple address rows across different networks and account types
These changes lay the foundation for improved multichain account management UI and provide more flexible, reusable components for displaying address information across different blockchain networks.
Changelog
CHANGELOG entry: Refactored multichain address row components to support better account management across different blockchain networks
Related issues
Fixes:
Jira ticket: https://consensyssoftware.atlassian.net/browse/MUL-441
Manual testing steps
Screenshots/Recordings
MultichainAddressRowList.mov
Before
After
Pre-merge author checklist
Pre-merge reviewer checklist