Nickname overflows in the "New Chat" drawer if it's long

[smohamedjavid]

Bug Report

The nickname of the contact overflows in the "New Chat" drawer if the nickname is long.

Expected behaviour

The nickname should not overflow.

Reproduction

Prerequisites: Have at least one mutual contact

1. Open Status
2. Set/Update the nickname of the contact to the longest one
3. Navigate to the Messages tab
4. Tap on + button on top right corner
5. Tap on New Chat
6. Observe the name of the contact

Additional Information

• Status Version: nightly [12/06]
• Operating System: Android, iOS

NOTES:

Please check with the Design Team (@status-im/design-team) on the behaviour before starting to work on this issue.

[Francesca-G]

@smohamedjavid thanks for sharing this!

Here's the Figma frame with the design solution to long nicknames and / or names.
As you can see it should end with ellipses to avoid any overflow.

Hope this helps :)