Merge pull request #7183 from AlexSCorey/7104-UserTeamsDisassociate

Adds disassociate functionality and an empty state for Sys Admin Reviewed-by: https://github.com/apps/softwarefactory-project-zuul
ansible · Jun 3, 2020 · fb8b902 · fb8b902
2 parents ec2c121 + af70e3b
commit fb8b902
Show file tree

Hide file tree

Showing 10 changed files with 768 additions and 293 deletions.
diff --git a/awx/ui_next/src/api/index.js b/awx/ui_next/src/api/index.js
@@ -18,6 +18,7 @@ import Organizations from './models/Organizations';
 import ProjectUpdates from './models/ProjectUpdates';
 import Projects from './models/Projects';
 import Root from './models/Root';
+import Roles from './models/Roles';
 import Schedules from './models/Schedules';
 import SystemJobs from './models/SystemJobs';
 import Teams from './models/Teams';
@@ -49,6 +50,7 @@ const OrganizationsAPI = new Organizations();
 const ProjectUpdatesAPI = new ProjectUpdates();
 const ProjectsAPI = new Projects();
 const RootAPI = new Root();
+const RolesAPI = new Roles();
 const SchedulesAPI = new Schedules();
 const SystemJobsAPI = new SystemJobs();
 const TeamsAPI = new Teams();
@@ -81,6 +83,7 @@ export {
   ProjectUpdatesAPI,
   ProjectsAPI,
   RootAPI,
+  RolesAPI,
   SchedulesAPI,
   SystemJobsAPI,
   TeamsAPI,

diff --git a/awx/ui_next/src/api/models/Roles.js b/awx/ui_next/src/api/models/Roles.js
@@ -0,0 +1,23 @@
+import Base from '../Base';
+
+class Roles extends Base {
+  constructor(http) {
+    super(http);
+    this.baseUrl = '/api/v2/roles/';
+  }
+
+  disassociateUserRole(roleId, userId) {
+    return this.http.post(`${this.baseUrl}/${roleId}/users/`, {
+      disassociate: true,
+      id: userId,
+    });
+  }
+
+  disassociateTeamRole(roleId, teamId) {
+    return this.http.post(`${this.baseUrl}/${roleId}/teams/`, {
+      disassociate: true,
+      id: teamId,
+    });
+  }
+}
+export default Roles;
diff --git a/awx/ui_next/src/screens/Team/TeamAccess/TeamAccessList.jsx b/awx/ui_next/src/screens/Team/TeamAccess/TeamAccessList.jsx
@@ -4,17 +4,25 @@ import { useLocation, useParams } from 'react-router-dom';
 import { withI18n } from '@lingui/react';
 import { t } from '@lingui/macro';
 
-import { Button } from '@patternfly/react-core';
-import { TeamsAPI } from '../../../api';
-
-import useRequest from '../../../util/useRequest';
+import {
+  Button,
+  EmptyState,
+  EmptyStateBody,
+  EmptyStateIcon,
+  Title,
+} from '@patternfly/react-core';
+import { CubesIcon } from '@patternfly/react-icons';
+import { TeamsAPI, RolesAPI } from '../../../api';
+import useRequest, { useDeleteItems } from '../../../util/useRequest';
 import DataListToolbar from '../../../components/DataListToolbar';
 import PaginatedDataList from '../../../components/PaginatedDataList';
 import { getQSConfig, parseQueryString } from '../../../util/qs';
+import ErrorDetail from '../../../components/ErrorDetail';
+import AlertModal from '../../../components/AlertModal';
 import TeamAccessListItem from './TeamAccessListItem';
 import UserAndTeamAccessAdd from '../../../components/UserAndTeamAccessAdd/UserAndTeamAccessAdd';
 
-const QS_CONFIG = getQSConfig('team', {
+const QS_CONFIG = getQSConfig('roles', {
   page: 1,
   page_size: 20,
   order_by: 'id',
@@ -24,6 +32,7 @@ function TeamAccessList({ i18n }) {
   const [isWizardOpen, setIsWizardOpen] = useState(false);
   const { search } = useLocation();
   const { id } = useParams();
+  const [roleToDisassociate, setRoleToDisassociate] = useState(null);
 
   const {
     isLoading,
@@ -60,6 +69,21 @@ function TeamAccessList({ i18n }) {
     setIsWizardOpen(false);
     fetchRoles();
   };
+  const {
+    isLoading: isDisassociateLoading,
+    deleteItems: disassociateRole,
+    deletionError: disassociationError,
+    clearDeletionError: clearDisassociationError,
+  } = useDeleteItems(
+    useCallback(async () => {
+      setRoleToDisassociate(null);
+      await RolesAPI.disassociateTeamRole(
+        roleToDisassociate.id,
+        parseInt(id, 10)
+      );
+    }, [roleToDisassociate, id]),
+    { qsConfig: QS_CONFIG, fetchItems: fetchRoles }
+  );
 
   const canAdd =
     options && Object.prototype.hasOwnProperty.call(options, 'POST');
@@ -80,11 +104,28 @@ function TeamAccessList({ i18n }) {
     return `/${resource_type}s/${resource_id}/details`;
   };
 
+  const isSysAdmin = roles.some(role => role.name === 'System Administrator');
+  if (isSysAdmin) {
+    return (
+      <EmptyState variant="full">
+        <EmptyStateIcon icon={CubesIcon} />
+        <Title headingLevel="h5" size="lg">
+          {i18n._(t`System Administrator`)}
+        </Title>
+        <EmptyStateBody>
+          {i18n._(
+            t`System administrators have unrestricted access to all resources.`
+          )}
+        </EmptyStateBody>
+      </EmptyState>
+    );
+  }
+
   return (
     <>
       <PaginatedDataList
         contentError={contentError}
-        hasContentLoading={isLoading}
+        hasContentLoading={isLoading || isDisassociateLoading}
         items={roles}
         itemCount={roleCount}
         pluralizedItemName={i18n._(t`Teams`)}
@@ -128,7 +169,9 @@ function TeamAccessList({ i18n }) {
             key={role.id}
             role={role}
             detailUrl={detailUrl(role)}
-            onSelect={() => {}}
+            onSelect={item => {
+              setRoleToDisassociate(item);
+            }}
           />
         )}
       />
@@ -141,6 +184,53 @@ function TeamAccessList({ i18n }) {
           title={i18n._(t`Add team permissions`)}
         />
       )}
+
+      {roleToDisassociate && (
+        <AlertModal
+          aria-label={i18n._(t`Disassociate role`)}
+          isOpen={roleToDisassociate}
+          variant="error"
+          title={i18n._(t`Disassociate role!`)}
+          onClose={() => setRoleToDisassociate(null)}
+          actions={[
+            <Button
+              key="disassociate"
+              variant="danger"
+              aria-label={i18n._(t`confirm disassociate`)}
+              onClick={() => disassociateRole()}
+            >
+              {i18n._(t`Disassociate`)}
+            </Button>,
+            <Button
+              key="cancel"
+              variant="secondary"
+              aria-label={i18n._(t`Cancel`)}
+              onClick={() => setRoleToDisassociate(null)}
+            >
+              {i18n._(t`Cancel`)}
+            </Button>,
+          ]}
+        >
+          <div>
+            {i18n._(
+              t`This action will disassociate the following role from ${roleToDisassociate.summary_fields.resource_name}:`
+            )}
+            <br />
+            <strong>{roleToDisassociate.name}</strong>
+          </div>
+        </AlertModal>
+      )}
+      {disassociationError && (
+        <AlertModal
+          isOpen={disassociationError}
+          variant="error"
+          title={i18n._(t`Error!`)}
+          onClose={clearDisassociationError}
+        >
+          {i18n._(t`Failed to delete role.`)}
+          <ErrorDetail error={disassociationError} />
+        </AlertModal>
+      )}
     </>
   );
 }