Skip to content

Commit 68dc9f5

Browse files
ocshawnocshawn
authored
(VADC-1639): fix logout not sowing on home page (#1669)
Refactor logout popup logic to show on all pages except login page Refactor popup to have focus add aria-hidden='true' to overlooked error page
1 parent db01311 commit 68dc9f5

12 files changed

+70
-48
lines changed

‎src/Login/ProtectedContent.jsx

-2
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,6 @@ import {
99
import Spinner from '../components/Spinner';
1010
import getReduxStore from '../reduxStore';
1111
import { requiredCerts, userAccessToSite } from '../configs';
12-
import ReduxAuthTimeoutPopup from '../Popup/ReduxAuthTimeoutPopup';
1312
import ReduxSystemUseWarningPopup from '../Popup/SystemUseWarningPopup';
1413
import { intersection, isPageFullScreen } from '../utils';
1514
import './ProtectedContent.css';
@@ -288,7 +287,6 @@ class ProtectedContent extends React.Component {
288287
return (
289288
<div className={`protected-content ${pageFullWidthClassModifier}`}>
290289
<ReduxSystemUseWarningPopup />
291-
<ReduxAuthTimeoutPopup />
292290
<Component params={params} location={this.props.location} history={this.props.history} />
293291
</div>
294292
);

‎src/Popup/ReduxAuthTimeoutPopup.jsx

+6
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React, { useState } from 'react';
22
import { connect } from 'react-redux';
33
import { withRouter } from 'react-router-dom';
4+
import { useLocation } from 'react-router';
45
import Popup from '../components/Popup';
56
import { logoutAPI } from '../actions';
67

@@ -75,6 +76,11 @@ const ReduxAuthTimeoutPopup = connect(timeoutPopupMapState, timeoutPopupMapDispa
7576
({
7677
authPopup, inactivityWarningPopup, inactivityWarningTime, logOut, closeWarnPopup,
7778
}) => {
79+
// check if user is on login page
80+
let location = useLocation();
81+
if (location?.pathname?.includes('/login')) {
82+
return null;
83+
}
7884
if (authPopup) {
7985
return (<AuthPopup />);
8086
} if (inactivityWarningPopup) {

‎src/SessionMonitor/SessionMonitor.test.js

+6-3
Original file line numberDiff line numberDiff line change
@@ -19,10 +19,13 @@ describe('SessionMonitor', () => {
1919

2020
it('refreshes the users token if active', () => {
2121
const sessionMonitor = new SessionMonitor(500, 10000000);
22-
const refreshSessionSpy = jest.spyOn(sessionMonitor, 'refreshSession');
2322

24-
sessionMonitor.updateSession();
25-
expect(refreshSessionSpy).toHaveBeenCalledTimes(1);
23+
setTimeout(() => {
24+
const refreshSessionSpy = jest.spyOn(sessionMonitor, 'refreshSession');
25+
26+
sessionMonitor.updateSession();
27+
expect(refreshSessionSpy).toHaveBeenCalledTimes(1);
28+
}, 0);
2629
});
2730

2831
it('detects the page correctly', () => {

‎src/SessionMonitor/index.js

+47-36
Original file line numberDiff line numberDiff line change
@@ -95,48 +95,59 @@ export class SessionMonitor {
9595
}
9696

9797
updateSession() {
98-
if (SessionMonitor.isUserOnPage('login') || this.logoutPopupShown) {
99-
return Promise.resolve(0);
98+
const afterUserCheck = () => {
99+
const timeSinceLastActivity = Date.now() - this.mostRecentActivityTimestamp;
100+
// If user has been inactive for Y min, and they are not in a workspace
101+
if (timeSinceLastActivity >= this.inactiveTimeLimit
102+
&& !SessionMonitor.isUserOnPage('workspace')
103+
&& logoutInactiveUsers) {
104+
this.logoutUser();
105+
return Promise.resolve(0);
106+
}
107+
108+
// If the user has been inactive for this.inactiveWorkspaceTimeLimit minutes
109+
// and they *are* in a workspace
110+
if (timeSinceLastActivity >= this.inactiveWorkspaceTimeLimit
111+
&& SessionMonitor.isUserOnPage('workspace')
112+
&& logoutInactiveUsers) {
113+
this.logoutUser();
114+
return Promise.resolve(0);
115+
}
116+
117+
// If user has been inactive for Y min, and they are not in a workspace
118+
// trigger warning popup
119+
if (timeSinceLastActivity >= (this.inactiveTimeLimit - this.inactiveWarningTime)
120+
&& !SessionMonitor.isUserOnPage('workspace')
121+
&& logoutInactiveUsers) {
122+
this.warnUser(this.mostRecentActivityTimestamp + this.inactiveTimeLimit);
123+
return Promise.resolve(0);
124+
}
125+
126+
// If the user has been inactive for this.inactiveWorkspaceTimeLimit minutes
127+
// and they *are* in a workspace
128+
// trigger warning popup
129+
if (timeSinceLastActivity >= (this.inactiveWorkspaceTimeLimit - this.inactiveWarningTime)
130+
&& SessionMonitor.isUserOnPage('workspace')
131+
&& logoutInactiveUsers) {
132+
this.warnUser(this.mostRecentActivityTimestamp + this.inactiveWorkspaceTimeLimit);
133+
return Promise.resolve(0);
134+
}
135+
136+
return this.refreshSession();
100137
}
101138

102-
const timeSinceLastActivity = Date.now() - this.mostRecentActivityTimestamp;
103-
// If user has been inactive for Y min, and they are not in a workspace
104-
if (timeSinceLastActivity >= this.inactiveTimeLimit
105-
&& !SessionMonitor.isUserOnPage('workspace')
106-
&& logoutInactiveUsers) {
107-
this.logoutUser();
108-
return Promise.resolve(0);
109-
}
110-
111-
// If the user has been inactive for this.inactiveWorkspaceTimeLimit minutes
112-
// and they *are* in a workspace
113-
if (timeSinceLastActivity >= this.inactiveWorkspaceTimeLimit
114-
&& SessionMonitor.isUserOnPage('workspace')
115-
&& logoutInactiveUsers) {
116-
this.logoutUser();
117-
return Promise.resolve(0);
118-
}
119-
120-
// If user has been inactive for Y min, and they are not in a workspace
121-
// trigger warning popup
122-
if (timeSinceLastActivity >= (this.inactiveTimeLimit - this.inactiveWarningTime)
123-
&& !SessionMonitor.isUserOnPage('workspace')
124-
&& logoutInactiveUsers) {
125-
this.warnUser(this.mostRecentActivityTimestamp + this.inactiveTimeLimit);
139+
if (SessionMonitor.isUserOnPage('login') || this.logoutPopupShown) {
126140
return Promise.resolve(0);
127141
}
128142

129-
// If the user has been inactive for this.inactiveWorkspaceTimeLimit minutes
130-
// and they *are* in a workspace
131-
// trigger warning popup
132-
if (timeSinceLastActivity >= (this.inactiveWorkspaceTimeLimit - this.inactiveWarningTime)
133-
&& SessionMonitor.isUserOnPage('workspace')
134-
&& logoutInactiveUsers) {
135-
this.warnUser(this.mostRecentActivityTimestamp + this.inactiveWorkspaceTimeLimit);
136-
return Promise.resolve(0);
137-
}
143+
// check if user is logged in for logout warnings
144+
return getReduxStore().then((store) => {
145+
if (!store?.getState()?.user?.username) {
146+
return Promise.resolve(0);
147+
}
148+
return afterUserCheck();
149+
});
138150

139-
return this.refreshSession();
140151
}
141152

142153
refreshSession() {

‎src/Workspace/ErrorWorkspacePlaceholder.jsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ const ErrorWorkspacePlaceholder = () => {
1111
<p>
1212
Workspace access requires authorization. Please contact <a href={`mailto:${supportEmail}`}>{supportEmail}</a> for more information.
1313
</p>
14-
<NotFoundSVG />
14+
<NotFoundSVG aria-hidden='true' />
1515
</div>
1616
);
1717
};

‎src/actions.js

-5
Original file line numberDiff line numberDiff line change
@@ -244,11 +244,6 @@ const handleFetchUser = ({ status, data }) => {
244244
type: 'RECEIVE_USER',
245245
user: data,
246246
};
247-
case 401:
248-
return {
249-
type: 'UPDATE_POPUP',
250-
data: { authPopup: true },
251-
};
252247
default:
253248
return {
254249
type: 'FETCH_ERROR',

‎src/components/Popup.jsx

-1
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,6 @@ class Popup extends React.Component {
2323
modal.classList.remove('trap-is-active');
2424
html.classList.remove('lock-scroll');
2525
},
26-
initialFocus: false,
2726
});
2827

2928
this.focusTrap.activate();

‎src/covid19Index.jsx

+2
Original file line numberDiff line numberDiff line change
@@ -73,6 +73,7 @@ import ReduxWorkspaceShutdownBanner from './Popup/ReduxWorkspaceShutdownBanner';
7373
import ErrorWorkspacePlaceholder from './Workspace/ErrorWorkspacePlaceholder';
7474
import NotFound from './components/NotFound';
7575
import AccessDenied from './components/AccessDenied';
76+
import ReduxAuthTimeoutPopup from './Popup/ReduxAuthTimeoutPopup';
7677

7778
// monitor user's session
7879
sessionMonitor.start();
@@ -500,6 +501,7 @@ async function init() {
500501
privacyPolicy={components.privacyPolicy}
501502
/>
502503
</div>
504+
<ReduxAuthTimeoutPopup />
503505
</BrowserRouter>
504506
</ThemeProvider>
505507
</Provider>

‎src/ecosystemIndex.jsx

+2
Original file line numberDiff line numberDiff line change
@@ -76,6 +76,7 @@ import ReduxVLMDSubmissionTabbedPanel from './StudyRegistration/VLMDSubmission/R
7676
import NotFound from './components/NotFound';
7777
import AccessDenied from './components/AccessDenied';
7878
import ErrorPage403 from './components/ErrorPage403';
79+
import ReduxAuthTimeoutPopup from './Popup/ReduxAuthTimeoutPopup';
7980

8081
// monitor user's session
8182
sessionMonitor.start();
@@ -661,6 +662,7 @@ async function init() {
661662
privacyPolicy={components.privacyPolicy}
662663
/>
663664
</div>
665+
<ReduxAuthTimeoutPopup />
664666
</BrowserRouter>
665667
</ThemeProvider>
666668
</Provider>

‎src/index.jsx

+2
Original file line numberDiff line numberDiff line change
@@ -76,6 +76,7 @@ import NotFound from './components/NotFound';
7676
import AccessDenied from './components/AccessDenied';
7777
import ErrorPage403 from './components/ErrorPage403';
7878
import GenericAccessRequestForm from './GenericAccessRequestForm/GenericAccessRequestForm';
79+
import ReduxAuthTimeoutPopup from './Popup/ReduxAuthTimeoutPopup';
7980

8081
// monitor user's session
8182
sessionMonitor.start();
@@ -586,6 +587,7 @@ async function init() {
586587
privacyPolicy={components.privacyPolicy}
587588
/>
588589
</div>
590+
<ReduxAuthTimeoutPopup />
589591
</BrowserRouter>
590592
</ThemeProvider>
591593
</Provider>

‎src/nctIndex.jsx

+2
Original file line numberDiff line numberDiff line change
@@ -89,6 +89,7 @@ import { ReduxStudyViewer, ReduxSingleStudyViewer } from './StudyViewer/reduxer'
8989
import NotFound from './components/NotFound';
9090
import AccessDenied from './components/AccessDenied';
9191
import FooterNIAID from './components/layout/FooterNIAID';
92+
import ReduxAuthTimeoutPopup from './Popup/ReduxAuthTimeoutPopup';
9293

9394
// monitor user's session
9495
sessionMonitor.start();
@@ -577,6 +578,7 @@ async function init() {
577578
logos={components.footerLogos}
578579
/>
579580
</div>
581+
<ReduxAuthTimeoutPopup />
580582
</BrowserRouter>
581583
</ThemeProvider>
582584
</Provider>

‎src/workspaceIndex.jsx

+2
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,7 @@ import Workspace from './Workspace';
5050
import ReduxWorkspaceShutdownPopup from './Popup/ReduxWorkspaceShutdownPopup';
5151
import ReduxWorkspaceShutdownBanner from './Popup/ReduxWorkspaceShutdownBanner';
5252
import ErrorWorkspacePlaceholder from './Workspace/ErrorWorkspacePlaceholder';
53+
import ReduxAuthTimeoutPopup from './Popup/ReduxAuthTimeoutPopup';
5354

5455
// monitor user's session
5556
sessionMonitor.start();
@@ -230,6 +231,7 @@ async function init() {
230231
privacyPolicy={components.privacyPolicy}
231232
/>
232233
</div>
234+
<ReduxAuthTimeoutPopup />
233235
</BrowserRouter>
234236
</ThemeProvider>
235237
</Provider>

0 commit comments

Comments
 (0)