wip #8424

3 files changed, 54 insertions, 63 deletions

diff --git a/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx b/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx
index bf77174df..3bcf2d6ba 100644
--- a/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx
+++ b/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx
@@ -83,7 +83,7 @@ export function BankDetailsByPaytoType({
       {accounts.length > 1 ?
         <Fragment>
           {accounts.map((ac, acIdx) => {
-            return <Button variant={acIdx === index ? "contained" : "outlined"}
+            return <Button key={acIdx} variant={acIdx === index ? "contained" : "outlined"}
               onClick={async () => {
                 setIndex(acIdx)
               }}
diff --git a/packages/taler-wallet-webextension/src/popup/NoBalanceHelp.tsx b/packages/taler-wallet-webextension/src/popup/NoBalanceHelp.tsx
index 2fc21bb56..c698066e7 100644
--- a/packages/taler-wallet-webextension/src/popup/NoBalanceHelp.tsx
+++ b/packages/taler-wallet-webextension/src/popup/NoBalanceHelp.tsx
@@ -45,7 +45,7 @@ export function NoBalanceHelp({
         </Button>
       </Alert>
     </Paper>
-    <a href="https://demo.taler.net/" style={{ display: "block" }}>
+    <a target="_bank" rel="noreferrer" href="https://demo.taler.net/" style={{ display: "block" }}>
       <i18n.Translate>Try the demo bank and withdraw test money.</i18n.Translate> »
     </a>
   </Fragment>
diff --git a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
index 11fb88cf6..70a6e5491 100644
--- a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
@@ -231,13 +231,13 @@ function TransactionTemplate({
     <Fragment>
       <section style={{ padding: 8, textAlign: "center" }}>
         {transaction?.error &&
-          // FIXME: wallet core should stop sending this error on KYC
-          transaction.error.code !==
+        // FIXME: wallet core should stop sending this error on KYC
+        transaction.error.code !==
           TalerErrorCode.WALLET_WITHDRAWAL_KYC_REQUIRED ? (
           <ErrorAlertView
             error={alertFromError(
               i18n,
-              i18n.str`There was an error trying to complete the transaction`,
+              i18n.str`There was an error trying to complete the transaction.`,
               transaction.error,
             )}
           />
@@ -246,7 +246,7 @@ function TransactionTemplate({
           <AlertView
             alert={{
               type: "warning",
-              message: i18n.str`KYC check required for the transaction to complete`,
+              message: i18n.str`KYC check required for the transaction to complete.`,
               description:
                 transaction.kycUrl && typeof transaction.kycUrl === "string" ? (
                   <div>
@@ -257,12 +257,12 @@ function TransactionTemplate({
                         target="_bank"
                         href={transaction.kycUrl}
                       >
-                        KYC verifier
+                        KYC verifier.
                       </a>
                     </i18n.Translate>
                   </div>
                 ) : (
-                  i18n.str`No more information has been provided`
+                  i18n.str`No additional information has been provided.`
                 ),
             }}
           />
@@ -271,7 +271,7 @@ function TransactionTemplate({
           <WarningBox>
             <i18n.Translate>
               The transaction has been blocked since the account required an AML
-              check
+              check.
             </i18n.Translate>
           </WarningBox>
         )}
@@ -291,12 +291,12 @@ function TransactionTemplate({
         )}
         {transaction.txState.major === TransactionMajorState.Aborted && (
           <InfoBox>
-            <i18n.Translate>This transaction was aborted</i18n.Translate>
+            <i18n.Translate>This transaction was aborted.</i18n.Translate>
           </InfoBox>
         )}
         {transaction.txState.major === TransactionMajorState.Failed && (
           <ErrorBox>
-            <i18n.Translate>This transaction failed</i18n.Translate>
+            <i18n.Translate>This transaction failed.</i18n.Translate>
           </ErrorBox>
         )}
         {confirmBeforeForget ? (
@@ -427,7 +427,7 @@ export function TransactionView({
   transaction,
   onDelete,
   onAbort,
-  onBack,
+  // onBack,
   onResume,
   onSuspend,
   onRetry,
@@ -444,10 +444,13 @@ export function TransactionView({
     transaction.type === TransactionType.Withdrawal ||
     transaction.type === TransactionType.InternalWithdrawal
   ) {
-    const conversion =
-      transaction.withdrawalDetails.type === WithdrawalType.ManualTransfer
-        ? transaction.withdrawalDetails.exchangeCreditAccountDetails ?? []
-        : [];
+    // const conversion =
+    //   transaction.withdrawalDetails.type === WithdrawalType.ManualTransfer
+    //     ? transaction.withdrawalDetails.exchangeCreditAccountDetails ?? []
+    //     : [];
+    const blockedByKycOrAml =
+      transaction.txState.minor === TransactionMinorState.KycRequired ||
+      transaction.txState.minor === TransactionMinorState.AmlRequired;
     return (
       <TransactionTemplate
         transaction={transaction}
@@ -467,30 +470,32 @@ export function TransactionView({
           {transaction.exchangeBaseUrl}
         </Header>
 
-        {transaction.txState.major !==
-          TransactionMajorState.Pending ? undefined : transaction.txState
-            .minor === TransactionMinorState.KycRequired ||
-            transaction.txState.minor ===
-            TransactionMinorState.AmlRequired ? undefined : transaction
-              .withdrawalDetails.type === WithdrawalType.ManualTransfer
-              && transaction.withdrawalDetails.exchangeCreditAccountDetails ? (
+        {transaction.txState.major !== TransactionMajorState.Pending ||
+        blockedByKycOrAml ? undefined : transaction.withdrawalDetails.type ===
+            WithdrawalType.ManualTransfer &&
+          transaction.withdrawalDetails.exchangeCreditAccountDetails ? (
           <Fragment>
             <InfoBox>
-              {transaction.withdrawalDetails.exchangeCreditAccountDetails.length > 1 ?
+              {transaction.withdrawalDetails.exchangeCreditAccountDetails
+                .length > 1 ? (
                 <span>
                   <i18n.Translate>
-                    Now the payment service provider is waiting for <Amount value={raw} /> to
-                    be transferred. Select one of the accounts and use the information below
-                    to complete the operation by making a wire transfer from your bank account.
+                    Now the payment service provider is waiting for{" "}
+                    <Amount value={raw} /> to be transferred. Select one of the
+                    accounts and use the information below to complete the
+                    operation by making a wire transfer from your bank account.
                   </i18n.Translate>
                 </span>
-                :
-                <span><i18n.Translate>
-                  Now the payment service provider is waiting for <Amount value={raw} /> to
-                  be transferred. Use the information below to complete the operation
-                  by making a wire transfer from your bank account.
-                </i18n.Translate></span>}
-
+              ) : (
+                <span>
+                  <i18n.Translate>
+                    Now the payment service provider is waiting for{" "}
+                    <Amount value={raw} /> to be transferred. Use the
+                    information below to complete the operation by making a wire
+                    transfer from your bank account.
+                  </i18n.Translate>
+                </span>
+              )}
             </InfoBox>
             <BankDetailsByPaytoType
               amount={raw}
@@ -571,7 +576,7 @@ export function TransactionView({
                               tid: r.transactionId,
                             })}
                           >
-                            was refunded
+                            Was refunded
                           </a>{" "}
                           on{" "}
                           {
@@ -582,6 +587,7 @@ export function TransactionView({
                               format="dd MMMM yyyy"
                             />
                           }
+                          .
                         </i18n.Translate>
                       </td>
                     </tr>
@@ -696,7 +702,7 @@ export function TransactionView({
         />
         {!shouldBeWired ? (
           <Part
-            title={i18n.str`Wire transfer deadline`}
+            title={i18n.str`Wire transfer deadline.`}
             text={
               <Time timestamp={wireTime} format="dd MMMM yyyy 'at' HH:mm" />
             }
@@ -706,7 +712,7 @@ export function TransactionView({
           <AlertView
             alert={{
               type: "warning",
-              message: i18n.str`Wire transfer is not initiated`,
+              message: i18n.str`Wire transfer is not initiated.`,
               description: i18n.str` `,
             }}
           />
@@ -715,7 +721,7 @@ export function TransactionView({
             <AlertView
               alert={{
                 type: "success",
-                message: i18n.str`Wire transfer completed`,
+                message: i18n.str`Wire transfer completed.`,
                 description: i18n.str` `,
               }}
             />
@@ -733,7 +739,7 @@ export function TransactionView({
           <AlertView
             alert={{
               type: "info",
-              message: i18n.str`Wire transfer in progress`,
+              message: i18n.str`Wire transfer in progress.`,
               description: i18n.str` `,
             }}
           />
@@ -1126,10 +1132,9 @@ export function TransactionView({
         );
       }
       default: {
-        assertUnreachable(transaction.lossEventType)
+        assertUnreachable(transaction.lossEventType);
       }
     }
-
   }
   if (transaction.type === TransactionType.Recoup) {
     throw Error("recoup transaction not implemented");
@@ -1529,12 +1534,6 @@ export function WithdrawDetails({
 }): VNode {
   const { i18n } = useTranslationContext();
 
-  const maxFrac = [amount.fee, amount.fee]
-    .map((a) => Amounts.maxFractionalDigits(a))
-    .reduce((c, p) => Math.max(c, p), 0);
-
-  const total = Amounts.add(amount.value, amount.fee).amount;
-
   return (
     <PurchaseDetailsTable>
       {conversion ? (
@@ -1548,7 +1547,7 @@ export function WithdrawDetails({
             </td>
           </tr>
           {conversion.fraction === amount.value.fraction &&
-            conversion.value === amount.value.value ? undefined : (
+          conversion.value === amount.value.value ? undefined : (
             <tr>
               <td>
                 <i18n.Translate>Converted</i18n.Translate>
@@ -1599,7 +1598,7 @@ export function WithdrawDetails({
 export function PurchaseDetails({
   price,
   effectiveRefund,
-  info,
+  info: _info,
   proposalId,
 }: {
   price: AmountWithFee;
@@ -1611,15 +1610,6 @@ export function PurchaseDetails({
 
   const total = Amounts.add(price.value, price.fee).amount;
 
-  // const hasProducts = info.products && info.products.length > 0;
-
-  // const hasShipping =
-  //   info.delivery_date !== undefined || info.delivery_location !== undefined;
-
-  const showLargePic = (): void => {
-    return;
-  };
-
   return (
     <PurchaseDetailsTable>
       <tr>
@@ -1845,7 +1835,7 @@ function TrackingDepositDetails({
       </tr>
 
       {wireTransfers.map((wire) => (
-        <tr>
+        <tr key={wire.id}>
           <td>{wire.id}</td>
           <td>
             <Amount value={wire.amount} />
@@ -2081,8 +2071,9 @@ function ShowWithdrawalDetailForBankIntegrated({
   if (
     transaction.txState.major !== TransactionMajorState.Pending ||
     transaction.withdrawalDetails.type === WithdrawalType.ManualTransfer
-  )
+  ) {
     return <Fragment />;
+  }
   const raw = Amounts.parseOrThrow(transaction.amountRaw);
   return (
     <Fragment>
@@ -2094,7 +2085,7 @@ function ShowWithdrawalDetailForBankIntegrated({
             setShowDetails(!showDetails);
           }}
         >
-          show details
+          Show details.
         </a>
       </EnabledBySettings>
 
@@ -2108,7 +2099,7 @@ function ShowWithdrawalDetailForBankIntegrated({
         />
       )}
       {!transaction.withdrawalDetails.confirmed &&
-        transaction.withdrawalDetails.bankConfirmationUrl ? (
+      transaction.withdrawalDetails.bankConfirmationUrl ? (
         <InfoBox>
           <div style={{ display: "block" }}>
             <i18n.Translate>
@@ -2131,7 +2122,7 @@ function ShowWithdrawalDetailForBankIntegrated({
           <InfoBox>
             <i18n.Translate>
               Bank has confirmed the wire transfer. Waiting for the exchange to
-              send the coins
+              send the coins.
             </i18n.Translate>
           </InfoBox>
         )}