feat(technical user details): update technical user details (#1137)

eclipse-tractusx · Sep 24, 2024 · 7445b56 · 7445b56
1 parent f251717
commit 7445b56
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 31 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -4,6 +4,8 @@
 
 ### 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 [#1137](https://github.com/eclipse-tractusx/portal-frontend/pull/1137)
 - **Company Subscriptions**
   - update API query parameters and fix tab UI scroll [#1131](https://github.com/eclipse-tractusx/portal-frontend/pull/1131)
 

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
 }