From 20c4ccc1ff517117a8c4dde892ee7782074f3a5b Mon Sep 17 00:00:00 2001 From: Paulo Gustavo Veiga Date: Tue, 6 Feb 2024 22:28:17 -0800 Subject: [PATCH] Fix logout. --- packages/webapp/src/classes/client/index.ts | 2 +- .../src/classes/client/mock-client/index.ts | 3 +++ .../src/classes/client/rest-client/index.ts | 10 +++++++- .../maps-page/account-menu/index.tsx | 12 ++++++--- .../components/maps-page/maps-list/index.tsx | 1 + packages/webapp/webpack.dev.js | 3 --- yarn.lock | 25 +++++++++++++++++++ 7 files changed, 48 insertions(+), 8 deletions(-) diff --git a/packages/webapp/src/classes/client/index.ts b/packages/webapp/src/classes/client/index.ts index 0f2ac7f3..c25c3c9c 100644 --- a/packages/webapp/src/classes/client/index.ts +++ b/packages/webapp/src/classes/client/index.ts @@ -91,7 +91,7 @@ export type ForgotPasswordResult = { interface Client { login(auth: JwtAuth): Promise; - + logout(): Promise; deleteAccount(): Promise; importMap(model: ImportMapInfo): Promise; createMap(map: BasicMapInfo): Promise; diff --git a/packages/webapp/src/classes/client/mock-client/index.ts b/packages/webapp/src/classes/client/mock-client/index.ts index 5610e0f3..d9fe56e0 100644 --- a/packages/webapp/src/classes/client/mock-client/index.ts +++ b/packages/webapp/src/classes/client/mock-client/index.ts @@ -128,6 +128,9 @@ class MockClient implements Client { this.labels = [label1, label2, label3]; } + logout(): Promise { + return Promise.resolve(); + } login(auth: JwtAuth): Promise { const cookies = new Cookies(); diff --git a/packages/webapp/src/classes/client/rest-client/index.ts b/packages/webapp/src/classes/client/rest-client/index.ts index 153a80ce..eaba553b 100644 --- a/packages/webapp/src/classes/client/rest-client/index.ts +++ b/packages/webapp/src/classes/client/rest-client/index.ts @@ -25,7 +25,7 @@ export default class RestClient implements Client { response?: AxiosResponse; }): Promise<{ response?: AxiosResponse }> => { // TODO: Improve session timeout response and response handling - if (error.response && error.response.status === 405) { + if (error.response && (error.response.status === 405 || error.response.status === 403)) { this.sessionExpired(); } return Promise.reject(error); @@ -63,6 +63,14 @@ export default class RestClient implements Client { ); } + logout(): Promise { + // Set jwt token on cookie ... + const cookies = new Cookies(); + cookies.remove('jwt-auth-token', { path: '/' }); + + return Promise.resolve(); + } + login(model: JwtAuth): Promise { const handler = (success: () => void, reject: (error: ErrorInfo) => void) => { this.axios diff --git a/packages/webapp/src/components/maps-page/account-menu/index.tsx b/packages/webapp/src/components/maps-page/account-menu/index.tsx index 8281712a..c73327a8 100644 --- a/packages/webapp/src/components/maps-page/account-menu/index.tsx +++ b/packages/webapp/src/components/maps-page/account-menu/index.tsx @@ -13,12 +13,18 @@ import ChangePasswordDialog from './change-password-dialog'; import LockOpenOutlined from '@mui/icons-material/LockOpenOutlined'; import Link from '@mui/material/Link'; import ExitToAppOutlined from '@mui/icons-material/ExitToAppOutlined'; +import { activeInstance } from '../../../redux/clientSlice'; +import { useSelector } from 'react-redux'; +import Client from '../../../classes/client'; +import { useNavigate } from 'react-router-dom'; type ActionType = 'change-password' | 'account-info' | undefined; const AccountMenu = (): React.ReactElement => { const [anchorEl, setAnchorEl] = React.useState(null); const open = Boolean(anchorEl); const [action, setAction] = React.useState(undefined); + const client: Client = useSelector(activeInstance); + const navigate = useNavigate(); const handleMenu = (event: React.MouseEvent) => { setAnchorEl(event.currentTarget); @@ -30,8 +36,9 @@ const AccountMenu = (): React.ReactElement => { const handleLogout = (event: React.MouseEvent) => { event.preventDefault(); - const elem = document.getElementById('logoutFrom') as HTMLFormElement; - elem.submit(); + + client.logout(); + navigate('/c/login'); }; const account = useFetchAccount(); @@ -85,7 +92,6 @@ const AccountMenu = (): React.ReactElement => { )} -
handleLogout(e)}> diff --git a/packages/webapp/src/components/maps-page/maps-list/index.tsx b/packages/webapp/src/components/maps-page/maps-list/index.tsx index a7be7ee2..7defb666 100644 --- a/packages/webapp/src/components/maps-page/maps-list/index.tsx +++ b/packages/webapp/src/components/maps-page/maps-list/index.tsx @@ -372,6 +372,7 @@ export const MapsList = (props: MapsListProps): React.ReactElement => { ); const handleStarred = (event: React.MouseEvent, id: number) => { + event.stopPropagation(); event.preventDefault(); starredMultation.mutate(id); }; diff --git a/packages/webapp/webpack.dev.js b/packages/webapp/webpack.dev.js index 1a05b32a..1c172474 100644 --- a/packages/webapp/webpack.dev.js +++ b/packages/webapp/webpack.dev.js @@ -17,9 +17,6 @@ module.exports = merge(common, { protocol: 'http:', port: 8080 }, - pathRewrite: { - '^/api': '' - } }, }, historyApiFallback: { diff --git a/yarn.lock b/yarn.lock index f57536d2..d04f3fad 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4965,6 +4965,13 @@ __metadata: languageName: node linkType: hard +"@types/cookie@npm:^0.6.0": + version: 0.6.0 + resolution: "@types/cookie@npm:0.6.0" + checksum: 5edce7995775b0b196b142883e4d4f71fd93c294eaec973670f1fa2540b70ea7390408ed513ddefef5fcb12a578100c76596e8f2a714b0c2ae9f70ee773f4510 + languageName: node + linkType: hard + "@types/cypress-image-snapshot@npm:^3.1.6": version: 3.1.6 resolution: "@types/cypress-image-snapshot@npm:3.1.6" @@ -6247,6 +6254,7 @@ __metadata: react-redux: ^7.2.2 react-router-dom: ^6.4.3 styled-components: ^5.3.6 + universal-cookie: ^7.0.2 languageName: unknown linkType: soft @@ -8883,6 +8891,13 @@ __metadata: languageName: node linkType: hard +"cookie@npm:^0.6.0": + version: 0.6.0 + resolution: "cookie@npm:0.6.0" + checksum: f56a7d32a07db5458e79c726b77e3c2eff655c36792f2b6c58d351fb5f61531e5b1ab7f46987150136e366c65213cbe31729e02a3eaed630c3bf7334635fb410 + languageName: node + linkType: hard + "copy-concurrently@npm:^1.0.0": version: 1.0.5 resolution: "copy-concurrently@npm:1.0.5" @@ -21904,6 +21919,16 @@ __metadata: languageName: node linkType: hard +"universal-cookie@npm:^7.0.2": + version: 7.0.2 + resolution: "universal-cookie@npm:7.0.2" + dependencies: + "@types/cookie": ^0.6.0 + cookie: ^0.6.0 + checksum: c2c20cc4918fae7c912e2e154e4bed33a8a150685fec737cfe62d89b95b19be1658c3224b9d523a9269a9c5571c5ad5eb702b9db04c0544ea1061925289d82d2 + languageName: node + linkType: hard + "universal-user-agent@npm:^6.0.0": version: 6.0.0 resolution: "universal-user-agent@npm:6.0.0"