[BUG]Post Ride page renders blank when opened directly in a new tab

[Pranavgitty]

Browser

Chrome

Area

Post Ride

Steps to reproduce

1. Open the application in a browser.
2. Instead of navigating through the application's UI, directly access the Post Ride route:
   • Open a new browser tab and enter /post-ride in the URL, or
   • Manually type the complete URL (e.g. http://localhost:5173/post-ride) into the address bar.
3. Observe that the page does not render correctly and displays a blank screen.
4. Open the browser's Developer Tools console.
5. Notice that React throws a runtime error related to hook execution order ("Rendered fewer hooks than expected").

Expected behavior

The Post Ride /Post Intent page should render correctly even on opening in a new tab.

What actually happened

When the Post Ride page is accessed directly (for example by opening /post-ride in a new browser tab or by manually entering the URL), the page fails to render and displays a blank screen.

The issue does not occur when navigating to the page through the normal application flow. However, direct access consistently triggers a React runtime error in the browser console related to hook execution order.

The console reports that fewer hooks were rendered than expected, causing React to stop rendering the component. As a result, users are unable to access the Post Ride form when visiting the route directly.

This behavior can be confusing for users because the URL appears valid, but the page remains blank with no visible indication of what went wrong.

Logs / Screenshots

[Harshbansal06]

/assign

This issue is happening because the component is violating React's Rules of Hooks.

When user accesses /post-ride directly via a new tab, those values are initially null. This likely triggers an early conditional return statement (e.g., if (loading) return ...) placed before other React hooks (like useEffect or useState) are declared.

Since React relies on the exact same execution order of hooks on every render, skipping hooks due to an early conditional return causes the "Rendered fewer hooks than expected" runtime crash.

I will refactor the Post Ride component to ensure that all hooks are declared at the very top level, strictly before any conditional returns or guard clauses.

I'd love to take this up and open a PR for it! 🙌

[nairutidave09-hue]

I would like to work on this issue.
While accessing http://localhost:5173/post-ride directly, it shows a blank screen. This is likely due to violating the Rules Of Hooks.
The hooks must be executed before the if statement, so that it registers 7 hooks.
I can see that if (authLoading) statement is used first , when http://localhost:5173/post-ride is accessed, the if statement is executed and the remaining React hooks (useState) aren't executed.
I will fix this issue by placing all the 7 hooks above if condition .
Thus after the authentication is completed , it will trigger a re-render of 7 hooks .
I have even tested it locally and its working

[BitForge95]

@Pranavgitty i have assigned you the issue. Before submitting a PR , explain your approach and implementation.