From 7b6583f8d6a988c5e03a564308319a1fba1dc6b3 Mon Sep 17 00:00:00 2001 From: Ryan Mathis Date: Thu, 3 Jun 2021 10:05:46 -0700 Subject: [PATCH] Implemented session timeout modal --- .../main/resources/i18n/messages.properties | 3 +++ ui/public/index.html | 2 +- ui/src/app/App.js | 17 ++++++++---- ui/src/app/core/user/SessionModal.js | 27 +++++++++++++++++++ 4 files changed, 43 insertions(+), 6 deletions(-) create mode 100644 ui/src/app/core/user/SessionModal.js diff --git a/backend/src/main/resources/i18n/messages.properties b/backend/src/main/resources/i18n/messages.properties index 0d7787bb1..17781cbc9 100644 --- a/backend/src/main/resources/i18n/messages.properties +++ b/backend/src/main/resources/i18n/messages.properties @@ -524,6 +524,9 @@ message.invalid-regex-pattern=Invalid Regular Expression message.invalid-signing=Unless the response or the assertions are signed, SAML security is compromised and the service should reject the SAML response. (If it doesn\u0027t, investigate, as that is serious unless the HTTP-Artifact binding is in use.) +message.session-timeout-heading=Session timed out +message.session-timeout-body=Your session has timed out. Please login again. + tooltip.entity-id=Entity ID tooltip.service-provider-name=Service Provider Name (Dashboard Display Only) tooltip.force-authn=Disallows use (or reuse) of authentication results and login flows that don\u0027t provide a real-time proof of user presence in the login process diff --git a/ui/public/index.html b/ui/public/index.html index 6cdabfc57..95e30a725 100644 --- a/ui/public/index.html +++ b/ui/public/index.html @@ -2,7 +2,7 @@ - + Shibboleth IDP UI diff --git a/ui/src/app/App.js b/ui/src/app/App.js index dedc97b57..b7cc87f0d 100644 --- a/ui/src/app/App.js +++ b/ui/src/app/App.js @@ -25,10 +25,14 @@ import { NewSource } from './metadata/new/NewSource'; import { NewProvider } from './metadata/new/NewProvider'; import { Filter } from './metadata/Filter'; import { Contention } from './metadata/contention/ContentionContext'; +import { SessionModal } from './core/user/SessionModal'; +import Button from 'react-bootstrap/esm/Button'; function App() { + const [showTimeout, setShowTimeout] = React.useState(); + const httpOptions = { redirect: 'manual', interceptors: { @@ -37,13 +41,13 @@ function App() { return options; }, - /*response: async ({response}) => { + response: async ({response}) => { if (response.type === "opaqueredirect") { - // window.location.reload(); - } else { - return response; + setShowTimeout(true); } - }*/ + + return response; + } } }; @@ -53,6 +57,9 @@ function App() { + + + {(message, confirm, confirmCallback, setConfirm, getConfirmation) => diff --git a/ui/src/app/core/user/SessionModal.js b/ui/src/app/core/user/SessionModal.js new file mode 100644 index 000000000..88312e99b --- /dev/null +++ b/ui/src/app/core/user/SessionModal.js @@ -0,0 +1,27 @@ +import React from 'react'; + +import Modal from 'react-bootstrap/Modal'; + +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import { faExclamationTriangle } from '@fortawesome/free-solid-svg-icons'; +import Translate from '../../i18n/components/translate'; + +export function SessionModal({ show, children }) { + + return ( + <> + + Session timed out + + +

+ Your session has timed out. Please login again. +

+ + + {children} + + + + ); +} \ No newline at end of file