'use client'

import { useLinkStatus } from 'next/link'

/**
 * Der Ladepunkt in einem Link, solange der Wechsel läuft.
 *
 * Ein Wechsel kann einen Moment dauern, und ohne Rückmeldung sieht es aus, als
 * sei der Klick nicht angekommen — man klickt ein zweites Mal. Der Punkt sitzt
 * **im geklickten Link**, damit sichtbar bleibt, wohin es geht.
 *
 * Das ist kein Blockade-Spinner im Sinn von Regel 5 aus CLAUDE.md: er ersetzt
 * keinen Inhalt und hält nichts auf. Die Zielseite bringt ihr Skelett mit, das
 * ist die eigentliche Antwort auf das Warten — hier geht es nur darum, den
 * Klick zu quittieren.
 *
 * `useLinkStatus` funktioniert nur als Kind eines `next/link`, deshalb die
 * eigene Komponente.
 */
export function Pending() {
  const { pending } = useLinkStatus()
  if (!pending) return null
  return <span aria-hidden className="pending-dot" />
}