Refactor according to review comments

packages/browser-wallet/src/popup/pages/VerifiableCredential/VerifiableCredentialCard.tsx

@@ -1,15 +1,13 @@
 import React, { PropsWithChildren } from 'react';
 import { ClassName } from 'wallet-common-helpers';
 import clsx from 'clsx';
-import { VerifiableCredentialMetadata } from '@shared/utils/verifiable-credential-helpers';
-import Img from '@popup/shared/Img';
-import { AttributeType, CredentialSubject } from '@concordium/web-sdk';
 import {
-    VerifiableCredentialStatus,
-    MetadataUrl,
-    VerifiableCredentialSchema,
+    VerifiableCredentialMetadata,
     VerifiableCredentialSchemaWithFallback,
-} from '@shared/storage/types';
+} from '@shared/utils/verifiable-credential-helpers';
+import Img from '@popup/shared/Img';
+import { AttributeType, CredentialSubject } from '@concordium/web-sdk';
+import { VerifiableCredentialStatus, MetadataUrl, VerifiableCredentialSchema } from '@shared/storage/types';
 import { useTranslation } from 'react-i18next';
 import StatusIcon from './VerifiableCredentialStatus';
 
@@ -110,10 +108,7 @@ function applySchemaAndLocalization(
 ): (value: [string, AttributeType]) => { title: string; key: string; value: AttributeType } {
     return (value: [string, AttributeType]) => {
         const attributeSchema = schema.properties.credentialSubject.properties.attributes.properties[value[0]];
-        let title = value[0];
-        if (attributeSchema) {
-            title = attributeSchema.title;
-        }
+        let title = attributeSchema ? attributeSchema.title : value[0];
 
         if (localization) {
             const localizedTitle = localization[value[0]];

packages/browser-wallet/src/popup/pages/VerifiableCredential/VerifiableCredentialDetails.tsx

@@ -1,10 +1,6 @@
 import React, { useCallback, useMemo, useState } from 'react';
 import { useAtomValue } from 'jotai';
-import {
-    VerifiableCredential,
-    VerifiableCredentialSchemaWithFallback,
-    VerifiableCredentialStatus,
-} from '@shared/storage/types';
+import { VerifiableCredential, VerifiableCredentialStatus } from '@shared/storage/types';
 import Topbar, { ButtonTypes, MenuButton } from '@popup/shared/Topbar/Topbar';
 import { useTranslation } from 'react-i18next';
 import { AccountTransactionType } from '@concordium/web-sdk';
@@ -21,6 +17,7 @@ import {
     getCredentialRegistryContractAddress,
     getRevokeTransactionExecutionEnergyEstimate,
     getContractAddressFromIssuerDID,
+    VerifiableCredentialSchemaWithFallback,
 } from '@shared/utils/verifiable-credential-helpers';
 import { fetchContractName } from '@shared/utils/token-helpers';
 import { TimeStampUnit, dateFromTimestamp, ClassName } from 'wallet-common-helpers';

packages/browser-wallet/src/popup/pages/VerifiableCredential/VerifiableCredentialHooks.tsx

@@ -1,10 +1,5 @@
 import { grpcClientAtom } from '@popup/store/settings';
-import {
-    VerifiableCredential,
-    VerifiableCredentialStatus,
-    VerifiableCredentialSchema,
-    VerifiableCredentialSchemaWithFallback,
-} from '@shared/storage/types';
+import { VerifiableCredential, VerifiableCredentialStatus } from '@shared/storage/types';
 import {
     CredentialQueryResponse,
     IssuerMetadata,
@@ -16,6 +11,7 @@ import {
     getCredentialRegistryMetadata,
     getVerifiableCredentialEntry,
     getVerifiableCredentialStatus,
+    VerifiableCredentialSchemaWithFallback,
 } from '@shared/utils/verifiable-credential-helpers';
 import { useAtomValue } from 'jotai';
 import { useEffect, useState } from 'react';
@@ -60,7 +56,7 @@ export function useCredentialStatus(credential: VerifiableCredential) {
 export function useCredentialSchema(
     credential?: VerifiableCredential
 ): VerifiableCredentialSchemaWithFallback | undefined {
-    const [schema, setSchema] = useState<VerifiableCredentialSchema & { usingFallback: boolean }>();
+    const [schema, setSchema] = useState<VerifiableCredentialSchemaWithFallback>();
     const schemas = useAtomValue(storedVerifiableCredentialSchemasAtom);
     const client = useAtomValue(grpcClientAtom);
 

packages/browser-wallet/src/popup/pages/VerifiableCredential/VerifiableCredentialList.tsx

@@ -7,14 +7,10 @@ import {
 import { useAtomValue, useAtom } from 'jotai';
 import Topbar, { ButtonTypes } from '@popup/shared/Topbar/Topbar';
 import { useTranslation } from 'react-i18next';
-import {
-    VerifiableCredential,
-    VerifiableCredentialSchema,
-    VerifiableCredentialSchemaWithFallback,
-    VerifiableCredentialStatus,
-} from '@shared/storage/types';
+import { VerifiableCredential, VerifiableCredentialSchema, VerifiableCredentialStatus } from '@shared/storage/types';
 import {
     VerifiableCredentialMetadata,
+    VerifiableCredentialSchemaWithFallback,
     getChangesToCredentialMetadata,
     getChangesToCredentialSchemas,
 } from '@shared/utils/verifiable-credential-helpers';

packages/browser-wallet/src/shared/storage/types.ts

@@ -345,5 +345,3 @@ export interface VerifiableCredentialSchema {
     properties: SchemaProperties;
     required: string[];
 }
-
-export type VerifiableCredentialSchemaWithFallback = VerifiableCredentialSchema & { usingFallback: boolean };

packages/browser-wallet/src/shared/utils/verifiable-credential-helpers.ts

@@ -13,6 +13,8 @@ import { applyExecutionNRGBuffer, getContractName } from './contract-helpers';
 import { getNet } from './network-helpers';
 import { logError } from './log-helpers';
 
+export type VerifiableCredentialSchemaWithFallback = VerifiableCredentialSchema & { usingFallback: boolean };
+
 /**
  * Extracts the credential holder id from a verifiable credential id (did).
  * @param credentialId the did for a credential