Skip to content

Commit 422aa85

Browse files
oharstaoharsta
committed
https://github.com/OpenConext/OpenConext-access/pull/474
1 parent 8a429c9 commit 422aa85

18 files changed

Lines changed: 136 additions & 66 deletions

‎client/src/components/AuthorizedHeader.jsx‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,26 @@ import React from "react";
22
import "./AuthorizedHeader.scss";
33
import {BreadCrumb} from "./BreadCrumb.jsx";
44
import {UserMenu} from "./UserMenu.jsx";
5+
import {useLocation} from "react-router-dom";
6+
import {Button, ButtonType} from "@surfnet/sds";
7+
import {useLogout} from "../hooks/UseLogout.jsx";
8+
import I18n from "../locale/I18n.js";
59

610
export const AuthorizedHeader = ({setIsAuthenticated}) => {
711

12+
const currentLocation = useLocation();
13+
const logoutUser = useLogout();
14+
15+
if (currentLocation.pathname === "/landing") {
16+
return (
17+
<div className="guest-authorized-header">
18+
<Button onClick={() => logoutUser(null, setIsAuthenticated)}
19+
txt={I18n.t("landing.header.logout")}
20+
type={ButtonType.Secondary}
21+
/>
22+
</div>)
23+
}
24+
825
return (
926
<div className="authorized-header">
1027
<BreadCrumb/>

‎client/src/components/AuthorizedHeader.scss‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,4 +19,14 @@
1919
}
2020
}
2121
}
22+
}
23+
24+
.guest-authorized-header {
25+
display: flex;
26+
align-items: center;
27+
width: 100%;
28+
29+
button {
30+
margin: 25px 60px 0 auto;
31+
}
2232
}

‎client/src/components/SharedMenu.jsx‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ export const SharedMenu = () => {
2323

2424
const navigate = useNavigate();
2525
const currentLocation = useLocation();
26-
console.log(currentLocation.href)
26+
2727
const filteredMenuGroups = useMemo(() => {
2828
return allMenuGroups
2929
.map(menuGroup => ({
@@ -53,6 +53,10 @@ export const SharedMenu = () => {
5353
}));
5454
}
5555

56+
if (currentLocation.pathname === "/landing") {
57+
return null;
58+
}
59+
5660
const isPendingApproval = currentOrganization.status === ORGANIZATION_STATUSES.PENDING_APPROVAL;
5761
return (
5862
<NavigationMenu

‎client/src/components/UserMenu.jsx‎

Lines changed: 6 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,13 @@ import I18n from "../locale/I18n";
22
import React, {useState} from "react";
33
import "./UserMenu.scss";
44
import {Link, useNavigate} from "react-router-dom";
5-
import {isEmpty, stopEvent} from "../utils/Utils";
5+
import {isEmpty} from "../utils/Utils";
66
import {Button, ButtonType, Loader, UserInfo} from "@surfnet/sds";
77
import {useAppStore} from "../stores/AppStore";
8-
import {logout} from "../api";
98
import CheckPlain from "../icons/check-plain.svg";
109
import CaretDown from "../icons/caret_down.svg";
11-
import {SESSION_STORAGE_LOCATION} from "../utils/Login.js";
1210
import {menuItemsForUser} from "../utils/MenuItems.js";
11+
import {useLogout} from '../hooks/UseLogout.jsx';
1312

1413
export const UserMenu = ({setIsAuthenticated}) => {
1514

@@ -21,23 +20,7 @@ export const UserMenu = ({setIsAuthenticated}) => {
2120
const [dropDownActive, setDropDownActive] = useState(false);
2221
const [isSwitchOrganizationOpen, setIsSwitchOrganizationOpen] = useState(false);
2322

24-
const logoutUser = e => {
25-
stopEvent(e);
26-
logout().then(() => {
27-
useAppStore.setState(() => ({
28-
currentOrganization: {name: ""},
29-
breadcrumbPaths: [],
30-
user: {name: ""}
31-
}));
32-
sessionStorage.removeItem(SESSION_STORAGE_LOCATION);
33-
navigate("/authentication-switch");
34-
setTimeout(() => {
35-
setIsAuthenticated(false);
36-
navigate("/home");
37-
}, 150)
38-
39-
});
40-
}
23+
const logoutUser = useLogout();
4124

4225
const switchOrganization = organization => {
4326
const newMenuItems = menuItemsForUser(user, organization);
@@ -89,7 +72,9 @@ export const UserMenu = ({setIsAuthenticated}) => {
8972
</ul>
9073
<ul>
9174
<li>
92-
<a href="/logout" onClick={logoutUser}>{I18n.t(`landing.header.logout`)}</a>
75+
<a href="/logout" onClick={e => logoutUser(e, setIsAuthenticated)}>
76+
{I18n.t("landing.header.logout")}
77+
</a>
9378
</li>
9479
</ul>
9580
{user.superUser && <ul>

‎client/src/hooks/UseLogout.jsx‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import {useAppStore} from "../stores/AppStore";
2+
import {logout} from "../api";
3+
import {useNavigate} from "react-router-dom";
4+
import {SESSION_STORAGE_LOCATION} from "../utils/Login.js";
5+
import {stopEvent} from "../utils/Utils.js";
6+
import {useCallback} from "react";
7+
8+
9+
export const useLogout = () => {
10+
const navigate = useNavigate();
11+
12+
const logoutUser = useCallback((e, setIsAuthenticated) => {
13+
stopEvent(e);
14+
logout().then(() => {
15+
useAppStore.setState(() => ({
16+
currentOrganization: { name: "" },
17+
breadcrumbPaths: [],
18+
user: { name: "" }
19+
}));
20+
21+
sessionStorage.removeItem(SESSION_STORAGE_LOCATION);
22+
navigate("/authentication-switch");
23+
24+
setTimeout(() => {
25+
setIsAuthenticated(false);
26+
navigate("/home");
27+
}, 150);
28+
});
29+
}, [navigate]);
30+
31+
return logoutUser;
32+
};

‎client/src/locale/en.js‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -930,6 +930,7 @@ const en = {
930930
sure: "I'm sure",
931931
edit: "Edit",
932932
accept: "Accept",
933+
ok: "Ok",
933934
proceed: "Proceed",
934935
delete: "Delete",
935936
deleteAnyway: "I know what I'm doing. Delete!",
@@ -1120,6 +1121,11 @@ const en = {
11201121
confirmation: {
11211122
deleteQuestion: "Are you sure you want to delete this policy?"
11221123
}
1124+
},
1125+
error: {
1126+
title: "Whoops, error!!!",
1127+
unexpected: "An unexpected error occurred. Please contact <a href='mailto:support@surfconext.nl'>support@surfconext.nl</a> for support.",
1128+
jiraDown: "Momentarily the backend could not process your request. Please contact <a href='mailto:support@surfconext.nl'>support@surfconext.nl</a> for support."
11231129
}
11241130

11251131
}

‎client/src/pages/ApplicationDetail.jsx‎

Lines changed: 16 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -198,10 +198,6 @@ const ApplicationDetail = ({anonymous, refreshUser}) => {
198198
if (isEmpty(attribute)) {
199199
return null;
200200
}
201-
if (link.localeAttribute) {
202-
let s = `${link.locale}.${attribute}`;
203-
console.log(s);
204-
}
205201
return (
206202
<a href={attribute} key={index} target="_blank" rel="noopener noreferrer">
207203
{link.localeAttribute ? I18n.t(`${link.locale}.${attribute.replace(/\./g, '')}`) : I18n.t(link.locale)}
@@ -292,7 +288,7 @@ const ApplicationDetail = ({anonymous, refreshUser}) => {
292288
});
293289
} else {
294290
cancelConfirmation();
295-
alert("cancel request")
291+
alert("cancel request");
296292
}
297293
}
298294

@@ -337,7 +333,19 @@ const ApplicationDetail = ({anonymous, refreshUser}) => {
337333
});
338334

339335
}
336+
}).catch(() => {
337+
setLoading(false);
338+
setConfirmationModalOption(null);
339+
setConfirmation({
340+
open: true,
341+
cancel: null,
342+
action: () => cancelConfirmation(),
343+
title: I18n.t("error.title"),
344+
isError: true,
345+
question: I18n.t("error.jiraDown"),
346+
okButton: I18n.t("forms.ok")
340347
})
348+
})
341349
}
342350
}
343351

@@ -351,7 +359,7 @@ const ApplicationDetail = ({anonymous, refreshUser}) => {
351359
navigate(-1);
352360
}
353361

354-
const {open, cancel, action, question, title, okButton} = confirmation;
362+
const {open, cancel, isError, action, question, title, okButton} = confirmation;
355363

356364
const renderCurrentTab = () => {
357365
switch (currentTab) {
@@ -605,7 +613,7 @@ const ApplicationDetail = ({anonymous, refreshUser}) => {
605613
const renderQuickLinks = () => {
606614
return (
607615
<>
608-
<p className="info">{I18n.t("applicationDetail.quickLinks")}</p>
616+
<p className="info no-margin">{I18n.t("applicationDetail.quickLinks")}</p>
609617
<div className="app-info-block">
610618
{APPLICATION_LINKS.map((link, index) =>
611619
externalLink(link, metaData, index)
@@ -629,7 +637,6 @@ const ApplicationDetail = ({anonymous, refreshUser}) => {
629637
{renderAppPrivacy()}
630638
</div>
631639
<div className="right">
632-
<p className="license">{I18n.t(`applicationDetail.license.${metaData['coin:ss:license_status'] || 'license_not_required'}`)}</p>
633640
{renderQuickLinks()}
634641
<p className="info">{I18n.t("applicationDetail.contractual")}</p>
635642
<p>
@@ -724,6 +731,7 @@ const ApplicationDetail = ({anonymous, refreshUser}) => {
724731
<div className={`application-detail-container`}>
725732
{open && <ConfirmationDialog confirm={action}
726733
cancel={cancel}
734+
isError={isError}
727735
confirmationTxt={okButton}
728736
confirmationHeader={title}
729737
question={question}>

‎client/src/pages/ApplicationDetail.scss‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -225,6 +225,9 @@ div.application-detail-container {
225225
margin-top: 25px;
226226
font-size: 18px;
227227
font-weight: 600;
228+
&.no-margin {
229+
margin-top: 0;
230+
}
228231
}
229232

230233
.app-info-block {

‎client/src/pages/Landing.jsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,6 @@ const Landing = ({refreshUser}) => {
4545
}
4646
useAppStore.setState({
4747
breadcrumbPaths: [
48-
{path: "/home", value: I18n.t("breadCrumb.access"), menuItemName: mainMenuItems.home},
4948
{value: I18n.t("breadCrumb.landing")}
5049
]
5150
});

‎client/src/pages/Landing.scss‎

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
@use "../index";
33

44
.landing-container {
5-
padding: 60px 50px 0 50px;
5+
padding: 0 50px 0 50px;
66
width: 50%;
77

88
@include index.page-media;
@@ -12,8 +12,13 @@
1212
flex-direction: column;
1313
gap: 25px;
1414

15-
.sds-loading {
16-
top: 41%;
15+
.sds--loading-container {
16+
position: fixed;
17+
18+
.sds-loading {
19+
top: 160px;
20+
left: 49%;
21+
}
1722
}
1823
}
1924

0 commit comments

Comments
 (0)