From 85f5444e8e42437cd84b60cfefd50c18d236c303 Mon Sep 17 00:00:00 2001
From: Hjort <shj@concordium.com>
Date: Thu, 24 Aug 2023 13:19:20 +0200
Subject: [PATCH] Add contract address to verifiableCredentialDetails

---
 packages/browser-wallet/CHANGELOG.md          |  4 +++
 .../VerifiableCredentialDetails.tsx           | 29 +++++++++----------
 .../pages/VerifiableCredential/i18n/da.ts     |  1 +
 .../pages/VerifiableCredential/i18n/en.ts     |  1 +
 4 files changed, 19 insertions(+), 16 deletions(-)

diff --git a/packages/browser-wallet/CHANGELOG.md b/packages/browser-wallet/CHANGELOG.md
index e1015b688..a609f8b9c 100644
--- a/packages/browser-wallet/CHANGELOG.md
+++ b/packages/browser-wallet/CHANGELOG.md
@@ -2,6 +2,10 @@
 
 ## Unreleased
 
+### Added
+
+-   Display contract address of issuer in verifiable credential details.
+
 ### Fixed
 
 -   Incorrect verifiable presentations created, due to incorrect identity/identityProviderIndex used.
diff --git a/packages/browser-wallet/src/popup/pages/VerifiableCredential/VerifiableCredentialDetails.tsx b/packages/browser-wallet/src/popup/pages/VerifiableCredential/VerifiableCredentialDetails.tsx
index 7c74de008..ad1148a08 100644
--- a/packages/browser-wallet/src/popup/pages/VerifiableCredential/VerifiableCredentialDetails.tsx
+++ b/packages/browser-wallet/src/popup/pages/VerifiableCredential/VerifiableCredentialDetails.tsx
@@ -16,6 +16,7 @@ import {
     getCredentialHolderId,
     getCredentialRegistryContractAddress,
     getRevokeTransactionExecutionEnergyEstimate,
+    getContractAddressFromIssuerDID,
 } from '@shared/utils/verifiable-credential-helpers';
 import { fetchContractName } from '@shared/utils/token-helpers';
 import { TimeStampUnit, dateFromTimestamp, ClassName } from 'wallet-common-helpers';
@@ -36,38 +37,34 @@ import { DisplayAttribute, VerifiableCredentialCard, VerifiableCredentialCardHea
 function DisplayIssuerMetadata({ issuer }: { issuer: string }) {
     const { t } = useTranslation('verifiableCredential');
     const issuerMetadata = useIssuerMetadata(issuer);
-
-    if (
-        issuerMetadata === undefined ||
-        (issuerMetadata.description === undefined &&
-            issuerMetadata.icon === undefined &&
-            issuerMetadata.name === undefined &&
-            issuerMetadata.url === undefined)
-    ) {
-        return null;
-    }
+    const issuerContract = getContractAddressFromIssuerDID(issuer);
 
     return (
         <div className="verifiable-credential__body-attributes">
             <h3>{t('details.issuer.title')}</h3>
-            {issuerMetadata.icon && <Img className="issuer-logo" src={issuerMetadata.icon.url} withDefaults />}
-            {issuerMetadata.name && (
+            <DisplayAttribute
+                attributeKey="issuerContract"
+                attributeTitle={t('details.issuer.contract')}
+                attributeValue={`${issuerContract.index.toString()} (${issuerContract.subindex.toString()})`}
+            />
+            {issuerMetadata?.icon && <Img className="issuer-logo" src={issuerMetadata.icon.url} withDefaults />}
+            {issuerMetadata?.name && (
                 <DisplayAttribute
                     attributeKey="issuerName"
                     attributeTitle={t('details.issuer.name')}
                     attributeValue={issuerMetadata.name}
                 />
             )}
-            {issuerMetadata.description && (
+            {issuerMetadata?.description && (
                 <DisplayAttribute
-                    attributeKey="issuerName"
+                    attributeKey="issuerDescription"
                     attributeTitle={t('details.issuer.description')}
                     attributeValue={issuerMetadata.description}
                 />
             )}
-            {issuerMetadata.url && (
+            {issuerMetadata?.url && (
                 <DisplayAttribute
-                    attributeKey="issuerName"
+                    attributeKey="issuerUrl"
                     attributeTitle={t('details.issuer.url')}
                     attributeValue={issuerMetadata.url}
                 />
diff --git a/packages/browser-wallet/src/popup/pages/VerifiableCredential/i18n/da.ts b/packages/browser-wallet/src/popup/pages/VerifiableCredential/i18n/da.ts
index 62c3f003f..dd0a11dbe 100644
--- a/packages/browser-wallet/src/popup/pages/VerifiableCredential/i18n/da.ts
+++ b/packages/browser-wallet/src/popup/pages/VerifiableCredential/i18n/da.ts
@@ -17,6 +17,7 @@ const t: typeof en = {
         validUntil: 'Gyldig indtil',
         issuer: {
             title: 'Udstedt af',
+            contract: 'kontraktindeks, subindeks',
             name: 'Navn',
             description: 'Beskrivelse',
             url: 'Hjemmeside',
diff --git a/packages/browser-wallet/src/popup/pages/VerifiableCredential/i18n/en.ts b/packages/browser-wallet/src/popup/pages/VerifiableCredential/i18n/en.ts
index aec8ad541..45beb1f66 100644
--- a/packages/browser-wallet/src/popup/pages/VerifiableCredential/i18n/en.ts
+++ b/packages/browser-wallet/src/popup/pages/VerifiableCredential/i18n/en.ts
@@ -15,6 +15,7 @@ const t = {
         validUntil: 'Valid until',
         issuer: {
             title: 'Issued by',
+            contract: 'contract index, subindex',
             name: 'Name',
             description: 'Description',
             url: 'Website',