fix: add auth loading state to prevent route flicker (#365)

[5hivam123]

Description

Added an AppContent inner component that uses useAuth hook
to check loading state before rendering AppRoutes. This
prevents route flicker and premature redirects to login page
while Firebase auth state is being resolved.

Changes:

• Created AppContent component inside App.jsx that reads
  loading from useAuth()
• Shows <Preloader /> while auth is loading
• Renders <AppRoutes /> only after auth state is resolved
• Also fixed duplicate hash fragment issue in redirect logic

Related Issue

Fixes #365

Type of Change

• Bug fix (non-breaking change which fixes an issue)

Screenshots / Videos (if applicable)

[Add screen recording showing no flicker on page refresh]

Testing Done

• Visual verification on local dev server (http://localhost:5173)
• Refreshed page while logged in — no login page flash ✅
• Auth state resolves correctly before routes render ✅
• No console errors or warnings

Checklist

• My code follows the style guidelines of this project.
• I have performed a self-review of my own code.
• My changes generate no new warnings or console errors.

Contributor Declaration

• I confirm that this contribution is made under the rules of NSoC 2026.
• I confirm that I have been assigned the related issue by a maintainer before opening this PR.
• I have read the Contributing Guidelines and Code of Conduct.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
ranker-hub	Ready	Preview, Comment	Jun 14, 2026 6:14am

[5hivam123]

Hi @indresh404! 👋

I've fixed this issue.

Changes made in src/App.jsx:

• Created AppContent inner component using useAuth hook
• Added loading check — shows <Preloader /> while auth resolves
• <AppRoutes /> renders only after auth state is confirmed
• No more route flicker or premature login page redirect ✅

PR: [paste your PR link here]

Please review when you get a chance. Thanks! 🙏