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() {
)}
-
- {!authenticated ? (
-
- ) : (
-
- )}
-
+
+
+
)}
);
}
+
+function AuthenticatedRoute({ authenticated, children, ...rest }) {
+ const location = useLocation();
+
+ return (
+
+ {authenticated ? (
+ children
+ ) : (
+
+ )}
+
+ );
+}
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 (