Fix prompt, and modal.

Signed-off-by: Dave Richer <dave@imexsystems.ca>

client/src/utils/prompt.js

@@ -1,38 +1,44 @@
-import * as React from "react";
-import { useBeforeUnload, useBlocker } from "react-router-dom";
+import {useBeforeUnload, useBlocker} from "react-router-dom";
+import {useCallback, useEffect, useRef} from "react";
+function usePrompt(message, {beforeUnload} = {}) {
 
-function usePrompt(message, { beforeUnload } = {}) {
+    let blocker = useBlocker(
+        useCallback(
+            (location) => {
+                // This has been put in, so it does not affect transitions between the same page
+                if (location.currentLocation.pathname === location.nextLocation.pathname) {
+                    return false;
+                }
+                return typeof message === "string" ? !window.confirm(message) : false;
+            },
+            [message]
+        )
+    );
 
-let blocker = useBlocker(
-    React.useCallback(
-        () => (typeof message === "string" ? !window.confirm(message) : false),
-        [message]
-    )
-);
-let prevState = React.useRef(blocker.state);
+    let prevState = useRef(blocker.state);
 
-React.useEffect(() => {
-    if (blocker.state === "blocked") {
-        blocker.reset();
-    }
-    prevState.current = blocker.state;
-}, [blocker]);
+    useEffect(() => {
+        if (blocker.state === "blocked") {
+            blocker.reset();
+        }
+        prevState.current = blocker.state;
+    }, [blocker]);
 
-useBeforeUnload(
-    React.useCallback(
-        (event) => {
-            if (beforeUnload && typeof message === "string") {
-                event.preventDefault();
-                event.returnValue = message;
-            }
-        },
-        [message, beforeUnload]
-    ),
-    { capture: true }
-);
+    useBeforeUnload(
+        useCallback(
+            (event) => {
+                if (beforeUnload && typeof message === "string") {
+                    event.preventDefault();
+                    event.returnValue = message;
+                }
+            },
+            [message, beforeUnload]
+        ),
+        {capture: true}
+    );
 }
 
-function Prompt({ when, message, ...props }) {
+function Prompt({when, message, ...props}) {
     usePrompt(when ? message : false, props);
     return null;
 }