import { AbsoluteTime, Amounts, NotificationType, Transaction, } from "@gnu-taler/taler-util"; import { PendingTaskInfo } from "@gnu-taler/taler-wallet-core"; import { Fragment, h, JSX } from "preact"; import { useAsyncAsHook } from "../hooks/useAsyncAsHook.js"; import { Avatar } from "../mui/Avatar.js"; import { Typography } from "../mui/Typography.js"; import Banner from "./Banner.js"; import { Time } from "./Time.js"; import * as wxApi from "../wxApi.js"; interface Props extends JSX.HTMLAttributes { goToTransaction: (id: string) => void; } export function PendingTransactions({ goToTransaction }: Props) { const state = useAsyncAsHook(wxApi.getTransactions, [ NotificationType.WithdrawGroupFinished, ]); const transactions = !state || state.hasError ? [] : state.response.transactions.filter((t) => t.pending); if (!state || state.hasError || !transactions.length) { return ; } return ( ); } export function PendingTransactionsView({ transactions, goToTransaction, }: { goToTransaction: (id: string) => void; transactions: Transaction[]; }) { return ( 3 ? "scroll" : "hidden", }} elements={transactions.map((t) => { const amount = Amounts.parseOrThrow(t.amountEffective); return { icon: ( {t.type.substring(0, 1)} ), action: () => goToTransaction(t.transactionId), description: ( {amount.currency} {Amounts.stringifyValue(amount)} {" "} -{" "} ), }; })} /> ); } export default PendingTransactions;