diff options
author | Sebastian <sebasjm@gmail.com> | 2024-02-05 16:23:09 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2024-02-05 16:23:09 -0300 |
commit | 46aa042f9acb940660f7a53b4824b1d6fb2ad8b3 (patch) | |
tree | e8b03acb195a2161aa0a0e68435b07de352a4477 /packages/demobank-ui/src/components | |
parent | f68585db5f9ba0f760e22dada474fd7ec2847796 (diff) |
fixes #8294
Diffstat (limited to 'packages/demobank-ui/src/components')
4 files changed, 57 insertions, 47 deletions
diff --git a/packages/demobank-ui/src/components/Transactions/index.ts b/packages/demobank-ui/src/components/Transactions/index.ts index b0e67d4d9..f4e799839 100644 --- a/packages/demobank-ui/src/components/Transactions/index.ts +++ b/packages/demobank-ui/src/components/Transactions/index.ts @@ -19,9 +19,11 @@ import { Loading, utils } from "@gnu-taler/web-util/browser"; import { ErrorLoadingWithDebug } from "../ErrorLoadingWithDebug.js"; import { useComponentState } from "./state.js"; import { ReadyView } from "./views.js"; +import { RouteDefinition } from "../../route.js"; export interface Props { account: string; + routeCreateWireTransfer: RouteDefinition<{ destination: string }> | undefined; } export type State = State.Loading | State.LoadingUriError | State.Ready; @@ -43,6 +45,7 @@ export namespace State { export interface Ready extends BaseInfo { status: "ready"; error: undefined; + routeCreateWireTransfer: RouteDefinition<{ destination: string }> | undefined; transactions: Transaction[]; onPrev?: () => void; onNext?: () => void; diff --git a/packages/demobank-ui/src/components/Transactions/state.ts b/packages/demobank-ui/src/components/Transactions/state.ts index 74e6b0d36..5e99a8a76 100644 --- a/packages/demobank-ui/src/components/Transactions/state.ts +++ b/packages/demobank-ui/src/components/Transactions/state.ts @@ -23,7 +23,7 @@ import { import { useTransactions } from "../../hooks/access.js"; import { Props, State, Transaction } from "./index.js"; -export function useComponentState({ account }: Props): State { +export function useComponentState({ account, routeCreateWireTransfer }: Props): State { const result = useTransactions(account); if (!result) { return { @@ -42,38 +42,39 @@ export function useComponentState({ account }: Props): State { result.data.type === "fail" ? [] : result.data.body.transactions - .map((tx) => { - const negative = tx.direction === "debit"; - const cp = parsePaytoUri( - negative ? tx.creditor_payto_uri : tx.debtor_payto_uri, - ); - const counterpart = - (cp === undefined || !cp.isKnown - ? undefined - : cp.targetType === "iban" - ? cp.iban - : cp.targetType === "x-taler-bank" - ? cp.account - : cp.targetType === "bitcoin" - ? `${cp.targetPath.substring(0, 6)}...` - : undefined) ?? "unknown"; + .map((tx) => { + const negative = tx.direction === "debit"; + const cp = parsePaytoUri( + negative ? tx.creditor_payto_uri : tx.debtor_payto_uri, + ); + const counterpart = + (cp === undefined || !cp.isKnown + ? undefined + : cp.targetType === "iban" + ? cp.iban + : cp.targetType === "x-taler-bank" + ? cp.account + : cp.targetType === "bitcoin" + ? `${cp.targetPath.substring(0, 6)}...` + : undefined) ?? "unknown"; - const when = AbsoluteTime.fromProtocolTimestamp(tx.date); - const amount = Amounts.parse(tx.amount); - const subject = tx.subject; - return { - negative, - counterpart, - when, - amount, - subject, - }; - }) - .filter((x): x is Transaction => x !== undefined); + const when = AbsoluteTime.fromProtocolTimestamp(tx.date); + const amount = Amounts.parse(tx.amount); + const subject = tx.subject; + return { + negative, + counterpart, + when, + amount, + subject, + }; + }) + .filter((x): x is Transaction => x !== undefined); return { status: "ready", error: undefined, + routeCreateWireTransfer, transactions, onNext: result.isLastPage ? undefined : result.loadMore, onPrev: result.isFirstPage ? undefined : result.loadMorePrev, diff --git a/packages/demobank-ui/src/components/Transactions/test.ts b/packages/demobank-ui/src/components/Transactions/test.ts index cf33a0b1c..9ded218c1 100644 --- a/packages/demobank-ui/src/components/Transactions/test.ts +++ b/packages/demobank-ui/src/components/Transactions/test.ts @@ -33,6 +33,7 @@ describe("Transaction states", () => { const props: Props = { account: "myAccount", + routeCreateWireTransfer: undefined, }; env.addRequestExpectation(TRANSACTION_API_EXAMPLE.LIST_FIRST_PAGE, { @@ -161,6 +162,7 @@ describe("Transaction states", () => { const props: Props = { account: "myAccount", + routeCreateWireTransfer: undefined, }; env.addRequestExpectation(TRANSACTION_API_EXAMPLE.LIST_ERROR, { diff --git a/packages/demobank-ui/src/components/Transactions/views.tsx b/packages/demobank-ui/src/components/Transactions/views.tsx index 51fb90b61..53e437523 100644 --- a/packages/demobank-ui/src/components/Transactions/views.tsx +++ b/packages/demobank-ui/src/components/Transactions/views.tsx @@ -20,10 +20,10 @@ import { Fragment, h, VNode } from "preact"; import { useBankCoreApiContext } from "../../context/config.js"; import { RenderAmount } from "../../pages/PaytoWireTransferForm.js"; import { State } from "./index.js"; -import { privatePages } from "../../Routing.js"; export function ReadyView({ transactions, + routeCreateWireTransfer, onNext, onPrev, }: State.Ready): VNode { @@ -93,8 +93,8 @@ export function ReadyView({ item.when.t_ms === "never" ? "" : format(item.when.t_ms, "HH:mm:ss", { - locale: dateLocale, - }); + locale: dateLocale, + }); return ( <tr key={idx} @@ -134,14 +134,16 @@ export function ReadyView({ </dt> <dd class="mt-1 truncate text-gray-500 sm:hidden"> {item.negative ? i18n.str`to` : i18n.str`from`}{" "} - <a - href={privatePages.wireTranserCreate.url({ - destination: item.counterpart, - })} - class="text-indigo-600 hover:text-indigo-900" - > - {item.counterpart} - </a> + {!routeCreateWireTransfer ? item.counterpart : + <a + href={routeCreateWireTransfer.url({ + destination: item.counterpart, + })} + class="text-indigo-600 hover:text-indigo-900" + > + {item.counterpart} + </a> + } </dd> <dd class="mt-1 text-gray-500 sm:hidden"> <pre class="break-words w-56 whitespace-break-spaces p-2 rounded-md mx-auto my-2 bg-gray-100"> @@ -168,14 +170,16 @@ export function ReadyView({ )} </td> <td class="hidden sm:table-cell px-3 py-3.5 text-sm text-gray-500"> - <a - href={privatePages.wireTranserCreate.url({ - destination: item.counterpart, - })} - class="text-indigo-600 hover:text-indigo-900" - > - {item.counterpart} - </a> + {!routeCreateWireTransfer ? item.counterpart : + <a + href={routeCreateWireTransfer.url({ + destination: item.counterpart, + })} + class="text-indigo-600 hover:text-indigo-900" + > + {item.counterpart} + </a> + } </td> <td class="hidden sm:table-cell px-3 py-3.5 text-sm text-gray-500 break-all min-w-md"> {item.subject} |