diff --git a/frontend/src/actions/auth.actions.js b/frontend/src/actions/auth.actions.js index 2a22de1..27011b5 100644 --- a/frontend/src/actions/auth.actions.js +++ b/frontend/src/actions/auth.actions.js @@ -18,14 +18,14 @@ export const LOGOUT_REQUEST = 'LOGOUT_REQUEST' export const LOGOUT_SUCCESS = 'LOGOUT_SUCCESS'; export const LOGOUT_FAILURE = 'LOGOUT_FAILURE'; -export function logout(username, password) { - return { type: LOGOUT_REQUEST, username, password } +export function logout() { + return { type: LOGOUT_REQUEST } } -export function logoutFailure(username, error) { - return { type: LOGOUT_FAILURE, username, error } +export function logoutFailure(error) { + return { type: LOGOUT_FAILURE, error } } -export function logoutSuccess(username) { - return { type: LOGOUT_SUCCESS, username } +export function logoutSuccess() { + return { type: LOGOUT_SUCCESS } } \ No newline at end of file diff --git a/frontend/src/app.js b/frontend/src/app.js index a67b5c6..fd6cf27 100644 --- a/frontend/src/app.js +++ b/frontend/src/app.js @@ -6,6 +6,7 @@ import HomePage from './pages/home'; import { ConnectedLoginPage as LoginPage } from './pages/login'; import DashBoardClient from './pages/DashBoardClient'; import DashBoardDev from './pages/DashBoardDev'; +import { ConnectedLogoutPage as LogoutPage } from './pages/logout'; class App extends Component { render () { @@ -14,6 +15,7 @@ class App extends Component { + diff --git a/frontend/src/pages/home.js b/frontend/src/pages/home.js index 4392a47..749f561 100644 --- a/frontend/src/pages/home.js +++ b/frontend/src/pages/home.js @@ -8,6 +8,7 @@ export default class HomePage extends React.PureComponent {

Bienvenue sur PleaseWait !

Le gestionnaire de ticket simplifié.

+ Se déconnecter
); diff --git a/frontend/src/pages/logout.js b/frontend/src/pages/logout.js new file mode 100644 index 0000000..b04ad75 --- /dev/null +++ b/frontend/src/pages/logout.js @@ -0,0 +1,30 @@ +import React, { useEffect } from 'react' +import { logout } from '../actions/auth.actions'; +import { connect } from 'react-redux'; +import { ConnectedPage as Page } from './page'; + +export function LogoutPage({ dispatch, isLoggedIn, history }) { + useEffect(() => { + dispatch(logout()); + }, []); + + useEffect(() => { + if (!isLoggedIn) history.push("/login"); + }, [isLoggedIn]); + + return ( + +
+
+ Déconnexion en cours... +
+
+
+ ) +} + +function mapStateToProps({ session }) { + return { isLoggedIn: session.isLoggedIn }; +} + +export const ConnectedLogoutPage = connect(mapStateToProps)(LogoutPage); \ No newline at end of file diff --git a/frontend/src/reducers/session.reducers.js b/frontend/src/reducers/session.reducers.js index 2d245a7..a709959 100644 --- a/frontend/src/reducers/session.reducers.js +++ b/frontend/src/reducers/session.reducers.js @@ -1,4 +1,4 @@ -import { LOGIN_SUCCESS } from "../actions/auth.actions"; +import { LOGIN_SUCCESS, LOGOUT_SUCCESS } from "../actions/auth.actions"; const initialState = { isLoggedIn: false, @@ -9,6 +9,8 @@ export function sessionReducer(state = initialState, action) { switch(action.type) { case LOGIN_SUCCESS: return handleLoginSuccess(state, action); + case LOGOUT_SUCCESS: + return handleLogoutSuccess(state, action); }; return state; } @@ -21,4 +23,12 @@ function handleLoginSuccess(state, action) { username: action.username, }, } +}; + +function handleLogoutSuccess(state, action) { + return { + ...state, + isLoggedIn: false, + user: null, + } }; \ No newline at end of file diff --git a/frontend/src/sagas/auth.sagas.js b/frontend/src/sagas/auth.sagas.js index f42bea7..e15d677 100644 --- a/frontend/src/sagas/auth.sagas.js +++ b/frontend/src/sagas/auth.sagas.js @@ -1,5 +1,5 @@ import { call, put } from 'redux-saga/effects'; -import { loginFailure, loginSuccess } from '../actions/auth.actions'; +import { loginFailure, loginSuccess, logoutFailure, logoutSuccess } from '../actions/auth.actions'; import { addMessage } from '../actions/message.actions'; export function* loginSaga(action) { @@ -34,4 +34,34 @@ function doLogin(username, password) { mode: 'cors', credentials: 'include' }).then(res => res.json()) +} + +export function* logoutSaga(action) { + let result; + try { + result = yield call(doLogout); + } catch(err) { + yield put(logoutFailure(err)); + yield put(addMessage('danger', "Une erreur inconnue bloque le fonctionnement normal de l'application. Veuillez réessayer plus tard.")); + } + + if ('error' in result) { + yield put(logoutFailure(action.username, result.error)); + const message = result.error.message ? result.error.message : result.error.toString(); + yield put(addMessage('danger', message)); + return + } + + yield put(logoutSuccess(action.username)); +} + +function doLogout() { + return fetch('http://localhost:8001/api/v1/logout', { + method: 'GET', + headers: { + 'Content-Type': 'application/json', + }, + mode: 'cors', + credentials: 'include' + }).then(res => res.json()) } \ No newline at end of file diff --git a/frontend/src/sagas/root.js b/frontend/src/sagas/root.js index 975d32c..845dc31 100644 --- a/frontend/src/sagas/root.js +++ b/frontend/src/sagas/root.js @@ -1,12 +1,13 @@ import { all, takeLatest } from 'redux-saga/effects'; -import { LOGIN_REQUEST } from '../actions/auth.actions'; -import { loginSaga} from './auth.sagas'; +import { LOGIN_REQUEST, LOGOUT_REQUEST } from '../actions/auth.actions'; +import { loginSaga, logoutSaga } from './auth.sagas'; import { PROJECT_USER_LIST, PROJECT_LIST } from '../actions/project'; import { projectUserListSaga, projectListSaga } from './project'; export default function* rootSaga() { yield all([ takeLatest(LOGIN_REQUEST, loginSaga), + takeLatest(LOGOUT_REQUEST, logoutSaga), takeLatest(PROJECT_USER_LIST, projectUserListSaga), takeLatest(PROJECT_LIST, projectListSaga), ]);