[HOLD for Payment 2025-05-08] [$250] Android - Reports- Can't scroll to see more items on Recent chats

[nlemma]

If you haven’t already, check out our contributing guidelines for onboarding and email [email protected] to request to join our Slack channel!

---

Version Number: v9.1.26-0
Reproducible in staging?: Yes
Reproducible in production?: Yes
If this was caught on HybridApp, is this reproducible on New Expensify Standalone?: No, reproducible on hybrid only
If this was caught during regression testing, add the test name, ID and link from TestRail: N/A
Email or phone of affected tester (no customers): N/A
Issue reported by: Applause Internal Team
Device used: SS S20 FE/ Android 13
App Component: Other

Action Performed:

1. Open app
2. Login with new account
3. Onboarding screen, select Something else
4. Fill out name
5. Tap on Reports on the bottom menu
6. Tap on search box
7. Tap on Workspace switcher
8. Tap on Get Started
9. Tap on Confirm
10. Tap back button on navigation bar
11. Scroll up to view more items

Expected Result:

User can scroll up to view more items

Actual Result:

Can't scroll up or down

Workaround:

Unknown

Platforms:

• Android: Standalone
• Android: HybridApp
• Android: mWeb Chrome
• iOS: Standalone
• iOS: HybridApp
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Bug6797999_1744270837595.az_recorder_20250410_143030.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021915384390659153833
• Upwork Job ID: 1915384390659153833
• Last Price Increase: 2025-04-24
• Automatic offers:
• linhvovan29546 | Contributor | 107057057

Issue Owner

Current Issue Owner: @MonilBhavsar

[melvin-bot]

Triggered auto assignment to @twisterdotcom (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

[twisterdotcom]

I will actually have an Android device on Monday so can test on that.

Tap back button on navigation bar

On iOS this doesn't take you back to the search though, so this might be fixed.

ScreenRecording_04-11-2025.16-47-57_1.MP4

[linhvovan29546]

🚨 Edited by proposal-police: This proposal was edited at 2025-04-23 13:27:08 UTC.

Proposal

Please re-state the problem that we are trying to solve in this issue.

Android - Reports- Can't scroll to see more items on Recent chats

What is the root cause of that problem?

Here The issue occurs because we conditionally hide the bottomContent when searchRouterListVisible is true. Since the bottom tab overlaps the search list, it causes the footer content to be hidden and prevents scrolling or can't scrolling to view the full content

What changes do you think we should make in order to solve the problem?

We should remove the conditional check for searchRouterListVisible, as it doesn't resolve the issue as intended.

App/src/pages/Search/SearchPageNarrow.tsx

Line 148 in ea3cd2d

extraContent={!searchRouterListVisible && <NavigationTabBar selectedTab={NAVIGATION_TABS.SEARCH} />}

  extraContent ={  <NavigationTabBar selectedTab={NAVIGATION_TABS.SEARCH} />}

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

None, UI bug

What alternative solutions did you explore? (Optional)

Reminder: Please use plain English, be brief and avoid jargon. Feel free to use images, charts or pseudo-code if necessary. Do not post large multi-line diffs or write walls of text. Do not create PRs unless you have been hired for this job.

[linhvovan29546]

I will actually have an Android device on Monday so can test on that.

@twisterdotcom The problem appears on all platforms. You can test it in offline mode to clearly see the list behind the bottom tab and notice that you can't scroll to view the full content(To reproduce: simply open the search list and try scrolling with about 8 items or more).

[twisterdotcom]

Okay, so I must be in Offline mode? Can I get some correct reproduction steps to retry this please?

[linhvovan29546]

@twisterdotcom Normally, it's hard to notice that the list has more items. An easy way to test this is by using offline mode, where part of the last item becomes visible at the top.
Could you follow my recording?

Screen_Recording_20250415_065018_Expensify.mp4

[melvin-bot]

@twisterdotcom Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

[melvin-bot]

@twisterdotcom 6 days overdue. This is scarier than being forced to listen to Vogon poetry!

[melvin-bot]

@twisterdotcom this issue was created 2 weeks ago. Are we close to a solution? Let's make sure we're treating this as a top priority. Don't hesitate to create a thread in #expensify-open-source to align faster in real time. Thanks!

[melvin-bot]

@twisterdotcom 8 days overdue is a lot. Should this be a Weekly issue? If so, feel free to change it!

[twisterdotcom]

Okay, I have finally understood this and I agree, it's odd. Why would we not let you scroll down here?

screen-20250424-132609.1.mov

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~021915384390659153833

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @c3024 (External)

[AHMEDTASRIFABDULLAH]

Bug Summary:
Issue: "Recent chats" section is not scrollable on Android devices.

Impacted Version: v9.1.26-0

Reproducible: Yes, in both staging and production environments.

Platform: Only in HybridApp; not in New Expensify Standalone.

Labels: Bug, External, Help Wanted, Daily

Proposed Solution:
Issue Analysis:
Likely caused by incorrect configuration of ScrollView or FlatList in Android.

Possible reasons:

height or flex properties not set correctly in ScrollView/FlatList.

Missing keyboardShouldPersistTaps or nestedScrollEnabled properties.

Styling issues with overflow or position.

Proposed Fix:
ScrollView/FlatList Configuration:

Set nestedScrollEnabled={true} (especially for Android).

Add keyboardShouldPersistTaps="handled".

Use contentContainerStyle={{ flexGrow: 1 }} to ensure content is scrollable.

Styling Fix:

Ensure flex: 1 and overflow: 'scroll' for internal views.

Avoid Absolute Positioning by using position: 'relative'.

Platform-Specific Adjustment:

Use Platform.select to apply specific styling for Android.

Testing Plan:
Manual Testing: Check scrolling functionality on Android Emulator.
Confirm no regression on iOS and Web platforms.

Upwork Profile:
https://www.upwork.com/freelancers/ahmedtasrifa?mp_source=share

[melvin-bot]

📣 @AHMEDTASRIFABDULLAH! 📣
Hey, it seems we don’t have your contributor details yet! You'll only have to do this once, and this is how we'll hire you on Upwork.
Please follow these steps:

1. Make sure you've read and understood the contributing guidelines.
2. Get the email address used to login to your Expensify account. If you don't already have an Expensify account, create one here. If you have multiple accounts (e.g. one for testing), please use your main account email.
3. Get the link to your Upwork profile. It's necessary because we only pay via Upwork. You can access it by logging in, and then clicking on your name. It'll look like this. If you don't already have an account, sign up for one here.
4. Copy the format below and paste it in a comment on this issue. Replace the placeholder text with your actual details.
   
   Format:

Contributor details
Your Expensify account email: <REPLACE EMAIL HERE>
Upwork Profile Link: <REPLACE LINK HERE>

[c3024]

@linhvovan29546 's RCA and proposal LGTM!

They clarified with the PR author who introduced this line too. This change should not break anything.

🎀 👀 🎀 C+ reviewed!

[melvin-bot]

Triggered auto assignment to @MonilBhavsar, see https://stackoverflow.com/c/expensify/questions/7972 for more details.

[AHMEDTASRIFABDULLAH]

Hi, I noticed the positive feedback on the proposed solution. I would like to confirm if you're considering hiring me for this task. Please let me know the next steps

[AHMEDTASRIFABDULLAH]

Here are my contributor details as requested:
Expensify account email: [email protected]
Upwork Profile Link: https://www.upwork.com/freelancers/ahmedtasrifa?mp_source=share

[melvin-bot]

📣 @linhvovan29546 🎉 An offer has been automatically sent to your Upwork account for the Contributor role 🎉 Thanks for contributing to the Expensify app!

Offer link
Upwork job
Please accept the offer and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻
Keep in mind: Code of Conduct | Contributing 📖

[linhvovan29546]

PR is ready for review!

[linhvovan29546]

FYI: The PR was deployed to production yesterday. Looks like the automation didn't work

[twisterdotcom]

Okay. @c3024 could you do the checklist when you get a chance? I will be OOO next week, but will try to pay it first thing on May 12th if that's okay.

[c3024]

Sure, np. I'll complete the checklist.

[c3024]

BugZero Checklist:

• [Contributor] Classify the bug:

Bug classification

Source of bug:

• 1a. Result of the original design (eg. a case wasn't considered)
• 1b. Mistake during implementation
• 1c. Backend bug
• 1z. Other:

Where bug was reported:

• 2a. Reported on production (eg. bug slipped through the normal regression and PR testing process on staging)
• 2b. Reported on staging (eg. found during regression or PR testing)
• 2d. Reported on a PR
• 2z. Other:

Who reported the bug:

• 3a. Expensify user
• 3b. Expensify employee
• 3c. Contributor
• 3d. QA
• 3z. Other:

• [Contributor] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake.

  Link to comment: https://github.com/Expensify/App/pull/57549/files#r2040629278

• [Contributor] If the regression was CRITICAL (e.g. interrupts a core flow) A discussion in #expensify-open-source has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner.

  Link to discussion: Not critical enough to warrant a discussion.

• [Contributor] If it was decided to create a regression test for the bug, please propose the regression test steps using the template below to ensure the same bug will not reach production again.

Regression Test Proposal Template

• [BugZero Assignee] Create a GH issue for creating/updating the regression test once above steps have been agreed upon.

  Link to issue:

Regression Test Proposal

Precondition:

• The account must have more than 10 report items.

Test:

1. Open the app or web/desktop and resize the window to a narrow layout.
2. Go to the Reports page and open the Search.
3. Scroll to the end of the list.
4. Verify that all search items are displayed properly.

Do we agree 👍 or 👎

[linhvovan29546]

Hi @twisterdotcom Hope you're back, we have a payment due date here.

[melvin-bot]

@MonilBhavsar Whoops! This issue is 2 days overdue. Let's get this updated quick!

[melvin-bot]

@MonilBhavsar Still overdue 6 days?! Let's take care of this!

[twisterdotcom]

Ahh, the automations aren't here. I see. Okay, manually manual. Here comes a payment summary.

[twisterdotcom]

Payment Summary:

• @linhvovan29546 paid $250 here via Upwork (Contributor)
• @c3024 paid $250 via NewDot requests (Reviewer)

[JmillsExpensify]

$250 approved for @c3024