Merge pull request #8441 from nixocio/ui_issue_7595

Rename users and access tabs

Reviewed-by: https://github.com/apps/softwarefactory-project-zuul

awx/ui_next/src/screens/User/User.jsx

@@ -21,7 +21,7 @@ import UserEdit from './UserEdit';
 import UserOrganizations from './UserOrganizations';
 import UserTeams from './UserTeams';
 import UserTokens from './UserTokens';
-import UserAccessList from './UserAccess/UserAccessList';
+import UserRolesList from './UserRoles/UserRolesList';
 
 function User({ i18n, setBreadcrumb, me }) {
   const location = useLocation();
@@ -68,7 +68,7 @@ function User({ i18n, setBreadcrumb, me }) {
       id: 1,
     },
     { name: i18n._(t`Teams`), link: `${match.url}/teams`, id: 2 },
-    { name: i18n._(t`Access`), link: `${match.url}/access`, id: 3 },
+    { name: i18n._(t`Roles`), link: `${match.url}/roles`, id: 3 },
   ];
 
   if (me?.id === Number(match.params.id)) {
@@ -128,8 +128,8 @@ function User({ i18n, setBreadcrumb, me }) {
               <UserTeams userId={Number(match.params.id)} />
             </Route>
             {user && (
-              <Route path="/users/:id/access">
-                <UserAccessList user={user} />
+              <Route path="/users/:id/roles">
+                <UserRolesList user={user} />
               </Route>
             )}
             <Route path="/users/:id/tokens">

awx/ui_next/src/screens/User/UserAccess/index.js

@@ -1,2 +0,0 @@
-export { default as UserAccessList } from './UserAccessList';
-export { default as UserAccessListItem } from './UserAccessListItem';

awx/ui_next/src/screens/User/UserRoles/UserRolesList.jsx

@@ -18,7 +18,7 @@ import ErrorDetail from '../../../components/ErrorDetail';
 import AlertModal from '../../../components/AlertModal';
 
 import DatalistToolbar from '../../../components/DataListToolbar';
-import UserAccessListItem from './UserAccessListItem';
+import UserRolesListItem from './UserRolesListItem';
 import UserAndTeamAccessAdd from '../../../components/UserAndTeamAccessAdd/UserAndTeamAccessAdd';
 
 const QS_CONFIG = getQSConfig('roles', {
@@ -29,7 +29,7 @@ const QS_CONFIG = getQSConfig('roles', {
 // TODO Figure out how to best conduct a search of this list.
 // Since we only have a role ID in the top level of each role object
 // we can't really search using the normal search parameters.
-function UserAccessList({ i18n, user }) {
+function UserRolesList({ i18n, user }) {
   const { search } = useLocation();
   const [isWizardOpen, setIsWizardOpen] = useState(false);
   const [roleToDisassociate, setRoleToDisassociate] = useState(null);
@@ -164,7 +164,7 @@ function UserAccessList({ i18n, user }) {
         toolbarRelatedSearchableKeys={relatedSearchableKeys}
         renderItem={role => {
           return (
-            <UserAccessListItem
+            <UserRolesListItem
               key={role.id}
               value={role.name}
               role={role}
@@ -256,4 +256,4 @@ function UserAccessList({ i18n, user }) {
     </>
   );
 }
-export default withI18n()(UserAccessList);
+export default withI18n()(UserRolesList);

awx/ui_next/src/screens/User/UserRoles/UserRolesList.test.jsx

@@ -5,7 +5,7 @@ import {
   mountWithContexts,
   waitForElement,
 } from '../../../../testUtils/enzymeHelpers';
-import UserAccessList from './UserAccessList';
+import UserRolesList from './UserRolesList';
 
 jest.mock('../../../api/models/Users');
 jest.mock('../../../api/models/Roles');
@@ -101,7 +101,7 @@ const roles = {
   },
 };
 
-describe('<UserAccessList />', () => {
+describe('<UserRolesList />', () => {
   let wrapper;
   afterEach(() => {
     jest.clearAllMocks();
@@ -111,17 +111,17 @@ describe('<UserAccessList />', () => {
     UsersAPI.readRoles.mockResolvedValue(roles);
 
     await act(async () => {
-      wrapper = mountWithContexts(<UserAccessList user={user} />);
+      wrapper = mountWithContexts(<UserRolesList user={user} />);
     });
 
-    expect(wrapper.find('UserAccessList').length).toBe(1);
+    expect(wrapper.find('UserRolesList').length).toBe(1);
   });
 
   test('should create proper detailUrl', async () => {
     UsersAPI.readRoles.mockResolvedValue(roles);
 
     await act(async () => {
-      wrapper = mountWithContexts(<UserAccessList user={user} />);
+      wrapper = mountWithContexts(<UserRolesList user={user} />);
     });
 
     wrapper.update();
@@ -191,7 +191,7 @@ describe('<UserAccessList />', () => {
     });
     await act(async () => {
       wrapper = mountWithContexts(
-        <UserAccessList
+        <UserRolesList
           user={{
             ...user,
             summary_fields: {
@@ -214,7 +214,7 @@ describe('<UserAccessList />', () => {
   test('should open and close wizard', async () => {
     UsersAPI.readRoles.mockResolvedValue(roles);
     await act(async () => {
-      wrapper = mountWithContexts(<UserAccessList user={user} />);
+      wrapper = mountWithContexts(<UserRolesList user={user} />);
     });
     wrapper.update();
     await act(async () =>
@@ -232,7 +232,7 @@ describe('<UserAccessList />', () => {
     UsersAPI.readRoles.mockResolvedValue(roles);
 
     await act(async () => {
-      wrapper = mountWithContexts(<UserAccessList user={user} />);
+      wrapper = mountWithContexts(<UserRolesList user={user} />);
     });
 
     wrapper.update();
@@ -283,7 +283,7 @@ describe('<UserAccessList />', () => {
     );
 
     await act(async () => {
-      wrapper = mountWithContexts(<UserAccessList user={user} />);
+      wrapper = mountWithContexts(<UserRolesList user={user} />);
     });
 
     wrapper.update();
@@ -338,7 +338,7 @@ describe('<UserAccessList />', () => {
     });
 
     await act(async () => {
-      wrapper = mountWithContexts(<UserAccessList user={user} />);
+      wrapper = mountWithContexts(<UserRolesList user={user} />);
     });
 
     waitForElement(

awx/ui_next/src/screens/User/UserRoles/UserRolesListItem.jsx

@@ -11,7 +11,7 @@ import { Link } from 'react-router-dom';
 import { DetailList, Detail } from '../../../components/DetailList';
 import DataListCell from '../../../components/DataListCell';
 
-function UserAccessListItem({ role, i18n, detailUrl, onSelect }) {
+function UserRolesListItem({ role, i18n, detailUrl, onSelect }) {
   const labelId = `userRole-${role.id}`;
   return (
     <DataListItem key={role.id} aria-labelledby={labelId} id={`${role.id}`}>
@@ -61,4 +61,4 @@ function UserAccessListItem({ role, i18n, detailUrl, onSelect }) {
   );
 }
 
-export default withI18n()(UserAccessListItem);
+export default withI18n()(UserRolesListItem);

awx/ui_next/src/screens/User/UserRoles/UserRolesListItem.test.jsx

@@ -1,8 +1,8 @@
 import React from 'react';
 import { mountWithContexts } from '../../../../testUtils/enzymeHelpers';
-import UserAccessListItem from './UserAccessListItem';
+import UserRolesListItem from './UserRolesListItem';
 
-describe('<UserAccessListItem/>', () => {
+describe('<UserRolesListItem/>', () => {
   let wrapper;
   const role = {
     id: 1,
@@ -19,7 +19,7 @@ describe('<UserAccessListItem/>', () => {
   };
   test('should mount properly', () => {
     wrapper = mountWithContexts(
-      <UserAccessListItem
+      <UserRolesListItem
         role={role}
         detailUrl="/templates/job_template/15/details"
       />
@@ -29,7 +29,7 @@ describe('<UserAccessListItem/>', () => {
 
   test('should render proper list item data', () => {
     wrapper = mountWithContexts(
-      <UserAccessListItem
+      <UserRolesListItem
         role={role}
         detailUrl="/templates/job_template/15/details"
       />
@@ -46,7 +46,7 @@ describe('<UserAccessListItem/>', () => {
   });
   test('should render deletable chip', () => {
     wrapper = mountWithContexts(
-      <UserAccessListItem
+      <UserRolesListItem
         role={role}
         detailUrl="/templates/job_template/15/details"
       />
@@ -56,7 +56,7 @@ describe('<UserAccessListItem/>', () => {
   test('should render read only chip', () => {
     role.summary_fields.user_capabilities.unattach = false;
     wrapper = mountWithContexts(
-      <UserAccessListItem
+      <UserRolesListItem
         role={role}
         detailUrl="/templates/job_template/15/details"
       />

awx/ui_next/src/screens/User/UserRoles/index.js

@@ -0,0 +1,2 @@
+export { default as UserRolesList } from './UserRolesList';
+export { default as UserRolesListItem } from './UserRolesListItem';

awx/ui_next/src/screens/User/Users.jsx

@@ -29,12 +29,14 @@ function Users({ i18n }) {
         [`/users/${user.id}`]: `${user.username}`,
         [`/users/${user.id}/edit`]: i18n._(t`Edit Details`),
         [`/users/${user.id}/details`]: i18n._(t`Details`),
-        [`/users/${user.id}/access`]: i18n._(t`Access`),
+        [`/users/${user.id}/roles`]: i18n._(t`Roles`),
         [`/users/${user.id}/teams`]: i18n._(t`Teams`),
         [`/users/${user.id}/organizations`]: i18n._(t`Organizations`),
         [`/users/${user.id}/tokens`]: i18n._(t`Tokens`),
         [`/users/${user.id}/tokens/add`]: i18n._(t`Create user token`),
-        [`/users/${user.id}/tokens/${token && token.id}`]: `Application Name`,
+        [`/users/${user.id}/tokens/${token && token.id}`]: i18n._(
+          t`Application Name`
+        ),
         [`/users/${user.id}/tokens/${token && token.id}/details`]: i18n._(
           t`Details`
         ),