From 3435ddfd840b697487c5db8c644796e8e09e0dca Mon Sep 17 00:00:00 2001
From: Juan Carlos Farah <juancarlos.farah@epfl.ch>
Date: Fri, 12 Apr 2024 15:05:54 +0200
Subject: [PATCH] feat: show warning on unload

---
 .../interaction/ParticipantInteraction.tsx     | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

diff --git a/src/modules/interaction/ParticipantInteraction.tsx b/src/modules/interaction/ParticipantInteraction.tsx
index e3d24a1..f2a9fb0 100644
--- a/src/modules/interaction/ParticipantInteraction.tsx
+++ b/src/modules/interaction/ParticipantInteraction.tsx
@@ -1,4 +1,4 @@
-import { ReactElement, useState } from 'react';
+import { ReactElement, useEffect, useState } from 'react';
 
 import { Button } from '@mui/material';
 import Box from '@mui/material/Box';
@@ -121,6 +121,22 @@ const ParticipantInteraction = (): ReactElement => {
   const [interaction, setInteraction] =
     useState<Interaction>(defaultInteraction);
 
+  useEffect(() => {
+    const handleBeforeUnload = (event: BeforeUnloadEvent): void => {
+      if (!interaction.completed) {
+        // Perform actions before the component unloads
+        event.preventDefault();
+
+        // eslint-disable-next-line no-alert,no-restricted-globals
+        confirm('Confirm refresh');
+      }
+    };
+    window.addEventListener('beforeunload', handleBeforeUnload);
+    return () => {
+      window.removeEventListener('beforeunload', handleBeforeUnload);
+    };
+  }, [interaction]);
+
   function startInteraction(): void {
     const updatedInteraction = { ...interaction };
     updatedInteraction.started = true;