diff --git a/awx/ui_next/src/screens/User/UserTokenList/UserTokenList.jsx b/awx/ui_next/src/screens/User/UserTokenList/UserTokenList.jsx index 315c035f4b..ac94f980af 100644 --- a/awx/ui_next/src/screens/User/UserTokenList/UserTokenList.jsx +++ b/awx/ui_next/src/screens/User/UserTokenList/UserTokenList.jsx @@ -5,7 +5,6 @@ import { t } from '@lingui/macro'; import { getQSConfig, parseQueryString } from '../../../util/qs'; import PaginatedDataList, { ToolbarAddButton, - ToolbarDeleteButton, } from '../../../components/PaginatedDataList'; import useSelected from '../../../util/useSelected'; import useRequest from '../../../util/useRequest'; @@ -39,7 +38,7 @@ function UserTokenList({ i18n }) { application: result.summary_fields.application, user_capabilities: { delete: true }, }; - result.username = result.summary_fields.user.username; + result.name = result.summary_fields.application?.name; return result; }); return { tokens: modifiedResults, itemCount: count }; @@ -114,12 +113,6 @@ function UserTokenList({ i18n }) { />, ] : []), - {}} - itemsToDelete={selected} - pluralizedItemName="Tokens" - />, ]} /> )} @@ -130,7 +123,6 @@ function UserTokenList({ i18n }) { onSelect={() => { handleSelect(token); }} - detailUrl={`${location.pathname}/details`} isSelected={selected.some(row => row.id === token.id)} /> )} diff --git a/awx/ui_next/src/screens/User/UserTokenList/UserTokenList.test.jsx b/awx/ui_next/src/screens/User/UserTokenList/UserTokenList.test.jsx index faf233b9bd..83549798bb 100644 --- a/awx/ui_next/src/screens/User/UserTokenList/UserTokenList.test.jsx +++ b/awx/ui_next/src/screens/User/UserTokenList/UserTokenList.test.jsx @@ -141,10 +141,6 @@ describe('', () => { wrapper = mountWithContexts(); }); waitForElement(wrapper, 'ContentEmpty', el => el.length === 0); - - expect(wrapper.find('Button[aria-label="Delete"]').prop('isDisabled')).toBe( - true - ); }); test('should enable edit button', async () => { @@ -165,8 +161,5 @@ describe('', () => { expect( wrapper.find('DataListCheck[id="select-token-3"]').props().checked ).toBe(true); - expect(wrapper.find('Button[aria-label="Delete"]').prop('isDisabled')).toBe( - false - ); }); }); diff --git a/awx/ui_next/src/screens/User/UserTokenList/UserTokenListItem.jsx b/awx/ui_next/src/screens/User/UserTokenList/UserTokenListItem.jsx index 6af8bd3e87..cb5e4057c5 100644 --- a/awx/ui_next/src/screens/User/UserTokenList/UserTokenListItem.jsx +++ b/awx/ui_next/src/screens/User/UserTokenList/UserTokenListItem.jsx @@ -1,7 +1,6 @@ import React from 'react'; import { withI18n } from '@lingui/react'; import { t } from '@lingui/macro'; -import { Link } from 'react-router-dom'; import { DataListItemCells, DataListCheck, @@ -9,6 +8,7 @@ import { DataListItem, } from '@patternfly/react-core'; import styled from 'styled-components'; +import { toTitleCase } from '../../../util/strings'; import { formatDateStringUTC } from '../../../util/dates'; import DataListCell from '../../../components/DataListCell'; @@ -16,7 +16,12 @@ import DataListCell from '../../../components/DataListCell'; const Label = styled.b` margin-right: 20px; `; -function UserTokenListItem({ i18n, token, isSelected, detailUrl, onSelect }) { + +const NameLabel = styled.b` + margin-right: 5px; +`; + +function UserTokenListItem({ i18n, token, isSelected, onSelect }) { const labelId = `check-action-${token.id}`; return ( @@ -29,14 +34,22 @@ function UserTokenListItem({ i18n, token, isSelected, detailUrl, onSelect }) { /> - - {token.summary_fields.application.name} - + + {token.summary_fields?.application?.name ? ( + + {i18n._(t`Application:`)} + {token.summary_fields.application.name} + + ) : ( + i18n._(t`Personal access token`) + )} , - {token.scope} + {toTitleCase(token.scope)} , diff --git a/awx/ui_next/src/screens/User/UserTokenList/UserTokenListItem.test.jsx b/awx/ui_next/src/screens/User/UserTokenList/UserTokenListItem.test.jsx index cfefda696e..fe009e4b8a 100644 --- a/awx/ui_next/src/screens/User/UserTokenList/UserTokenListItem.test.jsx +++ b/awx/ui_next/src/screens/User/UserTokenList/UserTokenListItem.test.jsx @@ -51,11 +51,11 @@ describe('', () => { ); }); expect(wrapper.find('DataListCheck').prop('checked')).toBe(false); - expect(wrapper.find('PFDataListCell[aria-label="name"]').text()).toBe( - 'app' - ); + expect( + wrapper.find('PFDataListCell[aria-label="application name"]').text() + ).toBe('Application:app'); expect(wrapper.find('PFDataListCell[aria-label="scope"]').text()).toBe( - 'Scoperead' + 'ScopeRead' ); expect(wrapper.find('PFDataListCell[aria-label="expiration"]').text()).toBe( 'Expires10/25/3019, 3:06:43 PM'