From c244cd6823edd030fc55085804aa9591a284c164 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Nuno=20G=C3=B3is?= <github@nunogois.com>
Date: Fri, 6 Jan 2023 13:07:33 +0000
Subject: [PATCH] feat: show token info when deleting SA (#2841)

https://linear.app/unleash/issue/2-544/delete-service-account-show-latest-activity-for-that-service-account


![image](https://user-images.githubusercontent.com/14320932/211002311-835c4435-4a06-446b-9585-ed7b679e3532.png)
---
 .../ServiceAccountDeleteDialog.tsx                   | 12 ++++++++++++
 .../ServiceAccountTokens/ServiceAccountTokens.tsx    |  2 +-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountDeleteDialog/ServiceAccountDeleteDialog.tsx b/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountDeleteDialog/ServiceAccountDeleteDialog.tsx
index a72ceb6322..2974ca2a49 100644
--- a/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountDeleteDialog/ServiceAccountDeleteDialog.tsx
+++ b/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountDeleteDialog/ServiceAccountDeleteDialog.tsx
@@ -1,6 +1,11 @@
 import { Alert, styled } from '@mui/material';
 import { Dialogue } from 'component/common/Dialogue/Dialogue';
 import { IUser } from 'interfaces/user';
+import { ServiceAccountTokens } from '../ServiceAccountModal/ServiceAccountTokens/ServiceAccountTokens';
+
+const StyledTableContainer = styled('div')(({ theme }) => ({
+    marginTop: theme.spacing(1.5),
+}));
 
 const StyledLabel = styled('p')(({ theme }) => ({
     marginTop: theme.spacing(3),
@@ -34,6 +39,13 @@ export const ServiceAccountDeleteDialog = ({
                 Deleting this service account may break any existing
                 implementations currently using it.
             </Alert>
+            <StyledLabel>Service account tokens</StyledLabel>
+            <StyledTableContainer>
+                <ServiceAccountTokens
+                    serviceAccount={serviceAccount!}
+                    readOnly
+                />
+            </StyledTableContainer>
             <StyledLabel>
                 You are about to delete service account:{' '}
                 <strong>{serviceAccount?.name}</strong>
diff --git a/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountModal/ServiceAccountTokens/ServiceAccountTokens.tsx b/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountModal/ServiceAccountTokens/ServiceAccountTokens.tsx
index b7047ea0c2..31bd839d44 100644
--- a/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountModal/ServiceAccountTokens/ServiceAccountTokens.tsx
+++ b/frontend/src/component/admin/serviceAccounts/ServiceAccountsTable/ServiceAccountModal/ServiceAccountTokens/ServiceAccountTokens.tsx
@@ -105,7 +105,7 @@ export const ServiceAccountTokens = ({
         usePersonalAPITokensApi();
 
     const [initialState] = useState(() => ({
-        sortBy: [defaultSort],
+        sortBy: readOnly ? [{ id: 'seenAt' }] : [defaultSort],
     }));
 
     const [searchValue, setSearchValue] = useState('');