From af9ff7280efb0c66c4dad841cb8dc02679d3e11e Mon Sep 17 00:00:00 2001 From: Laurent Caouissin <38245508+laurentC35@users.noreply.github.com> Date: Fri, 16 Feb 2024 13:35:26 +0100 Subject: [PATCH] Feat logout modal (#542) * feat: logout modal Autologout: logout to currentPage and display Modal to reconnect * build: bumb version to 2.4.17-rc1 * build: bumb version to 2.4.17 --- package.json | 2 +- src/components/auth/hoc/hoc.js | 13 +++------ src/components/auth/hoc/index.js | 2 +- src/components/modals/logout/index.js | 1 + src/components/modals/logout/logout.js | 40 ++++++++++++++++++++++++++ src/components/router/router.js | 2 +- src/i18n/buttonMessage.js | 1 + src/i18n/errorMessage.js | 12 ++++++++ src/utils/oidc/index.js | 3 +- 9 files changed, 63 insertions(+), 13 deletions(-) create mode 100644 src/components/modals/logout/index.js create mode 100644 src/components/modals/logout/logout.js diff --git a/package.json b/package.json index 82894fea..c8e563a4 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "stromae", - "version": "2.4.16", + "version": "2.4.17", "description": "Web application for the management of questionnaires powered by Lunatic", "repository": { "type": "git", diff --git a/src/components/auth/hoc/hoc.js b/src/components/auth/hoc/hoc.js index f4dbbe2a..f03db1cd 100644 --- a/src/components/auth/hoc/hoc.js +++ b/src/components/auth/hoc/hoc.js @@ -1,21 +1,16 @@ +import { LogoutModal } from 'components/modals/logout'; import { useOidc } from 'utils/oidc'; -const secure = (WrappedComponent) => { +export const secure = (WrappedComponent) => { const Component = (props) => { const oidc = useOidc(); - const { isUserLoggedIn, login } = oidc; + const { isUserLoggedIn } = oidc; const { otherProps } = props; if (isUserLoggedIn) { return ; - } - login({ - doesCurrentHrefRequiresAuth: true, - }); - return null; + } else return ; }; return Component; }; - -export default secure; diff --git a/src/components/auth/hoc/index.js b/src/components/auth/hoc/index.js index b6d76923..4b32f93e 100644 --- a/src/components/auth/hoc/index.js +++ b/src/components/auth/hoc/index.js @@ -1 +1 @@ -export { default } from './hoc'; +export { secure } from './hoc'; diff --git a/src/components/modals/logout/index.js b/src/components/modals/logout/index.js new file mode 100644 index 00000000..d3358604 --- /dev/null +++ b/src/components/modals/logout/index.js @@ -0,0 +1 @@ +export { default as LogoutModal } from './logout'; diff --git a/src/components/modals/logout/logout.js b/src/components/modals/logout/logout.js new file mode 100644 index 00000000..ce98cc94 --- /dev/null +++ b/src/components/modals/logout/logout.js @@ -0,0 +1,40 @@ +import Dialog from '@material-ui/core/Dialog'; +import DialogActions from '@material-ui/core/DialogActions'; +import DialogContent from '@material-ui/core/DialogContent'; +import DialogContentText from '@material-ui/core/DialogContentText'; +import DialogTitle from '@material-ui/core/DialogTitle'; +import { buttonDictionary, errorDictionary } from 'i18n'; +import { useOidc } from 'utils/oidc'; +import { Button } from '../../designSystem'; + +const LogoutModal = () => { + const { isUserLoggedIn, login: oidcLogin } = useOidc(); + + const login = () => oidcLogin({ doesCurrentHrefRequiresAuth: true }); + + return ( + + + {errorDictionary.getErrorLogOffTitle} + + + + {errorDictionary.getErrorLogOffDetails1} + + + {errorDictionary.getErrorLogOffDetails2} + + + + + + + ); +}; + +export default LogoutModal; diff --git a/src/components/router/router.js b/src/components/router/router.js index 6c49069f..977cfa27 100644 --- a/src/components/router/router.js +++ b/src/components/router/router.js @@ -1,7 +1,7 @@ +import { secure } from 'components/auth/hoc'; import { Redirect, Route, Switch } from 'react-router-dom'; import { environment } from 'utils/read-env-vars'; import { READ_ONLY } from '../../utils/constants'; -import secure from '../auth/hoc/hoc'; import { OrchestratorManager } from '../orchestrator/manager'; import { Visualizer } from '../orchestrator/visualizer'; import { NotFound } from '../pages'; diff --git a/src/i18n/buttonMessage.js b/src/i18n/buttonMessage.js index bcd110f9..97bb168c 100644 --- a/src/i18n/buttonMessage.js +++ b/src/i18n/buttonMessage.js @@ -26,6 +26,7 @@ const buttonMessage = { en: `Go to the first page`, }, visualize: { fr: `Visualiser`, en: `Visualize` }, + reconnect: { fr: `Se reconnecter`, en: `Reconnect` }, }; export default buttonMessage; diff --git a/src/i18n/errorMessage.js b/src/i18n/errorMessage.js index 11fa4cd0..fa53293b 100644 --- a/src/i18n/errorMessage.js +++ b/src/i18n/errorMessage.js @@ -1,4 +1,16 @@ const errorMessage = { + getErrorLogOffTitle: { + fr: 'Vous avez été déconnecté', + en: 'You have been logged out', + }, + getErrorLogOffDetails1: { + fr: 'Pour des raisons de sécurité, vous avez été déconnecté pour inactivité.', + en: 'For security reasons, you have been logged out for inactivity.', + }, + getErrorLogOffDetails2: { + fr: 'Pour continuer à remplir le questionnaire, veuillez vous reconnecter.', + en: 'To continue completing the questionnaire, please log in again..', + }, getError401: { fr: 'Vous semblez avoir été déconnecté.', en: 'Changing the sequence', diff --git a/src/utils/oidc/index.js b/src/utils/oidc/index.js index 59fcaaad..e73820c8 100644 --- a/src/utils/oidc/index.js +++ b/src/utils/oidc/index.js @@ -35,6 +35,7 @@ const dummyOidc = { refreshTokenExpirationTime: null, accessTokenExpirationTime: Date.now() + 60 * 60 * 1000, }, + login: () => window.location.reload(), getTokens: () => ({ accessToken: null, idToken: null, @@ -83,7 +84,7 @@ prOidc.then((oidc) => { clearTimeout(timer); timer = setTimeout(async () => { - await oidc.logout({ redirectTo: 'specific url', url: getLogoutUrl() }); + await oidc.logout({ redirectTo: 'current page' }); }, getDelayExpriationinMs()); };