import { useEffect, useState } from 'react'

/** Ein Zustand, der einen Neuladevorgang überlebt.
 *
 *  Für ANSICHTSSACHEN gedacht: wie viele Kacheln je Seite, wonach sortiert
 *  wird. Wer 120 pro Seite einstellt, meint das dauerhaft und nicht bis zum
 *  nächsten F5.
 *
 *  BEWUSST NICHT für Filter. Ein gemerkter Ordner- oder Artfilter führt zu der
 *  Frage „warum sehe ich nichts", und die Antwort steht dann in einer Leiste,
 *  auf die niemand schaut, weil er sie nicht selbst gesetzt hat. Was die
 *  Ansicht formt, wird gemerkt; was die Menge einschränkt, nicht.
 *
 *  localStorage kann werfen — im privaten Fenster mancher Browser, oder wenn
 *  der Speicher voll ist. Dann verhält sich der Haken wie ein gewöhnlicher
 *  Zustand, statt die Seite mitzureißen. */
export function useMerker<T>(schluessel: string, standard: T) {
    const voll = `d4rk_media.${schluessel}`

    const [wert, setWert] = useState<T>(() => {
        try {
            const roh = localStorage.getItem(voll)
            return roh === null ? standard : (JSON.parse(roh) as T)
        } catch {
            return standard
        }
    })

    useEffect(() => {
        try {
            localStorage.setItem(voll, JSON.stringify(wert))
        } catch {
            /* dann eben nur für diese Sitzung */
        }
    }, [voll, wert])

    return [wert, setWert] as const
}