'use client'

import { useState, useEffect } from'react'

const WEEKDAYS = ['Sonntag','Montag','Dienstag','Mittwoch','Donnerstag','Freitag','Samstag']

function getISOWeek(d: Date): number {
 const date = new Date(Date.UTC(d.getFullYear(), d.getMonth(), d.getDate()))
 date.setUTCDate(date.getUTCDate() + 4 - (date.getUTCDay() || 7))
 const yearStart = new Date(Date.UTC(date.getUTCFullYear(), 0, 1))
 return Math.ceil((((date.getTime() - yearStart.getTime()) / 86400000) + 1) / 7)
}

export default function DateDisplay() {
 const [now, setNow] = useState<Date | null>(null)

 useEffect(() => {
 setNow(new Date())
 const id = setInterval(() => setNow(new Date()), 60_000)
 return () => clearInterval(id)
 }, [])

 if (!now) return null

 const weekday = WEEKDAYS[now.getDay()]
 const date = now.toLocaleDateString('de-DE', { day:'2-digit', month:'2-digit', year:'numeric'})
 const kw = getISOWeek(now)

 return (
 <span className="hidden sm:block text-[13px] text-muted-foreground whitespace-nowrap">
 {weekday}, {date} · KW&nbsp;{kw}
 </span>
 )
}