[Due for payment 2025-05-14] [$250] Hybrid iOS - The scroll bar in help page overlap with content

[IuliiaHerets]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Version Number: v9.1.27-2
Reproducible in staging?: Yes
Reproducible in production?: Unable to check
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: #60135
Issue reported by: Applause Internal Team
Device used: iPhone 12 / iOS 17.7.2
App Component: User Settings

Action Performed:

1. Sign in to any account
2. Make sure you do not see the "❔" help panel button in the top right corner
   [Mobile]:
3. Go to Settings > Troubleshoot > [Enable Client side logging] > View debug console
4. Enter and submit command: Onyx.set("nvp_sidePanel", {});
5. Make sure the "❔" help panel button appears in the UI
6. Click the button, verify that the help panel opens
7. Navigate between different pages of the app,

Expected Result:

Verify that the content of the side panel updates accordingly

Actual Result:

The scroll bar in the help panel overlaps with the content

Workaround:

Unknown

Platforms:

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

Screenshots/Videos

Bug6801497_1744616016551.Overlap_help.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021914724609345241057
• Upwork Job ID: 1914724609345241057
• Last Price Increase: 2025-04-29
• Automatic offers:
• daledah | Contributor | 107111717

Issue Owner

Current Issue Owner: @

Issue Owner

Current Issue Owner: @CortneyOfstad

[melvin-bot]

Triggered auto assignment to @CortneyOfstad (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.

[IuliiaHerets]

Unable to check on Prod because after enter code no help button display.
Let me know, if I need to add a Blocker label.

[daledah]

🚨 Edited by proposal-police: This proposal was edited at 2025-04-14 13:32:11 UTC.

Proposal

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

• The scroll bar in the help panel overlaps with the content

What is the root cause of that problem?

• We don't set the scrollIndicatorInsets in here. The RCA mentioned in here.
• When the ScrollView is mounted while screen animation is in progress, since iOS will adjust scroll indicator insets by default, sometimes the scrollbar will get stuck in the middle/left of the screen.

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

• Use scrollIndicatorInsets={{right: Number.MIN_VALUE}} in:

App/src/components/SidePanel/HelpComponents/HelpContent.tsx

Lines 96 to 99 in f5f3af7

	<ScrollView
	style={[styles.ph5, styles.pb5]}
	userSelect="auto"
	>

• The scrollIndicatorInsets.right or scrollIndicatorInsets.left could also be decided later based on which position we want to display the scrollbar.

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

• None

What alternative solutions did you explore? (Optional)

[melvin-bot]

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

[melvin-bot]

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

[Julesssss]

Let me know, if I need to add a Blocker label.

No blocker as this is new functionality.