Merge branch 'develop' into bugfix/SHIBUI-2146-attribute-success-alert

Former-commit-id: 069f1486c298c4855db6d1bd51ab96ce4ef0fde7
TIER · Aug 8, 2022 · 6bee116 · 6bee116
2 parents ff33f17 + eabe9dc
commit 6bee116
Show file tree

Hide file tree

Showing 24 changed files with 254 additions and 143 deletions.
diff --git a/backend/src/integration/resources/SHIBUI-1732-4.side b/backend/src/integration/resources/SHIBUI-1732-4.side
@@ -992,28 +992,35 @@
         ["xpath=//div[3]/div/div/div[3]/button", "xpath:position"]
       ],
       "value": ""
+    }, {
+      "id": "14c486b1-bdff-4474-94e3-b4286303a8fd",
+      "comment": "",
+      "command": "pause",
+      "target": "5000",
+      "targets": [],
+      "value": ""
     }, {
       "id": "e3892564-1a1b-4ee6-bbab-49d3cb3079d7",
       "comment": "",
       "command": "assertElementNotPresent",
       "target": "css=table > tbody > tr",
       "targets": [],
       "value": ""
-    },{
-            "id": "4ec2c493-85e4-403b-9b09-031c5728f498",
-            "comment": "",
-            "command": "open",
-            "target": "/api/heheheheheheheWipeout",
-            "targets": [],
-            "value": ""
-          }, {
-            "id": "e074980a-8f21-4c22-8412-c4b6fcdcd1a4",
-            "comment": "",
-            "command": "assertText",
-            "target": "css=body",
-            "targets": [],
-            "value": "yes, you did it"
-          }]
+    }, {
+      "id": "4ec2c493-85e4-403b-9b09-031c5728f498",
+      "comment": "",
+      "command": "open",
+      "target": "/api/heheheheheheheWipeout",
+      "targets": [],
+      "value": ""
+    }, {
+      "id": "e074980a-8f21-4c22-8412-c4b6fcdcd1a4",
+      "comment": "",
+      "command": "assertText",
+      "target": "css=body",
+      "targets": [],
+      "value": "yes, you did it"
+    }]
   }],
   "suites": [{
     "id": "575d414c-556d-45f7-b2f2-c9971ad51348",

diff --git a/backend/src/main/resources/i18n/messages.properties b/backend/src/main/resources/i18n/messages.properties
@@ -410,6 +410,7 @@ label.remove-roleless-entity-descriptors=Remove Roleless Entity Descriptors?
 label.remove-empty-entities-descriptors=Remove Empty Entities Descriptors?
 
 label.select-metadata-provider-type=Select Metadata Provider Type
+label.select-metadata-filter-type=Select Metadata Filter Type
 label.filter-list=Filter List
 label.common-attributes=Common Attributes
 label.reloading-attributes=Reloading Attributes

diff --git a/ui/public/unsecured/error.html b/ui/public/unsecured/error.html
@@ -4,20 +4,31 @@
     <meta charset="utf-8">
     <title th:text="#{messages.brand.header.title}">Shibboleth Metadata Management</title>
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="icon" type="image/x-icon" href="favicon.ico">
-    <link rel="icon" type="image/png" sizes="96x96" href="assets/favicon-96x96.png">
+    <link rel="icon" type="image/x-icon" href="/unsecured/favicon.ico">
+    <link rel="icon" type="image/png" sizes="96x96" href="/unsecured/favicon-96x96.png">
     <link rel="stylesheet" type="text/css" href="/unsecured/static.css">
     <base href="/">
 </head>
 <body>
     <nav class="navbar navbar-expand-md fixed-top bg-white">
-        <span class="navbar-text" th:text="#{messages.brand.header.title}">Shibboleth Metadata Management</span>
+        <a href="https://www.shibboleth.net/" title="Shibboleth Logo" class="navbar-brand ms-4">
+            <img
+                src="/unsecured/shibboleth_icon_color_130x130.png" class="d-inline-block align-top" alt="brand.logo-alt" width="30"
+                height="30">
+        </a>
+        <span class=" navbar-text" th:text="#{messages.brand.header.title}">Shibboleth Metadata Management</span>
     </nav>
     <main class="container-fluid p-3">
         <div class="d-flex justify-content-center">
             <div class="card align-self-center">
-                <div class="card-body d-flex justify-content-between">
-                    <i class="fa fa-fw fa-check-circle-o fa-3x text-success"></i>
+                <div class="card-body d-flex justify-content-between align-items-start">
+                    <div class="w-50 text-success">
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+                            <path
+                                d="M243.8 339.8C232.9 350.7 215.1 350.7 204.2 339.8L140.2 275.8C129.3 264.9 129.3 247.1 140.2 236.2C151.1 225.3 168.9 225.3 179.8 236.2L224 280.4L332.2 172.2C343.1 161.3 360.9 161.3 371.8 172.2C382.7 183.1 382.7 200.9 371.8 211.8L243.8 339.8zM512 256C512 397.4 397.4 512 256 512C114.6 512 0 397.4 0 256C0 114.6 114.6 0 256 0C397.4 0 512 114.6 512 256zM256 48C141.1 48 48 141.1 48 256C48 370.9 141.1 464 256 464C370.9 464 464 370.9 464 256C464 141.1 370.9 48 256 48z"
+                                fill="#498500" />
+                        </svg>
+                    </div>
                     <div class="ml-2 px-3">
                         <h5 class="card-title" th:text="#{messages.message.user-request-received-title}">User request received</h5>
                         <p class="card-text" th:text="#{messages.message.user-request-received-body}">Your request has been received and is being reviewed. You will be notified with access status.</p>

diff --git a/ui/public/unsecured/favicon-96x96.png b/ui/public/unsecured/favicon-96x96.png
diff --git a/ui/public/unsecured/favicon.ico b/ui/public/unsecured/favicon.ico
diff --git a/ui/public/unsecured/shibboleth_icon_color_130x130.png b/ui/public/unsecured/shibboleth_icon_color_130x130.png
diff --git a/ui/src/app/core/components/Spinner.js b/ui/src/app/core/components/Spinner.js
@@ -0,0 +1,9 @@
+import React from 'react';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { faSpinner } from '@fortawesome/free-solid-svg-icons';
+
+export function Spinner ({ size, className }) {
+    return (<FontAwesomeIcon icon={faSpinner} size={size} spin={true} pulse={true} className={ className } />)
+}
+
+export default Spinner;
diff --git a/ui/src/app/dashboard/view/ActionsTab.js b/ui/src/app/dashboard/view/ActionsTab.js
@@ -1,11 +1,12 @@
 import React from 'react';
 import { MetadataActions } from '../../admin/container/MetadataActions';
 import UserActions from '../../admin/container/UserActions';
+import Spinner from '../../core/components/Spinner';
 
 import Translate from '../../i18n/components/translate';
 import SourceList from '../../metadata/domain/source/component/SourceList';
 
-export function ActionsTab({ sources, users, reloadSources, reloadUsers }) {
+export function ActionsTab({ sources, users, reloadSources, reloadUsers, loadingSources, loadingUsers }) {
 
     return (
         <>
@@ -21,7 +22,9 @@ export function ActionsTab({ sources, users, reloadSources, reloadUsers }) {
                     <div className="p-3">
                         <MetadataActions type="source">
                             {(enable) =>
-                                <SourceList entities={sources} onDelete={reloadSources} onEnable={(s, e) => enable(s, e, reloadSources)} />
+                                <SourceList entities={sources} onDelete={reloadSources} onEnable={(s, e) => enable(s, e, reloadSources)}>
+                                    {loadingSources && <div className="d-flex justify-content-center text-primary"><Spinner size="4x" /></div> }
+                                </SourceList>
                             }
                         </MetadataActions>
                     </div>
@@ -36,7 +39,9 @@ export function ActionsTab({ sources, users, reloadSources, reloadUsers }) {
                             </div>
                         </div>
                     </div>
-                    <UserActions users={users} reloadUsers={reloadUsers} />
+                    <UserActions users={users} reloadUsers={reloadUsers}>
+                        {loadingUsers && <div className="d-flex justify-content-center text-primary"><Spinner size="4x" /></div> }
+                    </UserActions>
                 </div>
             </section>
         </>

diff --git a/ui/src/app/dashboard/view/AdminTab.js b/ui/src/app/dashboard/view/AdminTab.js
@@ -5,12 +5,13 @@ import UserMaintenance from '../../admin/component/UserMaintenance';
 import API_BASE_PATH from '../../App.constant';
 
 import Translate from '../../i18n/components/translate';
+import Spinner from '../../core/components/Spinner';
 
 export function AdminTab () {
 
     const [users, setUsers] = React.useState([]);
 
-    const { get, response } = useFetch(`${API_BASE_PATH}/admin/users`, {
+    const { get, response, loading } = useFetch(`${API_BASE_PATH}/admin/users`, {
         cachePolicy: 'no-cache'
     }, []);
 
@@ -46,7 +47,9 @@ export function AdminTab () {
                                 onChangeUserRole={onChangeUserRole}
                                 onDeleteUser={onDeleteUser}
                                 onChangeUserGroup={onChangeUserGroup} />}
+
                     </UserManagement>
+                    {loading && <div className="d-flex justify-content-center text-primary"><Spinner size="4x" /></div> }
                 </div>
             </div>
         </section>

diff --git a/ui/src/app/dashboard/view/Dashboard.js b/ui/src/app/dashboard/view/Dashboard.js
@@ -26,13 +26,13 @@ export function Dashboard () {
 
     const isAdmin = useIsAdmin();
 
-    const loading = useCurrentUserLoading();
+    const loadingUser = useCurrentUserLoading();
 
     const [actions, setActions] = React.useState(0);
     const [users, setUsers] = React.useState([]);
     const [sources, setSources] = React.useState([]);
 
-    const { get, response } = useFetch(`${API_BASE_PATH}`, {
+    const { get, response, loading } = useFetch(`${API_BASE_PATH}`, {
         cachePolicy: 'no-cache'
     });
 
@@ -64,7 +64,7 @@ export function Dashboard () {
 
     return (
         <div className="container-fluid p-3" role="navigation">
-            {loading ?
+            {loadingUser ?
             <div className="d-flex justify-content-center text-primary mt-5">
                 <FontAwesomeIcon icon={faSpinner} spin={true} pulse={true} size="3x" />
             </div>
@@ -109,7 +109,13 @@ export function Dashboard () {
                 } />
                 <Route path={`${path}/admin/actions`} render={() =>
                     <ProtectRoute redirectTo="/dashboard">
-                        <ActionsTab sources={sources} users={users} reloadSources={loadSources} reloadUsers={loadUsers} />
+                        <ActionsTab
+                            sources={sources}
+                            users={users}
+                            reloadSources={loadSources}
+                            reloadUsers={loadUsers}
+                            loadingSources={sourceLoader.loading}
+                            loadingUsers={loading} />
                     </ProtectRoute>
                 } />
                 <Route exact path={`${path}/*`}>

diff --git a/ui/src/app/dashboard/view/ProvidersTab.js b/ui/src/app/dashboard/view/ProvidersTab.js
@@ -8,13 +8,14 @@ import { Ordered } from '../component/Ordered';
 import { useIsAdmin } from '../../core/user/UserContext';
 import Alert from 'react-bootstrap/Alert';
 import { MetadataActions } from '../../admin/container/MetadataActions';
+import Spinner from '../../core/components/Spinner';
 const searchProps = ['name', '@type', 'createdBy'];
 
 export function ProvidersTab () {
 
     const [providers, setProviders] = React.useState([]);
 
-    const { get, response } = useMetadataEntities('provider', {
+    const { get, response, loading } = useMetadataEntities('provider', {
         cachePolicy: 'no-cache'
     });
 
@@ -54,7 +55,9 @@ export function ProvidersTab () {
                                             last={last}
                                             onEnable={(p, e) => enable(p, e, loadProviders)}
                                             onOrderUp={onOrderUp}
-                                            onOrderDown={onOrderDown}></ProviderList>
+                                            onOrderDown={onOrderDown}>
+                                                {loading && <div className="d-flex justify-content-center text-primary"><Spinner size="4x" /></div> }
+                                            </ProviderList>
                                     }
                                 </MetadataActions>
                                 }

diff --git a/ui/src/app/dashboard/view/SourcesTab.js b/ui/src/app/dashboard/view/SourcesTab.js
@@ -5,9 +5,11 @@ import Translate from '../../i18n/components/translate';
 import SourceList from '../../metadata/domain/source/component/SourceList';
 import { useMetadataEntities, useMetadataEntity } from '../../metadata/hooks/api';
 import { Search } from '../component/Search';
+import { Spinner } from '../../core/components/Spinner';
 
 import { NotificationContext, createNotificationAction, NotificationTypes } from '../../notifications/hoc/Notifications';
 
+
 const searchProps = ['serviceProviderName', 'entityId', 'createdBy'];
 
 export function SourcesTab () {
@@ -16,7 +18,7 @@ export function SourcesTab () {
 
     const [sources, setSources] = React.useState([]);
 
-    const { get, response } = useMetadataEntities('source', {
+    const { get, response, loading } = useMetadataEntities('source', {
         cachePolicy: 'no-cache'
     });
 
@@ -68,7 +70,9 @@ export function SourcesTab () {
                                         entities={searched}
                                         onDelete={(id) => remove(id, loadSources)}
                                         onEnable={(s, e) => enable(s, e, loadSources) }
-                                        onChangeGroup={changeSourceGroup} />
+                                        onChangeGroup={changeSourceGroup}>
+                                            {loading && <div className="d-flex justify-content-center text-primary"><Spinner size="4x" /></div> }
+                                    </SourceList>
                                 }
                             </MetadataActions>
                         }

diff --git a/ui/src/app/metadata/copy/CopySource.js b/ui/src/app/metadata/copy/CopySource.js
@@ -9,18 +9,9 @@ import { Translate } from '../../i18n/components/translate';
 import { EntityTypeahead } from './EntityTypeahead';
 import kebabCase from 'lodash/kebabCase';
 import { useMetadataSources } from '../hooks/api';
+import { useMetadataSourceSections } from '../domain/source/definition/SourceDefinition';
+
 
-const sections = [
-    { i18nKey: 'organizationInformation', property: 'organization' },
-    { i18nKey: 'contacts', property: 'contacts' },
-    { i18nKey: 'uiMduiInfo', property: 'mdui' },
-    { i18nKey: 'spSsoDescriptorInfo', property: 'serviceProviderSsoDescriptor' },
-    { i18nKey: 'logoutEndpoints', property: 'logoutEndpoints' },
-    { i18nKey: 'securityDescriptorInfo', property: 'securityInfo' },
-    { i18nKey: 'assertionConsumerServices', property: 'assertionConsumerServices' },
-    { i18nKey: 'relyingPartyOverrides', property: 'relyingPartyOverrides' },
-    { i18nKey: 'attributeRelease', property: 'attributeRelease' }
-];
 
 export function CopySource({ copy, onNext }) {
 
@@ -64,6 +55,8 @@ export function CopySource({ copy, onNext }) {
 
     const sourceIds = data.map(p => p.entityId);
 
+    const sections = useMetadataSourceSections();
+
     return (
         <>
             <div className="row">
@@ -162,7 +155,7 @@ export function CopySource({ copy, onNext }) {
                                     <td><span className="mb-0" id={`property-checkbox-${i}`}><Translate value={`label.${kebabCase(item.i18nKey)}`} /></span></td>
                                     <td>
                                         <Form.Check
-                                            custom
+                                            custom={'true'}
                                             type={'checkbox'}
                                             id={`property-checkbox-${i}-check`}
                                             onChange={({ target: { checked } }) => onSelect(item, checked)}