Skip to content

Conversation

@OGPoyraz
Copy link
Member

@OGPoyraz OGPoyraz commented Jan 6, 2026

Description

This PR aims to add word break to long ens names in send flow.

Open in GitHub Codespaces

Changelog

CHANGELOG entry: Fix long ens name representation in send flow

Related issues

Fixes: https://github.com/MetaMask/MetaMask-planning/issues/6494

Manual testing steps

See task detail

Screenshots/Recordings

Before

Screenshot 2026-01-06 at 13 01 50

After

long ens name with confusables long ens name with confusables 2 long ens name without confusables short ens with confusables

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

Improves wrapping of long recipient names in the send flow, including cases with confusable-character highlighting.

  • Render ConfusableRecipientName as inline (display=Inline) with break-all; convert highlighted and normal segments to inline spans (Text as="span", Tooltip tag="span") to enable proper line breaking
  • Apply break-all to plain recipient name Text when no confusables are present
  • Minor tooltip text tweaks (straight quotes) while keeping behavior unchanged

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

@OGPoyraz OGPoyraz requested a review from a team as a code owner January 6, 2026 10:02
@metamaskbot metamaskbot added the team-confirmations Push issues to confirmations team label Jan 6, 2026
@metamaskbotv2
Copy link

metamaskbotv2 bot commented Jan 6, 2026

✨ Files requiring CODEOWNER review ✨

@MetaMask/confirmations (2 files, +7 -5)
  • 📁 ui/
    • 📁 pages/
      • 📁 confirmations/
        • 📁 components/
          • 📁 send/
            • 📁 recipient-input/
              • 📄 confusable-recipient-name.tsx +6 -4
              • 📄 recipient-input.tsx +1 -1

@metamaskbotv2
Copy link

metamaskbotv2 bot commented Jan 6, 2026

Builds ready [e3a4a82]
UI Startup Metrics (1282 ± 112 ms)
PlatformBuildTypePageMetricMean (ms)Min (ms)Max (ms)Std Dev (ms)P 75 (ms)P 95 (ms)
ChromeBrowserifyStandard HomeuiStartup12821013174011213571421
load1074864140310111441204
domContentLoaded1067857138610011411191
domInteractive2616107202282
firstPaint169651158154197325
backgroundConnect21219427310216229
firstReactRender1493651427
getState331867103761
initialActions103112
loadScripts8616611160100938991
setupStore1283751326
numNetworkReqs171174171168
BrowserifyPower User HomeuiStartup------
load------
domContentLoaded------
domInteractive------
firstPaint------
backgroundConnect------
firstReactRender------
getState------
initialActions------
loadScripts------
setupStore------
numNetworkReqs------
WebpackStandard HomeuiStartup79266899163823919
load64157784662660797
domContentLoaded63657284061654789
domInteractive261593182281
firstPaint1196175088142290
backgroundConnect286118283789
firstReactRender15113241724
getState3115128154055
initialActions104112
loadScripts63357083260651781
setupStore1274371334
numNetworkReqs181174171169
WebpackPower User HomeuiStartup------
load------
domContentLoaded------
domInteractive------
firstPaint------
backgroundConnect------
firstReactRender------
getState------
initialActions------
loadScripts------
setupStore------
numNetworkReqs------
FirefoxBrowserifyStandard HomeuiStartup13411075195116514141681
load1065898147210111291276
domContentLoaded1065898147210111281276
domInteractive71291843791137
firstPaint------
backgroundConnect50193554951154
firstReactRender13103841222
getState187426441271
initialActions103022
loadScripts103688314488710891169
setupStore144187221051
numNetworkReqs19981201378
BrowserifyPower User HomeuiStartup25821531334648329913196
load17801018255451522122464
domContentLoaded17791018255451522112464
domInteractive933394713191221
firstPaint------
backgroundConnect3611711893544061085
firstReactRender21126082528
getState114571029102112199
initialActions204123
loadScripts1513993237845419832252
setupStore734109219149306
numNetworkReqs69221973576160
WebpackStandard HomeuiStartup15941285238120616822007
load13231144192712813731596
domContentLoaded13231144192712813731596
domInteractive802922446113148
firstPaint------
backgroundConnect60212814477138
firstReactRender16116571624
getState1871712616103
initialActions103122
loadScripts12901112181411413341516
setupStore236232331799
numNetworkReqs19987201477
WebpackPower User HomeuiStartup27571644394155331763514
load20401162324053924842646
domContentLoaded20401162324053924832645
domInteractive137301316220114891
firstPaint------
backgroundConnect3192511503214011063
firstReactRender211384112445
getState1106495993110205
initialActions204123
loadScripts18191146320949722972482
setupStore545108014840214
numNetworkReqs70201933490147
📊 Page Load Benchmark Results

Current Commit: e3a4a82 | Date: 1/6/2026

📄 Localhost MetaMask Test Dapp

Samples: 100

Summary

  • pageLoadTime-> current mean value: 1.04s (±44ms) 🟡 | historical mean value: 1.05s ⬇️ (historical data)
  • domContentLoaded-> current mean value: 727ms (±42ms) 🟢 | historical mean value: 732ms ⬇️ (historical data)
  • firstContentfulPaint-> current mean value: 77ms (±12ms) 🟢 | historical mean value: 79ms ⬇️ (historical data)

📈 Detailed Results

Metric Mean Std Dev Min Max P95 P99
pageLoadTime 1.04s 44ms 1.01s 1.38s 1.07s 1.38s
domContentLoaded 727ms 42ms 703ms 1.05s 744ms 1.05s
firstPaint 77ms 12ms 60ms 176ms 84ms 176ms
firstContentfulPaint 77ms 12ms 60ms 176ms 84ms 176ms
largestContentfulPaint 0ms 0ms 0ms 0ms 0ms 0ms
Bundle size diffs [🚨 Warning! Bundle size has increased!]
  • background: 58 Bytes (0%)
  • ui: 69 Bytes (0%)
  • common: 20 Bytes (0%)

@metamaskbotv2
Copy link

metamaskbotv2 bot commented Jan 6, 2026

Builds ready [e7da303]
UI Startup Metrics (1304 ± 101 ms)
PlatformBuildTypePageMetricMean (ms)Min (ms)Max (ms)Std Dev (ms)P 75 (ms)P 95 (ms)
ChromeBrowserifyStandard HomeuiStartup13041086149810113751476
load108888013089611541237
domContentLoaded108287513009511491232
domInteractive2616106182381
firstPaint183661208203191301
backgroundConnect22120126912227241
firstReactRender1493041525
getState371986124064
initialActions106112
loadScripts8686761079949391015
setupStore1163741219
numNetworkReqs171171151164
BrowserifyPower User HomeuiStartup------
load------
domContentLoaded------
domInteractive------
firstPaint------
backgroundConnect------
firstReactRender------
getState------
initialActions------
loadScripts------
setupStore------
numNetworkReqs------
WebpackStandard HomeuiStartup8126691057878581006
load65958591876708811
domContentLoaded65458191476703805
domInteractive2616111202284
firstPaint1126224752154230
backgroundConnect225136253088
firstReactRender15103751628
getState3514126214082
initialActions102111
loadScripts65157891275700796
setupStore146106121537
numNetworkReqs171171161367
WebpackPower User HomeuiStartup------
load------
domContentLoaded------
domInteractive------
firstPaint------
backgroundConnect------
firstReactRender------
getState------
initialActions------
loadScripts------
setupStore------
numNetworkReqs------
FirefoxBrowserifyStandard HomeuiStartup13671079189918614561806
load1093922162914211601497
domContentLoaded1092916162814211601496
domInteractive62321983586131
firstPaint------
backgroundConnect57202034871182
firstReactRender1293441223
getState126118121125
initialActions103122
loadScripts1060902160312911201449
setupStore154127181147
numNetworkReqs19990191475
BrowserifyPower User HomeuiStartup26061520411653029813188
load1768982270355022612501
domContentLoaded1767982270255022612501
domInteractive10031102815381299
firstPaint------
backgroundConnect3682511773894311158
firstReactRender20124572533
getState1125395591118200
initialActions203123
loadScripts1481962254245820002252
setupStore37411071122893
numNetworkReqs69251873774172
WebpackStandard HomeuiStartup15561227241120216761912
load13071105198714113881543
domContentLoaded13061105198714113881543
domInteractive772821342108143
firstPaint------
backgroundConnect64172525167169
firstReactRender14112631622
getState2152363814111
initialActions104122
loadScripts12681062187412313201482
setupStore145100141340
numNetworkReqs19979191575
WebpackPower User HomeuiStartup26401708350148430333194
load19751205270747423822542
domContentLoaded19741205270747423812542
domInteractive66293235674205
firstPaint------
backgroundConnect3333012103383801072
firstReactRender2113192202053
getState955921728106147
initialActions213122
loadScripts17191156269339721272297
setupStore524102915143171
numNetworkReqs68241853576162
📊 Page Load Benchmark Results

Current Commit: e7da303 | Date: 1/6/2026

📄 Localhost MetaMask Test Dapp

Samples: 100

Summary

  • pageLoadTime-> current mean value: 1.05s (±41ms) 🟡 | historical mean value: 1.05s ⬆️ (historical data)
  • domContentLoaded-> current mean value: 733ms (±37ms) 🟢 | historical mean value: 731ms ⬆️ (historical data)
  • firstContentfulPaint-> current mean value: 80ms (±13ms) 🟢 | historical mean value: 77ms ⬆️ (historical data)

📈 Detailed Results

Metric Mean Std Dev Min Max P95 P99
pageLoadTime 1.05s 41ms 1.01s 1.33s 1.10s 1.33s
domContentLoaded 733ms 37ms 702ms 987ms 765ms 987ms
firstPaint 80ms 13ms 64ms 196ms 92ms 196ms
firstContentfulPaint 80ms 13ms 64ms 196ms 92ms 196ms
largestContentfulPaint 0ms 0ms 0ms 0ms 0ms 0ms
Bundle size diffs [🚨 Warning! Bundle size has increased!]
  • background: 58 Bytes (0%)
  • ui: 69 Bytes (0%)
  • common: 20 Bytes (0%)

@metamaskbotv2
Copy link

metamaskbotv2 bot commented Jan 6, 2026

Builds ready [e7da303]
UI Startup Metrics (1304 ± 101 ms)
PlatformBuildTypePageMetricMean (ms)Min (ms)Max (ms)Std Dev (ms)P 75 (ms)P 95 (ms)
ChromeBrowserifyStandard HomeuiStartup13041086149810113751476
load108888013089611541237
domContentLoaded108287513009511491232
domInteractive2616106182381
firstPaint183661208203191301
backgroundConnect22120126912227241
firstReactRender1493041525
getState371986124064
initialActions106112
loadScripts8686761079949391015
setupStore1163741219
numNetworkReqs171171151164
BrowserifyPower User HomeuiStartup------
load------
domContentLoaded------
domInteractive------
firstPaint------
backgroundConnect------
firstReactRender------
getState------
initialActions------
loadScripts------
setupStore------
numNetworkReqs------
WebpackStandard HomeuiStartup8126691057878581006
load65958591876708811
domContentLoaded65458191476703805
domInteractive2616111202284
firstPaint1126224752154230
backgroundConnect225136253088
firstReactRender15103751628
getState3514126214082
initialActions102111
loadScripts65157891275700796
setupStore146106121537
numNetworkReqs171171161367
WebpackPower User HomeuiStartup------
load------
domContentLoaded------
domInteractive------
firstPaint------
backgroundConnect------
firstReactRender------
getState------
initialActions------
loadScripts------
setupStore------
numNetworkReqs------
FirefoxBrowserifyStandard HomeuiStartup13671079189918614561806
load1093922162914211601497
domContentLoaded1092916162814211601496
domInteractive62321983586131
firstPaint------
backgroundConnect57202034871182
firstReactRender1293441223
getState126118121125
initialActions103122
loadScripts1060902160312911201449
setupStore154127181147
numNetworkReqs19990191475
BrowserifyPower User HomeuiStartup26061520411653029813188
load1768982270355022612501
domContentLoaded1767982270255022612501
domInteractive10031102815381299
firstPaint------
backgroundConnect3682511773894311158
firstReactRender20124572533
getState1125395591118200
initialActions203123
loadScripts1481962254245820002252
setupStore37411071122893
numNetworkReqs69251873774172
WebpackStandard HomeuiStartup15561227241120216761912
load13071105198714113881543
domContentLoaded13061105198714113881543
domInteractive772821342108143
firstPaint------
backgroundConnect64172525167169
firstReactRender14112631622
getState2152363814111
initialActions104122
loadScripts12681062187412313201482
setupStore145100141340
numNetworkReqs19979191575
WebpackPower User HomeuiStartup26401708350148430333194
load19751205270747423822542
domContentLoaded19741205270747423812542
domInteractive66293235674205
firstPaint------
backgroundConnect3333012103383801072
firstReactRender2113192202053
getState955921728106147
initialActions213122
loadScripts17191156269339721272297
setupStore524102915143171
numNetworkReqs68241853576162
📊 Page Load Benchmark Results

Current Commit: e7da303 | Date: 1/6/2026

📄 Localhost MetaMask Test Dapp

Samples: 100

Summary

  • pageLoadTime-> current mean value: 1.05s (±41ms) 🟡 | historical mean value: 1.05s ⬆️ (historical data)
  • domContentLoaded-> current mean value: 733ms (±37ms) 🟢 | historical mean value: 731ms ⬆️ (historical data)
  • firstContentfulPaint-> current mean value: 80ms (±13ms) 🟢 | historical mean value: 77ms ⬆️ (historical data)

📈 Detailed Results

Metric Mean Std Dev Min Max P95 P99
pageLoadTime 1.05s 41ms 1.01s 1.33s 1.10s 1.33s
domContentLoaded 733ms 37ms 702ms 987ms 765ms 987ms
firstPaint 80ms 13ms 64ms 196ms 92ms 196ms
firstContentfulPaint 80ms 13ms 64ms 196ms 92ms 196ms
largestContentfulPaint 0ms 0ms 0ms 0ms 0ms 0ms
Bundle size diffs [🚨 Warning! Bundle size has increased!]
  • background: 58 Bytes (0%)
  • ui: 69 Bytes (0%)
  • common: 20 Bytes (0%)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

size-S team-confirmations Push issues to confirmations team

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants