From 514f07cc1152fe62c607077c50b53908cf1e422e Mon Sep 17 00:00:00 2001
From: amoussa1229 <166072409+amoussa1229@users.noreply.github.com>
Date: Thu, 2 Jul 2026 01:29:52 +0000
Subject: [PATCH] Move PWA registration into useEffect to avoid render-phase
 side effects

registerSW() and setUpdateSW() were being called during component render,
which triggers a state update during rendering and can cause infinite
re-render loops. This also caused the Playwright E2E tests to fail since
they block service workers and the render-phase side effect destabilizes
React hydration.

Move both calls into a useEffect that runs once on mount, gated on
import.meta.env.PROD.
---
 ui/src/client.tsx | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/ui/src/client.tsx b/ui/src/client.tsx
index 096d57cf..c6783110 100644
--- a/ui/src/client.tsx
+++ b/ui/src/client.tsx
@@ -1,5 +1,5 @@
 import { StartClient } from "@tanstack/react-start/client"
-import { StrictMode, useState } from "react"
+import { StrictMode, useEffect, useState } from "react"
 import { hydrateRoot } from "react-dom/client"
 import { registerSW } from "virtual:pwa-register"
 
@@ -15,14 +15,15 @@ function PwaUpdateProvider() {
   const [needRefresh, setNeedRefresh] = useState(false)
   const [updateSW, setUpdateSW] = useState<(() => Promise<void>) | undefined>(undefined)
 
-  if (import.meta.env.PROD) {
+  useEffect(() => {
+    if (!import.meta.env.PROD) return
     const updateSWRef = registerSW({
       onNeedRefresh() {
         setNeedRefresh(true)
       },
     })
     setUpdateSW(() => updateSWRef)
-  }
+  }, [])
 
   return (
     <PwaUpdateToast