Hide "Næsti hálfleikur" button after advancing to next half

clock/src/contexts/FirebaseStateContext.spec.tsx

@@ -1205,7 +1205,7 @@ describe("FirebaseStateContext", () => {
   });
 
   describe("pauseMatch with isHalfEnd", () => {
-    it("sets timeElapsed to first halfStop and slices halfStops", () => {
+    it("sets halfOffset to first halfStop, resets timeElapsed, and slices halfStops", () => {
       let matchApi: ReturnType<typeof useMatch> | null = null;
       render(
         <FirebaseStateProvider
@@ -1232,7 +1232,39 @@ describe("FirebaseStateContext", () => {
         "match",
         expect.objectContaining({
           started: 0,
-          timeElapsed: 45 * 60 * 1000,
+          halfOffset: 45 * 60 * 1000,
+          halfStops: [90, 105, 120],
+        }),
+      );
+    });
+
+    it("resets timeElapsed to 0 when it was non-zero", () => {
+      let matchApi: ReturnType<typeof useMatch> | null = null;
+      render(
+        <FirebaseStateProvider
+          listenPrefix="test-location"
+          isAuthenticated={true}
+        >
+          <TestMatchConsumer
+            onMount={(api) => {
+              matchApi = api;
+            }}
+          />
+        </FirebaseStateProvider>,
+      );
+      act(() => {
+        matchApi!.updateMatch({ timeElapsed: 46 * 60 * 1000 });
+      });
+      vi.clearAllMocks();
+      act(() => {
+        matchApi!.pauseMatch(true);
+      });
+      expect(firebaseDatabase.syncState).toHaveBeenCalledWith(
+        "test-location",
+        "match",
+        expect.objectContaining({
+          timeElapsed: 0,
+          halfOffset: 45 * 60 * 1000,
           halfStops: [90, 105, 120],
         }),
       );

clock/src/contexts/FirebaseStateContext.tsx

@@ -56,6 +56,7 @@ const defaultMatch: Match = {
   buzzer: false,
   countdown: false,
   showInjuryTime: true,
+  halfOffset: 0,
 };
 
 const defaultController: ControllerState = {
@@ -628,7 +629,8 @@ export const FirebaseStateProvider: React.FC<FirebaseStateProviderProps> = ({
       applyMatchUpdate((prev) => {
         const newState: Match = { ...prev, started: 0 };
         if (isHalfEnd) {
-          newState.timeElapsed = (newState.halfStops[0] ?? 0) * 60 * 1000;
+          newState.halfOffset = (newState.halfStops[0] ?? 0) * 60 * 1000;
+          newState.timeElapsed = 0;
           if (newState.halfStops.length > 1) {
             newState.halfStops = newState.halfStops.slice(1);
           }

clock/src/contexts/firebaseParsers.ts

@@ -174,6 +174,10 @@ export function parseMatch(data: unknown, defaultMatch: Match): Match | null {
       typeof raw.showInjuryTime === "boolean"
         ? raw.showInjuryTime
         : defaultMatch.showInjuryTime,
+    halfOffset:
+      typeof raw.halfOffset === "number"
+        ? raw.halfOffset
+        : defaultMatch.halfOffset,
   };
 }
 

clock/src/controller/MatchActions.tsx

@@ -161,7 +161,7 @@ const MatchActions = () => {
               <PlayIcon /> Byrja
             </Button>
           )}
-          {!match.started && !match.timeElapsed
+          {!match.started && !match.timeElapsed && !match.halfOffset
             ? match.matchType === Sports.Football &&
               match.matchStartTime && (
                 <Button
@@ -176,7 +176,8 @@ const MatchActions = () => {
                 </Button>
               )
             : !match.started &&
-              match.showInjuryTime && (
+              match.showInjuryTime &&
+              !!match.timeElapsed && (
                 <Button
                   color="blue"
                   appearance="primary"
@@ -199,6 +200,7 @@ const MatchActions = () => {
               updateMatch({
                 started: 0,
                 timeElapsed: 0,
+                halfOffset: 0,
                 home2min: [],
                 away2min: [],
                 timeout: 0,

clock/src/match/Clock.tsx

@@ -9,15 +9,15 @@ interface ClockProps {
 
 const Clock: React.FC<ClockProps> = ({ className }) => {
   const { match, pauseMatch, buzz, getServerTime } = useMatch();
-  const { started, halfStops, timeElapsed, showInjuryTime, countdown } = match;
+  const { started, halfStops, timeElapsed, halfOffset, showInjuryTime, countdown } = match;
 
   const halfStop = halfStops[0];
 
   const hasFiredHalfStop = useRef(false);
   const hasFiredCountdownEnd = useRef(false);
 
   const updateTime = useCallback((): string => {
-    let milliSecondsElapsed = timeElapsed;
+    let milliSecondsElapsed = halfOffset + timeElapsed;
     if (started) {
       milliSecondsElapsed += getServerTime() - started;
     }
@@ -57,6 +57,7 @@ const Clock: React.FC<ClockProps> = ({ className }) => {
     started,
     halfStop,
     timeElapsed,
+    halfOffset,
     pauseMatch,
     buzz,
     showInjuryTime,
@@ -77,7 +78,7 @@ const Clock: React.FC<ClockProps> = ({ className }) => {
   return (
     <ClockBase
       updateTime={updateTime}
-      isTimeNull={!started && !timeElapsed}
+      isTimeNull={!started && !timeElapsed && !halfOffset}
       className={className}
     />
   );

clock/src/types.ts

@@ -32,6 +32,7 @@ export interface Match {
   buzzer: number | false;
   countdown: boolean;
   showInjuryTime?: boolean;
+  halfOffset: number;
 }
 
 // Player type