problemi/client/App.tsx

import Router from 'preact-router'
import { route } from 'preact-router'
import { useEffect } from 'preact/hooks'
import { AdminPage } from './pages/Admin'

import { HomePage } from './pages/Home'
import { LoginPage } from './pages/Login'
import { ProblemPage } from './pages/Problem'
import { ProfilePage } from './pages/Profile'

const Redirect = ({ to }: { default: boolean; to: string }) => {
    useEffect(() => {
        route(to, true)
    }, [])

    return (
        <>
            Redirecting to <pre>{to}</pre>...
        </>
    )
}

export const App = ({ url }: { url?: string }) => {
    return (
        <Router url={url}>
            <HomePage path="/" />
            <LoginPage path="/login" />
            <ProfilePage path="/profile" />
            <ProblemPage path="/problem/:id" />
            <AdminPage path="/admin" />
            <Redirect default to="/" />
        </Router>
    )
}