diff --git a/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountDeleteDialog/ServiceAccountDeleteDialog.tsx b/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountDeleteDialog/ServiceAccountDeleteDialog.tsx
index be112d15f6..caf2674d3e 100644
--- a/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountDeleteDialog/ServiceAccountDeleteDialog.tsx
+++ b/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountDeleteDialog/ServiceAccountDeleteDialog.tsx
@@ -25,6 +25,13 @@ export const ServiceAccountDeleteDialog = ({
setOpen,
onConfirm,
}: IServiceAccountDeleteDialogProps) => {
+ const deleteMessage = (
+ <>
+ You are about to delete service account:{' '}
+ {serviceAccount?.name}
+ >
+ );
+
return (
-
- Deleting this service account may break any existing
- implementations currently using it.
-
- Service account tokens
+
+ Deleting this service account may break any existing
+ implementations currently using it.
+
+ {deleteMessage}
+ Service account tokens:
>
}
+ elseShow={{deleteMessage}
}
/>
-
- You are about to delete service account:{' '}
- {serviceAccount?.name}
-
);
};
diff --git a/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountTokensCell/ServiceAccountTokensCell.tsx b/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountTokensCell/ServiceAccountTokensCell.tsx
index f001b92c1e..cfdf5d90d9 100644
--- a/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountTokensCell/ServiceAccountTokensCell.tsx
+++ b/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountTokensCell/ServiceAccountTokensCell.tsx
@@ -5,6 +5,7 @@ import { HtmlTooltip } from 'component/common/HtmlTooltip/HtmlTooltip';
import { Highlighter } from 'component/common/Highlighter/Highlighter';
import { useSearchHighlightContext } from 'component/common/Table/SearchHighlightContext/SearchHighlightContext';
import { IServiceAccount } from 'interfaces/service-account';
+import { LinkCell } from 'component/common/Table/cells/LinkCell/LinkCell';
const StyledItem = styled(Typography)(({ theme }) => ({
fontSize: theme.fontSizes.smallerBody,
@@ -17,27 +18,27 @@ const StyledLink = styled(Link, {
}));
interface IServiceAccountTokensCellProps {
- row: {
- original: IServiceAccount;
- };
+ serviceAccount: IServiceAccount;
value: string;
+ onCreateToken: () => void;
}
export const ServiceAccountTokensCell: VFC = ({
- row,
+ serviceAccount,
value,
+ onCreateToken,
}) => {
const { searchQuery } = useSearchHighlightContext();
- if (!row.original.tokens || row.original.tokens.length === 0)
- return ;
+ if (!serviceAccount.tokens || serviceAccount.tokens.length === 0)
+ return ;
return (
- {row.original.tokens?.map(({ id, description }) => (
+ {serviceAccount.tokens?.map(({ id, description }) => (
{description}
@@ -54,9 +55,9 @@ export const ServiceAccountTokensCell: VFC = ({
value.toLowerCase().includes(searchQuery.toLowerCase())
}
>
- {row.original.tokens?.length === 1
+ {serviceAccount.tokens?.length === 1
? '1 token'
- : `${row.original.tokens?.length} tokens`}
+ : `${serviceAccount.tokens?.length} tokens`}
diff --git a/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountsTable.tsx b/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountsTable.tsx
index 72cd5c02b8..a2c0761e2d 100644
--- a/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountsTable.tsx
+++ b/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountsTable.tsx
@@ -65,9 +65,9 @@ export const ServiceAccountsTable = () => {
{
Header: 'Avatar',
accessor: 'imageUrl',
- Cell: ({ row: { original: user } }: any) => (
+ Cell: ({ row: { original: serviceAccount } }: any) => (
-
+
),
disableSortBy: true,
@@ -78,8 +78,11 @@ export const ServiceAccountsTable = () => {
Header: 'Name',
accessor: (row: any) => row.name || '',
minWidth: 200,
- Cell: ({ row: { original: user } }: any) => (
-
+ Cell: ({ row: { original: serviceAccount } }: any) => (
+
),
searchable: true,
},
@@ -98,7 +101,22 @@ export const ServiceAccountsTable = () => {
row.tokens
?.map(({ description }) => description)
.join('\n') || '',
- Cell: ServiceAccountTokensCell,
+ Cell: ({
+ row: { original: serviceAccount },
+ value,
+ }: {
+ row: { original: IServiceAccount };
+ value: string;
+ }) => (
+ {
+ setSelectedServiceAccount(serviceAccount);
+ setModalOpen(true);
+ }}
+ />
+ ),
searchable: true,
},
{
@@ -126,14 +144,14 @@ export const ServiceAccountsTable = () => {
Header: 'Actions',
id: 'Actions',
align: 'center',
- Cell: ({ row: { original: user } }: any) => (
+ Cell: ({ row: { original: serviceAccount } }: any) => (
{
- setSelectedServiceAccount(user);
+ setSelectedServiceAccount(serviceAccount);
setModalOpen(true);
}}
onDelete={() => {
- setSelectedServiceAccount(user);
+ setSelectedServiceAccount(serviceAccount);
setDeleteOpen(true);
}}
/>