Repository navigation
[HOLD for payment 2023-07-24] [$1000] The "No results found" message in the emoji picker is scrollable #22504
Description
If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!
Action Performed:
- Login to ND
- Go to any chat
- Open emoji picker
- Type "tt" in the search input
- Try to scroll "No results found" message
Expected Result:
The "No results found" message should remain fixed in its position
Actual Result:
The "No results found" message is scrollable
Workaround:
Can the user still use Expensify without this being fixed? Have you informed them of the workaround?
Platforms:
Which of our officially supported platforms is this issue occurring on?
- Android / native
- Android / Chrome
- iOS / native
- iOS / Safari
- MacOS / Chrome / Safari
- MacOS / Desktop
Version Number: 1.3.38-2
Reproducible in staging?: y
Reproducible in production?: y
If this was caught during regression testing, add the test name, ID and link from TestRail:
Email or phone of affected tester (no customers):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Notes/Photos/Videos: Any additional supporting documentation
RPReplay_Final1688818788.mov
DFNN4026.MP4
Expensify/Expensify Issue URL:
Issue reported by: @aman-atg
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1688824480134429
Upwork Automation - Do Not Edit
- Upwork Job URL: https://www.upwork.com/jobs/~01e4d1df988507fb8b
- Upwork Job ID: 1678462833490141184
- Last Price Increase: 2023-07-10
Activity
melvin-bot commentedon Jul 9, 2023
Triggered auto assignment to @lschurr (
Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.melvin-bot commentedon Jul 9, 2023
Bug0 Triage Checklist (Main S/O)
Platformsin OP are ✅)GItGudRatio commentedon Jul 9, 2023
Proposal
Please re-state the problem that we are trying to solve in this issue.
We can notice that on iOS, the text "No results found" is scrollable, when it should not be.
What is the root cause of that problem?
This is a native issue with iOS and the way iOS handles scrolling within containers by calculating the available space for scrolling content. When using the ListEmptyComponent in React Native, it is rendered within the same container as the list itself. If the list is empty and the ListEmptyComponent has content that exceeds the available height of the container, iOS may consider it as scrollable content and enable scrolling behaviour.
What changes do you think we should make in order to solve the problem?
In order to fix this problem, we can add the prop
scrollEnabled={this.state.filteredEmojis.length !== 0}to theFlatListinEmojiPickerMenufor native devices.What alternative solutions did you explore? (Optional)
N/A
bernhardoj commentedon Jul 9, 2023
Proposal
Please re-state the problem that we are trying to solve in this issue.
We can "scroll" the Not found text in emoji picker.
What is the root cause of that problem?
The not found text is a
ListEmptyComponentthat is part of the list (FlatList). It's a normal behavior of a FlatList in iOS to be able to scroll a bit more (I think this is called bounces in RN) even if it reaches the edge of the list.What changes do you think we should make in order to solve the problem?
Set
alwaysBounceVerticaltofalse.This prop will allow to bounce only if the list items are scrollable. So, if the text no found is shown, bounce is deactivated, but when the emoji list is shown (and scrollable), it will be activated back.
[-]The "No results found" message in the emoji picker is scrollable[/-][+][$1000] The "No results found" message in the emoji picker is scrollable[/+]melvin-bot commentedon Jul 10, 2023
Job added to Upwork: https://www.upwork.com/jobs/~01e4d1df988507fb8b
melvin-bot commentedon Jul 10, 2023
Current assignee @lschurr is eligible for the External assigner, not assigning anyone new.
melvin-bot commentedon Jul 10, 2023
Triggered auto assignment to Contributor-plus team member for initial proposal review - @sobitneupane (
External)sobitneupane commentedon Jul 11, 2023
Thanks everyone for the proposal.
Rather than a bug, it can be considered as polish. I am okay with the present state where "No results found" bounces/scrolls. But If we want to polish it,
Proposal from @bernhardoj looks good to me.🎀 👀 🎀 C+ reviewedUpdate: #22504 (comment)
29 remaining items
lschurr commentedon Jul 24, 2023
PR up on July 11th at 12:32pm PT
Merged July 13th at 7:03am PT
Qualifies for bonus.
lschurr commentedon Jul 24, 2023
@sobitneupane - do we need a regression test for this one?
lschurr commentedon Jul 24, 2023
Also @sobitneupane - could you accept the offer in Upwork?
And @aman-atg could you apply?
https://www.upwork.com/jobs/~01e4d1df988507fb8b
sobitneupane commentedon Jul 24, 2023
#18221
#18221 (comment)
This is an edge case. I don't think any udpate on the PR review checklist is required.
Yes.
#22504 (comment)
sobitneupane commentedon Jul 24, 2023
Regression Test Proposal
Do we agree 👍 or 👎
sobitneupane commentedon Jul 24, 2023
@lschurr Payment Requested on newDot.
aman-atg commentedon Jul 24, 2023
@lschurr I've applied to the job, thanks!
lschurr commentedon Jul 24, 2023
Offer sent @aman-atg
lschurr commentedon Jul 25, 2023
Bump @aman-atg - could you accept the offer in Upwork?
aman-atg commentedon Jul 25, 2023
@lschurr Sorry for the delay, I've now accepted the offer
lschurr commentedon Jul 25, 2023
All set. Closing this one out.
JmillsExpensify commentedon Jul 27, 2023
Reviewed details for @sobitneupane. This pay of $1500 (base + urgency bonus) is accurate based on comment from Business Reviewer and approved for payment in NewDot.