Allow SessionAuth to take a loading component

[rishabhpoddar]

This is so that while we fetch info about the session's existence, we can display some nice loading UI instead of nothing. It prevents the issue of the screen being "small" first, and then being pushed cause a new large component is added (the login component)

[rishabhpoddar]

Maybe a better interface would be to pass a "LOADING" status to the children component instead? So the context would become:

{
   status: "LOADING"
} | {
   status: "READY",
   doesSessionExist: boolean,
   userId: string,
   jwtPayload: any
}

[gmwill934]

Any update on this? I can help if pointed in the right direction!

const { doesSessionExist, isLoading } = useSessionContext();

[rishabhpoddar]

Hey @gmwill934 , Sure! Help would be much appreciated.

I like the idea of returning a isLoading param from useSessionContext(). However, this would be a breaking change since right now, don't render the children component in case the context provider is in loading state.

If we want to make this a non breaking change, we can instead take a react component in the context provider something like:

<SessionAuth
   loadingComponent={() => {
      return (<div> {/* Render loading state here */} </div>)
   }}>
   {<SomeComponentThatRequiresTheSessionContext />}
</SessionAuth>

This way whenever the SessionAuth is in loading state, we will display loadingComponent.

---

Personally, I prefer the non breaking change, simply because it is non breaking and cause the loading state is just a few milliseconds. However, I do see that returning a isLoading output could be more powerful.. Which one do you prefer?