kamilkrzywda
e327e9aea0
Map (WorldMap): - Keep the near-black OpenFreeMap `dark` basemap (verified HTTP 200; the suggested dark-matter / dark-outdoors / liberty-dark variants 404 on that host) so the choropleth nation colors pop - Stable per-nation fills at 0.8 opacity, thin subtle borders, and a brighter thicker amber border for the player nation so "this is me" is always obvious - Hover brightens a region and shows a color-chipped owner + key stats popup; click opens a full dossier popup and focuses the left panel on that nation - Transient, self-cleaning flash (pulsing amber outline) over regions whose ownership changed this turn - Bottom-left legend auto-generated from the region map; per-scenario initial camera (Europe for the WWII scenarios, wider for Cold War / Modern / Aegis) Command-center UI: - New header bar: scenario title, prominent turn + date, the player nation (name + color chip), and a live Idle / "Simulating…" status indicator - 3-column operations-console grid: nation dossier (left) / dominant map (center) / command deck + event feed (right); stacks map-first on mobile - EventFeed: one card per event with a category icon, a colored outcome badge (success/failure/partial/neutral), a nation-colored accent edge, and the turn + date; new events slide in and flash at the top - NationPanel: value-colored animated stat bars (red → green), territory as color-coded region chips, and diplomacy as a list with a colored indicator per relation (ally/rival/war/neutral) - ActionPanel: a "Your move" composer with one prominent Send button and a spinner + "turns can take a few seconds" hint while a turn resolves - sonner error toasts: a 502 / model-down surfaces as "AI temporarily unavailable — try again" Live LLM rewire (server, previously uncommitted): - Default endpoint https://ai.kkhost.pl/v1 (vLLM, no API key); reasoning model qwen3.8-27b; always send a generous max_tokens (4000) so it finishes its chain-of-thought before emitting content; read only `content`, ignore `reasoning`. docker-compose + AGENTS.md updated to match. Tests: the deterministic Playwright e2e gains assertions for the dossier stat bars, the map legend (all nations), and the event-card type icon + outcome badge; it stays fully deterministic under LLM_STUB=1.
38 lines
1.3 KiB
TypeScript
38 lines
1.3 KiB
TypeScript
import { cn } from '@/lib/utils';
|
||
import { statValueColor } from '@/lib/colors';
|
||
|
||
interface Props {
|
||
label: string;
|
||
value: number;
|
||
/**
|
||
* Optional explicit bar color. When omitted, the bar is colored by its value
|
||
* on a red → yellow → green ramp (low = danger, high = strong).
|
||
*/
|
||
color?: string;
|
||
testId?: string;
|
||
className?: string;
|
||
}
|
||
|
||
/**
|
||
* A compact 0–100 stat bar. The fill animates (width + color) when the value
|
||
* changes, so a stat bump is visible at a glance. Defaults to a value-driven
|
||
* red→green color so a low stat reads as "danger".
|
||
*/
|
||
export default function StatBar({ label, value, color, testId, className }: Props) {
|
||
const v = Math.max(0, Math.min(100, Math.round(value)));
|
||
return (
|
||
<div className={cn('flex items-center gap-2 text-xs', className)}>
|
||
<span className="w-16 shrink-0 capitalize text-muted-foreground">{label}</span>
|
||
<div className="h-2 flex-1 overflow-hidden rounded-full bg-muted">
|
||
<div
|
||
className="h-full rounded-full transition-[width,background-color] duration-500 ease-out"
|
||
style={{ width: `${v}%`, background: color ?? statValueColor(v) }}
|
||
/>
|
||
</div>
|
||
<span className="w-8 shrink-0 text-right font-semibold tabular-nums" data-testid={testId}>
|
||
{v}
|
||
</span>
|
||
</div>
|
||
);
|
||
}
|