Using routeData in context provider at root of page not working
When attempting to use a context provider at the root of the app, routeData doesn't work, and using createRouteData directly results in an error
34 Replies
and this is the relevant context provider code
I've also tried wrapping the providers within a route:
but the same issue persists
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
As I recall, the
<Route> components need to be children of the <Routes> component, without things like context provider in the middle. Try moving the context provider above the <Routes> component?I've done that, and the provider still returns undefined
This is what my provider does
provider still returns undefinedI didn't realize this was the issue, you said you were getting an error Please provide the error if there is one Where is the provider being used?
The error happens if I try to use createServerData or createRouteData directly
without wrapping it
Well, I don't think you're supposed to...
Yeah
but now it's wrapped in routeData
Could it be because the provider is being referenced in the root.tsx file?
Well, created not referenced I guess
The provider is used in most routes
to check for login
I don't know if you can use routedata outside above the routes 🤷
That's probably it
I would have expected
data to be a resourceyep
typescript says it can be a Resource or undefined
Oh. Then the undefined case should probably never happen if it can find the routedata
Actually, sorry, it's a resource which either contains a bool or undefined
Resource<boolean | undefined>
routeData doesn't even get called
https://start.solidjs.com/api/useRouteData
It seems pretty specific to a route
Maybe some sort of nesting solution would allow you do this as a route
Otherwise I have no idea
I've tried that
I'll show my solution
2 secs
In the root
and:
I'm afraid I can't help you much though, my #solid-start foo is very limited
I don't think that will work, for the reason I gave at the beginning of the thread
What happens when you use that code?
Same as before
Site renders, but routeData doesn't work in the provider
Data within the provider works though
Through my hacky way of setting the signals
But I had to introduce some artificial delay for some reason
or the UI wouldn't update with signal change
I've just tried wrapping the FileRoutes in Routes
and now things are really strange: The provider logs undefined 5 times per second, rather than once per second
and the 5 logs are all at the same time
So maybe the provider is mounted multiple times?
I've just inserted a log inside of onMount, and it logs 5 times
So it appears as if the component is mounted 5 times
For some reason
This is what I've got:
It seems as if Routes cannot be nested in this way
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
The provider is still defined under /routes
Is there any other way to resolve authentication state in a context provider?
Currently, I check for a cookie inside of onMount and then set signals based off of that, and after checking if the cookie is valid.
But I need to add artificial delay, or the UI doesn't update properly with the state of the signal.
My current solution works fine, but, ideally, the data would be resolved before the main page renders so I can redirect to login if the user isn't logged in
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
Does (app).tsx act as a layout for your entire app then?
Because, otherwise, if the user loads onto a different page, it wouldn't load and the context provider wouldn't get the required data
Unless I force the user to go through the main page
I've come up with a solution to my problem, where I first initialise isAuthed to undefined, then, on the server I check if a token exists and, if so, I set it temporarily to true, so the server render renders the HTML as if the user were authenticated, then, on every page that requires auth, an effect checks if isAuthed is ever set to false
It's a terrible solution
But it works ig