Fix for user menu dropdown

OpenConext · Dec 11, 2024 · 47953c2 · 47953c2
1 parent d24a595
commit 47953c2
Show file tree

Hide file tree

Showing 10 changed files with 30 additions and 24 deletions.
diff --git a/client/package.json b/client/package.json
@@ -3,7 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "@surfnet/sds": "^0.0.115",
+    "@surfnet/sds": "^0.0.119",
     "dompurify": "^3.1.7",
     "i18n-js": "^4.4.3",
     "isomorphic-dompurify": "^2.16.0",

diff --git a/client/src/components/InvitationRoleCard.jsx b/client/src/components/InvitationRoleCard.jsx
@@ -46,16 +46,15 @@ export const InvitationRoleCard = ({
         </div>;
 
     const inviterCard = invitationSelected ? "inviter-selected" : "inviter"
-    const className = `card-container ${isNew ? "is-new" : ""} ${inviterCard}`;
+    const className = `card-container ${isNew ? "is-new" : ""} ${inviterCard} ${invitationSelectCallback ? "pointer" : ""}`;
     return (
         <div className={className}>
             {isNew &&
                 <Chip label={I18n.t("proceed.new")} type={ChipType.Status_error}/>
             }
-            {isEmpty(inviterCard) && <Card key={index} cardType={CardType.Big} children={children}/>}
-            {!isEmpty(inviterCard) &&
-                <label htmlFor={`invitationSelected-${index}-${role.value}`}> <Card key={index} cardType={CardType.Big}
-                                                                                    children={children}/></label>}
+                <label htmlFor={`invitationSelected-${index}-${role.value}`}>
+                    <Card key={index} cardType={CardType.Big}  children={children}/>
+                </label>
         </div>
     );
 }
diff --git a/client/src/components/RoleCard.scss b/client/src/components/RoleCard.scss
@@ -9,11 +9,13 @@
     &.inviter-selected .sds--card {
         border-color: var(--sds--color--green--300);
         background-color: var(--sds--color--green--100);
-        cursor: pointer;
     }
 
     &.inviter .sds--card {
         background-color: var(--sds--color--gray--100);
+    }
+
+    &.pointer .sds--card {
         cursor: pointer;
     }
 

diff --git a/client/src/components/UserMenu.jsx b/client/src/components/UserMenu.jsx
@@ -34,9 +34,10 @@ export const UserMenu = ({user, config, actions}) => {
     const renderMenu = adminLinks => {
         return (<>
                 <ul>
-                    {user.superUser && adminLinks.map(l => <li key={l}>
-                        <Link onClick={toggleUserMenu} to={`/${l}`}>{I18n.t(`header.links.${l}`)}</Link>
-                    </li>)}
+                    {user.superUser && adminLinks.map(l =>
+                        <li key={l}>
+                            <Link onClick={toggleUserMenu} to={`/${l}`}>{I18n.t(`header.links.${l}`)}</Link>
+                        </li>)}
                     <li>
                         <Link onClick={toggleUserMenu} to={`/profile`}>{I18n.t(`header.links.profile`)}</Link>
                     </li>
@@ -57,7 +58,7 @@ export const UserMenu = ({user, config, actions}) => {
     return (
         <div className="user-menu"
              tabIndex={1}
-             onBlur={() => setTimeout(() => setDropDownActive(false), 125)}>
+             onBlur={() => setTimeout(() => setDropDownActive(false), 325)}>
             <UserInfo isOpen={dropDownActive}
                       children={renderMenu(adminLinks)}
                       organisationName={I18n.t(`access.${highestAuthority(user, false)}`)}

diff --git a/client/src/pages/Inviter.js b/client/src/pages/Inviter.js
@@ -30,7 +30,6 @@ export const Inviter = () => {
                                 applicationMaps={applicationMaps}
                                 key={index}
                                 isNew={false}
-
             />
         )
     }

diff --git a/client/src/pages/Role.js b/client/src/pages/Role.js
@@ -116,7 +116,7 @@ export const Role = () => {
                 const orgName = m[`OrganizationName:${I18n.locale}`] || m["OrganizationName:en"];
                 const landingPage = role.applicationUsages.find(au => au.application.manageId === m.id).landingPage;
                 return (
-                    <span>
+                    <span key={index}>
                         <a href={landingPage} target="_blank" rel="noreferrer">{`${name}`}</a>
                         {`${orgName ? " (" + orgName + ")" : ""}`}
                         {separator(role, index)}

diff --git a/client/yarn.lock b/client/yarn.lock
@@ -1873,10 +1873,10 @@
   dependencies:
     "@sinonjs/commons" "^1.7.0"
 
-"@surfnet/sds@^0.0.115":
-  version "0.0.115"
-  resolved "https://registry.yarnpkg.com/@surfnet/sds/-/sds-0.0.115.tgz#0007e0ea6b26d072f4fb91ed963d691fb3ed3cdc"
-  integrity sha512-F5/I2uA95T73IHHtVbJuG6fFiwLLxHahiI6s27Gv0RhDuUwppStcmxawTUWIaMWiyLiyKayQWN/dkhKXnsIebw==
+"@surfnet/sds@^0.0.119":
+  version "0.0.119"
+  resolved "https://registry.yarnpkg.com/@surfnet/sds/-/sds-0.0.119.tgz#0e66f7f3c8f8de4d0e4d74f29d6a02c30fa2b19c"
+  integrity sha512-h69Gb9fX5i7zw1Vf7hBCTn4HAQis4e6EcsA6FKCZnJ8DRzviK3jzhqWFuievqg8yteNey3VeB734t4Dx1ceP2A==
 
 "@surma/rollup-plugin-off-main-thread@^2.2.3":
   version "2.2.3"

diff --git a/welcome/package.json b/welcome/package.json
@@ -3,7 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "@surfnet/sds": "^0.0.115",
+    "@surfnet/sds": "^0.0.119",
     "dompurify": "^3.1.6",
     "i18n-js": "^4.4.3",
     "isomorphic-dompurify": "^2.15.0",

diff --git a/welcome/src/components/RoleCard.jsx b/welcome/src/components/RoleCard.jsx
@@ -18,8 +18,13 @@ export const RoleCard = ({index, application, isNew = false, skipLaunch = false}
             </section>
             {(!skipLaunch && !isEmpty(application.landingPage)) &&
                 <div className={"launch"}>
-                    <Button txt={I18n.t("proceed.launch")} onClick={() => {
-                        window.location.href = sanitizeURL(application.landingPage);
+                    <Button txt={I18n.t("proceed.launch")} onClick={e => {
+                        const href = sanitizeURL(application.landingPage);
+                        if (e.metaKey || e.ctrlKey) {
+                            window.open(href, '_blank');
+                        } else {
+                            window.location.href = href;
+                        }
                     }}/>
                 </div>
             }

diff --git a/welcome/yarn.lock b/welcome/yarn.lock
@@ -1749,10 +1749,10 @@
   dependencies:
     "@sinonjs/commons" "^1.7.0"
 
-"@surfnet/sds@^0.0.115":
-  version "0.0.115"
-  resolved "https://registry.yarnpkg.com/@surfnet/sds/-/sds-0.0.115.tgz#0007e0ea6b26d072f4fb91ed963d691fb3ed3cdc"
-  integrity sha512-F5/I2uA95T73IHHtVbJuG6fFiwLLxHahiI6s27Gv0RhDuUwppStcmxawTUWIaMWiyLiyKayQWN/dkhKXnsIebw==
+"@surfnet/sds@^0.0.119":
+  version "0.0.119"
+  resolved "https://registry.yarnpkg.com/@surfnet/sds/-/sds-0.0.119.tgz#0e66f7f3c8f8de4d0e4d74f29d6a02c30fa2b19c"
+  integrity sha512-h69Gb9fX5i7zw1Vf7hBCTn4HAQis4e6EcsA6FKCZnJ8DRzviK3jzhqWFuievqg8yteNey3VeB734t4Dx1ceP2A==
 
 "@surma/rollup-plugin-off-main-thread@^2.2.3":
   version "2.2.3"
-Original file line number
+Diff line change
@@ Expand Up / @@ -30,7 +30,6 @@ export const Inviter = () => { @@
                                     applicationMaps={applicationMaps}
                                     key={index}
                                     isNew={false}
                 />
             )
         }
@@ Expand Down @@