From 5d5b63416bbbf8bfefe5ee8d5a5adfdc8c361e31 Mon Sep 17 00:00:00 2001 From: Sebastian Date: Wed, 7 Dec 2022 11:22:21 -0300 Subject: no-fix: moving out public histories page --- packages/demobank-ui/src/pages/home/index.tsx | 421 +------------------------- 1 file changed, 3 insertions(+), 418 deletions(-) (limited to 'packages/demobank-ui/src/pages/home/index.tsx') diff --git a/packages/demobank-ui/src/pages/home/index.tsx b/packages/demobank-ui/src/pages/home/index.tsx index 64ceedf66..e05ace2e0 100644 --- a/packages/demobank-ui/src/pages/home/index.tsx +++ b/packages/demobank-ui/src/pages/home/index.tsx @@ -20,11 +20,8 @@ import useSWR, { SWRConfig, useSWRConfig } from "swr"; import { Amounts, HttpStatusCode, parsePaytoUri } from "@gnu-taler/taler-util"; import { hooks } from "@gnu-taler/web-util/lib/index.browser"; -import { createHashHistory } from "history"; -import Router, { Route, route } from "preact-router"; +import { route } from "preact-router"; import { StateUpdater, useEffect, useRef, useState } from "preact/hooks"; -import talerLogo from "../../assets/logo-white.svg"; -import { LangSelectorLikePy as LangSelector } from "../../components/menu/LangSelector.js"; import { PageStateType, usePageContext } from "../../context/pageState.js"; import { useTranslationContext } from "../../context/translation.js"; import { BackendStateType, useBackendState } from "../../hooks/backend.js"; @@ -35,6 +32,8 @@ import { getIbanFromPayto, validateAmount, } from "../../utils.js"; +import { BankFrame } from "./BankFrame.js"; +import { Transactions } from "./Transactions.js"; /** * FIXME: @@ -57,24 +56,6 @@ import { * Helpers. * ***********/ -function maybeDemoContent(content: VNode): VNode { - if (bankUiSettings.showDemoNav) { - return content; - } - return ; -} - -/** - * Bring the state to show the public accounts page. - */ -function goPublicAccounts(pageStateSetter: StateUpdater) { - return () => - pageStateSetter((prevState) => ({ - ...prevState, - showPublicHistories: true, - })); -} - /** * Get username from the backend state, and throw * exception if not found. @@ -145,29 +126,6 @@ function prepareHeaders(username?: string, password?: string): Headers { * State managers. * ******************/ -/** - * Stores in the state a object containing a 'username' - * and 'password' field, in order to avoid losing the - * handle of the data entered by the user in fields. - */ -function useShowPublicAccount( - state?: string, -): [string | undefined, StateUpdater] { - const ret = hooks.useLocalStorage( - "show-public-account", - JSON.stringify(state), - ); - const retObj: string | undefined = ret[0] ? JSON.parse(ret[0]) : ret[0]; - const retSetter: StateUpdater = function (val) { - const newVal = - val instanceof Function - ? JSON.stringify(val(retObj)) - : JSON.stringify(val); - ret[1](newVal); - }; - return [retObj, retSetter]; -} - /** * Stores the raw Payto value entered by the user in the state. */ @@ -689,165 +647,6 @@ async function registrationCall( * Functional components. * *************************/ -function ErrorBanner(Props: any): VNode | null { - const [pageState, pageStateSetter] = Props.pageState; - // const { i18n } = useTranslationContext(); - if (!pageState.error) return null; - - const rval = ( -
-
-

- {pageState.error.title} -

-
- { - pageStateSetter((prev: any) => ({ ...prev, error: undefined })); - }} - /> -
-
-

{pageState.error.description}

-
- ); - delete pageState.error; - return rval; -} - -function StatusBanner(Props: any): VNode | null { - const [pageState, pageStateSetter] = Props.pageState; - if (!pageState.info) return null; - - const rval = ( -
-
-

- {pageState.info} -

-
- { - pageStateSetter((prev: any) => ({ ...prev, info: undefined })); - }} - /> -
-
-
- ); - return rval; -} - -function BankFrame(Props: any): VNode { - const { i18n } = useTranslationContext(); - const { pageState, pageStateSetter } = usePageContext(); - console.log("BankFrame state", pageState); - const logOut = ( -
- { - pageStateSetter((prevState: PageStateType) => { - const { talerWithdrawUri, withdrawalId, ...rest } = prevState; - return { - ...rest, - isLoggedIn: false, - withdrawalInProgress: false, - error: undefined, - info: undefined, - isRawPayto: false, - }; - }); - }} - >{i18n.str`Logout`} -
- ); - - const demo_sites = []; - for (const i in bankUiSettings.demoSites) - demo_sites.push( - - {bankUiSettings.demoSites[i][0]} - , - ); - - return ( - -
- -
-

- - {bankUiSettings.bankName} - -

- {maybeDemoContent( -

- - This part of the demo shows how a bank that supports Taler - directly would work. In addition to using your own bank account, - you can also see the transaction history of some{" "} - - Public Accounts - - . - -

, - )} -
- - {i18n.str`Taler - -
-
- -
-
- - - {pageState.isLoggedIn ? logOut : null} - {Props.children} -
- - - ); -} function ShowInputErrorLabel({ isDirty, message, @@ -1685,81 +1484,6 @@ function RegistrationForm(): VNode { ); } -/** - * Show one page of transactions. - */ -function Transactions(Props: any): VNode { - const { pageNumber, accountLabel, balanceValue } = Props; - const { i18n } = useTranslationContext(); - const { data, error, mutate } = useSWR( - `access-api/accounts/${accountLabel}/transactions?page=${pageNumber}`, - ); - useEffect(() => { - mutate(); - }, [balanceValue]); - if (typeof error !== "undefined") { - console.log("transactions not found error", error); - switch (error.status) { - case 404: { - return

Transactions page {pageNumber} was not found.

; - } - case 401: { - return

Wrong credentials given.

; - } - default: { - return

Transaction page {pageNumber} could not be retrieved.

; - } - } - } - if (!data) { - console.log(`History data of ${accountLabel} not arrived`); - return

Transactions page loading...

; - } - console.log(`History data of ${accountLabel}`, data); - return ( -
- - - - - - - - - - - {data.transactions.map((item: any, idx: number) => { - const sign = item.direction == "DBIT" ? "-" : ""; - const counterpart = - item.direction == "DBIT" ? item.creditorIban : item.debtorIban; - // Pattern: - // - // DD/MM YYYY subject -5 EUR - // DD/MM YYYY subject 5 EUR - const dateRegex = /^([0-9]{4})-([0-9]{2})-([0-9]{1,2})/; - const dateParse = dateRegex.exec(item.date); - const date = - dateParse !== null - ? `${dateParse[3]}/${dateParse[2]} ${dateParse[1]}` - : "date not found"; - return ( - - - - - - - ); - })} - -
{i18n.str`Date`}{i18n.str`Amount`}{i18n.str`Counterpart`}{i18n.str`Subject`}
{date} - {sign} - {item.amount} {item.currency} - {counterpart}{item.subject}
-
- ); -} - /** * Show only the account's balance. NOTE: the backend state * is mostly needed to provide the user's credentials to POST @@ -1965,145 +1689,6 @@ function SWRWithCredentials(props: any): VNode { ); } -function SWRWithoutCredentials(Props: any): VNode { - const { baseUrl } = Props; - console.log("Base URL", baseUrl); - return ( - - fetch(baseUrl + url || "").then((r) => { - if (!r.ok) throw { status: r.status, json: r.json() }; - - return r.json(); - }), - }} - > - {Props.children} - - ); -} - -/** - * Show histories of public accounts. - */ -function PublicHistories(Props: any): VNode { - const [showAccount, setShowAccount] = useShowPublicAccount(); - const { data, error } = useSWR("access-api/public-accounts"); - const { i18n } = useTranslationContext(); - - if (typeof error !== "undefined") { - console.log("account error", error); - switch (error.status) { - case 404: - console.log("public accounts: 404", error); - Props.pageStateSetter((prevState: PageStateType) => ({ - ...prevState, - - showPublicHistories: false, - error: { - title: i18n.str`List of public accounts was not found.`, - debug: JSON.stringify(error), - }, - })); - break; - default: - console.log("public accounts: non-404 error", error); - Props.pageStateSetter((prevState: PageStateType) => ({ - ...prevState, - - showPublicHistories: false, - error: { - title: i18n.str`List of public accounts could not be retrieved.`, - debug: JSON.stringify(error), - }, - })); - break; - } - } - if (!data) return

Waiting public accounts list...

; - const txs: any = {}; - const accountsBar = []; - - /** - * Show the account specified in the props, or just one - * from the list if that's not given. - */ - if (typeof showAccount === "undefined" && data.publicAccounts.length > 0) - setShowAccount(data.publicAccounts[1].accountLabel); - console.log(`Public history tab: ${showAccount}`); - - // Ask story of all the public accounts. - for (const account of data.publicAccounts) { - console.log("Asking transactions for", account.accountLabel); - const isSelected = account.accountLabel == showAccount; - accountsBar.push( -
  • - setShowAccount(account.accountLabel)} - > - {account.accountLabel} - -
    • , - ); - txs[account.accountLabel] = ( - - ); - } - - return ( - -

    {i18n.str`History of public accounts`}

    -
    -
    -
    -
      {accountsBar}
    - {typeof showAccount !== "undefined" ? ( - txs[showAccount] - ) : ( -

    No public transactions found.

    - )} - {Props.children} -
    -
    -
    -     - ); -} - -export function PublicHistoriesPage(): VNode { - const { pageState, pageStateSetter } = usePageContext(); - // const { i18n } = useTranslationContext(); - return ( - - - -
    - { - pageStateSetter((prevState: PageStateType) => ({ - ...prevState, - showPublicHistories: false, - })); - }} - > - Go back - -     -     -     - ); -} - export function RegistrationPage(): VNode { const { i18n } = useTranslationContext(); if (!bankUiSettings.allowRegistrations) { -- cgit v1.2.3