[HOLD for Payment 2024-10-07][$250] [Search v2.2] Hide mobile Search nav button + status tabs on scrollDown, but reveal on scrollUp

[luacmartins]

Problem
On mobile, the Search page occupies a lot of fixed space between the top workspace switcher, the page navigation button, the status tabs, and the bottom fixed tabs. This doesn't lave a whole lot of vertical space remaining to view the expenses page.

Solution:
Let's make it so that the nav button and status tabs scroll the page with the content, but are revealed as soon as the user scrolls back up. Here is a rough prototype of the action:

CleanShot.2024-08-23.at.13.43.41.mp4

Note that in the prototype, we're scrolling the button + tabs back into view at the same speed as the content, but I could see where it might even make sense to just animate that area back in as soon as we detect "one scroll" going back up.

cc @Expensify/design @luacmartins for visibility. I think this is good #wave-control polish.

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01ee6fbdd84bda73a1
• Upwork Job ID: 1828223707737004666
• Last Price Increase: 2024-08-27
• Automatic offers:
• rayane-djouah | Contributor | 103694364

Issue Owner

Current Issue Owner: @kadiealexander

[melvin-bot]

Triggered auto assignment to @kadiealexander (NewFeature), see https://stackoverflowteams.com/c/expensify/questions/14418#:~:text=BugZero%20process%20steps%20for%20feature%20requests for more details. Please add this Feature request to a GH project, as outlined in the SO.

[melvin-bot]

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