From 0bd880040202dbbaf1e0ddeda9615f4379888031 Mon Sep 17 00:00:00 2001
From: Robert Long <robert@robertlong.me>
Date: Mon, 9 Aug 2021 18:38:19 -0700
Subject: [PATCH] Redirect after login

---
 src/App.jsx                       | 33 ++++++++++++++++++-----
 src/ConferenceCallManagerHooks.js | 12 +++++++--
 src/LoginOrRegister.jsx           | 44 +++++++++++++++++++++++--------
 3 files changed, 69 insertions(+), 20 deletions(-)

diff --git a/src/App.jsx b/src/App.jsx
index fdeebce5..fb5e3c34 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -20,6 +20,7 @@ import {
   Switch,
   Route,
   Redirect,
+  useLocation,
 } from "react-router-dom";
 import { useConferenceCallManager } from "./ConferenceCallManagerHooks";
 import { JoinOrCreateRoom } from "./JoinOrCreateRoom";
@@ -48,16 +49,34 @@ export default function App() {
                 <LoginOrRegister onRegister={register} onLogin={login} />
               )}
             </Route>
-            <Route path="/room/:roomId">
-              {!authenticated ? (
-                <Redirect to="/" />
-              ) : (
-                <Room manager={manager} />
-              )}
-            </Route>
+            <AuthenticatedRoute
+              authenticated={authenticated}
+              path="/room/:roomId"
+            >
+              <Room manager={manager} />
+            </AuthenticatedRoute>
           </Switch>
         )}
       </div>
     </Router>
   );
 }
+
+function AuthenticatedRoute({ authenticated, children, ...rest }) {
+  const location = useLocation();
+
+  return (
+    <Route {...rest}>
+      {authenticated ? (
+        children
+      ) : (
+        <Redirect
+          to={{
+            pathname: "/",
+            state: { from: location },
+          }}
+        />
+      )}
+    </Route>
+  );
+}
diff --git a/src/ConferenceCallManagerHooks.js b/src/ConferenceCallManagerHooks.js
index d10b7bff..5b029abb 100644
--- a/src/ConferenceCallManagerHooks.js
+++ b/src/ConferenceCallManagerHooks.js
@@ -63,7 +63,7 @@ export function useConferenceCallManager(homeserverUrl) {
       });
   }, []);
 
-  const login = useCallback(async (username, password) => {
+  const login = useCallback(async (username, password, cb) => {
     setState((prevState) => ({
       ...prevState,
       authenticated: false,
@@ -78,6 +78,10 @@ export function useConferenceCallManager(homeserverUrl) {
           authenticated: true,
           error: undefined,
         });
+
+        if (cb) {
+          cb();
+        }
       })
       .catch((err) => {
         console.error(err);
@@ -91,7 +95,7 @@ export function useConferenceCallManager(homeserverUrl) {
       });
   }, []);
 
-  const register = useCallback(async (username, password) => {
+  const register = useCallback(async (username, password, cb) => {
     setState((prevState) => ({
       ...prevState,
       authenticated: false,
@@ -106,6 +110,10 @@ export function useConferenceCallManager(homeserverUrl) {
           authenticated: true,
           error: undefined,
         });
+
+        if (cb) {
+          cb();
+        }
       })
       .catch((err) => {
         console.error(err);
diff --git a/src/LoginOrRegister.jsx b/src/LoginOrRegister.jsx
index eb830f8c..29251759 100644
--- a/src/LoginOrRegister.jsx
+++ b/src/LoginOrRegister.jsx
@@ -15,25 +15,47 @@ limitations under the License.
 */
 
 import React, { useCallback, useRef } from "react";
+import { useHistory, useLocation } from "react-router-dom";
 
 export function LoginOrRegister({ onRegister, onLogin }) {
   const registerUsernameRef = useRef();
   const registerPasswordRef = useRef();
   const loginUsernameRef = useRef();
   const loginPasswordRef = useRef();
+  const history = useHistory();
+  const location = useLocation();
 
-  const onSubmitRegisterForm = useCallback((e) => {
-    e.preventDefault();
-    onRegister(
-      registerUsernameRef.current.value,
-      registerPasswordRef.current.value
-    );
-  });
+  const onSubmitRegisterForm = useCallback(
+    (e) => {
+      e.preventDefault();
+      onRegister(
+        registerUsernameRef.current.value,
+        registerPasswordRef.current.value,
+        () => {
+          if (location.state && location.state.from) {
+            history.replace(location.state.from);
+          }
+        }
+      );
+    },
+    [onRegister, location, history]
+  );
 
-  const onSubmitLoginForm = useCallback((e) => {
-    e.preventDefault();
-    onLogin(loginUsernameRef.current.value, loginPasswordRef.current.value);
-  });
+  const onSubmitLoginForm = useCallback(
+    (e) => {
+      e.preventDefault();
+      onLogin(
+        loginUsernameRef.current.value,
+        loginPasswordRef.current.value,
+        () => {
+          if (location.state && location.state.from) {
+            history.replace(location.state.from);
+          }
+        }
+      );
+    },
+    [onLogin, location, history]
+  );
 
   return (
     <div className="page">