Fix: Using trim() for better UX

[aman-atg]

Details

Comment

Fixed Issues

#4155 and #4156

Tests || QA Steps

Search Page

1. Search for an email
2. Add extra space
3. Search result should not disppear

Profile

1. Add extra whitespace anywhere in either names
2. Save button will not be activated

Emoji picker Menu

1. Go to any chat
2. Open emoji picker
3. Search for an emoji
4. Adding extra whitespace won't make the result(s) disappear

Tested On

• [ ✔️ ] Web
• [ ✔️ ] Mobile Web
• [ ❌ ] Desktop
• [ ❌ ] iOS
• [ ✔️ ] Android

Screenshots

Web

Search

Profile

Emoji Picker

Mobile Web

Profile

Search

Desktop

iOS

Android

Profile

Search

[github-actions]

CLA Assistant Lite bot All contributors have signed the CLA ✍️ ✅

[aman-atg]

I have read the CLA Document and I hereby sign the CLA

[johnmlee101]

Looks good!

[OSBotify]

✋ This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release.

[OSBotify]

🚀 Deployed to staging in version: 1.0.80-3🚀

platform	result
🤖 android 🤖	success ✅
🖥 desktop 🖥	success ✅
🍎 iOS 🍎	success ✅
🕸 web 🕸	success ✅

[kavimuru]

Desktop - Profile - Save button always enabled and able to save with space in name

Expected Result:

Save button will not be activated

Actual Result:

Save button always enabled and able to save name with spaces

Actions Performed:

1. Launch the app and login
2. Click on avatar and select profile
3. Add extra whitespace anywhere in either names

Platform:

iOS
Web ✔️
Desktop ✔️

Build:

1.0.81-0

Notes/Images/Video:

Bug5171703_Recording__995.mp4

[aman-atg]

Web (v1.0.81-1)

Not observing this behaviour on staging (Web).

• Maybe it's fixed for Desktop as well on v1.0.81 , I don't have a macbook right now else I would have shown. Can you please check for build v1.0.81-1 on Desktop

[isagoico]

I'm still able to reproduce this on Web/Chrome staging 1.0.81-1 \

[aman-atg]

@isagoico
Can you tell me if your name was already having extra whitespace from earlier versions?
Or did you change any other field like Preferred Pronouns or Timezone etc.

Still trying to figure out if there's any other reason.

New Changes

• I found out that changing other fields in Profile Section will also result in saving names with extra whitespace so only disabling the Button won't completely fix this behaviour.

App/src/pages/settings/Profile/ProfilePage.js

Lines 175 to 176 in f99dea6

	firstName,
	lastName,

• These two lines should be changed with the below code

            firstName: firstName.trim(),
            lastName: lastName.trim(),

@johnmlee101 Please review the proposed changes

[isagoico]

I just tried again in a new account (that didn't have a name set yet) and got the same behavior. I only edited the name and last name fields with white space and text. Hope this is helpful

[aman-atg]

@isagoico Thanks for testing.

I only edited the name and last name fields with white space and text. Hope this is helpful

I think changing the text should enable the Button?

[isagoico]

So, let me see if I get this. The user is allowed to save the name that contains whitespace if the user changes the text? We thought it was a bug.

[aman-atg]

So, let me see if I get this. The user is allowed to save the name that contains whitespace if the user changes the text? We thought it was a bug.

Yes, you're right it's a bug and the new proposed changes will hopefully fix it.

Earlier, it was thought that only disabling the Save Button will fix it.
But, as we can't stop user from adding a whitespace after changing the name or other fields, the best we can do is save the name after trimming it.

[isagoico]

Oh thanks a lot for the clarification 🙇‍♀️ we'll wait for the fixes so we can retest this then

[johnmlee101]

@aman-atg are you working on a fix for this?

[aman-atg]

New Changes

• I found out that changing other fields in Profile Section will also result in saving names with extra whitespace so only disabling the Button won't completely fix this behaviour.

App/src/pages/settings/Profile/ProfilePage.js

Lines 175 to 176 in f99dea6

	firstName,
	lastName,

• These two lines should be changed with the below code

            firstName: firstName.trim(),
            lastName: lastName.trim(),

@johnmlee101
I think these changes will fix the issue.

[johnmlee101]

I think that makes sense! Can you spin up a PR and link both the original issue and this PR to it?

[isagoico]

Retested this and it was a pass 🎉

Checking it off.

[OSBotify]

🚀 Deployed to production in version: 1.0.81-4🚀

platform	result
🤖 android 🤖	success ✅
🖥 desktop 🖥	success ✅
🍎 iOS 🍎	success ✅
🕸 web 🕸	success ✅