From 0ff42e9f27e97da20ceb540b8d95546a86a31c20 Mon Sep 17 00:00:00 2001
From: Pablo Roncero Fernandez <pablo.roncero.fernandez@cern.ch>
Date: Mon, 4 May 2020 18:56:51 +0200
Subject: [PATCH] Add logout button
---
.env | 1 +
.env.dev | 1 +
src/App.js | 2 ++
src/auth/actions/Logout.js | 13 +------------
src/auth/pages/logoutPage/LogoutPage.js | 18 ++++++++++++++++++
src/auth/pages/redirectPage/RedirectPage.js | 2 +-
src/auth/reducers/index.js | 4 ++--
src/auth/routes/index.js | 8 ++++++--
.../components/CERNToolBar/CERNToolBar.js | 7 +++----
src/common/reducers/SnackbarReducer.js | 1 -
10 files changed, 35 insertions(+), 22 deletions(-)
create mode 100644 src/auth/pages/logoutPage/LogoutPage.js
diff --git a/.env b/.env
index e075f4ca..afa6db66 100644
--- a/.env
+++ b/.env
@@ -2,4 +2,5 @@ REACT_APP_BASE_URL=https://localhost:8080/api
REACT_APP_OAUTH_CLIENT_ID=push-notifications
REACT_APP_AUTHORIZATION_URL=https://auth.cern.ch/auth/realms/cern/protocol/openid-connect/auth
REACT_APP_OAUTH_REDIRECT_URL=https://localhost:3000/redirect
+REACT_APP_OAUTH_LOGOUT_URL=https://localhost:3000/logout
REACT_APP_NODE_TLS_REJECT_UNAUTHORIZED=0
\ No newline at end of file
diff --git a/.env.dev b/.env.dev
index e47ddc12..ef9fdf72 100644
--- a/.env.dev
+++ b/.env.dev
@@ -2,3 +2,4 @@ REACT_APP_BASE_URL=https://test-notifications-service.web.cern.ch/api
REACT_APP_OAUTH_CLIENT_ID=push-notifications
REACT_APP_AUTHORIZATION_URL=https://auth.cern.ch/auth/realms/cern/protocol/openid-connect/auth
REACT_APP_OAUTH_REDIRECT_URL=https://test-notifications-service.web.cern.ch/redirect
+REACT_APP_OAUTH_LOGOUT_URL=https://test-notifications-service.web.cern.ch/logout
\ No newline at end of file
diff --git a/src/App.js b/src/App.js
index 4057e105..f8081ce9 100644
--- a/src/App.js
+++ b/src/App.js
@@ -6,6 +6,7 @@ import LoginPageContainer from "auth/containers/pages/LoginPageContainer";
import RedirectPageContainer from "auth/containers/pages/RedirectPageContainer";
import * as authRoutes from "auth/routes";
import MainPageContainer from "./common/containers/pages/MainPageContainer";
+import LogoutPage from "./auth/pages/logoutPage/LogoutPage";
const NoMatch = ({ location }) => (
<div>
@@ -30,6 +31,7 @@ class App extends Component {
path={authRoutes.loginRoute.path}
component={LoginPageContainer}
/>
+ <Route path={authRoutes.logoutRoute.path} component={LogoutPage} />
<Redirect to="/main/channels" />
</Switch>
);
diff --git a/src/auth/actions/Logout.js b/src/auth/actions/Logout.js
index c9d4add1..d5b079fc 100644
--- a/src/auth/actions/Logout.js
+++ b/src/auth/actions/Logout.js
@@ -1,16 +1,5 @@
-import { RSAA } from "redux-api-middleware";
-import { withAuth } from "auth/utils/authUtils";
-
export const LOGOUT = "LOGOUT_REQUEST";
-export const LOGOUT_SUCCESS = "LOGOUT_SUCCESS";
-export const LOGOUT_FAILURE = "LOGOUT_FAILURE";
export const logout = () => ({
- [RSAA]: {
- endpoint: `https://authorization-service-api.web.cern.ch/api/v1.0/Identity/logout`,
- method: "POST",
- credentials: "include",
- headers: withAuth({ "Content-Type": "application/json" }),
- types: [LOGOUT, LOGOUT_SUCCESS, LOGOUT_FAILURE],
- },
+ type: LOGOUT,
});
diff --git a/src/auth/pages/logoutPage/LogoutPage.js b/src/auth/pages/logoutPage/LogoutPage.js
new file mode 100644
index 00000000..611af7a8
--- /dev/null
+++ b/src/auth/pages/logoutPage/LogoutPage.js
@@ -0,0 +1,18 @@
+import React from "react";
+import { Redirect } from "react-router-dom";
+import { bindActionCreators } from "redux";
+import { connect } from "react-redux";
+import * as logoutActionCreators from "../../actions/Logout";
+
+const LogoutPage = ({ logout }) => {
+ logout();
+ return <Redirect to="/main/channels" />;
+};
+
+const mapStateToProps = (state) => ({});
+
+const mapDispatchToProps = (dispatch) => ({
+ ...bindActionCreators(logoutActionCreators, dispatch),
+});
+
+export default connect(mapStateToProps, mapDispatchToProps)(LogoutPage);
diff --git a/src/auth/pages/redirectPage/RedirectPage.js b/src/auth/pages/redirectPage/RedirectPage.js
index 9d080c54..222a45be 100644
--- a/src/auth/pages/redirectPage/RedirectPage.js
+++ b/src/auth/pages/redirectPage/RedirectPage.js
@@ -15,7 +15,7 @@ class RedirectPage extends Component {
render() {
if (this.props.isAuthenticated) {
- return <Redirect to={notificationsRoute.path} />;
+ return <Redirect to="/main/channels" />;
}
return <Redirect to={authRoutes.loginRoute.path} />;
}
diff --git a/src/auth/reducers/index.js b/src/auth/reducers/index.js
index 6d361485..b554d198 100644
--- a/src/auth/reducers/index.js
+++ b/src/auth/reducers/index.js
@@ -5,7 +5,7 @@ import {
REFRESH_TOKEN_SUCCESS,
REFRESH_TOKEN_FAILURE,
} from "auth/actions/RefreshToken";
-import { LOGOUT_SUCCESS } from "../actions/Logout";
+import { LOGOUT } from "../actions/Logout";
const initialState = {
loggedIn: isAuthenticated(),
@@ -61,7 +61,7 @@ export default (state = initialState, action) => {
non_field_errors: action.payload.statusText,
},
};
- case LOGOUT_SUCCESS:
+ case LOGOUT:
sessionStorage.removeItem("accessToken");
sessionStorage.removeItem("refreshToken");
return {
diff --git a/src/auth/routes/index.js b/src/auth/routes/index.js
index 36e61b8e..8162db4f 100644
--- a/src/auth/routes/index.js
+++ b/src/auth/routes/index.js
@@ -1,7 +1,11 @@
export const loginRoute = {
- path: "/login"
+ path: "/login",
};
export const redirectRoute = {
- path: "/redirect"
+ path: "/redirect",
+};
+
+export const logoutRoute = {
+ path: "/logout",
};
diff --git a/src/common/components/CERNToolBar/CERNToolBar.js b/src/common/components/CERNToolBar/CERNToolBar.js
index eedcc57f..b093c3a6 100644
--- a/src/common/components/CERNToolBar/CERNToolBar.js
+++ b/src/common/components/CERNToolBar/CERNToolBar.js
@@ -66,14 +66,13 @@ const CERNToolBarAuthenticated = ({ logout }) => {
{getDecodedToken().cern_upn} (CERN)
</a>{" "}
</span>
- <button
+ <a
className="cern-signout"
- type="button"
- onClick={() => logout()}
title="Sign out of your account"
+ href={`https://auth.cern.ch/auth/realms/cern/protocol/openid-connect/logout?redirect_uri=${process.env.REACT_APP_OAUTH_LOGOUT_URL}`}
>
Sign out
- </button>
+ </a>
</li>
<li>
<a
diff --git a/src/common/reducers/SnackbarReducer.js b/src/common/reducers/SnackbarReducer.js
index 6c5a2782..c7aeb1ec 100644
--- a/src/common/reducers/SnackbarReducer.js
+++ b/src/common/reducers/SnackbarReducer.js
@@ -15,7 +15,6 @@ const processHideSnackbar = (snackbars, index) => {
};
export default (state = INITIAL_STATE, action) => {
- console.log(action.type);
switch (action.type) {
case SHOW_SNACKBAR:
return processShowSnackbar(state, action.message, action.variant);
--
GitLab