feat(eod): update difficulty selection in EOD components and bump version to 0.2.0

package.json

@@ -1,6 +1,6 @@
 {
   "name": "polaris-task-force",
-  "version": "0.1.6",
+  "version": "0.2.0",
   "description": "Web app for the Arma 3 unit Polaris Task Force. Uses Next.js for client- and server-side rendering, with a Postgres database and some other neat libraries.",
   "license": "MIT",
   "type": "module",

src/components/frontend/eod/EodArena.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { useCallback, useState } from "react";
-import type { EodStats } from "@/app/(frontend)/eod/actions";
+import type { EodDifficulty, EodStats } from "@/app/(frontend)/eod/actions";
 import { useRealtimePresence } from "@/hooks/useRealtimePresence";
 import { EodLeaderboard } from "./EodLeaderboard";
 import { MinesweeperBoard } from "./MinesweeperBoard";
@@ -15,6 +15,7 @@ export function EodArena({
 }) {
   const [refreshKey, setRefreshKey] = useState(0);
   const [playing, setPlaying] = useState(false);
+  const [selectedDifficulty, setSelectedDifficulty] = useState<EodDifficulty>("training");
   const activeTeams = useRealtimePresence("eod", playing, true);
   const onPhaseChange = useCallback((phase: "ready" | "playing" | "over") => {
     setPlaying(phase === "playing");
@@ -26,11 +27,14 @@ export function EodArena({
         initialStats={initialStats}
         onGameRecorded={() => setRefreshKey((key) => key + 1)}
         onPhaseChange={onPhaseChange}
+        onDifficultyChange={setSelectedDifficulty}
       />
       <EodLeaderboard
         refreshKey={refreshKey}
         currentUserId={currentUserId}
         activeTeams={activeTeams}
+        difficulty={selectedDifficulty}
+        onDifficultyChange={setSelectedDifficulty}
       />
     </div>
   );

src/components/frontend/eod/EodLeaderboard.tsx

@@ -10,6 +10,7 @@ import {
   SelectValue,
 } from "@/components/ui/select";
 import { cn } from "@/lib/utils";
+import type { EodDifficulty } from "@/app/(frontend)/eod/actions";
 import type { PresenceParticipant } from "@/hooks/useRealtimePresence";
 
 interface ApiUser {
@@ -58,6 +59,8 @@ interface EodLeaderboardProps {
   refreshKey?: number;
   currentUserId?: number | string;
   activeTeams?: PresenceParticipant[];
+  difficulty: EodDifficulty;
+  onDifficultyChange: (difficulty: EodDifficulty) => void;
 }
 
 function rankClass(index: number) {
@@ -71,8 +74,9 @@ export function EodLeaderboard({
   refreshKey = 0,
   currentUserId,
   activeTeams = [],
+  difficulty,
+  onDifficultyChange,
 }: EodLeaderboardProps) {
-  const [difficulty, setDifficulty] = useState<"training" | "perimeter" | "supplyRoad">("training");
   const [rows, setRows] = useState<LeaderboardRow[] | null>(null);
   const [failed, setFailed] = useState(false);
 
@@ -146,7 +150,7 @@ export function EodLeaderboard({
         <div className="ml-auto flex items-center gap-2 text-xs text-muted-foreground">
           <Select
             value={difficulty}
-            onValueChange={(value) => setDifficulty(value as typeof difficulty)}
+            onValueChange={(value) => onDifficultyChange(value as EodDifficulty)}
           >
             <SelectTrigger aria-label="Leaderboard sector" className="h-8 w-[150px] text-xs">
               <SelectValue />

src/components/frontend/eod/MinesweeperBoard.tsx

@@ -174,10 +174,12 @@ export function MinesweeperBoard({
   initialStats: serverStats,
   onGameRecorded,
   onPhaseChange,
+  onDifficultyChange,
 }: {
   initialStats: EodStats;
   onGameRecorded: () => void;
   onPhaseChange: (phase: Phase) => void;
+  onDifficultyChange: (difficulty: EodDifficulty) => void;
 }) {
   const router = useRouter();
   const [difficulty, setDifficulty] = useState<GameMode>("training");
@@ -240,13 +242,14 @@ export function MinesweeperBoard({
       if (submittingRef.current) return;
       const nextConfig = nextDifficulty === "custom" ? customConfig : DIFFICULTIES[nextDifficulty];
       setDifficulty(nextDifficulty);
+      if (nextDifficulty !== "custom") onDifficultyChange(nextDifficulty);
       setBoard(emptyBoard(nextConfig.rows * nextConfig.cols));
       generatedRef.current = false;
       setSeconds(0);
       setLastRun(null);
       setPhaseSafe("ready");
     },
-    [customConfig, difficulty, setPhaseSafe],
+    [customConfig, difficulty, onDifficultyChange, setPhaseSafe],
   );
 
   useEffect(() => {