- Added package.json for project dependencies and scripts. - Configured PostCSS with Tailwind CSS. - Created main application structure with App component and routing. - Implemented API client for handling requests with Axios. - Developed authentication API for login, logout, and user verification. - Created entities API for managing virtual entities. - Implemented logs API for fetching dispatch logs. - Added navigation bar component for app navigation. - Created protected route component for route guarding. - Set up global CSS with Tailwind directives. - Configured main entry point for React application. - Developed basic Dashboard and Login pages. - Set up router for application navigation. - Added Jest testing setup for testing library. - Configured Tailwind CSS with content paths. - Set TypeScript configuration for frontend. - Created Vite configuration for development and production builds. - Added Nginx configuration for serving the application and proxying API requests.
23 lines
635 B
TypeScript
23 lines
635 B
TypeScript
import { type ReactNode } from 'react'
|
|
import { Navigate } from 'react-router-dom'
|
|
import { useQuery } from '@tanstack/react-query'
|
|
import { getMe } from '../api/authApi'
|
|
|
|
interface ProtectedRouteProps {
|
|
children: ReactNode
|
|
}
|
|
|
|
/** Redirects to /login if the current JWT session is not valid. */
|
|
export default function ProtectedRoute({ children }: ProtectedRouteProps) {
|
|
const { data, isLoading, isError } = useQuery({
|
|
queryKey: ['auth', 'me'],
|
|
queryFn: getMe,
|
|
retry: false,
|
|
})
|
|
|
|
if (isLoading) return <div>Loading...</div>
|
|
if (isError || !data) return <Navigate to="/login" replace />
|
|
|
|
return <>{children}</>
|
|
}
|