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)

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>

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('');