🐛 [Bug report]: Navbar hide/show behavior inconsistent after hero section

[harishsehlangia]

Contributor Guidelines

• I have read the guidelines and discussion

Descrcibe the bug?

The header/navbar visibility logic works correctly while the page is inside the hero (top banner) section.

However, after scrolling past the hero section, the navbar does not consistently reappear when scrolling up.

The expected behavior is:

• Navbar should always remain visible while inside the hero section.
• After crossing the hero section, it should hide on scroll down and show again on scroll up.

Currently, once we move further down the page, the show-on-scroll-up behavior sometimes fails.

Steps to reproduce the bug?

1. Open the homepage.
2. Scroll down past the hero/banner section.
3. Continue scrolling down so the navbar hides.
4. Now scroll up.

Notice that the navbar does not always reappear as expected.

Expected behavior

After leaving the hero section:

• Scroll DOWN → navbar hides.
• Scroll UP → navbar becomes visible again.

Desktop (Please provide your system information)

OS: Windows 11
Browser: Chrome
Version: Latest

Mobile (Please provide your device information)

No response

Screenshot / Screenshare

No response

Relevant log output

No response

Record

• I have checked the existing issues
• I have read the Contributing Guidelines
• I want to work on this issue
• I am a Hacktoberfest contributor

Code of Conduct

• I agree to follow this project's Code of Conduct

[github-actions]

Hey! contributor, thank you for opening an Issue 🎉.

@reactplay/maintainers will review your submission soon and give you helpful feedback. If you're interested in continuing your contributions to open source and want to be a part of a welcoming and fantastic community, we invite you to join our ReactPlay Discord Community.
Show your support by starring ⭐ this repository. Thank you and we appreciate your contribution to open source!
Stale Marking : After 30 days of inactivity this issue/PR will be marked as stale issue/PR and it will be closed and locked in 7 days if no further activity occurs.

[harishsehlangia]

@priyankarpal I would like to work on this issue. Can I be assigned?

[harishsehlangia]

While working on this issue, I discovered an additional edge case.

There is a promotional activity banner displayed above the navbar
when REACT_APP_ACTIVITIES_ON is true.

Because of this banner:
• the navbar was hiding partially while scrolling down
• an empty space appeared above the navbar while scrolling up

I have updated the scroll logic to detect the banner height
and handle the show/hide behavior correctly when the banner is present.

Now:

• navbar hides completely on scroll down
• navbar + banner reappear together on scroll up
• behavior remains unchanged when the banner is not present

I will include this improvement in the PR.