diff options
Diffstat (limited to 'packages/demobank-ui/src/components')
5 files changed, 67 insertions, 83 deletions
diff --git a/packages/demobank-ui/src/components/Cashouts/index.ts b/packages/demobank-ui/src/components/Cashouts/index.ts index db39ba7e4..1410267be 100644 --- a/packages/demobank-ui/src/components/Cashouts/index.ts +++ b/packages/demobank-ui/src/components/Cashouts/index.ts @@ -23,7 +23,7 @@ import { useComponentState } from "./state.js"; import { LoadingUriView, ReadyView } from "./views.js"; export interface Props { - account: string; + empty?: boolean; } export type State = State.Loading | State.LoadingUriError | State.Ready; diff --git a/packages/demobank-ui/src/components/Cashouts/state.ts b/packages/demobank-ui/src/components/Cashouts/state.ts index 7e420940f..178a1e815 100644 --- a/packages/demobank-ui/src/components/Cashouts/state.ts +++ b/packages/demobank-ui/src/components/Cashouts/state.ts @@ -18,27 +18,24 @@ import { AbsoluteTime, Amounts } from "@gnu-taler/taler-util"; import { useCashouts } from "../../hooks/circuit.js"; import { Props, State, Transaction } from "./index.js"; -export function useComponentState({ - account, -}: Props): State { - const result = useCashouts() +export function useComponentState({ empty }: Props): State { + const result = useCashouts(); if (result.loading) { return { status: "loading", - error: undefined - } + error: undefined, + }; } if (!result.ok) { return { status: "loading-error", - error: result - } + error: result, + }; } - return { status: "ready", error: undefined, - cashout: result.data, + cashouts: result.data, }; } diff --git a/packages/demobank-ui/src/components/Cashouts/stories.tsx b/packages/demobank-ui/src/components/Cashouts/stories.tsx index 77fdde092..05439780c 100644 --- a/packages/demobank-ui/src/components/Cashouts/stories.tsx +++ b/packages/demobank-ui/src/components/Cashouts/stories.tsx @@ -26,20 +26,4 @@ export default { title: "transaction list", }; -export const Ready = tests.createExample(ReadyView, { - transactions: [ - { - amount: { - currency: "USD", - fraction: 0, - value: 1, - }, - counterpart: "ASD", - negative: false, - subject: "Some", - when: { - t_ms: new Date().getTime(), - }, - }, - ], -}); +export const Ready = tests.createExample(ReadyView, {}); diff --git a/packages/demobank-ui/src/components/Cashouts/views.tsx b/packages/demobank-ui/src/components/Cashouts/views.tsx index 30803d4d1..16ae8a58f 100644 --- a/packages/demobank-ui/src/components/Cashouts/views.tsx +++ b/packages/demobank-ui/src/components/Cashouts/views.tsx @@ -39,7 +39,7 @@ export function ReadyView({ cashouts }: State.Ready): VNode { <tr> <th>{i18n.str`Created`}</th> <th>{i18n.str`Confirmed`}</th> - <th>{i18n.str`Counterpart`}</th> + <th>{i18n.str`Status`}</th> <th>{i18n.str`Subject`}</th> </tr> </thead> @@ -53,8 +53,9 @@ export function ReadyView({ cashouts }: State.Ready): VNode { ? format(item.confirmation_time, "dd/MM/yyyy HH:mm:ss") : "-"} </td> + <td>{Amounts.stringifyValue(item.amount_debit)}</td> <td>{Amounts.stringifyValue(item.amount_credit)}</td> - <td>{item.counterpart}</td> + <td>{item.status}</td> <td>{item.subject}</td> </tr> ); diff --git a/packages/demobank-ui/src/components/Transactions/state.ts b/packages/demobank-ui/src/components/Transactions/state.ts index 9e1bce39b..198ef6c5f 100644 --- a/packages/demobank-ui/src/components/Transactions/state.ts +++ b/packages/demobank-ui/src/components/Transactions/state.ts @@ -18,21 +18,19 @@ import { AbsoluteTime, Amounts } from "@gnu-taler/taler-util"; import { useTransactions } from "../../hooks/access.js"; import { Props, State, Transaction } from "./index.js"; -export function useComponentState({ - account, -}: Props): State { - const result = useTransactions(account) +export function useComponentState({ account }: Props): State { + const result = useTransactions(account); if (result.loading) { return { status: "loading", - error: undefined - } + error: undefined, + }; } if (!result.ok) { return { status: "loading-error", - error: result - } + error: result, + }; } // if (error) { // switch (error.status) { @@ -73,53 +71,57 @@ export function useComponentState({ // }; // } - const transactions = result.data.transactions.map((item: unknown) => { - if ( - !item || - typeof item !== "object" || - !("direction" in item) || - !("creditorIban" in item) || - !("debtorIban" in item) || - !("date" in item) || - !("subject" in item) || - !("currency" in item) || - !("amount" in item) - ) { - //not valid - return; - } - const anyItem = item as any; - if ( - !(typeof anyItem.creditorIban === "string") || - !(typeof anyItem.debtorIban === "string") || - !(typeof anyItem.date === "string") || - !(typeof anyItem.subject === "string") || - !(typeof anyItem.currency === "string") || - !(typeof anyItem.amount === "string") - ) { - return; - } + const transactions = result.data.transactions + .map((item: unknown) => { + if ( + !item || + typeof item !== "object" || + !("direction" in item) || + !("creditorIban" in item) || + !("debtorIban" in item) || + !("date" in item) || + !("subject" in item) || + !("currency" in item) || + !("amount" in item) + ) { + //not valid + return; + } + const anyItem = item as any; + if ( + !(typeof anyItem.creditorIban === "string") || + !(typeof anyItem.debtorIban === "string") || + !(typeof anyItem.date === "string") || + !(typeof anyItem.subject === "string") || + !(typeof anyItem.currency === "string") || + !(typeof anyItem.amount === "string") + ) { + return; + } - const negative = anyItem.direction === "DBIT"; - const counterpart = negative ? anyItem.creditorIban : anyItem.debtorIban; + const negative = anyItem.direction === "DBIT"; + const counterpart = negative ? anyItem.creditorIban : anyItem.debtorIban; - let date = anyItem.date ? parseInt(anyItem.date, 10) : 0 - if (isNaN(date) || !isFinite(date)) { - date = 0 - } - const when: AbsoluteTime = !date ? AbsoluteTime.never() : { - t_ms: date, - }; - const amount = Amounts.parse(`${anyItem.currency}:${anyItem.amount}`); - const subject = anyItem.subject; - return { - negative, - counterpart, - when, - amount, - subject, - }; - }).filter((x): x is Transaction => x !== undefined); + let date = anyItem.date ? parseInt(anyItem.date, 10) : 0; + if (isNaN(date) || !isFinite(date)) { + date = 0; + } + const when: AbsoluteTime = !date + ? AbsoluteTime.never() + : { + t_ms: date, + }; + const amount = Amounts.parse(`${anyItem.currency}:${anyItem.amount}`); + const subject = anyItem.subject; + return { + negative, + counterpart, + when, + amount, + subject, + }; + }) + .filter((x): x is Transaction => x !== undefined); return { status: "ready", |