Add onbeforeunload prompt while a swap is active

Author: sisou

src/components/swap/SwapNotification.vue

@@ -60,6 +60,13 @@ export default defineComponent({
             ),
         );
 
+        function onUnload(event: BeforeUnloadEvent) {
+            // Firefox respects the event cancellation to prompt the user
+            event.preventDefault();
+            // Chrome requires returnValue to be set
+            event.returnValue = '';
+        }
+
         onMounted(() => {
             if (activeSwap.value) processSwap();
         });
@@ -126,6 +133,8 @@ export default defineComponent({
                     ...activeSwap.value!,
                     state: SwapState.EXPIRED,
                 });
+            } else {
+                window.addEventListener('beforeunload', onUnload);
             }
 
             switch (activeSwap.value!.state) {
@@ -156,13 +165,15 @@ export default defineComponent({
                         return;
                     }
                 case SwapState.COMPLETE:
+                    window.removeEventListener('beforeunload', onUnload);
                     setTimeout(() => {
                         // Hide notification after a timeout, if not in the SwapModal.
                         if (context.root.$route.name === 'swap') return;
                         setActiveSwap(null);
                     }, 4 * 1000); // 4 seconds
                 /* eslint-enable no-fallthrough */
                 default:
+                    window.removeEventListener('beforeunload', onUnload);
                     break;
             }
         }