Fix: Truncate Search Item label text

[rumzledz]

Description

Just a good ol' combination of text and address truncation.

Testing

Important

1. Update amy's username

1. Open the UserAccountPage/hooks.tsx file and update line 31 to:

return { canChangeUsername: true, daysTillUsernameChange };

2. Connect amy's wallet
3. Visit your profile page: http://localhost:9091/account/profile
4. Update your username to:

QQQQQQQQQQQQQQQQQQQQQQQQQQQQQQ

2. Add a wallet address to the list of recippients

1. Visit the Wayne colony: http://localhost:9091/wayne
2. Copy its address
3. Visit the Planex colony: http://localhost:9091/planex
4. Bring up the Manage verified members form
5. Add Wayne's address and submit the form

Verifying the truncation

1. Bring up the Simple payment form
2. Bring up the recipients list popover
3. Verify that:

• the popover doesn't have a horizontal scrollbar
• your new username is truncated
• Wayne's contract address conforms to our address truncation

4. Change the action type to Manage Verified Members form
5. Set the Add/remove field to Remove members
6. Click the Select members field
7. Verify that:

• the popover doesn't have a horizontal scrollbar
• your new username is truncated
• Wayne's contract address conforms to our address truncation

Resolves #3679

[iamsamgibbs]

Nice work on this so far, it is very nearly there!

Simple payments recipient field looks good in both cases:

Wallet address for verified members works:

But long usernames are not being truncated for verified members:

I also noticed the bug resolved by #3733 is back, I'm hoping it's just that this PR hasn't been rebased since that was merged! 😬 I don't see anything here that would have messed with that.

[davecreaser]

Nice one @rumzledz!

All looks good with the original bug:

Just having some trouble / questions about the change to not return addresses when searching verified members.

Seems to me that in the PR from @iamsamgibbs it states that addresses should show in the search for verified members?

[davecreaser]

I think this should return addresses, right?

I added 0x94CB46d05c2c88A7A053632865634a19Ba4C02fc as a verified member, and when I search for it, it doesn't show up. If i remove the search term it does though.

[rumzledz]

We might need to revisit this one @iamsamgibbs 👀

[iamsamgibbs]

🫠 Strange! If it's in the list of options, it should return before even checking if shouldReturnAddresses is true or not (I also realise now that this name maybe isn't the most intuitive, when shouldReturnAddresses is true: if there are no matches in the list and the search value is address, then return the search value is the expected behaviour). Will join you in taking a look at this on Monday!

[rumzledz]

Okay I just rebased from master and that seems to have fixed it. So something funny must've happened on master but got recently fixed or something 😅 @davecreaser @iamsamgibbs can I please ask you to try it again?

[rumzledz]

Oh and @davecreaser we removed the shouldReturnAddresses prop for the VerifiedMembersSelect function because we don't want to show the unknown address item if it's not being returned from the search results. But only for the VerifiedMembersSelect component!

[davecreaser]

Nice one @rumzledz

Everything is still working, and the address now shows up in the search!

[iamsamgibbs]

Nice job, this is all working great now!

Adding an address:

Trying to remove an address when it is not already a verified member:

Removing an address that HAS actually been verified:

And simple payments:

Lets get it merged!

[rdig]

Approving so you can merge. Nicely done!