From 74dba9506dba104d918c5386e67146f71f07436c Mon Sep 17 00:00:00 2001
From: Sebastian <sebasjm@gmail.com>
Date: Wed, 29 Mar 2023 15:14:02 -0300
Subject: show wire details when the deposit has been wired

---
 .../src/wallet/Transaction.tsx                     | 68 +++++++++++++++++++---
 1 file changed, 61 insertions(+), 7 deletions(-)

(limited to 'packages/taler-wallet-webextension/src/wallet')

diff --git a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
index 217a77575..a9683f680 100644
--- a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
@@ -28,6 +28,7 @@ import {
   stringifyPaytoUri,
   TalerProtocolTimestamp,
   Transaction,
+  TransactionDeposit,
   TransactionType,
   TranslatedString,
   WithdrawalType,
@@ -714,13 +715,24 @@ export function TransactionView({
             }}
           />
         ) : transaction.wireTransferProgress === 100 ? (
-          <AlertView
-            alert={{
-              type: "success",
-              message: i18n.str`Wire transfer completed`,
-              description: i18n.str` `,
-            }}
-          />
+          <Fragment>
+            <AlertView
+              alert={{
+                type: "success",
+                message: i18n.str`Wire transfer completed`,
+                description: i18n.str` `,
+              }}
+            />
+            <Part
+              title={i18n.str`Transfer details`}
+              text={
+                <TrackingDepositDetails
+                  trackingState={transaction.trackingState}
+                />
+              }
+              kind="neutral"
+            />
+          </Fragment>
         ) : (
           <AlertView
             alert={{
@@ -1559,6 +1571,48 @@ function RefundDetails({ amount }: { amount: AmountWithFee }): VNode {
   );
 }
 
+function TrackingDepositDetails({
+  trackingState,
+}: {
+  trackingState: TransactionDeposit["trackingState"];
+}): VNode {
+  const { i18n } = useTranslationContext();
+
+  const trackByWtid = Object.values(trackingState ?? {}).reduce((prev, cur) => {
+    const am = Amounts.parseOrThrow(cur.amountEffective);
+    const sum = !prev[cur.wireTransferId]
+      ? am
+      : Amounts.add(prev[cur.wireTransferId], am).amount;
+    prev[cur.wireTransferId] = sum;
+    return prev;
+  }, {} as Record<string, AmountJson>);
+  const wireTransfers = Object.entries(trackByWtid).map(([id, amountJson]) => ({
+    id,
+    amount: Amounts.stringify(amountJson),
+  }));
+
+  return (
+    <PurchaseDetailsTable>
+      <tr>
+        <td>
+          <i18n.Translate>Transfer identification</i18n.Translate>
+        </td>
+        <td>
+          <i18n.Translate>Amount</i18n.Translate>
+        </td>
+      </tr>
+
+      {wireTransfers.map((wire) => (
+        <tr>
+          <td>{wire.id}</td>
+          <td>
+            <Amount value={wire.amount} />
+          </td>
+        </tr>
+      ))}
+    </PurchaseDetailsTable>
+  );
+}
 function DepositDetails({ amount }: { amount: AmountWithFee }): VNode {
   const { i18n } = useTranslationContext();
 
-- 
cgit v1.2.3