From 83cf2dc860f1b69402ad825380829ce1ca3af338 Mon Sep 17 00:00:00 2001
From: Morten Kolstad <morten.kolstad@bekk.no>
Date: Fri, 29 Nov 2024 23:49:28 +0100
Subject: [PATCH] fix: reacquire wakelock when getting focus again

---
 apps/frontend/src/context/WakeLockContext.tsx | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/apps/frontend/src/context/WakeLockContext.tsx b/apps/frontend/src/context/WakeLockContext.tsx
index 412d1cb9..fdc0a7d9 100644
--- a/apps/frontend/src/context/WakeLockContext.tsx
+++ b/apps/frontend/src/context/WakeLockContext.tsx
@@ -11,6 +11,16 @@ export const WakeLockContextProvider = ({
   const { isRunning } = useData();
   const [wakeLock, setWakeLock] = React.useState<WakeLockSentinel | null>(null);
 
+  const documentVisibility = React.useSyncExternalStore(
+    (callback) => {
+      document.addEventListener('visibilitychange', callback);
+      return () => {
+        document.removeEventListener('visibilitychange', callback);
+      };
+    },
+    () => document.visibilityState
+  );
+
   const acquireWakeLock = async () => {
     const wl = await navigator.wakeLock.request('screen');
     setWakeLock(wl);
@@ -19,14 +29,14 @@ export const WakeLockContextProvider = ({
     });
   };
   React.useEffect(() => {
-    if (isRunning) {
+    if (isRunning && documentVisibility === 'visible') {
       acquireWakeLock().catch(() => console.warn('Could not acquire wakeLock'));
     } else if (wakeLock) {
       wakeLock
         .release()
         .catch(() => console.warn('Could not release wakeLock'));
     }
-  }, [isRunning]);
+  }, [isRunning, documentVisibility]);
 
   return (
     <WakeLockContext.Provider value={null}>{children}</WakeLockContext.Provider>