56 lines
1.3 KiB
TypeScript
56 lines
1.3 KiB
TypeScript
|
|
import { useQuery } from '@tanstack/react-query'
|
|||
|
|
import { Route, Routes } from 'react-router-dom'
|
|||
|
|
import { getAuthStatus } from './api/client'
|
|||
|
|
import Connect from './pages/Connect'
|
|||
|
|
import Feed from './pages/Feed'
|
|||
|
|
import Channels from './pages/Channels'
|
|||
|
|
import ChannelVideos from './pages/ChannelVideos'
|
|||
|
|
import VideoPage from './pages/VideoPage'
|
|||
|
|
import Categories from './pages/Categories'
|
|||
|
|
import './App.css'
|
|||
|
|
|
|||
|
|
function App() {
|
|||
|
|
const { data, isLoading, isError } = useQuery({
|
|||
|
|
queryKey: ['auth-status'],
|
|||
|
|
queryFn: getAuthStatus,
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
if (isLoading) {
|
|||
|
|
return (
|
|||
|
|
<div className="app">
|
|||
|
|
<p>Загрузка...</p>
|
|||
|
|
</div>
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
if (isError) {
|
|||
|
|
return (
|
|||
|
|
<div className="app">
|
|||
|
|
<p className="error">Backend недоступен</p>
|
|||
|
|
</div>
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
if (!data?.authenticated) {
|
|||
|
|
return (
|
|||
|
|
<div className="app">
|
|||
|
|
<Connect />
|
|||
|
|
</div>
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
return (
|
|||
|
|
<div className="app">
|
|||
|
|
<Routes>
|
|||
|
|
<Route path="/" element={<Feed />} />
|
|||
|
|
<Route path="/channels" element={<Channels />} />
|
|||
|
|
<Route path="/channels/:channelId/videos" element={<ChannelVideos />} />
|
|||
|
|
<Route path="/video/:youtubeVideoId" element={<VideoPage />} />
|
|||
|
|
<Route path="/categories" element={<Categories />} />
|
|||
|
|
</Routes>
|
|||
|
|
</div>
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
export default App
|