feat: add Usertype column to technical user management list (#1090)

eclipse-tractusx · Sep 17, 2024 · 531f6fb · 531f6fb
1 parent 90542d2
commit 531f6fb
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 9 deletions.
diff --git a/src/assets/locales/de/main.json b/src/assets/locales/de/main.json
@@ -2327,7 +2327,9 @@
       "alias": "Alias",
       "authMethod": "Auth Method",
       "progress": "Progress",
-      "action": "Action"
+      "action": "Action",
+      "ownership": "Ownership",
+      "userType": "Usertype"
     },
     "actions": {
       "cancel": "Abbrechen",

diff --git a/src/assets/locales/en/main.json b/src/assets/locales/en/main.json
@@ -2302,7 +2302,9 @@
       "alias": "Alias",
       "authMethod": "Auth Method",
       "progress": "Progress",
-      "action": "Action"
+      "action": "Action",
+      "ownership": "Ownership",
+      "userType": "Usertype"
     },
     "actions": {
       "cancel": "Cancel",

diff --git a/src/components/pages/TechnicalUserManagement/TechnicalUserTable.tsx b/src/components/pages/TechnicalUserManagement/TechnicalUserTable.tsx
@@ -30,6 +30,7 @@ import {
   ServiceAccountStatus,
   ServiceAccountStatusFilter,
   useFetchServiceAccountListQuery,
+  UserType,
 } from 'features/admin/serviceApiSlice'
 import { useSelector } from 'react-redux'
 import { PAGES } from 'types/Constants'
@@ -44,6 +45,11 @@ interface FetchHookArgsType {
 }
 type StatusTagColor = 'pending' | 'confirmed' | 'label' | undefined
 
+const userTypeMapping = {
+  [UserType.INTERNAL]: 'INTERNAL',
+  [UserType.EXTERNAL]: 'EXTERNAL',
+}
+
 export const TechnicalUserTable = () => {
   const { t } = useTranslation()
   const navigate = useNavigate()
@@ -122,36 +128,43 @@ export const TechnicalUserTable = () => {
           {
             field: 'name',
             headerName: t('global.field.userName'),
-            flex: 2,
+            flex: 1.8,
           },
           {
             field: 'clientId',
             headerName: t('global.field.clientId'),
-            flex: 1,
+            flex: 1.1,
           },
           {
             field: 'serviceAccountType',
-            headerName: t('global.field.type'),
+            headerName: t('global.field.ownership'),
+            flex: 1.15,
+          },
+          {
+            field: 'usertype',
+            headerName: t('global.field.userType'),
             flex: 1.2,
+            valueGetter: ({ row }: { row: ServiceAccountListEntry }) =>
+              userTypeMapping[row.usertype] || '-',
           },
           {
             field: 'offer',
             headerName: t('global.field.offerLink'),
-            flex: 1.5,
+            flex: 1.2,
             valueGetter: ({ row }: { row: ServiceAccountListEntry }) =>
               row.offer ? row.offer?.name : '',
           },
           {
             field: 'isOwner',
             headerName: t('global.field.owner'),
-            flex: 0.8,
+            flex: 0.9,
             valueGetter: ({ row }: { row: ServiceAccountListEntry }) =>
               row.isOwner ? 'Yes' : 'No',
           },
           {
             field: 'status',
             headerName: t('global.field.status'),
-            flex: 1.2,
+            flex: 1.25,
             renderCell: ({ row }: { row: ServiceAccountListEntry }) => (
               <StatusTag
                 color={statusColorMap[row.status]}
@@ -164,7 +177,7 @@ export const TechnicalUserTable = () => {
           {
             field: 'details',
             headerName: t('global.field.details'),
-            flex: 1,
+            flex: 0.9,
             renderCell: ({ row }: { row: ServiceAccountListEntry }) => (
               <>
                 <IconButton

diff --git a/src/features/admin/serviceApiSlice.ts b/src/features/admin/serviceApiSlice.ts
@@ -54,12 +54,17 @@ export enum ServiceAccountStatus {
   PENDING_DELETION = 'PENDING_DELETION',
 }
 
+export enum UserType {
+  INTERNAL = 'internal',
+  EXTERNAL = 'external',
+}
 export interface ServiceAccountListEntry {
   serviceAccountId: string
   clientId: string
   name: string
   status: ServiceAccountStatus
   isOwner?: boolean
+  usertype: UserType
   offer?: {
     name?: string
   }