diff --git a/frontend/src/components/button/index.tsx b/frontend/src/components/button/index.tsx index f77b51e6dbe80e187e7e9fd9732a26b6ec571e63..b54d948f64d79c2f5a22365fdade163e540c5b18 100644 --- a/frontend/src/components/button/index.tsx +++ b/frontend/src/components/button/index.tsx @@ -3,16 +3,21 @@ import { Button } from '@mui/material' interface IHrefButton { to: string + onClick?: () => {} children: React.ReactNode } -function HrefButton({ to, children }: IHrefButton) { +function HrefButton({ to, onClick, children }: IHrefButton) { return ( - <Button variant="contained" href={to} color="secondary"> + <Button variant="contained" href={to} color="secondary" onClick={onClick}> {children} </Button> ) } +HrefButton.defaultProps = { + onClick: () => {}, +} + // eslint-disable-next-line import/prefer-default-export export { HrefButton } diff --git a/frontend/src/components/loginBox/index.tsx b/frontend/src/components/loginBox/index.tsx index b7e0246c38705717c22f0ba32fab6d7a81f702e2..a00163338bf050c702478e5125033641511fb276 100644 --- a/frontend/src/components/loginBox/index.tsx +++ b/frontend/src/components/loginBox/index.tsx @@ -23,9 +23,16 @@ interface LoginBoxProps { info: string manual?: boolean large?: boolean + onClickLogin?: () => any } -const LoginBox = ({ header, info, manual, large }: LoginBoxProps) => { +const LoginBox = ({ + header, + info, + manual, + large, + onClickLogin, +}: LoginBoxProps) => { const { t } = useTranslation('login') return ( <StyledBox @@ -62,7 +69,7 @@ const LoginBox = ({ header, info, manual, large }: LoginBoxProps) => { gap: '16px', }} > - <HrefButton to="/oidc/authenticate/"> + <HrefButton to="/oidc/authenticate/" onClick={onClickLogin}> <Box sx={{ margin: '0 2rem 0 2rem', textTransform: 'none' }}> {t('login')} </Box> @@ -81,5 +88,5 @@ const LoginBox = ({ header, info, manual, large }: LoginBoxProps) => { </StyledBox> ) } -LoginBox.defaultProps = { manual: false, large: false } +LoginBox.defaultProps = { manual: false, large: false, onClickLogin: {} } export default LoginBox diff --git a/frontend/src/routes/invite/index.tsx b/frontend/src/routes/invite/index.tsx index 206700fcec11bfb8786be7c8c909f17dd28f386a..9373c224fc669c8cc9f20cbdbad60efb3526d050 100644 --- a/frontend/src/routes/invite/index.tsx +++ b/frontend/src/routes/invite/index.tsx @@ -4,13 +4,19 @@ import Page from 'components/page' import Loading from 'components/loading' import { useUserContext } from 'contexts' -import { submitJsonOpts } from 'utils' +import { setCookie, submitJsonOpts } from 'utils' import LoginBox from 'components/loginBox' import { Box, Container } from '@mui/material' function ChooseRegistrationMethod() { const { t } = useTranslation(['invite']) + // If the user clicks on login using Feide we want him to be sent to the + // guest register page afterwards + const setCookieLogin = () => { + setCookie('redirect', '/guestregister') + } + return ( <Page> <Container @@ -26,7 +32,7 @@ function ChooseRegistrationMethod() { <Box sx={{ fontSize: '1rem', marginBottom: '2rem' }}> {t('description')} </Box> - <LoginBox header={t('guest')} info={t('guestInfo')} manual large /> + <LoginBox header={t('guest')} info={t('guestInfo')} manual large onClickLogin={setCookieLogin}/> </Container> </Page> )