[HOLD for payment 2024-11-29] [$250] Onboarding tasks - Blank attachment screen is displayed after onboarding video ends

[isagoico]

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: 9.0.44-0
Reproducible in staging?: Yes
Reproducible in production?: Yes
If this was caught during regression testing, add the test name, ID and link from TestRail: Bottom UP - New user searches for Expensify and can create a new account

Issue reported by: Applause - Internal team

Action Performed:

1. Create a new account in ND
2. On the onboarding menu, tap on "Get paid back from my employer"
3. Input any name and tap on the "Continue" button
4. Tap on "Concierge"
5. Tap on the video
6. Wait until the video ends

Expected Result:

Video preview could be loading again, or the user could be dropped to Concierge after finishing the video.

Actual Result:

Blank attachment screen is displayed after "Submit video" ends.

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: mWeb Chrome
• iOS: Native
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Issue seen at second 55 of the video.
https://github.com/user-attachments/assets/6aba42d2-d799-4b87-938c-ce4686cca3a3

View all open jobs on GitHub

This was found when executing the newly added flows for CVP here https://github.com/Expensify/Expensify/issues/412920. CC @JmillsExpensify

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021843472805523129966
• Upwork Job ID: 1843472805523129966
• Last Price Increase: 2024-10-08
• Automatic offers:
• ishpaul777 | Reviewer | 104523527
• nkdengineer | Contributor | 104523529

Issue Owner

Current Issue Owner: @VictoriaExpensify

[melvin-bot]

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

[nkdengineer]

Proposal

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

Blank attachment screen is displayed after "Submit video" ends.

What is the root cause of that problem?

After the user finishes watching the video and the video is not looping, it will stop at the last frame of the video without any action.

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

We should show the video player controls again so that the user can know that they have finished watching the video.

1. Add a new state to BaseVideoPlayer component

    const [isEnded, setIsEnded] = useState(false);

2. Add isEnded to this condition

App/src/components/VideoPlayer/BaseVideoPlayer.tsx

Line 446 in a5e5392

{controlStatusState !== CONST.VIDEO_PLAYER.CONTROLS_STATUS.HIDE && !isLoading && (isPopoverVisible || isHovered || canUseTouchScreen) && (

controlStatusState !== CONST.VIDEO_PLAYER.CONTROLS_STATUS.HIDE && !isLoading && (isPopoverVisible || isHovered || canUseTouchScreen || isEnded) 

3. When the user finishes watching the video without looping the video, we will set isEnded to true here

 setIsEnded(status.didJustFinish && !status.isLooping);

What alternative solutions did you explore? (Optional)

We can dismiss modal or playback video again when status == didJustFinish

Result with the main solution

Screen.Recording.2024-10-04.at.11.49.18.mov

[melvin-bot]

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

[VictoriaExpensify]

Oh we should fix this. Tested on Android, it also happens there

[melvin-bot]

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

[melvin-bot]

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