/* This file is part of TALER (C) 2016 GNUnet e.V. TALER is free software; you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation; either version 3, or (at your option) any later version. TALER is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details. You should have received a copy of the GNU General Public License along with TALER; see the file COPYING. If not, see */ import { AmountJson, Amounts, i18n, Transaction, TransactionType } from "@gnu-taler/taler-util"; import { format } from "date-fns"; import { Fragment, JSX, VNode } from "preact"; import { route } from 'preact-router'; import { useEffect, useState } from "preact/hooks"; import * as wxApi from "../wxApi"; import { Pages } from "../NavigationBar"; import emptyImg from "../../static/img/empty.png" import { Button, ButtonDestructive, ButtonPrimary, ListOfProducts, PopupBox, Row, RowBorderGray, SmallTextLight } from "../components/styled"; import { ErrorMessage } from "../components/ErrorMessage"; export function TransactionPage({ tid }: { tid: string; }): JSX.Element { const [transaction, setTransaction] = useState< Transaction | undefined >(undefined); useEffect(() => { const fetchData = async (): Promise => { const res = await wxApi.getTransactions(); const ts = res.transactions.filter(t => t.transactionId === tid); if (ts.length === 1) { setTransaction(ts[0]); } else { route(Pages.history); } }; fetchData(); }, []); if (!transaction) { return
Loading ...
; } return wxApi.deleteTransaction(tid).then(_ => history.go(-1))} onRetry={() => wxApi.retryTransaction(tid).then(_ => history.go(-1))} onBack={() => { history.go(-1); }} />; } export interface WalletTransactionProps { transaction: Transaction, onDelete: () => void, onRetry: () => void, onBack: () => void, } export function TransactionView({ transaction, onDelete, onRetry, onBack }: WalletTransactionProps) { function Status() { if (transaction.error) { return (failed) } if (transaction.pending) { return (pending...) } return null } function Fee({ value }: { value: AmountJson }) { if (Amounts.isZero(value)) return null return (fee {Amounts.stringify(value)}) } function TransactionTemplate({ upperRight, children }: { upperRight: VNode, children: VNode[] }) { return
{transaction.timestamp.t_ms === "never" ? "never" : format(transaction.timestamp.t_ms, 'dd/MM/yyyy HH:mm:ss')} {upperRight}
{children}
{transaction?.error ? retry : null} delete
} if (transaction.type === TransactionType.Withdrawal) { const fee = Amounts.sub( Amounts.parseOrThrow(transaction.amountRaw), Amounts.parseOrThrow(transaction.amountEffective), ).amount return From {transaction.exchangeBaseUrl}}>

Withdraw

{transaction.amountEffective}

} const showLargePic = () => { } if (transaction.type === TransactionType.Payment) { const fee = Amounts.sub( Amounts.parseOrThrow(transaction.amountEffective), Amounts.parseOrThrow(transaction.amountRaw), ).amount return To {transaction.info.merchant.name}}>

Payment

{transaction.amountEffective}

#{transaction.info.orderId}

{transaction.info.summary}

{transaction.info.products && transaction.info.products.length > 0 && {transaction.info.products.map(p =>
{p.quantity && p.quantity > 0 && x {p.quantity} {p.unit}}
{p.description}
)}
}
} if (transaction.type === TransactionType.Deposit) { const fee = Amounts.sub( Amounts.parseOrThrow(transaction.amountRaw), Amounts.parseOrThrow(transaction.amountEffective), ).amount return To {transaction.targetPaytoUri}}>

Deposit

{transaction.amountEffective}

} if (transaction.type === TransactionType.Refresh) { const fee = Amounts.sub( Amounts.parseOrThrow(transaction.amountRaw), Amounts.parseOrThrow(transaction.amountEffective), ).amount return From {transaction.exchangeBaseUrl}}>

Refresh

{transaction.amountEffective}

} if (transaction.type === TransactionType.Tip) { const fee = Amounts.sub( Amounts.parseOrThrow(transaction.amountRaw), Amounts.parseOrThrow(transaction.amountEffective), ).amount return From {transaction.merchantBaseUrl}}>

Tip

{transaction.amountEffective}

} if (transaction.type === TransactionType.Refund) { const fee = Amounts.sub( Amounts.parseOrThrow(transaction.amountRaw), Amounts.parseOrThrow(transaction.amountEffective), ).amount return From {transaction.info.merchant.name}}>

Refund

{transaction.amountEffective}

#{transaction.info.orderId}

{transaction.info.summary}

{transaction.info.products && transaction.info.products.length > 0 && {transaction.info.products.map(p =>
{p.quantity && p.quantity > 0 && x {p.quantity} {p.unit}}
{p.description}
)}
}
} return
}