index.js: extract App.jsx

This commit is contained in:
He4eT 2023-06-05 01:19:12 +03:00 committed by Alexey
commit ceafed4a5c
2 changed files with 76 additions and 73 deletions

73
src/App.jsx Normal file
View file

@ -0,0 +1,73 @@
import { Route, Router, Switch } from 'wouter-preact'
import {
useHashLocation,
extractView,
} from './routing'
import {
useThemeEngine,
} from '~/src/themes/themes'
import HomeView from '~/src/views/HomeView/HomeView'
import GamesView from '~/src/views/GamesView/GamesView'
import ThemesView from '~/src/views/ThemesView/ThemesView'
import PlayerView from '~/src/views/PlayerView/PlayerView'
import NotFoundView from '~/src/views/NotFoundView'
export default function App () {
const themeEngine = useThemeEngine()
const [currentLocation] = useHashLocation()
const playerView = (themeEngine, singleWindow) =>
function view (params) {
return (<PlayerView {...{
themeEngine,
singleWindow,
...params,
}} />)
}
return (
<Router hook={useHashLocation}>
<div className={[
'app',
extractView(currentLocation),
themeEngine.currentTheme].join(' ')}>
<Switch>
<Route path='/'>
<HomeView {...{
themeEngine,
}} />
</Route>
<Route path='/games/'>
<GamesView />
</Route>
<Route path='/themes/'>
<ThemesView {...{
themeEngine,
}} />
</Route>
<Route path='/play/:encodedUrl'>
{ playerView(themeEngine, false) }
</Route>
<Route path='/play/:encodedUrl/:theme'>
{ playerView(themeEngine, false) }
</Route>
<Route path='/focus/:encodedUrl'>
{ playerView(themeEngine, true) }
</Route>
<Route path='/focus/:encodedUrl/:theme'>
{ playerView(themeEngine, true) }
</Route>
<Route>
<NotFoundView />
</Route>
</Switch>
</div>
</Router>
)
}

View file

@ -1,79 +1,9 @@
import { h, render } from 'preact'
import { Route, Router, Switch } from 'wouter-preact'
import {
useHashLocation,
extractView,
} from './routing'
import {
useThemeEngine,
} from '~/src/themes/themes'
import HomeView from '~/src/views/HomeView/HomeView'
import GamesView from '~/src/views/GamesView/GamesView'
import ThemesView from '~/src/views/ThemesView/ThemesView'
import PlayerView from '~/src/views/PlayerView/PlayerView'
import NotFoundView from '~/src/views/NotFoundView'
import { render } from 'preact'
import '@fontsource/open-sans'
import '~/src/style/base.css'
function App () {
const themeEngine = useThemeEngine()
const [currentLocation] = useHashLocation()
const playerView = (themeEngine, singleWindow) =>
function view (params) {
return (<PlayerView {...{
themeEngine,
singleWindow,
...params,
}} />)
}
return (
<Router hook={useHashLocation}>
<div className={[
'app',
extractView(currentLocation),
themeEngine.currentTheme].join(' ')}>
<Switch>
<Route path='/'>
<HomeView {...{
themeEngine,
}} />
</Route>
<Route path='/games/'>
<GamesView />
</Route>
<Route path='/themes/'>
<ThemesView {...{
themeEngine,
}} />
</Route>
<Route path='/play/:encodedUrl'>
{ playerView(themeEngine, false) }
</Route>
<Route path='/play/:encodedUrl/:theme'>
{ playerView(themeEngine, false) }
</Route>
<Route path='/focus/:encodedUrl'>
{ playerView(themeEngine, true) }
</Route>
<Route path='/focus/:encodedUrl/:theme'>
{ playerView(themeEngine, true) }
</Route>
<Route>
<NotFoundView />
</Route>
</Switch>
</div>
</Router>
)
}
import App from './App'
render(<App />, document.getElementById('root'))