From 0388d31d364139d0a3999126b06d8ac850117ab9 Mon Sep 17 00:00:00 2001 From: Sebastian Date: Tue, 19 Sep 2023 00:39:00 -0300 Subject: account page --- packages/demobank-ui/src/components/CopyButton.tsx | 60 ++++++++ .../demobank-ui/src/components/ErrorLoading.tsx | 29 ++++ packages/demobank-ui/src/components/Routing.tsx | 109 +++++++++++++ .../src/components/ShowInputErrorLabel.tsx | 29 ++++ packages/demobank-ui/src/components/app.tsx | 2 +- packages/demobank-ui/src/pages/AccountPage.tsx | 170 --------------------- .../demobank-ui/src/pages/AccountPage/index.ts | 91 +++++++++++ .../demobank-ui/src/pages/AccountPage/state.ts | 87 +++++++++++ .../demobank-ui/src/pages/AccountPage/stories.tsx | 29 ++++ packages/demobank-ui/src/pages/AccountPage/test.ts | 32 ++++ .../demobank-ui/src/pages/AccountPage/views.tsx | 74 +++++++++ packages/demobank-ui/src/pages/AdminPage.tsx | 2 +- packages/demobank-ui/src/pages/BusinessAccount.tsx | 2 +- packages/demobank-ui/src/pages/HomePage.tsx | 2 +- packages/demobank-ui/src/pages/LoginForm.tsx | 2 +- .../src/pages/PaytoWireTransferForm.tsx | 2 +- .../demobank-ui/src/pages/RegistrationPage.tsx | 2 +- packages/demobank-ui/src/pages/Routing.tsx | 110 ------------- .../demobank-ui/src/pages/ShowInputErrorLabel.tsx | 29 ---- .../demobank-ui/src/pages/WalletWithdrawForm.tsx | 2 +- .../src/pages/WithdrawalConfirmationQuestion.tsx | 2 +- 21 files changed, 549 insertions(+), 318 deletions(-) create mode 100644 packages/demobank-ui/src/components/CopyButton.tsx create mode 100644 packages/demobank-ui/src/components/ErrorLoading.tsx create mode 100644 packages/demobank-ui/src/components/Routing.tsx create mode 100644 packages/demobank-ui/src/components/ShowInputErrorLabel.tsx delete mode 100644 packages/demobank-ui/src/pages/AccountPage.tsx create mode 100644 packages/demobank-ui/src/pages/AccountPage/index.ts create mode 100644 packages/demobank-ui/src/pages/AccountPage/state.ts create mode 100644 packages/demobank-ui/src/pages/AccountPage/stories.tsx create mode 100644 packages/demobank-ui/src/pages/AccountPage/test.ts create mode 100644 packages/demobank-ui/src/pages/AccountPage/views.tsx delete mode 100644 packages/demobank-ui/src/pages/Routing.tsx delete mode 100644 packages/demobank-ui/src/pages/ShowInputErrorLabel.tsx (limited to 'packages') diff --git a/packages/demobank-ui/src/components/CopyButton.tsx b/packages/demobank-ui/src/components/CopyButton.tsx new file mode 100644 index 000000000..c61083074 --- /dev/null +++ b/packages/demobank-ui/src/components/CopyButton.tsx @@ -0,0 +1,60 @@ +import { h, VNode } from "preact"; +import { useEffect, useState } from "preact/hooks"; + + + +export function CopyIcon(): VNode { + return ( + + + + + ) + }; + + export function CopiedIcon(): VNode { + return ( + + + + ) + }; + +export function CopyButton({ getContent }: { getContent: () => string }): VNode { + const [copied, setCopied] = useState(false); + function copyText(): void { + navigator.clipboard.writeText(getContent() || ""); + setCopied(true); + } + useEffect(() => { + if (copied) { + setTimeout(() => { + setCopied(false); + }, 1000); + } + }, [copied]); + + if (!copied) { + return ( + + ); + } + return ( +
+ +
+ ); + } \ No newline at end of file diff --git a/packages/demobank-ui/src/components/ErrorLoading.tsx b/packages/demobank-ui/src/components/ErrorLoading.tsx new file mode 100644 index 000000000..fbc4ffceb --- /dev/null +++ b/packages/demobank-ui/src/components/ErrorLoading.tsx @@ -0,0 +1,29 @@ +/* +/* + This file is part of GNU Taler + (C) 2022 Taler Systems S.A. + + GNU 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. + + GNU 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 + GNU Taler; see the file COPYING. If not, see + */ + +import { useTranslationContext } from "@gnu-taler/web-util/browser"; +import { h, VNode } from "preact"; + +export function ErrorLoading(): VNode { + const { i18n } = useTranslationContext() + return ( +
+ Could not complete the request + +
+ ); +} diff --git a/packages/demobank-ui/src/components/Routing.tsx b/packages/demobank-ui/src/components/Routing.tsx new file mode 100644 index 000000000..d5ea44e10 --- /dev/null +++ b/packages/demobank-ui/src/components/Routing.tsx @@ -0,0 +1,109 @@ +/* + This file is part of GNU Taler + (C) 2022 Taler Systems S.A. + + GNU 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. + + GNU 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 + GNU Taler; see the file COPYING. If not, see + */ + +import { createHashHistory } from "history"; +import { VNode, h } from "preact"; +import { Route, Router, route } from "preact-router"; +import { useEffect } from "preact/hooks"; +import { BankFrame } from "../pages/BankFrame.js"; +import { BusinessAccount } from "../pages/BusinessAccount.js"; +import { HomePage, WithdrawalOperationPage } from "../pages/HomePage.js"; +import { PublicHistoriesPage } from "../pages/PublicHistoriesPage.js"; +import { RegistrationPage } from "../pages/RegistrationPage.js"; + +export function Routing(): VNode { + const history = createHashHistory(); + + return ( + { + route("/business"); + }} + > + + ( + { + route("/account"); + }} + onLoadNotOk={() => { + route("/account"); + }} + /> + )} + /> + } + /> + ( + { + route("/account"); + }} + /> + )} + /> + ( + { + route(`/operation/${wopid}`); + }} + onRegister={() => { + route("/register"); + }} + /> + )} + /> + ( + { + route("/account"); + }} + onRegister={() => { + route("/register"); + }} + onLoadNotOk={() => { + route("/account"); + }} + /> + )} + /> + + + + ); +} + +function Redirect({ to }: { to: string }): VNode { + useEffect(() => { + route(to, true); + }, []); + return
being redirected to {to}
; +} + +export function assertUnreachable(x: never): never { + throw new Error("Didn't expect to get here"); +} diff --git a/packages/demobank-ui/src/components/ShowInputErrorLabel.tsx b/packages/demobank-ui/src/components/ShowInputErrorLabel.tsx new file mode 100644 index 000000000..dacffe20a --- /dev/null +++ b/packages/demobank-ui/src/components/ShowInputErrorLabel.tsx @@ -0,0 +1,29 @@ +/* + This file is part of GNU Taler + (C) 2022 Taler Systems S.A. + + GNU 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. + + GNU 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 + GNU Taler; see the file COPYING. If not, see + */ + +import { Fragment, h, VNode } from "preact"; + +export function ShowInputErrorLabel({ + isDirty, + message, +}: { + message: string | undefined; + isDirty: boolean; +}): VNode { + if (message && isDirty) + return
{message}
; + return ; +} diff --git a/packages/demobank-ui/src/components/app.tsx b/packages/demobank-ui/src/components/app.tsx index ea86da518..1f7034bc5 100644 --- a/packages/demobank-ui/src/components/app.tsx +++ b/packages/demobank-ui/src/components/app.tsx @@ -23,7 +23,7 @@ import { FunctionalComponent, h } from "preact"; import { SWRConfig } from "swr"; import { BackendStateProvider } from "../context/backend.js"; import { strings } from "../i18n/strings.js"; -import { Routing } from "../pages/Routing.js"; +import { Routing } from "./Routing.js"; const WITH_LOCAL_STORAGE_CACHE = false; diff --git a/packages/demobank-ui/src/pages/AccountPage.tsx b/packages/demobank-ui/src/pages/AccountPage.tsx deleted file mode 100644 index 820c59984..000000000 --- a/packages/demobank-ui/src/pages/AccountPage.tsx +++ /dev/null @@ -1,170 +0,0 @@ -/* - This file is part of GNU Taler - (C) 2022 Taler Systems S.A. - - GNU 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. - - GNU 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 - GNU Taler; see the file COPYING. If not, see - */ - -import { Amounts, HttpStatusCode, parsePaytoUri, stringifyPaytoUri } from "@gnu-taler/taler-util"; -import { - ErrorType, - HttpResponsePaginated, - useTranslationContext, -} from "@gnu-taler/web-util/browser"; -import { Fragment, VNode, h } from "preact"; -import { Transactions } from "../components/Transactions/index.js"; -import { useBackendContext } from "../context/backend.js"; -import { useAccountDetails } from "../hooks/access.js"; -import { LoginForm } from "./LoginForm.js"; -import { PaymentOptions } from "./PaymentOptions.js"; -import { notifyError } from "../hooks/notification.js"; -import { useEffect, useState } from "preact/hooks"; - -interface Props { - account: string; - onLoadNotOk: ( - error: HttpResponsePaginated, - ) => VNode; -} - -export const CopyIcon = (): VNode => ( - - - - -); - -export const CopiedIcon = (): VNode => ( - - - -); - -function CopyButton({ getContent }: { getContent: () => string }): VNode { - const [copied, setCopied] = useState(false); - function copyText(): void { - navigator.clipboard.writeText(getContent() || ""); - setCopied(true); - } - useEffect(() => { - if (copied) { - setTimeout(() => { - setCopied(false); - }, 1000); - } - }, [copied]); - - if (!copied) { - return ( - - ); - } - return ( -
- -
- ); -} - - -/** - * Query account information and show QR code if there is pending withdrawal - */ -export function AccountPage({ account, onLoadNotOk }: Props): VNode { - const result = useAccountDetails(account); - const backend = useBackendContext(); - const { i18n } = useTranslationContext(); - - if (!result.ok) { - if (result.loading || result.type === ErrorType.TIMEOUT) { - return onLoadNotOk(result); - } - //logout if there is any error, not if loading - backend.logOut(); - if (result.status === HttpStatusCode.NotFound) { - notifyError({ - title: i18n.str`Username or account label "${account}" not found`, - }); - return ; - } - return onLoadNotOk(result); - } - - const { data } = result; - const balance = Amounts.parseOrThrow(data.balance.amount); - const debitThreshold = Amounts.parseOrThrow(data.debitThreshold); - const payto = parsePaytoUri(data.paytoUri); - if (!payto || !payto.isKnown || payto.targetType !== "iban") { - return ( -
Payto from server is not valid "{data.paytoUri}"
- ); - } - const balanceIsDebit = data.balance.credit_debit_indicator == "debit"; - const limit = balanceIsDebit - ? Amounts.sub(debitThreshold, balance).amount - : Amounts.add(balance, debitThreshold).amount; - return ( - -
-

- - Welcome, {account} ({payto.iban})! stringifyPaytoUri(payto)} /> - -

-
- -
-
-

{i18n.str`Bank account balance`}

- {!balance ? ( -
- Waiting server response... -
- ) : ( -
- {balanceIsDebit ? - : null} - {`${Amounts.stringifyValue(balance)}`} -   - {`${balance.currency}`} -
- )} -
-
-
-
-

{i18n.str`Payments`}

- -
-
- -
-
-

{i18n.str`Latest transactions`}

- -
-
- - ); -} diff --git a/packages/demobank-ui/src/pages/AccountPage/index.ts b/packages/demobank-ui/src/pages/AccountPage/index.ts new file mode 100644 index 000000000..28fb7cb0c --- /dev/null +++ b/packages/demobank-ui/src/pages/AccountPage/index.ts @@ -0,0 +1,91 @@ +/* + This file is part of GNU Taler + (C) 2022 Taler Systems S.A. + + GNU 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. + + GNU 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 + GNU Taler; see the file COPYING. If not, see + */ + +import { HttpError, HttpResponseOk, HttpResponsePaginated, utils } from "@gnu-taler/web-util/browser"; +import { AbsoluteTime, AmountJson, PaytoUriIBAN } from "@gnu-taler/taler-util"; +import { Loading } from "../../components/Loading.js"; +import { useComponentState } from "./state.js"; +import { ReadyView, InvalidIbanView} from "./views.js"; +import { VNode } from "preact"; +import { LoginForm } from "../LoginForm.js"; +import { ErrorLoading } from "../../components/ErrorLoading.js"; + +export interface Props { + account: string; + onLoadNotOk: ( + error: HttpResponsePaginated, + ) => VNode; +} + +export type State = State.Loading | State.LoadingError | State.Ready | State.InvalidIban | State.UserNotFound; + +export namespace State { + export interface Loading { + status: "loading"; + error: undefined; + } + + export interface LoadingError { + status: "loading-error"; + error: HttpError; + } + + export interface BaseInfo { + error: undefined; + } + + export interface Ready extends BaseInfo { + status: "ready"; + error: undefined; + account: string, + payto: PaytoUriIBAN, + balance: AmountJson, + balanceIsDebit: boolean, + limit: AmountJson, + } + + export interface InvalidIban { + status: "invalid-iban", + error: HttpResponseOk; + } + + export interface UserNotFound { + status: "error-user-not-found", + error: HttpError; + onRegister?: () => void; + } +} + +export interface Transaction { + negative: boolean; + counterpart: string; + when: AbsoluteTime; + amount: AmountJson | undefined; + subject: string; +} + +const viewMapping: utils.StateViewMap = { + loading: Loading, + "error-user-not-found": LoginForm, + "invalid-iban": InvalidIbanView, + "loading-error": ErrorLoading, + ready: ReadyView, +}; + +export const AccountPage = utils.compose( + (p: Props) => useComponentState(p), + viewMapping, +); diff --git a/packages/demobank-ui/src/pages/AccountPage/state.ts b/packages/demobank-ui/src/pages/AccountPage/state.ts new file mode 100644 index 000000000..bc59c9374 --- /dev/null +++ b/packages/demobank-ui/src/pages/AccountPage/state.ts @@ -0,0 +1,87 @@ +/* + This file is part of GNU Taler + (C) 2022 Taler Systems S.A. + + GNU 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. + + GNU 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 + GNU Taler; see the file COPYING. If not, see + */ + +import { Amounts, HttpStatusCode, parsePaytoUri } from "@gnu-taler/taler-util"; +import { ErrorType, useTranslationContext } from "@gnu-taler/web-util/browser"; +import { useBackendContext } from "../../context/backend.js"; +import { useAccountDetails } from "../../hooks/access.js"; +import { notifyError } from "../../hooks/notification.js"; +import { Props, State } from "./index.js"; + +export function useComponentState({ account, onLoadNotOk }: Props): State { + const result = useAccountDetails(account); + const backend = useBackendContext(); + const { i18n } = useTranslationContext(); + + if (result.loading) { + return { + status: "loading", + error: undefined, + }; + } + + if (!result.ok) { + if (result.loading || result.type === ErrorType.TIMEOUT) { + return { + status: "loading-error", + error: result, + }; + } + //logout if there is any error, not if loading + backend.logOut(); + if (result.status === HttpStatusCode.NotFound) { + notifyError({ + title: i18n.str`Username or account label "${account}" not found`, + }); + return { + status: "error-user-not-found", + error: result, + }; + } + return { + status: "loading-error", + error: result, + }; + } + + const { data } = result; + const balance = Amounts.parseOrThrow(data.balance.amount); + const debitThreshold = Amounts.parseOrThrow(data.debitThreshold); + const payto = parsePaytoUri(data.paytoUri); + + if (!payto || !payto.isKnown || payto.targetType !== "iban") { + return { + status: "invalid-iban", + error: result + }; + } + + const balanceIsDebit = data.balance.credit_debit_indicator == "debit"; + const limit = balanceIsDebit + ? Amounts.sub(debitThreshold, balance).amount + : Amounts.add(balance, debitThreshold).amount; + + + return { + status: "ready", + error: undefined, + account, + balance, + balanceIsDebit, + limit, + payto + }; +} diff --git a/packages/demobank-ui/src/pages/AccountPage/stories.tsx b/packages/demobank-ui/src/pages/AccountPage/stories.tsx new file mode 100644 index 000000000..f3828a5d6 --- /dev/null +++ b/packages/demobank-ui/src/pages/AccountPage/stories.tsx @@ -0,0 +1,29 @@ +/* + This file is part of GNU Taler + (C) 2022 Taler Systems S.A. + + GNU 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. + + GNU 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 + GNU Taler; see the file COPYING. If not, see + */ + +/** + * + * @author Sebastian Javier Marchano (sebasjm) + */ + +import * as tests from "@gnu-taler/web-util/testing"; +import { ReadyView } from "./views.js"; + +export default { + title: "account page", +}; + +export const Ready = tests.createExample(ReadyView, {}); diff --git a/packages/demobank-ui/src/pages/AccountPage/test.ts b/packages/demobank-ui/src/pages/AccountPage/test.ts new file mode 100644 index 000000000..588b84c35 --- /dev/null +++ b/packages/demobank-ui/src/pages/AccountPage/test.ts @@ -0,0 +1,32 @@ +/* + This file is part of GNU Taler + (C) 2022 Taler Systems S.A. + + GNU 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. + + GNU 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 + GNU Taler; see the file COPYING. If not, see + */ + +/** + * + * @author Sebastian Javier Marchano (sebasjm) + */ + +import * as tests from "@gnu-taler/web-util/testing"; +import { SwrMockEnvironment } from "@gnu-taler/web-util/testing"; +import { expect } from "chai"; +import { CASHOUT_API_EXAMPLE } from "../../endpoints.js"; +import { Props } from "./index.js"; +import { useComponentState } from "./state.js"; + +describe("Account states", () => { + it("should do some tests", async () => { + }); +}); diff --git a/packages/demobank-ui/src/pages/AccountPage/views.tsx b/packages/demobank-ui/src/pages/AccountPage/views.tsx new file mode 100644 index 000000000..b476759b4 --- /dev/null +++ b/packages/demobank-ui/src/pages/AccountPage/views.tsx @@ -0,0 +1,74 @@ +/* + This file is part of GNU Taler + (C) 2022 Taler Systems S.A. + + GNU 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. + + GNU 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 + GNU Taler; see the file COPYING. If not, see + */ + +import { Amounts, stringifyPaytoUri } from "@gnu-taler/taler-util"; +import { useTranslationContext } from "@gnu-taler/web-util/browser"; +import { Fragment, h, VNode } from "preact"; +import { Transactions } from "../../components/Transactions/index.js"; +import { PaymentOptions } from "../PaymentOptions.js"; +import { State } from "./index.js"; +import { CopyButton } from "../../components/CopyButton.js"; + +export function InvalidIbanView({error}:State.InvalidIban) { + return ( +
Payto from server is not valid "{error.data.paytoUri}"
+ ); +} + +export function ReadyView({ account, balance, balanceIsDebit, limit, payto }: State.Ready): VNode<{}> { + const { i18n } = useTranslationContext(); + return +
+

+ + Welcome, {account} ({payto.iban})! stringifyPaytoUri(payto)} /> + +

+
+ +
+
+

{i18n.str`Bank account balance`}

+ {!balance ? ( +
+ Waiting server response... +
+ ) : ( +
+ {balanceIsDebit ? - : null} + {`${Amounts.stringifyValue(balance)}`} +   + {`${balance.currency}`} +
+ )} +
+
+
+
+

{i18n.str`Payments`}

+ +
+
+ +
+
+

{i18n.str`Latest transactions`}

+ +
+
+ ; +} + diff --git a/packages/demobank-ui/src/pages/AdminPage.tsx b/packages/demobank-ui/src/pages/AdminPage.tsx index ce0feebce..73a4f9ca3 100644 --- a/packages/demobank-ui/src/pages/AdminPage.tsx +++ b/packages/demobank-ui/src/pages/AdminPage.tsx @@ -43,7 +43,7 @@ import { ErrorBannerFloat } from "./BankFrame.js"; import { ShowCashoutDetails } from "./BusinessAccount.js"; import { handleNotOkResult } from "./HomePage.js"; import { PaytoWireTransferForm } from "./PaytoWireTransferForm.js"; -import { ShowInputErrorLabel } from "./ShowInputErrorLabel.js"; +import { ShowInputErrorLabel } from "../components/ShowInputErrorLabel.js"; import { ErrorMessage, notifyInfo } from "../hooks/notification.js"; const charset = diff --git a/packages/demobank-ui/src/pages/BusinessAccount.tsx b/packages/demobank-ui/src/pages/BusinessAccount.tsx index d9aa8fa36..2faf83a1c 100644 --- a/packages/demobank-ui/src/pages/BusinessAccount.tsx +++ b/packages/demobank-ui/src/pages/BusinessAccount.tsx @@ -44,7 +44,7 @@ import { import { ShowAccountDetails, UpdateAccountPassword } from "./AdminPage.js"; import { ErrorBannerFloat } from "./BankFrame.js"; import { LoginForm } from "./LoginForm.js"; -import { ShowInputErrorLabel } from "./ShowInputErrorLabel.js"; +import { ShowInputErrorLabel } from "../components/ShowInputErrorLabel.js"; import { handleNotOkResult } from "./HomePage.js"; import { ErrorMessage, notifyInfo } from "../hooks/notification.js"; import { Amount } from "./WalletWithdrawForm.js"; diff --git a/packages/demobank-ui/src/pages/HomePage.tsx b/packages/demobank-ui/src/pages/HomePage.tsx index 93a9bdfae..86e511284 100644 --- a/packages/demobank-ui/src/pages/HomePage.tsx +++ b/packages/demobank-ui/src/pages/HomePage.tsx @@ -32,7 +32,7 @@ import { useBackendContext } from "../context/backend.js"; import { getInitialBackendBaseURL } from "../hooks/backend.js"; import { notifyError, notifyInfo } from "../hooks/notification.js"; import { useSettings } from "../hooks/settings.js"; -import { AccountPage } from "./AccountPage.js"; +import { AccountPage } from "./AccountPage/index.js"; import { AdminPage } from "./AdminPage.js"; import { LoginForm } from "./LoginForm.js"; import { WithdrawalQRCode } from "./WithdrawalQRCode.js"; diff --git a/packages/demobank-ui/src/pages/LoginForm.tsx b/packages/demobank-ui/src/pages/LoginForm.tsx index d2cb1bd8e..f0ae97d60 100644 --- a/packages/demobank-ui/src/pages/LoginForm.tsx +++ b/packages/demobank-ui/src/pages/LoginForm.tsx @@ -25,7 +25,7 @@ import { bankUiSettings } from "../settings.js"; import { undefinedIfEmpty } from "../utils.js"; import { ErrorBannerFloat } from "./BankFrame.js"; import { USERNAME_REGEX } from "./RegistrationPage.js"; -import { ShowInputErrorLabel } from "./ShowInputErrorLabel.js"; +import { ShowInputErrorLabel } from "../components/ShowInputErrorLabel.js"; /** * Collect and submit login data. diff --git a/packages/demobank-ui/src/pages/PaytoWireTransferForm.tsx b/packages/demobank-ui/src/pages/PaytoWireTransferForm.tsx index d8c1644b1..d16dc70f8 100644 --- a/packages/demobank-ui/src/pages/PaytoWireTransferForm.tsx +++ b/packages/demobank-ui/src/pages/PaytoWireTransferForm.tsx @@ -36,7 +36,7 @@ import { undefinedIfEmpty, validateIBAN, } from "../utils.js"; -import { ShowInputErrorLabel } from "./ShowInputErrorLabel.js"; +import { ShowInputErrorLabel } from "../components/ShowInputErrorLabel.js"; const logger = new Logger("PaytoWireTransferForm"); diff --git a/packages/demobank-ui/src/pages/RegistrationPage.tsx b/packages/demobank-ui/src/pages/RegistrationPage.tsx index ded48564f..e52a5b11b 100644 --- a/packages/demobank-ui/src/pages/RegistrationPage.tsx +++ b/packages/demobank-ui/src/pages/RegistrationPage.tsx @@ -25,7 +25,7 @@ import { useTestingAPI } from "../hooks/access.js"; import { notifyError } from "../hooks/notification.js"; import { bankUiSettings } from "../settings.js"; import { buildRequestErrorMessage, undefinedIfEmpty } from "../utils.js"; -import { ShowInputErrorLabel } from "./ShowInputErrorLabel.js"; +import { ShowInputErrorLabel } from "../components/ShowInputErrorLabel.js"; const logger = new Logger("RegistrationPage"); diff --git a/packages/demobank-ui/src/pages/Routing.tsx b/packages/demobank-ui/src/pages/Routing.tsx deleted file mode 100644 index f176c73db..000000000 --- a/packages/demobank-ui/src/pages/Routing.tsx +++ /dev/null @@ -1,110 +0,0 @@ -/* - This file is part of GNU Taler - (C) 2022 Taler Systems S.A. - - GNU 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. - - GNU 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 - GNU Taler; see the file COPYING. If not, see - */ - -import { useTranslationContext } from "@gnu-taler/web-util/browser"; -import { createHashHistory } from "history"; -import { VNode, h } from "preact"; -import { Route, Router, route } from "preact-router"; -import { useEffect, useMemo, useState } from "preact/hooks"; -import { BankFrame } from "./BankFrame.js"; -import { BusinessAccount } from "./BusinessAccount.js"; -import { HomePage, WithdrawalOperationPage } from "./HomePage.js"; -import { PublicHistoriesPage } from "./PublicHistoriesPage.js"; -import { RegistrationPage } from "./RegistrationPage.js"; - -export function Routing(): VNode { - const history = createHashHistory(); - - return ( - { - route("/business"); - }} - > - - ( - { - route("/account"); - }} - onLoadNotOk={() => { - route("/account"); - }} - /> - )} - /> - } - /> - ( - { - route("/account"); - }} - /> - )} - /> - ( - { - route(`/operation/${wopid}`); - }} - onRegister={() => { - route("/register"); - }} - /> - )} - /> - ( - { - route("/account"); - }} - onRegister={() => { - route("/register"); - }} - onLoadNotOk={() => { - route("/account"); - }} - /> - )} - /> - - - - ); -} - -function Redirect({ to }: { to: string }): VNode { - useEffect(() => { - route(to, true); - }, []); - return
being redirected to {to}
; -} - -export function assertUnreachable(x: never): never { - throw new Error("Didn't expect to get here"); -} diff --git a/packages/demobank-ui/src/pages/ShowInputErrorLabel.tsx b/packages/demobank-ui/src/pages/ShowInputErrorLabel.tsx deleted file mode 100644 index dacffe20a..000000000 --- a/packages/demobank-ui/src/pages/ShowInputErrorLabel.tsx +++ /dev/null @@ -1,29 +0,0 @@ -/* - This file is part of GNU Taler - (C) 2022 Taler Systems S.A. - - GNU 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. - - GNU 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 - GNU Taler; see the file COPYING. If not, see - */ - -import { Fragment, h, VNode } from "preact"; - -export function ShowInputErrorLabel({ - isDirty, - message, -}: { - message: string | undefined; - isDirty: boolean; -}): VNode { - if (message && isDirty) - return
{message}
; - return ; -} diff --git a/packages/demobank-ui/src/pages/WalletWithdrawForm.tsx b/packages/demobank-ui/src/pages/WalletWithdrawForm.tsx index 4c4a38e57..83be99d6f 100644 --- a/packages/demobank-ui/src/pages/WalletWithdrawForm.tsx +++ b/packages/demobank-ui/src/pages/WalletWithdrawForm.tsx @@ -30,7 +30,7 @@ import { useEffect, useRef, useState } from "preact/hooks"; import { useAccessAPI } from "../hooks/access.js"; import { notifyError } from "../hooks/notification.js"; import { buildRequestErrorMessage, undefinedIfEmpty } from "../utils.js"; -import { ShowInputErrorLabel } from "./ShowInputErrorLabel.js"; +import { ShowInputErrorLabel } from "../components/ShowInputErrorLabel.js"; import { forwardRef } from "preact/compat"; const logger = new Logger("WalletWithdrawForm"); diff --git a/packages/demobank-ui/src/pages/WithdrawalConfirmationQuestion.tsx b/packages/demobank-ui/src/pages/WithdrawalConfirmationQuestion.tsx index cdb612155..2fa8e51b5 100644 --- a/packages/demobank-ui/src/pages/WithdrawalConfirmationQuestion.tsx +++ b/packages/demobank-ui/src/pages/WithdrawalConfirmationQuestion.tsx @@ -28,7 +28,7 @@ import { useMemo, useState } from "preact/hooks"; import { useAccessAnonAPI } from "../hooks/access.js"; import { notifyError } from "../hooks/notification.js"; import { buildRequestErrorMessage, undefinedIfEmpty } from "../utils.js"; -import { ShowInputErrorLabel } from "./ShowInputErrorLabel.js"; +import { ShowInputErrorLabel } from "../components/ShowInputErrorLabel.js"; const logger = new Logger("WithdrawalConfirmationQuestion"); -- cgit v1.2.3