1 files changed, 60 insertions, 8 deletions
diff --git a/packages/taler-wallet-webextension/src/components/HistoryItem.tsx b/packages/taler-wallet-webextension/src/components/HistoryItem.tsx
index 4b44365ea..9be9326b2 100644
--- a/packages/taler-wallet-webextension/src/components/HistoryItem.tsx
+++ b/packages/taler-wallet-webextension/src/components/HistoryItem.tsx
@@ -23,6 +23,8 @@ import {
   TransactionType,
   WithdrawalType,
   TransactionMajorState,
+  DenomLossEventType,
+  parsePaytoUri,
 } from "@gnu-taler/taler-util";
 import { h, VNode } from "preact";
 import { useTranslationContext } from "@gnu-taler/web-util/browser";
@@ -134,10 +136,6 @@ export function HistoryItem(props: { tx: Transaction }): VNode {
           }
         />
       );
-    case TransactionType.Reward:
-      return (
-        <div>not supported</div>
-      );
     case TransactionType.Refresh:
       return (
         <Layout
@@ -155,13 +153,16 @@ export function HistoryItem(props: { tx: Transaction }): VNode {
           }
         />
       );
-    case TransactionType.Deposit:
+    case TransactionType.Deposit:{
+      const payto = parsePaytoUri(tx.targetPaytoUri);
+      const title = payto === undefined || !payto.isKnown ? tx.targetPaytoUri : 
+        payto.params["receiver-name"] ;
       return (
         <Layout
           id={tx.transactionId}
           amount={tx.amountEffective}
           debitCreditIndicator={"debit"}
-          title={tx.targetPaytoUri}
+          title={title}
           timestamp={AbsoluteTime.fromPreciseTimestamp(tx.timestamp)}
           iconPath={"D"}
           currentState={tx.txState.major}
@@ -172,6 +173,7 @@ export function HistoryItem(props: { tx: Transaction }): VNode {
           }
         />
       );
+    }
     case TransactionType.PeerPullCredit:
       return (
         <Layout
@@ -240,6 +242,56 @@ export function HistoryItem(props: { tx: Transaction }): VNode {
           }
         />
       );
+    case TransactionType.DenomLoss: {
+      switch (tx.lossEventType) {
+        case DenomLossEventType.DenomExpired: {
+          return (
+            <Layout
+              id={tx.transactionId}
+              amount={tx.amountEffective}
+              debitCreditIndicator={"debit"}
+              title={i18n.str`Denomination expired`}
+              timestamp={AbsoluteTime.fromPreciseTimestamp(tx.timestamp)}
+              iconPath={"L"}
+              currentState={tx.txState.major}
+              description={undefined}
+            />
+          );
+        }
+        case DenomLossEventType.DenomVanished: {
+          return (
+            <Layout
+              id={tx.transactionId}
+              amount={tx.amountEffective}
+              debitCreditIndicator={"debit"}
+              title={i18n.str`Denomination vanished`}
+              timestamp={AbsoluteTime.fromPreciseTimestamp(tx.timestamp)}
+              iconPath={"L"}
+              currentState={tx.txState.major}
+              description={undefined}
+            />
+          );
+        }
+        case DenomLossEventType.DenomUnoffered: {
+          return (
+            <Layout
+              id={tx.transactionId}
+              amount={tx.amountEffective}
+              debitCreditIndicator={"debit"}
+              title={i18n.str`Denomination unoffered`}
+              timestamp={AbsoluteTime.fromPreciseTimestamp(tx.timestamp)}
+              iconPath={"L"}
+              currentState={tx.txState.major}
+              description={undefined}
+            />
+          );
+        }
+        default: {
+          assertUnreachable(tx.lossEventType);
+        }
+      }
+      break;
+    }
     case TransactionType.Recoup:
       throw Error("recoup transaction not implemented");
     default: {
@@ -256,12 +308,12 @@ function Layout(props: LayoutProps): VNode {
       style={{
         backgroundColor:
           props.currentState === TransactionMajorState.Pending ||
-            props.currentState === TransactionMajorState.Dialog
+          props.currentState === TransactionMajorState.Dialog
             ? "lightcyan"
             : props.currentState === TransactionMajorState.Failed
               ? "#ff000040"
               : props.currentState === TransactionMajorState.Aborted ||
-                props.currentState === TransactionMajorState.Aborting
+                  props.currentState === TransactionMajorState.Aborting
                 ? "#00000010"
                 : "inherit",
         alignItems: "center",