diff --git a/frontend/src/component/App.tsx b/frontend/src/component/App.tsx index d2293e5a30..3b2094721d 100644 --- a/frontend/src/component/App.tsx +++ b/frontend/src/component/App.tsx @@ -41,7 +41,6 @@ export const App = () => { const renderRoute = (route: any) => { if (route.type === 'protected') { const unauthorized = isUnauthorized(); - return ( { + const { pathname } = useLocation(); + const loginLink = + pathname.length > 1 ? `/login?redirect=${pathname}` : '/login'; return ( { if (unauthorized) { - return ; + return ; } else { return ; } diff --git a/frontend/src/component/user/Authentication/Authentication.tsx b/frontend/src/component/user/Authentication/Authentication.tsx index 4137ac2000..0e72bb345c 100644 --- a/frontend/src/component/user/Authentication/Authentication.tsx +++ b/frontend/src/component/user/Authentication/Authentication.tsx @@ -15,7 +15,10 @@ import ConditionallyRender from '../../common/ConditionallyRender'; import { Alert } from '@material-ui/lab'; import { useAuthDetails } from '../../../hooks/api/getters/useAuth/useAuthDetails'; -const Authentication = () => { +interface IAuthenticationProps { + redirect: string; +} +const Authentication = ({ redirect }: IAuthenticationProps) => { const { authDetails } = useAuthDetails(); const params = useQueryParams(); @@ -26,7 +29,7 @@ const Authentication = () => { if (authDetails.type === PASSWORD_TYPE) { content = ( <> - + } @@ -34,13 +37,13 @@ const Authentication = () => { ); } else if (authDetails.type === SIMPLE_TYPE) { - content = ; + content = ; } else if (authDetails.type === DEMO_TYPE) { - content = ; + content = ; } else if (authDetails.type === HOSTED_TYPE) { content = ( <> - + } diff --git a/frontend/src/component/user/DemoAuth/DemoAuth.jsx b/frontend/src/component/user/DemoAuth/DemoAuth.jsx index 718c137844..ffd4badd1a 100644 --- a/frontend/src/component/user/DemoAuth/DemoAuth.jsx +++ b/frontend/src/component/user/DemoAuth/DemoAuth.jsx @@ -10,7 +10,7 @@ import { useAuthUser } from '../../../hooks/api/getters/useAuth/useAuthUser'; import useToast from '../../../hooks/useToast'; import { formatUnknownError } from '../../../utils/format-unknown-error'; -const DemoAuth = ({ authDetails }) => { +const DemoAuth = ({ authDetails, redirect }) => { const [email, setEmail] = useState(''); const history = useHistory(); const { refetchUser } = useAuthUser(); @@ -23,7 +23,7 @@ const DemoAuth = ({ authDetails }) => { try { await emailAuth(authDetails.path, email); refetchUser(); - history.push(`/`); + history.push(redirect); } catch (error) { setToastApiError(formatUnknownError(error)); } @@ -91,6 +91,7 @@ const DemoAuth = ({ authDetails }) => { DemoAuth.propTypes = { authDetails: PropTypes.object.isRequired, + redirect: PropTypes.string.isRequired, }; export default DemoAuth; diff --git a/frontend/src/component/user/HostedAuth/HostedAuth.jsx b/frontend/src/component/user/HostedAuth/HostedAuth.jsx index ce75206ebf..79cac78a8a 100644 --- a/frontend/src/component/user/HostedAuth/HostedAuth.jsx +++ b/frontend/src/component/user/HostedAuth/HostedAuth.jsx @@ -18,7 +18,7 @@ import { LOGIN_PASSWORD_ID, } from '../../../testIds'; -const HostedAuth = ({ authDetails }) => { +const HostedAuth = ({ authDetails, redirect }) => { const commonStyles = useCommonStyles(); const styles = useStyles(); const { refetchUser } = useAuthUser(); @@ -55,7 +55,7 @@ const HostedAuth = ({ authDetails }) => { try { await passwordAuth(authDetails.path, username, password); refetchUser(); - history.push(`/`); + history.push(redirect); } catch (error) { if (error.statusCode === 404 || error.statusCode === 400) { setErrors(prev => ({ @@ -145,6 +145,7 @@ const HostedAuth = ({ authDetails }) => { HostedAuth.propTypes = { authDetails: PropTypes.object.isRequired, + redirect: PropTypes.string.isRequired, }; export default HostedAuth; diff --git a/frontend/src/component/user/Login/Login.tsx b/frontend/src/component/user/Login/Login.tsx index 4e7f266710..8ce7ec763c 100644 --- a/frontend/src/component/user/Login/Login.tsx +++ b/frontend/src/component/user/Login/Login.tsx @@ -15,9 +15,10 @@ const Login = () => { const { user } = useAuthUser(); const query = useQueryParams(); const resetPassword = query.get('reset') === 'true'; + const redirect = query.get('redirect') || '/'; if (user) { - return ; + return ; } return ( @@ -36,7 +37,7 @@ const Login = () => { condition={resetPassword} show={} /> - + ); diff --git a/frontend/src/component/user/PasswordAuth/PasswordAuth.jsx b/frontend/src/component/user/PasswordAuth/PasswordAuth.jsx index 3c2fbcc965..e705614fe3 100644 --- a/frontend/src/component/user/PasswordAuth/PasswordAuth.jsx +++ b/frontend/src/component/user/PasswordAuth/PasswordAuth.jsx @@ -19,7 +19,7 @@ import PasswordField from '../../common/PasswordField/PasswordField'; import { useAuthApi } from '../../../hooks/api/actions/useAuthApi/useAuthApi'; import { useAuthUser } from '../../../hooks/api/getters/useAuth/useAuthUser'; -const PasswordAuth = ({ authDetails }) => { +const PasswordAuth = ({ authDetails, redirect }) => { const commonStyles = useCommonStyles(); const styles = useStyles(); const history = useHistory(); @@ -56,7 +56,7 @@ const PasswordAuth = ({ authDetails }) => { try { await passwordAuth(authDetails.path, username, password); refetchUser(); - history.push(`/`); + history.push(redirect); } catch (error) { if (error.statusCode === 404 || error.statusCode === 400) { setErrors(prev => ({ @@ -168,6 +168,7 @@ const PasswordAuth = ({ authDetails }) => { PasswordAuth.propTypes = { authDetails: PropTypes.object.isRequired, + redirect: PropTypes.string.isRequired, }; export default PasswordAuth; diff --git a/frontend/src/component/user/SimpleAuth/SimpleAuth.jsx b/frontend/src/component/user/SimpleAuth/SimpleAuth.jsx index 95cbe4e413..c08835ee7c 100644 --- a/frontend/src/component/user/SimpleAuth/SimpleAuth.jsx +++ b/frontend/src/component/user/SimpleAuth/SimpleAuth.jsx @@ -9,7 +9,7 @@ import { LOGIN_BUTTON, LOGIN_EMAIL_ID } from '../../../testIds'; import useToast from '../../../hooks/useToast'; import { formatUnknownError } from '../../../utils/format-unknown-error'; -const SimpleAuth = ({ authDetails }) => { +const SimpleAuth = ({ authDetails, redirect }) => { const [email, setEmail] = useState(''); const { refetchUser } = useAuthUser(); const { emailAuth } = useAuthApi(); @@ -22,7 +22,7 @@ const SimpleAuth = ({ authDetails }) => { try { await emailAuth(authDetails.path, email); refetchUser(); - history.push(`/`); + history.push(redirect); } catch (error) { setToastApiError(formatUnknownError(error)); } @@ -80,6 +80,7 @@ const SimpleAuth = ({ authDetails }) => { SimpleAuth.propTypes = { authDetails: PropTypes.object.isRequired, + redirect: PropTypes.string.isRequired, }; export default SimpleAuth;