diff options
Diffstat (limited to 'packages/taler-wallet-webextension/src/wallet/Transaction.tsx')
-rw-r--r-- | packages/taler-wallet-webextension/src/wallet/Transaction.tsx | 172 |
1 files changed, 83 insertions, 89 deletions
diff --git a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx index 9ed41c5de..13adb34b2 100644 --- a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx +++ b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx @@ -32,9 +32,11 @@ import { TransactionAction, TransactionDeposit, TransactionIdStr, + TransactionInternalWithdrawal, TransactionMajorState, TransactionMinorState, TransactionType, + TransactionWithdrawal, TranslatedString, WithdrawalType, } from "@gnu-taler/taler-util"; @@ -459,96 +461,14 @@ export function TransactionView({ TransactionMajorState.Pending ? undefined : transaction .withdrawalDetails.type === WithdrawalType.ManualTransfer ? ( //manual withdrawal - <Fragment> - <BankDetailsByPaytoType - amount={raw} - exchangeBaseUrl={transaction.exchangeBaseUrl} - payto={parsePaytoUri( - transaction.withdrawalDetails.exchangePaytoUris[0], - )} - subject={transaction.withdrawalDetails.reservePub} - /> - <table> - <tbody> - <tr> - <td> - <pre> - <b> - <a - target="_bank" - rel="noreferrer" - title="RFC 8905 for designating targets for payments" - href="https://tools.ietf.org/html/rfc8905" - > - Payto URI - </a> - </b> - </pre> - </td> - <td width="100%" style={{ wordBreak: "break-all" }}> - {transaction.withdrawalDetails.exchangePaytoUris[0]} - </td> - <td> - <CopyButton - getContent={() => - transaction.withdrawalDetails.type === - WithdrawalType.ManualTransfer - ? transaction.withdrawalDetails.exchangePaytoUris[0] - : "" - } - /> - </td> - </tr> - </tbody> - </table> - <WarningBox> - <i18n.Translate> - Make sure to use the correct subject, otherwise the money will - not arrive in this wallet. - </i18n.Translate> - </WarningBox> - </Fragment> + <BankDetailsByPaytoType + amount={raw} + exchangeBaseUrl={transaction.exchangeBaseUrl} + subject={transaction.withdrawalDetails.reservePub} + /> ) : ( //integrated bank withdrawal - <Fragment> - {!transaction.withdrawalDetails.confirmed && - transaction.withdrawalDetails.bankConfirmationUrl ? ( - <InfoBox> - <div style={{ display: "block" }}> - <i18n.Translate> - Wire transfer need a confirmation. Go to the{" "} - <a - href={transaction.withdrawalDetails.bankConfirmationUrl} - target="_blank" - rel="noreferrer" - style={{ display: "inline" }} - > - <i18n.Translate>bank site</i18n.Translate> - </a>{" "} - and check wire transfer operation to exchange account is - complete. - </i18n.Translate> - </div> - </InfoBox> - ) : undefined} - {transaction.withdrawalDetails.confirmed && - !transaction.withdrawalDetails.reserveIsReady && ( - <InfoBox> - <i18n.Translate> - Bank has confirmed the wire transfer. Waiting for the - exchange to send the coins - </i18n.Translate> - </InfoBox> - )} - {transaction.withdrawalDetails.confirmed && - transaction.withdrawalDetails.reserveIsReady && ( - <InfoBox> - <i18n.Translate> - Exchange is ready to send the coins, withdrawal in progress. - </i18n.Translate> - </InfoBox> - )} - </Fragment> + <ShowWithdrawalDetailForBankIntegrated transaction={transaction} /> )} <Part title={i18n.str`Details`} @@ -1404,7 +1324,7 @@ export function WithdrawDetails({ amount }: { amount: AmountWithFee }): VNode { <PurchaseDetailsTable> <tr> <td> - <i18n.Translate>Withdraw</i18n.Translate> + <i18n.Translate>Wire transfer</i18n.Translate> </td> <td> <Amount value={amount.value} maxFracSize={amount.maxFrac} /> @@ -1952,3 +1872,77 @@ function getShowButtonStates(transaction: Transaction) { }); return { abort, fail, resume, retry, remove, suspend }; } + +function ShowWithdrawalDetailForBankIntegrated({ + transaction, +}: { + transaction: TransactionWithdrawal | TransactionInternalWithdrawal; +}): VNode { + const { i18n } = useTranslationContext(); + const [showDetails, setShowDetails] = useState(false); + if ( + transaction.txState.major !== TransactionMajorState.Pending || + transaction.withdrawalDetails.type === WithdrawalType.ManualTransfer + ) + return <Fragment />; + const raw = Amounts.parseOrThrow(transaction.amountRaw); + return ( + <Fragment> + <EnabledBySettings name="advanceMode"> + <a + href="#" + onClick={(e) => { + e.preventDefault(); + setShowDetails(!showDetails); + }} + > + show details + </a> + </EnabledBySettings> + + {showDetails && ( + <BankDetailsByPaytoType + amount={raw} + exchangeBaseUrl={transaction.exchangeBaseUrl} + subject={transaction.withdrawalDetails.reservePub} + /> + )} + {!transaction.withdrawalDetails.confirmed && + transaction.withdrawalDetails.bankConfirmationUrl ? ( + <InfoBox> + <div style={{ display: "block" }}> + <i18n.Translate> + Wire transfer need a confirmation. Go to the{" "} + <a + href={transaction.withdrawalDetails.bankConfirmationUrl} + target="_blank" + rel="noreferrer" + style={{ display: "inline" }} + > + <i18n.Translate>bank site</i18n.Translate> + </a>{" "} + and check wire transfer operation to exchange account is complete. + </i18n.Translate> + </div> + </InfoBox> + ) : undefined} + {transaction.withdrawalDetails.confirmed && + !transaction.withdrawalDetails.reserveIsReady && ( + <InfoBox> + <i18n.Translate> + Bank has confirmed the wire transfer. Waiting for the exchange to + send the coins + </i18n.Translate> + </InfoBox> + )} + {transaction.withdrawalDetails.confirmed && + transaction.withdrawalDetails.reserveIsReady && ( + <InfoBox> + <i18n.Translate> + Exchange is ready to send the coins, withdrawal in progress. + </i18n.Translate> + </InfoBox> + )} + </Fragment> + ); +} |