a16988b957
* feat(debug-store): Zustand store met hydration-flag voor debug-modus * feat(status-bar): dev-only debug-toggle via geïsoleerde sub-component * feat(globals.css): debug-mode overlay CSS voor data-debug-id elementen * feat(shared): data-debug-id+label op navigatie-componenten * feat(shared): data-debug-id+label op form/select-componenten * feat(shared): data-debug-id+label op display-componenten
27 lines
878 B
TypeScript
27 lines
878 B
TypeScript
'use client'
|
|
|
|
import { DebugToggle } from './status-bar-debug-toggle'
|
|
|
|
const buildDate = process.env.NEXT_PUBLIC_BUILD_DATE
|
|
? new Date(process.env.NEXT_PUBLIC_BUILD_DATE).toLocaleDateString('nl-NL', {
|
|
day: 'numeric',
|
|
month: 'short',
|
|
year: 'numeric',
|
|
})
|
|
: '—'
|
|
|
|
const version = process.env.NEXT_PUBLIC_APP_VERSION ?? '0.0.0'
|
|
const isDev = process.env.NODE_ENV !== 'production'
|
|
|
|
export function StatusBar() {
|
|
return (
|
|
<footer
|
|
className="shrink-0 border-t border-border bg-surface-container-low h-14 px-4 flex items-center justify-between text-sm text-muted-foreground select-none"
|
|
data-debug-id="status-bar"
|
|
data-debug-label="StatusBar — shared/status-bar.tsx"
|
|
>
|
|
<span>© {new Date().getFullYear()} Scrum4Me</span>
|
|
<span>v{version} · gebouwd op {buildDate}{isDev && <DebugToggle />}</span>
|
|
</footer>
|
|
)
|
|
}
|