diff --git a/packages/demobank-ui/.gitignore b/packages/demobank-ui/.gitignore index 7e0633d5e..30cb2774c 100644 --- a/packages/demobank-ui/.gitignore +++ b/packages/demobank-ui/.gitignore @@ -1,3 +1,4 @@ node_modules /build /*.log +/demobank-ui-settings.js diff --git a/packages/demobank-ui/src/components/app.tsx b/packages/demobank-ui/src/components/app.tsx index ef535bb9f..5783c288a 100644 --- a/packages/demobank-ui/src/components/app.tsx +++ b/packages/demobank-ui/src/components/app.tsx @@ -18,13 +18,12 @@ import { globalLogLevel, setGlobalLogLevelFromString, } from "@gnu-taler/taler-util"; -import { h, FunctionalComponent } from "preact"; -import { BackendStateProvider } from "../context/backend.js"; -import { PageStateProvider } from "../context/pageState.js"; -import { Routing } from "../pages/Routing.js"; -import { strings } from "../i18n/strings.js"; import { TranslationProvider } from "@gnu-taler/web-util/lib/index.browser"; +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"; const WITH_LOCAL_STORAGE_CACHE = false; diff --git a/packages/demobank-ui/src/context/pageState.ts b/packages/demobank-ui/src/context/pageState.ts deleted file mode 100644 index 074fbcafc..000000000 --- a/packages/demobank-ui/src/context/pageState.ts +++ /dev/null @@ -1,113 +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 { TranslatedString } from "@gnu-taler/taler-util"; -import { useNotNullLocalStorage } from "@gnu-taler/web-util/lib/index.browser"; -import { ComponentChildren, createContext, h, VNode } from "preact"; -import { StateUpdater, useContext } from "preact/hooks"; - -/** - * - * @author Sebastian Javier Marchano (sebasjm) - */ - -export type Type = { - pageState: PageStateType; - pageStateSetter: StateUpdater; -}; -const initial: Type = { - pageState: {}, - pageStateSetter: () => { - null; - }, -}; -const Context = createContext(initial); - -export const usePageContext = (): Type => useContext(Context); - -export const PageStateProvider = ({ - children, -}: { - children: ComponentChildren; -}): VNode => { - const [pageState, pageStateSetter] = usePageState(); - - return h(Context.Provider, { - value: { pageState, pageStateSetter }, - children, - }); -}; - -/** - * Wrapper providing defaults. - */ -function usePageState( - state: PageStateType = {}, -): [PageStateType, StateUpdater] { - const ret = useNotNullLocalStorage("page-state", JSON.stringify(state)); - const retObj: PageStateType = JSON.parse(ret[0]); - - const retSetter: StateUpdater = function (val) { - const newVal = - val instanceof Function - ? JSON.stringify(val(retObj)) - : JSON.stringify(val); - - ret[1](newVal); - }; - - //when moving from one page to another - //clean up the info and error bar - function removeLatestInfo(val: any): ReturnType { - const updater = typeof val === "function" ? val : (c: any) => val; - return retSetter((current: any) => { - const cleanedCurrent: PageStateType = { - ...current, - info: undefined, - errors: undefined, - timestamp: new Date().getTime(), - }; - return updater(cleanedCurrent); - }); - } - - return [retObj, removeLatestInfo]; -} - -export type ErrorMessage = { - description?: string; - title: TranslatedString; - debug?: string; -}; -/** - * Track page state. - */ -export interface PageStateType { - currentWithdrawalOperationId?: string; -} - -export interface ObservedStateType { - error: ErrorMessage | undefined; - info: TranslatedString | undefined; -} -export const errorListeners: Array<(error: ErrorMessage) => void> = []; -export const infoListeners: Array<(info: TranslatedString) => void> = []; -export function notifyError(error: ErrorMessage) { - errorListeners.forEach((cb) => cb(error)); -} -export function notifyInfo(info: TranslatedString) { - infoListeners.forEach((cb) => cb(info)); -} diff --git a/packages/demobank-ui/src/hooks/backend.ts b/packages/demobank-ui/src/hooks/backend.ts index ca73a4793..9fe0f5b14 100644 --- a/packages/demobank-ui/src/hooks/backend.ts +++ b/packages/demobank-ui/src/hooks/backend.ts @@ -82,7 +82,7 @@ export interface BackendStateHandler { * base URL. */ export function useBackendState(): BackendStateHandler { - const [value, update] = useLocalStorage( + const { value, update } = useLocalStorage( "backend-state", JSON.stringify(defaultState), ); diff --git a/packages/demobank-ui/src/hooks/index.ts b/packages/demobank-ui/src/hooks/index.ts index 263b53e1d..99da9e679 100644 --- a/packages/demobank-ui/src/hooks/index.ts +++ b/packages/demobank-ui/src/hooks/index.ts @@ -20,10 +20,7 @@ */ import { StateUpdater } from "preact/hooks"; -import { - useLocalStorage, - useNotNullLocalStorage, -} from "@gnu-taler/web-util/lib/index.browser"; +import { useLocalStorage } from "@gnu-taler/web-util/lib/index.browser"; export type ValueOrFunction = T | ((p: T) => T); const calculateRootPath = () => { @@ -37,38 +34,23 @@ const calculateRootPath = () => { export function useBackendURL( url?: string, ): [string, boolean, StateUpdater, () => void] { - const [value, setter] = useNotNullLocalStorage( + const { value, update: setter } = useLocalStorage( "backend-url", url || calculateRootPath(), ); - const [triedToLog, setTriedToLog] = useLocalStorage("tried-login"); + + const { + value: triedToLog, + update: setTriedToLog, + reset: resetBackend, + } = useLocalStorage("tried-login"); const checkedSetter = (v: ValueOrFunction) => { setTriedToLog("yes"); - return setter((p) => (v instanceof Function ? v(p) : v).replace(/\/$/, "")); + const computedValue = + v instanceof Function ? v(value) : v.replace(/\/$/, ""); + return setter(computedValue); }; - const resetBackend = () => { - setTriedToLog(undefined); - }; return [value, !!triedToLog, checkedSetter, resetBackend]; } - -export function useBackendDefaultToken(): [ - string | undefined, - StateUpdater, -] { - return useLocalStorage("backend-token"); -} - -export function useBackendInstanceToken( - id: string, -): [string | undefined, StateUpdater] { - const [token, setToken] = useLocalStorage(`backend-token-${id}`); - const [defaultToken, defaultSetToken] = useBackendDefaultToken(); - - // instance named 'default' use the default token - if (id === "default") return [defaultToken, defaultSetToken]; - - return [token, setToken]; -} diff --git a/packages/demobank-ui/src/hooks/notification.ts b/packages/demobank-ui/src/hooks/notification.ts new file mode 100644 index 000000000..7cdece515 --- /dev/null +++ b/packages/demobank-ui/src/hooks/notification.ts @@ -0,0 +1,54 @@ +import { TranslatedString } from "@gnu-taler/taler-util"; +import { memoryMap } from "@gnu-taler/web-util/lib/index.browser"; +import { StateUpdater, useEffect, useState } from "preact/hooks"; + +export type NotificationMessage = ErrorNotification | InfoNotification; + +//FIXME: this should not be exported since every notification +// goes throw notify function +export interface ErrorMessage { + description?: string; + title: TranslatedString; + debug?: string; +} + +interface ErrorNotification { + type: "error"; + error: ErrorMessage; +} +interface InfoNotification { + type: "info"; + info: TranslatedString; +} + +const storage = memoryMap(); +const NOTIFICATION_KEY = "notification"; + +export function onNotificationUpdate( + handler: (newValue: NotificationMessage | undefined) => void, +) { + return storage.onUpdate(NOTIFICATION_KEY, () => { + const newValue = storage.get(NOTIFICATION_KEY); + handler(newValue); + }); +} + +export function notifyError(error: ErrorMessage) { + storage.set(NOTIFICATION_KEY, { type: "error", error }); +} +export function notifyInfo(info: TranslatedString) { + storage.set(NOTIFICATION_KEY, { type: "info", info }); +} + +export function useNotifications(): [ + NotificationMessage | undefined, + StateUpdater, +] { + const [value, setter] = useState(); + useEffect(() => { + return storage.onUpdate(NOTIFICATION_KEY, () => { + setter(storage.get(NOTIFICATION_KEY)); + }); + }); + return [value, setter]; +} diff --git a/packages/demobank-ui/src/hooks/settings.ts b/packages/demobank-ui/src/hooks/settings.ts new file mode 100644 index 000000000..5115f9959 --- /dev/null +++ b/packages/demobank-ui/src/hooks/settings.ts @@ -0,0 +1,49 @@ +/* + 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 { useLocalStorage } from "@gnu-taler/web-util/lib/index.browser"; + +interface Settings { + currentWithdrawalOperationId: string | undefined; +} + +const defaultSettings: Settings = { + currentWithdrawalOperationId: undefined, +}; + +function parse_json_or_undefined(str: string | undefined): T | undefined { + if (str === undefined) return undefined; + try { + return JSON.parse(str); + } catch { + return undefined; + } +} + +export function useSettings(): [ + Readonly, + (key: T, value: Settings[T]) => void, +] { + const { value, update } = useLocalStorage("demobank-settings"); + + const parsed: Settings = parse_json_or_undefined(value) ?? defaultSettings; + function updateField(k: T, v: Settings[T]) { + const newValue = { ...parsed, [k]: v }; + const json = JSON.stringify(newValue); + update(json); + } + return [parsed, updateField]; +} diff --git a/packages/demobank-ui/src/pages/AccountPage.tsx b/packages/demobank-ui/src/pages/AccountPage.tsx index 013c1b8c1..339f054d7 100644 --- a/packages/demobank-ui/src/pages/AccountPage.tsx +++ b/packages/demobank-ui/src/pages/AccountPage.tsx @@ -23,10 +23,10 @@ import { import { Fragment, VNode, h } from "preact"; import { Transactions } from "../components/Transactions/index.js"; import { useBackendContext } from "../context/backend.js"; -import { notifyError } from "../context/pageState.js"; import { useAccountDetails } from "../hooks/access.js"; import { LoginForm } from "./LoginForm.js"; import { PaymentOptions } from "./PaymentOptions.js"; +import { notifyError } from "../hooks/notification.js"; interface Props { account: string; diff --git a/packages/demobank-ui/src/pages/AdminPage.tsx b/packages/demobank-ui/src/pages/AdminPage.tsx index b867d0103..ad4a6d1a4 100644 --- a/packages/demobank-ui/src/pages/AdminPage.tsx +++ b/packages/demobank-ui/src/pages/AdminPage.tsx @@ -25,7 +25,6 @@ import { Fragment, h, VNode } from "preact"; import { useState } from "preact/hooks"; import { Cashouts } from "../components/Cashouts/index.js"; import { useBackendContext } from "../context/backend.js"; -import { ErrorMessage, notifyInfo } from "../context/pageState.js"; import { useAccountDetails } from "../hooks/access.js"; import { useAdminAccountAPI, @@ -45,6 +44,7 @@ import { ShowCashoutDetails } from "./BusinessAccount.js"; import { handleNotOkResult } from "./HomePage.js"; import { PaytoWireTransferForm } from "./PaytoWireTransferForm.js"; import { ShowInputErrorLabel } from "./ShowInputErrorLabel.js"; +import { ErrorMessage, notifyInfo } from "../hooks/notification.js"; const charset = "abcdefghijklmnopqrstuvwxyz0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ"; diff --git a/packages/demobank-ui/src/pages/BankFrame.tsx b/packages/demobank-ui/src/pages/BankFrame.tsx index c4b18189f..d8942a8e7 100644 --- a/packages/demobank-ui/src/pages/BankFrame.tsx +++ b/packages/demobank-ui/src/pages/BankFrame.tsx @@ -21,16 +21,10 @@ import { StateUpdater, useEffect, useState } from "preact/hooks"; import talerLogo from "../assets/logo-white.svg"; import { LangSelectorLikePy as LangSelector } from "../components/LangSelector.js"; import { useBackendContext } from "../context/backend.js"; -import { - ErrorMessage, - PageStateProvider, - PageStateType, - errorListeners, - infoListeners, - usePageContext, -} from "../context/pageState.js"; import { useBusinessAccountDetails } from "../hooks/circuit.js"; import { bankUiSettings } from "../settings.js"; +import { useSettings } from "../hooks/settings.js"; +import { ErrorMessage, onNotificationUpdate } from "../hooks/notification.js"; const IS_PUBLIC_ACCOUNT_ENABLED = false; @@ -60,20 +54,7 @@ function MaybeBusinessButton({ ); } -export function BankFrame(props: { - children: ComponentChildren; - goToBusinessAccount?: () => void; -}): VNode { - return ( - - - {props.children} - - - ); -} - -function BankFrame2({ +export function BankFrame({ children, goToBusinessAccount, }: { @@ -82,8 +63,7 @@ function BankFrame2({ }): VNode { const { i18n } = useTranslationContext(); const backend = useBackendContext(); - - const { pageStateSetter } = usePageContext(); + const [settings, updateSettings] = useSettings(); const demo_sites = []; for (const i in bankUiSettings.demoSites) @@ -158,9 +138,7 @@ function BankFrame2({ class="pure-button logout-button" onClick={() => { backend.logOut(); - pageStateSetter({ - currentWithdrawalOperationId: undefined, - }); + updateSettings("currentWithdrawalOperationId", undefined); }} >{i18n.str`Logout`} @@ -255,28 +233,19 @@ function ErrorBanner({ function StatusBanner(): VNode | null { const [info, setInfo] = useState(); const [error, setError] = useState(); - function listenError(e: ErrorMessage) { - setError(e); - } - function listenInfo(m: TranslatedString) { - setInfo(m); - } useEffect(() => { - /** - * Refactor this to reuse the pattern observable/listener - */ - errorListeners.push(listenError); - infoListeners.push(listenInfo); - return function unsuscribe() { - const idx = infoListeners.findIndex((d) => d === listenInfo); - if (idx !== -1) { - infoListeners.splice(idx, 1); + return onNotificationUpdate((newValue) => { + if (newValue === undefined) { + setInfo(undefined); + setError(undefined); + } else { + if (newValue.type === "error") { + setError(newValue.error); + } else { + setInfo(newValue.info); + } } - const idx2 = errorListeners.findIndex((d) => d === listenError); - if (idx2 !== -1) { - errorListeners.splice(idx2, 1); - } - }; + }); }, []); return (
void; diff --git a/packages/demobank-ui/src/pages/HomePage.tsx b/packages/demobank-ui/src/pages/HomePage.tsx index 2cdbc49bc..340181a4f 100644 --- a/packages/demobank-ui/src/pages/HomePage.tsx +++ b/packages/demobank-ui/src/pages/HomePage.tsx @@ -27,17 +27,11 @@ import { useTranslationContext, } from "@gnu-taler/web-util/lib/index.browser"; import { Fragment, VNode, h } from "preact"; -import { StateUpdater } from "preact/hooks"; import { Loading } from "../components/Loading.js"; import { useBackendContext } from "../context/backend.js"; -import { - ObservedStateType, - PageStateType, - notifyError, - notifyInfo, - usePageContext, -} from "../context/pageState.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 { AdminPage } from "./AdminPage.js"; import { LoginForm } from "./LoginForm.js"; @@ -63,15 +57,15 @@ export function HomePage({ onRegister: () => void; }): VNode { const backend = useBackendContext(); - const { pageState, pageStateSetter } = usePageContext(); + const [settings] = useSettings(); const { i18n } = useTranslationContext(); if (backend.state.status === "loggedOut") { return ; } - if (pageState.currentWithdrawalOperationId) { - onPendingOperationFound(pageState.currentWithdrawalOperationId); + if (settings.currentWithdrawalOperationId) { + onPendingOperationFound(settings.currentWithdrawalOperationId); return ; } @@ -104,9 +98,10 @@ export function WithdrawalOperationPage({ }); const parsedUri = parseWithdrawUri(uri); const { i18n } = useTranslationContext(); - const { pageStateSetter } = usePageContext(); + + const [settings, updateSettings] = useSettings(); function clearCurrentWithdrawal(): void { - pageStateSetter({}); + updateSettings("currentWithdrawalOperationId", undefined); onAbort(); } diff --git a/packages/demobank-ui/src/pages/LoginForm.tsx b/packages/demobank-ui/src/pages/LoginForm.tsx index 0ea001fe2..3e8aee259 100644 --- a/packages/demobank-ui/src/pages/LoginForm.tsx +++ b/packages/demobank-ui/src/pages/LoginForm.tsx @@ -19,11 +19,11 @@ import { ErrorType, useTranslationContext, } from "@gnu-taler/web-util/lib/index.browser"; -import { Fragment, h, VNode } from "preact"; +import { Fragment, VNode, h } from "preact"; import { useEffect, useRef, useState } from "preact/hooks"; import { useBackendContext } from "../context/backend.js"; -import { ErrorMessage } from "../context/pageState.js"; import { useCredentialsChecker } from "../hooks/backend.js"; +import { ErrorMessage } from "../hooks/notification.js"; import { bankUiSettings } from "../settings.js"; import { undefinedIfEmpty } from "../utils.js"; import { ErrorBannerFloat } from "./BankFrame.js"; diff --git a/packages/demobank-ui/src/pages/PaymentOptions.tsx b/packages/demobank-ui/src/pages/PaymentOptions.tsx index e0ad64e64..78e55928d 100644 --- a/packages/demobank-ui/src/pages/PaymentOptions.tsx +++ b/packages/demobank-ui/src/pages/PaymentOptions.tsx @@ -17,15 +17,11 @@ import { AmountJson } from "@gnu-taler/taler-util"; import { useTranslationContext } from "@gnu-taler/web-util/lib/index.browser"; import { h, VNode } from "preact"; -import { StateUpdater, useState } from "preact/hooks"; -import { - notifyError, - notifyInfo, - PageStateType, - usePageContext, -} from "../context/pageState.js"; +import { useState } from "preact/hooks"; +import { notifyInfo } from "../hooks/notification.js"; import { PaytoWireTransferForm } from "./PaytoWireTransferForm.js"; import { WalletWithdrawForm } from "./WalletWithdrawForm.js"; +import { useSettings } from "../hooks/settings.js"; /** * Let the user choose a payment option, @@ -33,7 +29,7 @@ import { WalletWithdrawForm } from "./WalletWithdrawForm.js"; */ export function PaymentOptions({ limit }: { limit: AmountJson }): VNode { const { i18n } = useTranslationContext(); - const { pageStateSetter } = usePageContext(); + const [settings, updateSettings] = useSettings(); const [tab, setTab] = useState<"charge-wallet" | "wire-transfer">( "charge-wallet", @@ -66,10 +62,8 @@ export function PaymentOptions({ limit }: { limit: AmountJson }): VNode { { - pageStateSetter({ - currentWithdrawalOperationId, - }); + onSuccess={(id) => { + updateSettings("currentWithdrawalOperationId", id); }} />
diff --git a/packages/demobank-ui/src/pages/PaytoWireTransferForm.tsx b/packages/demobank-ui/src/pages/PaytoWireTransferForm.tsx index 5f16fbf6b..0bdceddb1 100644 --- a/packages/demobank-ui/src/pages/PaytoWireTransferForm.tsx +++ b/packages/demobank-ui/src/pages/PaytoWireTransferForm.tsx @@ -29,11 +29,7 @@ import { } from "@gnu-taler/web-util/lib/index.browser"; import { h, VNode } from "preact"; import { useEffect, useRef, useState } from "preact/hooks"; -import { - notifyError, - ObservedStateType, - PageStateType, -} from "../context/pageState.js"; +import { notifyError } from "../hooks/notification.js"; import { useAccessAPI } from "../hooks/access.js"; import { buildRequestErrorMessage, diff --git a/packages/demobank-ui/src/pages/PublicHistoriesPage.tsx b/packages/demobank-ui/src/pages/PublicHistoriesPage.tsx index 290fd0a79..256653dc5 100644 --- a/packages/demobank-ui/src/pages/PublicHistoriesPage.tsx +++ b/packages/demobank-ui/src/pages/PublicHistoriesPage.tsx @@ -15,33 +15,15 @@ */ import { Logger } from "@gnu-taler/taler-util"; -import { - HttpResponsePaginated, - useLocalStorage, - useTranslationContext, -} from "@gnu-taler/web-util/lib/index.browser"; -import { Fragment, h, VNode } from "preact"; -import { StateUpdater } from "preact/hooks"; +import { useTranslationContext } from "@gnu-taler/web-util/lib/index.browser"; +import { Fragment, VNode, h } from "preact"; +import { useState } from "preact/hooks"; import { Transactions } from "../components/Transactions/index.js"; import { usePublicAccounts } from "../hooks/access.js"; -import { - PageStateType, - notifyError, - usePageContext, -} from "../context/pageState.js"; import { handleNotOkResult } from "./HomePage.js"; -import { Loading } from "../components/Loading.js"; const logger = new Logger("PublicHistoriesPage"); -// export function PublicHistoriesPage2(): VNode { -// return ( -// -// -// -// ); -// } - interface Props { onLoadNotOk: () => void; } @@ -50,10 +32,16 @@ interface Props { * Show histories of public accounts. */ export function PublicHistoriesPage({ onLoadNotOk }: Props): VNode { - const [showAccount, setShowAccount] = useShowPublicAccount(); const { i18n } = useTranslationContext(); const result = usePublicAccounts(); + + const [showAccount, setShowAccount] = useState( + result.ok && result.data.publicAccounts.length > 0 + ? result.data.publicAccounts[0].accountLabel + : undefined, + ); + if (!result.ok) { onLoadNotOk(); return handleNotOkResult(i18n)(result); @@ -64,13 +52,6 @@ export function PublicHistoriesPage({ onLoadNotOk }: Props): VNode { const txs: Record = {}; 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); - } logger.trace(`Public history tab: ${showAccount}`); // Ask story of all the public accounts. @@ -119,23 +100,3 @@ export function PublicHistoriesPage({ onLoadNotOk }: Props): VNode { ); } - -/** - * 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 = 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]; -} diff --git a/packages/demobank-ui/src/pages/RegistrationPage.tsx b/packages/demobank-ui/src/pages/RegistrationPage.tsx index 5b9584dde..525fefbf5 100644 --- a/packages/demobank-ui/src/pages/RegistrationPage.tsx +++ b/packages/demobank-ui/src/pages/RegistrationPage.tsx @@ -18,15 +18,11 @@ import { RequestError, useTranslationContext, } from "@gnu-taler/web-util/lib/index.browser"; -import { Fragment, h, VNode } from "preact"; +import { Fragment, VNode, h } from "preact"; import { useState } from "preact/hooks"; import { useBackendContext } from "../context/backend.js"; -import { - PageStateType, - notifyError, - usePageContext, -} from "../context/pageState.js"; 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"; diff --git a/packages/demobank-ui/src/pages/WalletWithdrawForm.tsx b/packages/demobank-ui/src/pages/WalletWithdrawForm.tsx index 7f3e207ac..c57a9b9c2 100644 --- a/packages/demobank-ui/src/pages/WalletWithdrawForm.tsx +++ b/packages/demobank-ui/src/pages/WalletWithdrawForm.tsx @@ -25,14 +25,10 @@ import { RequestError, useTranslationContext, } from "@gnu-taler/web-util/lib/index.browser"; -import { h, VNode } from "preact"; +import { VNode, h } from "preact"; import { useEffect, useRef, useState } from "preact/hooks"; -import { - ObservedStateType, - PageStateType, - notifyError, -} from "../context/pageState.js"; import { useAccessAPI } from "../hooks/access.js"; +import { notifyError } from "../hooks/notification.js"; import { buildRequestErrorMessage, undefinedIfEmpty } from "../utils.js"; import { ShowInputErrorLabel } from "./ShowInputErrorLabel.js"; diff --git a/packages/demobank-ui/src/pages/WithdrawalConfirmationQuestion.tsx b/packages/demobank-ui/src/pages/WithdrawalConfirmationQuestion.tsx index 10a37cd88..772b07b5f 100644 --- a/packages/demobank-ui/src/pages/WithdrawalConfirmationQuestion.tsx +++ b/packages/demobank-ui/src/pages/WithdrawalConfirmationQuestion.tsx @@ -23,14 +23,10 @@ import { RequestError, useTranslationContext, } from "@gnu-taler/web-util/lib/index.browser"; -import { Fragment, h, VNode } from "preact"; +import { Fragment, VNode, h } from "preact"; import { useMemo, useState } from "preact/hooks"; -import { - ObservedStateType, - PageStateType, - notifyError, -} from "../context/pageState.js"; import { useAccessAnonAPI } from "../hooks/access.js"; +import { notifyError } from "../hooks/notification.js"; import { buildRequestErrorMessage, undefinedIfEmpty } from "../utils.js"; import { ShowInputErrorLabel } from "./ShowInputErrorLabel.js"; diff --git a/packages/demobank-ui/src/pages/WithdrawalQRCode.tsx b/packages/demobank-ui/src/pages/WithdrawalQRCode.tsx index a20b2e90d..826578ffc 100644 --- a/packages/demobank-ui/src/pages/WithdrawalQRCode.tsx +++ b/packages/demobank-ui/src/pages/WithdrawalQRCode.tsx @@ -21,20 +21,15 @@ import { } from "@gnu-taler/taler-util"; import { ErrorType, - HttpResponsePaginated, useTranslationContext, } from "@gnu-taler/web-util/lib/index.browser"; -import { Fragment, h, VNode } from "preact"; +import { Fragment, VNode, h } from "preact"; import { Loading } from "../components/Loading.js"; -import { - ObservedStateType, - notifyError, - notifyInfo, -} from "../context/pageState.js"; import { useWithdrawalDetails } from "../hooks/access.js"; +import { notifyInfo } from "../hooks/notification.js"; +import { handleNotOkResult } from "./HomePage.js"; import { QrCodeSection } from "./QrCodeSection.js"; import { WithdrawalConfirmationQuestion } from "./WithdrawalConfirmationQuestion.js"; -import { handleNotOkResult } from "./HomePage.js"; const logger = new Logger("WithdrawalQRCode"); diff --git a/packages/demobank-ui/src/utils.ts b/packages/demobank-ui/src/utils.ts index af0329555..e0aac8ecb 100644 --- a/packages/demobank-ui/src/utils.ts +++ b/packages/demobank-ui/src/utils.ts @@ -20,7 +20,7 @@ import { HttpError, useTranslationContext, } from "@gnu-taler/web-util/lib/index.browser"; -import { ErrorMessage } from "./context/pageState.js"; +import { ErrorMessage } from "./hooks/notification.js"; /** * Validate (the number part of) an amount. If needed,