Fixed dropsdowns for groups

TIER · Jul 2, 2021 · c8b5eaa · c8b5eaa
1 parent b592f38
commit c8b5eaa
Show file tree

Hide file tree

Showing 5 changed files with 70 additions and 14 deletions.
diff --git a/backend/src/main/resources/i18n/messages.properties b/backend/src/main/resources/i18n/messages.properties
@@ -480,6 +480,7 @@ label.current=Current
 label.restore=Restore
 label.compare-selected=Compare Selected
 label.restore-version=Restore Version ({ date })
+label.group=Group
 
 label.saved=Saved
 label.by=By

diff --git a/ui/src/app/admin/component/UserMaintenance.js b/ui/src/app/admin/component/UserMaintenance.js
@@ -51,13 +51,13 @@ export default function UserMaintenance({ users, roles, onDeleteUser, onChangeUs
                                             </select>
                                         </td>
                                         <td>
-                                            <label htmlFor={`group-${user.username}`} className="sr-only"><Translate value="action.user-role">User role</Translate></label>
+                                            <label htmlFor={`group-${user.username}`} className="sr-only"><Translate value="action.user-group">User group</Translate></label>
                                             <select
                                                 id={`group-${user.username}`}
                                                 name={`group-${user.username}`}
                                                 className="form-control"
                                                 onChange={(event) => onChangeUserGroup(user, event.target.value)}
-                                                value={user.group ? user.group : ''}
+                                                value={user.groupId ? user.groupId : ''}
                                                 disabled={loadingGroups || currentUser.username === user.username}
                                                 disablevalidation="true">
                                                 <option>Select Group</option>

diff --git a/ui/src/app/core/user/UserContext.js b/ui/src/app/core/user/UserContext.js
@@ -39,5 +39,16 @@ function useIsAdmin() {
     return user.role === 'ROLE_ADMIN';
 }
 
+function useIsInGroup(id) {
+    const user = useCurrentUser();
+    return user.group === id;
+}
+
+function useIsAdminOrInGroup() {
+    const isAdmin = useIsAdmin();
+    const isInGroup = useIsInGroup();
+    return isAdmin || isInGroup;
+}
+
 
-export { UserContext, UserProvider, Consumer as UserConsumer, useCurrentUser, useIsAdmin };
+export { UserContext, UserProvider, Consumer as UserConsumer, useCurrentUser, useIsAdmin, useIsAdminOrInGroup };
diff --git a/ui/src/app/dashboard/view/SourcesTab.js b/ui/src/app/dashboard/view/SourcesTab.js
@@ -2,7 +2,7 @@ import React from 'react';
 import Translate from '../../i18n/components/translate';
 
 import SourceList from '../../metadata/domain/source/component/SourceList';
-import { useMetadataEntities } from '../../metadata/hooks/api';
+import { useMetadataEntities, useMetadataEntity } from '../../metadata/hooks/api';
 import { Search } from '../component/Search';
 
 const searchProps = ['serviceProviderName', 'entityId', 'createdBy'];
@@ -15,6 +15,10 @@ export function SourcesTab () {
         cachePolicy: 'no-cache'
     });
 
+    const updater = useMetadataEntity('source', {
+        cachePolicy: 'no-cache'
+    })
+
     async function loadSources() {
         const sources = await get('');
         if (response.ok) {
@@ -27,6 +31,16 @@ export function SourcesTab () {
     /*eslint-disable react-hooks/exhaustive-deps*/
     React.useEffect(() => { loadSources() }, []);
 
+    async function changeSourceGroup(source, group) {
+        const sources = await updater.put(`/${source.id}`, {
+            ...source,
+            groupId: group
+        });
+        if (updater.response.ok) {
+            loadSources();
+        }
+    }
+
     return (
         <section className="section">
             <div className="section-body border border-top-0 border-primary">
@@ -37,7 +51,7 @@ export function SourcesTab () {
                 </div>
                 <div className="p-3">
                     <Search entities={sources} searchable={searchProps}>
-                        {(searched) => <SourceList entities={ searched } onDelete={ updateSources }></SourceList>}
+                        {(searched) => <SourceList entities={ searched } onDelete={ updateSources } onChangeGroup={changeSourceGroup}></SourceList>}
                     </Search>
                 </div>
             </div>

diff --git a/ui/src/app/metadata/domain/source/component/SourceList.js b/ui/src/app/metadata/domain/source/component/SourceList.js
@@ -12,8 +12,13 @@ import FormattedDate from '../../../../core/components/FormattedDate';
 import Translate from '../../../../i18n/components/translate';
 import { Scroller } from '../../../../dashboard/component/Scroller';
 import { DeleteSourceConfirmation } from './DeleteSourceConfirmation';
+import { useIsAdmin } from '../../../../core/user/UserContext';
+import { GroupsProvider } from '../../../../admin/hoc/GroupsProvider';
+
+export default function SourceList({ entities, onDelete, onEnable, onChangeGroup }) {
+
+    const isAdmin = useIsAdmin();
 
-export default function SourceList({ entities, onDelete, onEnable }) {
     return (
         <DeleteSourceConfirmation>
             {(onDeleteSource) =>
@@ -24,11 +29,12 @@ export default function SourceList({ entities, onDelete, onEnable }) {
                     <table className="table table-striped w-100 table-hover">
                         <thead>
                             <tr>
-                                <th><Translate value="label.title">Title</Translate></th>
-                                <th className="w-40"><Translate value="label.entity-id">Entity ID</Translate></th>
-                                <th className="w-15"><Translate value="label.author">Author</Translate></th>
-                                <th className="w-15"><Translate value="label.creation-date">Created Date</Translate></th>
-                                <th className="text-center w-15"><Translate value="label.enabled">Enabled</Translate></th>
+                                <th className="w-25"><Translate value="label.title">Title</Translate></th>
+                                <th className="w-25"><Translate value="label.entity-id">Entity ID</Translate></th>
+                                <th className=""><Translate value="label.author">Author</Translate></th>
+                                <th className=""><Translate value="label.creation-date">Created Date</Translate></th>
+                                <th className=""><Translate value="label.enabled">Enabled</Translate></th>
+                                {isAdmin && onChangeGroup && <th className=""><Translate value="label.group">Group</Translate></th> }
                                 {onDeleteSource && <th className="w-auto"></th>}
                             </tr>
                         </thead>
@@ -45,7 +51,7 @@ export default function SourceList({ entities, onDelete, onEnable }) {
                                         {source.createdBy}
                                     </td>
                                     <td><FormattedDate date={source.createdDate} /></td>
-                                    <td className="text-center">
+                                    <td className="">
                                         {onEnable ?
                                             <Button
                                                 variant="success"
@@ -62,8 +68,32 @@ export default function SourceList({ entities, onDelete, onEnable }) {
                                         }
                                     </td>
 
-
-                                    {onDeleteSource && <td className="text-right">
+                                    {isAdmin && onChangeGroup &&
+                                        <td className="">
+                                            <GroupsProvider>
+                                                {(groups, removeGroup, loadingGroups) =>
+                                                    <React.Fragment>
+                                                        <label htmlFor={`group-${source.serviceProviderName}`} className="sr-only"><Translate value="action.source-group">Group</Translate></label>
+                                                        <select
+                                                            id={`group-${source.id}`}
+                                                            name={`group-${source.id}`}
+                                                            className="form-control"
+                                                            onChange={(event) => onChangeGroup(source, event.target.value)}
+                                                            value={source.groupId ? source.groupId : ''}
+                                                            disabled={loadingGroups}
+                                                            disablevalidation="true">
+                                                            <option>Select Group</option>
+                                                            {groups.map((g, ridx) => (
+                                                                <option key={ridx} value={g.resourceId}>{g.name}</option>
+                                                            ))}
+                                                        </select>
+                                                    </React.Fragment>
+                                                }
+                                            </GroupsProvider>
+                                        </td>
+                                    }
+                                    {onDeleteSource &&
+                                    <td className="text-right">
                                         <OverlayTrigger trigger={source.serviceEnabled ? ['hover', 'focus'] : []} placement="left"
                                             overlay={
                                                 <Popover id={`delete-source-btn-${idx}`}>