Release Healer Man 0.1.38

src/ui/DungeonSelectScreen.tsx

@@ -26,6 +26,8 @@ import { BrandMark, ControllerLegend, FrontSurface } from "./FrontSurface";
 import { OnlineGroupPanel } from "./OnlineGroupPanel";
 import { useOnlineGroupStore } from "../app/onlineGroupStore";
 import { specializationById } from "../game/specializationCatalog";
+import { DUNGEON_RELEASE_STAGE_LABELS } from "../game/dungeonReleaseStage";
+import { useDungeonReports } from "./useDungeonReports";
 
 installDungeonShellRuntime();
 
@@ -50,6 +52,7 @@ interface PendingDungeonDownload {
 }
 
 export function DungeonSelectScreen() {
+  const reports = useDungeonReports();
   const contentState = useContentManagerSnapshot();
   const activeCharacter = useShellStore((state) => state.activeCharacter);
   const rosterCharacter = useShellStore(selectedCharacter);
@@ -253,19 +256,24 @@ export function DungeonSelectScreen() {
                   controlId={`dungeon-${dungeon.id}`}
                   selectedId={controller.selectedId}
                   select={controller.select}
-                  className={`dungeon-select-row ${dungeon.id === selectedDungeon?.id ? "is-active" : ""}`}
+                  className={`dungeon-select-row ${dungeon.id === selectedDungeon?.id ? "is-active" : ""} ${(reports.snapshot?.openCounts[dungeon.id] ?? 0) > 0 ? "has-open-reports" : ""}`}
                   type="button"
                   aria-pressed={dungeon.id === selectedDungeon?.id}
                   onClick={() => selectDungeon(dungeon.id)}
                 >
                   <b aria-hidden="true">{String(index + 1).padStart(2, "0")}</b>
-                  <span><strong>{dungeon.title}</strong><small>{dungeon.entranceName}</small></span>
+                  <span><strong>{dungeon.title}</strong><small>{DUNGEON_RELEASE_STAGE_LABELS[dungeon.releaseStage]} · {dungeon.entranceName}</small></span>
+                  {(reports.snapshot?.openCounts[dungeon.id] ?? 0) > 0 && (
+                    <sup className="dungeon-open-report-count" aria-label={`${reports.snapshot!.openCounts[dungeon.id]} open reports`}
+                      title={`${reports.snapshot!.openCounts[dungeon.id]} open reports`}>{reports.snapshot!.openCounts[dungeon.id]}</sup>
+                  )}
                   <em>{dungeon.available
                     ? dungeonContentIsUsable(dungeon.id) ? "Ready" : "Download required"
                     : "Coming soon"}</em>
                 </ControllerButton>
               ))}
             </div>
+            {reports.error && <small role="status" className="dungeon-report-load-error">Report counts unavailable. {reports.snapshot ? "Showing the last loaded counts." : ""}</small>}
             <ControllerButton
               controlId="dungeon-back"
               selectedId={controller.selectedId}
@@ -295,6 +303,7 @@ export function DungeonSelectScreen() {
                 <section className="dungeon-select-copy">
                   <p className="front-kicker">{canStart ? "Playable expedition" : selectedDungeon.available ? "Content required" : "In development"}</p>
                   <h2>{selectedDungeon.title}</h2>
+                  <span className="dungeon-release-stage">{DUNGEON_RELEASE_STAGE_LABELS[selectedDungeon.releaseStage]}</span>
                   <p>{selectedDungeon.summary}</p>
                   {!canStart && selectedDungeon.availabilityReason && (
                     <p className="front-notice" role="status">{selectedDungeon.availabilityReason}</p>