Files
Mana-Loop/src/components/game/layout/Header.tsx
T
Refactoring Agent 338ac19628
Build and Publish Mana Loop Docker Image / build-and-publish (push) Successful in 1m24s
fix: remaining tab migrations to modular stores
- CraftingProgress, ManaDisplay, TimeDisplay: fmt/fmtDec imports → @/lib/game/stores
- SkillsTab, SkillRow, SkillUpgradeDialog: imports → @/lib/game/stores
- StatsTab and sub-components: fmt/fmtDec imports → @/lib/game/stores
- CategorySkillsList: GameStore type import → GameCoordinatorStore
- EnchantmentDesigner types/utils: GameStore type imports → GameCoordinatorStore
- Header: fmt import → @/lib/game/stores

Moves remaining non-hook usage files from legacy @/lib/game/store to modular @/lib/game/stores
2026-05-04 21:30:48 +02:00

46 lines
1.4 KiB
TypeScript

'use client';
import { fmt } from '@/lib/game/stores';
import { formatHour } from '@/lib/game/formatting';
import { TimeDisplay } from '@/components/game/TimeDisplay';
interface HeaderProps {
day: number;
hour: number;
insight: number;
}
export function Header({ day, hour, insight }: HeaderProps) {
return (
<header className="sticky top-0 z-50 bg-[var(--bg-surface)]/95 backdrop-blur-sm border-b border-[var(--border-subtle)] px-4 py-2">
<div className="flex items-center justify-between">
{/* Game Title - always visible */}
<h1 className="text-xl font-bold game-title tracking-wider">MANA LOOP</h1>
{/* Desktop header content */}
<div className="hidden md:flex items-center gap-4">
<TimeDisplay
day={day}
hour={hour}
insight={insight}
/>
</div>
{/* Mobile header content - compact */}
<div className="flex md:hidden items-center gap-2">
<div className="text-center">
<div className="text-sm font-bold game-mono text-[var(--mana-light)]">
D{day} {formatHour(hour)}
</div>
<div className="text-xs text-[var(--text-secondary)]">
{fmt(insight)} 💎
</div>
</div>
</div>
</div>
</header>
);
}
Header.displayName = "Header";