feat(technical user details): updated technical user details with use…

…r type and service endpoint fields. Also, updated copy icon color for better view and made copy icon available only when value is available
eclipse-tractusx · Sep 23, 2024 · 8eb5067 · 8eb5067
1 parent ea3ab6e
commit 8eb5067
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 31 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -2,6 +2,11 @@
 
 ## Unreleased
 
+### Change
+
+- **Technical User Details**
+  - updated technical user details with user type and service endpoint fields. Also, updated copy icon color for better view and made copy icon available only when value is available
+
 ## 2.2.0-alpha.1
 
 ### Bugfixes

diff --git a/src/components/pages/TechnicalUserDetails/TechnicalUserDetailsContent.tsx b/src/components/pages/TechnicalUserDetails/TechnicalUserDetailsContent.tsx
@@ -31,7 +31,6 @@ import {
   type ServiceAccountDetail,
   type ServiceAccountRole,
   useResetCredentialMutation,
-  UserType,
 } from 'features/admin/serviceApiSlice'
 import { OVERLAYS } from 'types/Constants'
 import { useDispatch } from 'react-redux'
@@ -52,11 +51,6 @@ export const statusColorMap: Record<
   [ServiceAccountStatus.PENDING_DELETION]: 'pending',
 }
 
-const userTypeMapping = {
-  [UserType.INTERNAL]: 'INTERNAL',
-  [UserType.EXTERNAL]: 'EXTERNAL',
-}
-
 const getValueWithTooltip = (value: string, tooltipTitle: string) => {
   return (
     value || (
@@ -129,10 +123,7 @@ export default function TechnicalUserDetailsContent({
     },
     {
       key: t('content.usermanagement.technicalUser.detailsPage.userType'),
-      value: getValueWithTooltip(
-        userTypeMapping[newData.usertype],
-        missingInformationHint
-      ),
+      value: getValueWithTooltip(newData.usertype, missingInformationHint),
       copy: false,
     },
     {

diff --git a/src/components/pages/TechnicalUserManagement/TechnicalUserTable.tsx b/src/components/pages/TechnicalUserManagement/TechnicalUserTable.tsx
@@ -30,7 +30,6 @@ import {
   ServiceAccountStatus,
   ServiceAccountStatusFilter,
   useFetchServiceAccountListQuery,
-  UserType,
 } from 'features/admin/serviceApiSlice'
 import { useSelector } from 'react-redux'
 import { PAGES } from 'types/Constants'
@@ -45,11 +44,6 @@ 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()
@@ -145,7 +139,7 @@ export const TechnicalUserTable = () => {
             headerName: t('global.field.userType'),
             flex: 1.2,
             valueGetter: ({ row }: { row: ServiceAccountListEntry }) =>
-              userTypeMapping[row.usertype] || '-',
+              row.usertype || '-',
           },
           {
             field: 'offer',

diff --git a/src/components/shared/basic/KeyValueView/index.tsx b/src/components/shared/basic/KeyValueView/index.tsx
@@ -70,9 +70,9 @@ export const KeyValueView = ({
         sx={{
           cursor: 'pointer',
           display: 'flex',
-          color: copied === item.value ? '#00cc00' : '#eeeeee',
+          color: copied === item.value ? '#00cc00' : '#888888',
           ':hover': {
-            color: copied === item.value ? '#00cc00' : '#cccccc',
+            color: copied === item.value ? '#00cc00' : '#0088CC',
           },
         }}
         onClick={async () => {
@@ -85,11 +85,14 @@ export const KeyValueView = ({
         }}
       >
         {renderValue(item.value ?? '')}
-        <ContentCopyIcon
-          sx={{
-            marginLeft: '10px',
-          }}
-        />
+        {item.value && (
+          <ContentCopyIcon
+            sx={{
+              marginLeft: '10px',
+              fontSize: '18px',
+            }}
+          />
+        )}
       </Box>
     ) : (
       <Box sx={{ marginRight: '34px', textAlign: 'left' }}>

diff --git a/src/features/admin/serviceApiSlice.ts b/src/features/admin/serviceApiSlice.ts
@@ -54,18 +54,13 @@ 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
+  usertype: string
   offer?: {
     name?: string
   }
@@ -84,7 +79,7 @@ export interface ServiceAccountDetail extends ServiceAccountListEntry {
   connector: ConnectedObject
   offer: ConnectedObject
   companyServiceAccountTypeId: companyServiceAccountType
-  usertype: UserType
+  usertype: string
   authenticationServiceUrl: string
 }