Progress

client/src/utils/private-route.js

@@ -1,18 +1,17 @@
 import React from "react";
-import { Redirect, Route, useLocation } from "react-router-dom";
+import { useNavigate, Route, useLocation } from "react-router-dom";
 
 function PrivateRoute({ component: Component, isAuthorized, ...rest }) {
   const location = useLocation();
+    const navigate = useNavigate();
 
+  if (!isAuthorized) {
+    navigate(`/signin?redirect=${location.pathname}`);
+  }
   return (
     <Route
       {...rest}
-      render={(props) =>
-        isAuthorized === true ? (
-          <Component {...props} />
-        ) : (
-          <Redirect to={`/signin?redirect=${location.pathname}`} />
-        )
+      render={(props) => <Component {...props} />
       }
     />
   );

client/src/utils/prompt.js

@@ -0,0 +1,18 @@
+import { unstable_usePrompt as useBlocker } from 'react-router-dom'
+
+function Prompt(props) {
+    const block = props.when
+
+    useBlocker(() => {
+        if (block) {
+            return ! window.confirm(props.message)
+        }
+        return false
+    })
+
+    return (
+        <div key={block}/>
+    )
+}
+
+export default Prompt