54 lines
1.6 KiB
JavaScript
54 lines
1.6 KiB
JavaScript
import { h, render } from 'preact'
|
|
import { useState } from 'preact/hooks'
|
|
import { ThemeProvider } from 'styled-components'
|
|
import { BrowserRouter, Route, Switch } from 'react-router-dom'
|
|
|
|
import Main from './app'
|
|
import SeriesPage from './src/pages/SeriesPage'
|
|
import { useEventApi, useEventCalendar } from './src/hooks/data'
|
|
import { useTheme } from './src/store'
|
|
import { useTimeout } from './src/hooks/timerHooks'
|
|
import LoaderLayout from './src/pages/LoaderLayout'
|
|
import FourOhFour from './src/pages/404'
|
|
import Series from './src/pages/Series'
|
|
|
|
const App = () => {
|
|
const { theme } = useTheme((store) => store)
|
|
const { data: calData, calLoading } = useEventCalendar()
|
|
const { data: seriesDataArray, loading: eventsLoading } = useEventApi()
|
|
const [minLoadTimePassed, setMinTimeUp] = useState(false)
|
|
|
|
useTimeout(() => {
|
|
setMinTimeUp(true)
|
|
}, 1500)
|
|
|
|
|
|
const seriesData = Object.values(seriesDataArray)
|
|
|
|
return (
|
|
<ThemeProvider theme={theme}>
|
|
{calLoading || eventsLoading || !minLoadTimePassed ? (
|
|
<LoaderLayout />
|
|
) : (
|
|
<BrowserRouter>
|
|
<Switch>
|
|
<Route exact path="/" component={Main} />
|
|
<Route exact path="/series" component={Series} />
|
|
{seriesData.length ? seriesData.map(series => (
|
|
<Route exact path={`/series/${series.slug}`}>
|
|
<SeriesPage data={series} />
|
|
</Route>)) : null}
|
|
<Route path="*">
|
|
<FourOhFour />
|
|
</Route>
|
|
</Switch>
|
|
</BrowserRouter>
|
|
)}
|
|
</ThemeProvider>)
|
|
}
|
|
|
|
|
|
const appEl = document.getElementById('app')
|
|
|
|
render(<App />, appEl)
|