Try closing the event controller in cleanup

lsst-sqre · Apr 3, 2024 · 48701fd · 48701fd
1 parent 37b46ba
commit 48701fd
Showing 1 changed file with 10 additions and 0 deletions.
diff --git a/apps/squareone/src/components/TimesSquareHtmlEventsProvider/TimesSquareHtmlEventsProvider.js b/apps/squareone/src/components/TimesSquareHtmlEventsProvider/TimesSquareHtmlEventsProvider.js
@@ -10,12 +10,16 @@ export const TimesSquareHtmlEventsContext = React.createContext();
 
 export default function TimesSquareHtmlEventsProvider({ children }) {
   const [htmlEvent, setHtmlEvent] = React.useState(null);
+  const [abortController, setAbortController] = useState(new AbortController());
   const { htmlEventsUrl } = useTimesSquarePage();
 
   React.useEffect(async () => {
+    const controller = new AbortController();
+
     async function runEffect() {
       await fetchEventSource(htmlEventsUrl, {
         method: 'GET',
+        signal: abortController.signal,
         onopen(res) {
           if (res.ok && res.status === 200) {
             console.log('Connection made ', res);
@@ -41,6 +45,12 @@ export default function TimesSquareHtmlEventsProvider({ children }) {
       });
     }
     runEffect();
+
+    return () => {
+      // Clean up: close the event source connection
+      controller.abort();
+      setAbortController(new AbortController());
+    };
   }, [htmlEventsUrl]);
 
   const contextValue = {