178 replies

Prevent possibly undefined user with useQuery

I have a hook

useUser

useUser

that looks basically like this

return useQuery(// fetch user)

return useQuery(// fetch user)

Lets imagine that its used in a

Layout

Layout

so when the user is loading the whole app is just a loading spinner.
Now I want to get the user inside a component nested in

Layout

Layout

Using

useUser

useUser

hook makes no sense here because its return is always

User | undefined

User | undefined

as typescript doesn't know the user is loaded somewhere higher. How do I solve this problem? Checking

if(!user) return

if(!user) return

Doesn't seem good because the user is always here if the component rendered.