tanstack.com/src/components/AuthComponents.tsx at github-app · TanStack/tanstack.com · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
import { useCurrentUserQuery } from '~/hooks/useCurrentUser'

// Authentication wrapper components for our custom session system
export function Authenticated({ children }: { children: React.ReactNode }) {
  const userQuery = useCurrentUserQuery()
  if (userQuery.data) {
    return <>{children}</>
  }
  return null
}

export function Unauthenticated({ children }: { children: React.ReactNode }) {
  const userQuery = useCurrentUserQuery()
  if (!userQuery.data && !userQuery.isLoading) {
    return <>{children}</>
  }
  return null
}

export function AuthLoading({ children }: { children: React.ReactNode }) {
  const userQuery = useCurrentUserQuery()
  if (userQuery.isLoading) {
    return <>{children}</>
  }
  return null
}