Add titles to summary map flags

client/src/components/screens/GameSummary/SummaryMap/SummaryMap.jsx

@@ -1,4 +1,5 @@
 import { useCallback, useRef, useState } from "react";
+import iso from "iso-3166-1";
 import flagLookup from "../../../../domain/flagLookup";
 import { useGameConfig } from "../../../../hooks/useGameInfo";
 import useMap from "../../../../hooks/useMap";
@@ -26,6 +27,9 @@ export const RoundSelect = ({ rounds, coords, selected, onSelect }) => (
             }`}
             key={r}
             onClick={() => onSelect(r)}
+            title={
+              coords[r].country && iso.whereAlpha2(coords[r].country).country
+            }
           >
             {r} - {flagLookup(coords[r].country)}
           </div>

client/src/tests/SummaryMap.test.js

@@ -4,18 +4,24 @@ import SummaryMap, {
   RoundSelect,
 } from "../components/screens/GameSummary/SummaryMap/SummaryMap";
 
+jest.mock("iso-3166-1");
 jest.mock("../domain/flagLookup");
 jest.mock("../hooks/useGameInfo");
 jest.mock("../hooks/useMap");
 jest.mock("../hooks/useMapBounds");
 jest.mock("../hooks/useMarkersFromGuesses");
 
+import iso from "iso-3166-1";
 import useMarkersFromGuesses from "../hooks/useMarkersFromGuesses";
 import useMap from "../hooks/useMap";
 import useMapBounds from "../hooks/useMapBounds";
 import { useGameConfig } from "../hooks/useGameInfo";
 
 describe("SummaryMap", () => {
+  beforeEach(() => {
+    iso.whereAlpha2.mockReturnValue({ country: "test-country" });
+  });
+
   it("renders", () => {
     useMap.mockReturnValue("map");
     useGameConfig.mockReturnValue({ countryLock: "lock" });

client/src/tests/__snapshots__/SummaryMap.test.js.snap

@@ -11,6 +11,7 @@ exports[`SummaryMap RoundSelect can be selected 1`] = `
     onKeyDown={[Function]}
     role="button"
     tabIndex="0"
+    title="test-country"
   >
     1
      - 
@@ -22,6 +23,7 @@ exports[`SummaryMap RoundSelect can be selected 1`] = `
     onKeyDown={[Function]}
     role="button"
     tabIndex="0"
+    title="test-country"
   >
     2
      - 
@@ -33,6 +35,7 @@ exports[`SummaryMap RoundSelect can be selected 1`] = `
     onKeyDown={[Function]}
     role="button"
     tabIndex="0"
+    title="test-country"
   >
     3
      - 
@@ -60,6 +63,7 @@ exports[`SummaryMap RoundSelect renders 1`] = `
     onKeyDown={[Function]}
     role="button"
     tabIndex="0"
+    title="test-country"
   >
     1
      - 
@@ -71,6 +75,7 @@ exports[`SummaryMap RoundSelect renders 1`] = `
     onKeyDown={[Function]}
     role="button"
     tabIndex="0"
+    title="test-country"
   >
     2
      - 
@@ -82,6 +87,7 @@ exports[`SummaryMap RoundSelect renders 1`] = `
     onKeyDown={[Function]}
     role="button"
     tabIndex="0"
+    title="test-country"
   >
     3
      -