From 0d2bc750e8222cfe926afbded2ea96c152e85331 Mon Sep 17 00:00:00 2001
From: nixocio <nixocio@gmail.com>
Date: Thu, 29 Jul 2021 15:32:06 -0400
Subject: [PATCH] Show PAT as part of bulk delete list

* Show PAT as part of bulk delete list
* Update tooltip message in how to create a Personal Access Token

See: https://github.com/ansible/awx/issues/8680
---
 awx/ui/src/components/DeleteButton/DeleteButton.js |  1 -
 .../screens/Application/shared/ApplicationForm.js  |  2 +-
 .../User/UserTokenDetail/UserTokenDetail.js        |  2 +-
 .../screens/User/UserTokenList/UserTokenList.js    | 14 ++++++++++++--
 .../User/UserTokenList/UserTokenListItem.js        |  2 +-
 awx/ui/src/screens/User/shared/UserTokenForm.js    |  2 +-
 6 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/awx/ui/src/components/DeleteButton/DeleteButton.js b/awx/ui/src/components/DeleteButton/DeleteButton.js
index 95df137103..a3e4b0ad94 100644
--- a/awx/ui/src/components/DeleteButton/DeleteButton.js
+++ b/awx/ui/src/components/DeleteButton/DeleteButton.js
@@ -20,7 +20,6 @@ function DeleteButton({
   onConfirm,
   modalTitle,
   name,
-
   variant,
   children,
   isDisabled,
diff --git a/awx/ui/src/screens/Application/shared/ApplicationForm.js b/awx/ui/src/screens/Application/shared/ApplicationForm.js
index db77085e1b..a374bc65e2 100644
--- a/awx/ui/src/screens/Application/shared/ApplicationForm.js
+++ b/awx/ui/src/screens/Application/shared/ApplicationForm.js
@@ -83,7 +83,7 @@ function ApplicationFormFields({
         label={t`Authorization grant type`}
         labelIcon={
           <Popover
-            content={t`The Grant type the user must use for acquire tokens for this application`}
+            content={t`The Grant type the user must use to acquire tokens for this application`}
           />
         }
       >
diff --git a/awx/ui/src/screens/User/UserTokenDetail/UserTokenDetail.js b/awx/ui/src/screens/User/UserTokenDetail/UserTokenDetail.js
index 921e8600b3..7507da3414 100644
--- a/awx/ui/src/screens/User/UserTokenDetail/UserTokenDetail.js
+++ b/awx/ui/src/screens/User/UserTokenDetail/UserTokenDetail.js
@@ -68,7 +68,7 @@ function UserTokenDetail({ token }) {
       </DetailList>
       <CardActionsRow>
         <DeleteButton
-          name={summary_fields?.application?.name}
+          name={summary_fields?.application?.name || t`Personal Access Token`}
           modalTitle={t`Delete User Token`}
           onConfirm={deleteToken}
           isDisabled={isLoading}
diff --git a/awx/ui/src/screens/User/UserTokenList/UserTokenList.js b/awx/ui/src/screens/User/UserTokenList/UserTokenList.js
index ec0289e458..99ca239ada 100644
--- a/awx/ui/src/screens/User/UserTokenList/UserTokenList.js
+++ b/awx/ui/src/screens/User/UserTokenList/UserTokenList.js
@@ -99,6 +99,16 @@ function UserTokenList() {
 
   const canAdd = true;
 
+  const modifiedSelected = selected.map((item) => {
+    if (item.application === null) {
+      return {
+        ...item,
+        name: t`Personal Access Token`,
+      };
+    }
+    return item;
+  });
+
   return (
     <>
       <PaginatedTable
@@ -162,7 +172,7 @@ function UserTokenList() {
               <ToolbarDeleteButton
                 key="delete"
                 onDelete={handleDelete}
-                itemsToDelete={selected}
+                itemsToDelete={modifiedSelected}
                 pluralizedItemName={t`User tokens`}
               />,
             ]}
@@ -170,7 +180,7 @@ function UserTokenList() {
         )}
         headerRow={
           <HeaderRow qsConfig={QS_CONFIG}>
-            <HeaderCell sortKey="application__name">{t`Name`}</HeaderCell>
+            <HeaderCell sortKey="application__name">{t`Application Name`}</HeaderCell>
             <HeaderCell sortKey="scope">{t`Scope`}</HeaderCell>
             <HeaderCell sortKey="expires">{t`Expires`}</HeaderCell>
           </HeaderRow>
diff --git a/awx/ui/src/screens/User/UserTokenList/UserTokenListItem.js b/awx/ui/src/screens/User/UserTokenList/UserTokenListItem.js
index 3830d19f64..7d4a20ec7d 100644
--- a/awx/ui/src/screens/User/UserTokenList/UserTokenListItem.js
+++ b/awx/ui/src/screens/User/UserTokenList/UserTokenListItem.js
@@ -21,7 +21,7 @@ function UserTokenListItem({ token, isSelected, onSelect, rowIndex }) {
         <Link to={`/users/${id}/tokens/${token.id}/details`}>
           {token.summary_fields?.application
             ? token.summary_fields.application.name
-            : `Personal access token`}
+            : t`Personal access token`}
         </Link>
       </Td>
       <Td dataLabel={t`Scope`}>{toTitleCase(token.scope)}</Td>
diff --git a/awx/ui/src/screens/User/shared/UserTokenForm.js b/awx/ui/src/screens/User/shared/UserTokenForm.js
index 08cec5d84b..b801f2cdc6 100644
--- a/awx/ui/src/screens/User/shared/UserTokenForm.js
+++ b/awx/ui/src/screens/User/shared/UserTokenForm.js
@@ -46,7 +46,7 @@ function UserTokenFormFields() {
             <span>
               {t`Application`}
               <Popover
-                content={t`Select the application that this token will belong to.`}
+                content={t`Select the application that this token will belong to, or leave this field empty to create a Personal Access Token.`}
               />
             </span>
           }