import { Header } from '../components/Header'

function splitFirst(s: string, sep: string): string[] {
    const i = s.indexOf(sep)

    if (i === -1) {
        return [s, '']
    } else {
        return [s.substring(0, i), s.substring(i + sep.length)]
    }
}

const defaultErrorMessage = <>Purtroppo c'è stato un errore inaspettato</>

export const ErrorPage = ({ url }: { url: string }) => {
    const query = Object.fromEntries(
        splitFirst(url, '?')[1]
            .split('&')
            .map(kv => splitFirst(kv, '='))
            .map(([k, v]) => [k, decodeURIComponent(v)])
    )

    return (
        <>
            <Header />
            <main class="page-error">
                <div class="title">Errore</div>
                <p>{query.message.trim().length > 0 ? query.message : defaultErrorMessage}</p>
            </main>
        </>
    )
}