35 lines
853 B
TypeScript
35 lines
853 B
TypeScript
import { Navigate } from 'react-router-dom'
|
|
import { useAuth } from './auth-context'
|
|
import type { PropsWithChildren } from 'react'
|
|
import { useEffect, useState } from 'react'
|
|
|
|
export default function ProtectedRoute({ children }: PropsWithChildren) {
|
|
const { isAuthed, ensureFreshToken, logout } = useAuth()
|
|
const [ready, setReady] = useState(false)
|
|
|
|
useEffect(() => {
|
|
let active = true
|
|
;(async () => {
|
|
if (!isAuthed) {
|
|
if (active) setReady(true)
|
|
return
|
|
}
|
|
try {
|
|
await ensureFreshToken()
|
|
} catch {
|
|
await logout()
|
|
} finally {
|
|
if (active) setReady(true)
|
|
}
|
|
})()
|
|
|
|
return () => {
|
|
active = false
|
|
}
|
|
}, [isAuthed, ensureFreshToken, logout])
|
|
|
|
if (!ready) return null
|
|
if (!isAuthed) return <Navigate to="/login" replace />
|
|
return <>{children}</>
|
|
}
|