diff options
Diffstat (limited to 'packages/demobank-ui/src/pages')
26 files changed, 146 insertions, 184 deletions
diff --git a/packages/demobank-ui/src/pages/AccountPage/state.ts b/packages/demobank-ui/src/pages/AccountPage/state.ts index b531ac757..e84fef025 100644 --- a/packages/demobank-ui/src/pages/AccountPage/state.ts +++ b/packages/demobank-ui/src/pages/AccountPage/state.ts @@ -21,7 +21,7 @@ import { assertUnreachable, parsePaytoUri, } from "@gnu-taler/taler-util"; -import { useAccountDetails } from "../../hooks/access.js"; +import { useAccountDetails } from "../../hooks/account.js"; import { Props, State } from "./index.js"; export function useComponentState({ diff --git a/packages/demobank-ui/src/pages/BankFrame.tsx b/packages/demobank-ui/src/pages/BankFrame.tsx index e1b8d6b83..427e9a156 100644 --- a/packages/demobank-ui/src/pages/BankFrame.tsx +++ b/packages/demobank-ui/src/pages/BankFrame.tsx @@ -28,8 +28,8 @@ import { ComponentChildren, VNode, h } from "preact"; import { useEffect, useErrorBoundary } from "preact/hooks"; import { useBankCoreApiContext } from "../context/config.js"; import { useSettingsContext } from "../context/settings.js"; -import { useAccountDetails } from "../hooks/access.js"; -import { useBackendState } from "../hooks/backend.js"; +import { useAccountDetails } from "../hooks/account.js"; +import { useSessionState } from "../hooks/session.js"; import { useBankState } from "../hooks/bank-state.js"; import { getAllBooleanPreferences, @@ -52,7 +52,7 @@ export function BankFrame({ children: ComponentChildren; }): VNode { const { i18n } = useTranslationContext(); - const backend = useBackendState(); + const session = useSessionState(); const settings = useSettingsContext(); const [preferences, updatePreferences] = usePreferences(); const [, , resetBankState] = useBankState(); @@ -86,10 +86,10 @@ export function BankFrame({ iconLinkURL={settings.iconLinkURL ?? "#"} profileURL={routeAccountDetails?.url({})} onLogout={ - backend.state.status !== "loggedIn" + session.state.status !== "loggedIn" ? undefined : () => { - backend.logOut(); + session.logOut(); resetBankState(); } } diff --git a/packages/demobank-ui/src/pages/LoginForm.tsx b/packages/demobank-ui/src/pages/LoginForm.tsx index f0ca447e1..e62759415 100644 --- a/packages/demobank-ui/src/pages/LoginForm.tsx +++ b/packages/demobank-ui/src/pages/LoginForm.tsx @@ -27,7 +27,7 @@ import { import { VNode, h } from "preact"; import { useEffect, useRef, useState } from "preact/hooks"; import { useBankCoreApiContext } from "../context/config.js"; -import { useBackendState } from "../hooks/backend.js"; +import { useSessionState } from "../hooks/session.js"; import { RouteDefinition } from "../route.js"; import { undefinedIfEmpty } from "../utils.js"; import { doAutoFocus } from "./PaytoWireTransferForm.js"; @@ -44,10 +44,10 @@ export function LoginForm({ currentUser?: string; routeRegister?: RouteDefinition; }): VNode { - const backend = useBackendState(); + const session = useSessionState(); const sessionUser = - backend.state.status !== "loggedOut" ? backend.state.username : undefined; + session.state.status !== "loggedOut" ? session.state.username : undefined; const [username, setUsername] = useState<string | undefined>( currentUser ?? sessionUser, ); @@ -73,7 +73,7 @@ export function LoginForm({ }); async function doLogout() { - backend.logOut(); + session.logOut(); } const loginHandler = !username || !password ? undefined : withErrorHandler( @@ -86,7 +86,7 @@ export function LoginForm({ refreshable: true, }), (result) => { - backend.logIn({ username, token: result.body.access_token }) + session.logIn({ username, token: result.body.access_token }) }, (fail) => { switch (fail.case) { @@ -173,7 +173,7 @@ export function LoginForm({ </div> </div> - {backend.state.status !== "loggedOut" ? ( + {session.state.status !== "loggedOut" ? ( <div class="flex justify-between"> <button type="submit" diff --git a/packages/demobank-ui/src/pages/OperationState/state.ts b/packages/demobank-ui/src/pages/OperationState/state.ts index ad2d91ee4..693179d40 100644 --- a/packages/demobank-ui/src/pages/OperationState/state.ts +++ b/packages/demobank-ui/src/pages/OperationState/state.ts @@ -28,8 +28,8 @@ import { utils } from "@gnu-taler/web-util/browser"; import { useEffect, useState } from "preact/hooks"; import { mutate } from "swr"; import { useBankCoreApiContext } from "../../context/config.js"; -import { useWithdrawalDetails } from "../../hooks/access.js"; -import { useBackendState } from "../../hooks/backend.js"; +import { useWithdrawalDetails } from "../../hooks/account.js"; +import { useSessionState } from "../../hooks/session.js"; import { useBankState } from "../../hooks/bank-state.js"; import { usePreferences } from "../../hooks/preferences.js"; import { Props, State } from "./index.js"; @@ -43,7 +43,7 @@ export function useComponentState({ }: Props): utils.RecursiveState<State> { const [settings] = usePreferences(); const [bankState, updateBankState] = useBankState(); - const { state: credentials } = useBackendState(); + const { state: credentials } = useSessionState(); const creds = credentials.status !== "loggedIn" ? undefined : credentials; const { api } = useBankCoreApiContext(); diff --git a/packages/demobank-ui/src/pages/PaymentOptions.tsx b/packages/demobank-ui/src/pages/PaymentOptions.tsx index ac7118697..48ecc7525 100644 --- a/packages/demobank-ui/src/pages/PaymentOptions.tsx +++ b/packages/demobank-ui/src/pages/PaymentOptions.tsx @@ -21,9 +21,9 @@ import { PaytoWireTransferForm } from "./PaytoWireTransferForm.js"; import { WalletWithdrawForm } from "./WalletWithdrawForm.js"; import { EmptyObject, RouteDefinition } from "../route.js"; import { useTranslationContext } from "@gnu-taler/web-util/browser"; -import { useWithdrawalDetails } from "../hooks/access.js"; +import { useWithdrawalDetails } from "../hooks/account.js"; import { useEffect } from "preact/hooks"; -import { useBackendState } from "../hooks/backend.js"; +import { useSessionState } from "../hooks/session.js"; function ShowOperationPendingTag({ woid, @@ -33,7 +33,7 @@ function ShowOperationPendingTag({ onOperationAlreadyCompleted?: () => void; }): VNode { const { i18n } = useTranslationContext(); - const { state: credentials } = useBackendState(); + const { state: credentials } = useSessionState(); const result = useWithdrawalDetails(woid); const loading = !result const error = diff --git a/packages/demobank-ui/src/pages/PaytoWireTransferForm.tsx b/packages/demobank-ui/src/pages/PaytoWireTransferForm.tsx index aeb5dc0c9..f746094ce 100644 --- a/packages/demobank-ui/src/pages/PaytoWireTransferForm.tsx +++ b/packages/demobank-ui/src/pages/PaytoWireTransferForm.tsx @@ -43,7 +43,7 @@ import { ComponentChildren, Fragment, Ref, VNode, h } from "preact"; import { useState } from "preact/hooks"; import { mutate } from "swr"; import { useBankCoreApiContext } from "../context/config.js"; -import { useBackendState } from "../hooks/backend.js"; +import { useSessionState } from "../hooks/session.js"; import { useBankState } from "../hooks/bank-state.js"; import { EmptyObject, RouteDefinition } from "../route.js"; import { undefinedIfEmpty, validateIBAN, validateTalerBank } from "../utils.js"; @@ -80,7 +80,7 @@ export function PaytoWireTransferForm({ limit, }: Props): VNode { const [isRawPayto, setIsRawPayto] = useState(false); - const { state: credentials } = useBackendState(); + const { state: credentials } = useSessionState(); const { api, config, url } = useBankCoreApiContext(); const sendingToFixedAccount = withAccount !== undefined; diff --git a/packages/demobank-ui/src/pages/ProfileNavigation.tsx b/packages/demobank-ui/src/pages/ProfileNavigation.tsx index 8b7a8205f..10497f015 100644 --- a/packages/demobank-ui/src/pages/ProfileNavigation.tsx +++ b/packages/demobank-ui/src/pages/ProfileNavigation.tsx @@ -18,7 +18,7 @@ import { useTranslationContext } from "@gnu-taler/web-util/browser"; import { Fragment, VNode, h } from "preact"; import { useBankCoreApiContext } from "../context/config.js"; import { useNavigationContext } from "../context/navigation.js"; -import { useBackendState } from "../hooks/backend.js"; +import { useSessionState } from "../hooks/session.js"; import { RouteDefinition } from "../route.js"; export function ProfileNavigation({ @@ -38,7 +38,7 @@ export function ProfileNavigation({ }): VNode { const { i18n } = useTranslationContext(); const { config } = useBankCoreApiContext(); - const { state: credentials } = useBackendState(); + const { state: credentials } = useSessionState(); const isAdminUser = credentials.status !== "loggedIn" ? false diff --git a/packages/demobank-ui/src/pages/PublicHistoriesPage.tsx b/packages/demobank-ui/src/pages/PublicHistoriesPage.tsx index f330cbc74..84d703cbe 100644 --- a/packages/demobank-ui/src/pages/PublicHistoriesPage.tsx +++ b/packages/demobank-ui/src/pages/PublicHistoriesPage.tsx @@ -19,7 +19,7 @@ import { Loading, useTranslationContext } from "@gnu-taler/web-util/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 { usePublicAccounts } from "../hooks/account.js"; /** * Show histories of public accounts. diff --git a/packages/demobank-ui/src/pages/QrCodeSection.tsx b/packages/demobank-ui/src/pages/QrCodeSection.tsx index 7091214e0..d4f5a5455 100644 --- a/packages/demobank-ui/src/pages/QrCodeSection.tsx +++ b/packages/demobank-ui/src/pages/QrCodeSection.tsx @@ -30,7 +30,7 @@ import { useEffect } from "preact/hooks"; import { QR } from "../components/QR.js"; import { useBankCoreApiContext } from "../context/config.js"; import { useTalerWalletIntegrationAPI } from "../context/wallet-integration.js"; -import { useBackendState } from "../hooks/backend.js"; +import { useSessionState } from "../hooks/session.js"; export function QrCodeSection({ withdrawUri, @@ -42,7 +42,7 @@ export function QrCodeSection({ const { i18n } = useTranslationContext(); const walletInegrationApi = useTalerWalletIntegrationAPI(); const talerWithdrawUri = stringifyWithdrawUri(withdrawUri); - const { state: credentials } = useBackendState(); + const { state: credentials } = useSessionState(); const creds = credentials.status !== "loggedIn" ? undefined : credentials; useEffect(() => { diff --git a/packages/demobank-ui/src/pages/SolveChallengePage.tsx b/packages/demobank-ui/src/pages/SolveChallengePage.tsx index 1bafbc3eb..7e117f535 100644 --- a/packages/demobank-ui/src/pages/SolveChallengePage.tsx +++ b/packages/demobank-ui/src/pages/SolveChallengePage.tsx @@ -39,10 +39,10 @@ import { Fragment, VNode, h } from "preact"; import { useEffect, useState } from "preact/hooks"; import { ErrorLoadingWithDebug } from "../components/ErrorLoadingWithDebug.js"; import { useBankCoreApiContext } from "../context/config.js"; -import { useWithdrawalDetails } from "../hooks/access.js"; -import { useBackendState } from "../hooks/backend.js"; +import { useWithdrawalDetails } from "../hooks/account.js"; +import { useSessionState } from "../hooks/session.js"; import { ChallengeInProgess, useBankState } from "../hooks/bank-state.js"; -import { useConversionInfo } from "../hooks/circuit.js"; +import { useConversionInfo } from "../hooks/regional.js"; import { RouteDefinition } from "../route.js"; import { undefinedIfEmpty } from "../utils.js"; import { RenderAmount } from "./PaytoWireTransferForm.js"; @@ -62,7 +62,7 @@ export function SolveChallengePage({ const [bankState, updateBankState] = useBankState(); const [code, setCode] = useState<string | undefined>(undefined); const [notification, notify, handleError] = useLocalNotification(); - const { state } = useBackendState(); + const { state } = useSessionState(); const creds = state.status !== "loggedIn" ? undefined : state; const { navigateTo } = useNavigationContext(); diff --git a/packages/demobank-ui/src/pages/WalletWithdrawForm.tsx b/packages/demobank-ui/src/pages/WalletWithdrawForm.tsx index 078f4e5f5..caf205f31 100644 --- a/packages/demobank-ui/src/pages/WalletWithdrawForm.tsx +++ b/packages/demobank-ui/src/pages/WalletWithdrawForm.tsx @@ -33,7 +33,7 @@ import { VNode, h } from "preact"; import { forwardRef } from "preact/compat"; import { useState } from "preact/hooks"; import { useBankCoreApiContext } from "../context/config.js"; -import { useBackendState } from "../hooks/backend.js"; +import { useSessionState } from "../hooks/session.js"; import { useBankState } from "../hooks/bank-state.js"; import { usePreferences } from "../hooks/preferences.js"; import { RouteDefinition } from "../route.js"; @@ -65,7 +65,7 @@ function OldWithdrawalForm({ const [bankState, updateBankState] = useBankState(); const { api } = useBankCoreApiContext(); - const { state: credentials } = useBackendState(); + const { state: credentials } = useSessionState(); const creds = credentials.status !== "loggedIn" ? undefined : credentials; const [amountStr, setAmountStr] = useState<string | undefined>( diff --git a/packages/demobank-ui/src/pages/WireTransfer.tsx b/packages/demobank-ui/src/pages/WireTransfer.tsx index 927968304..33f067e63 100644 --- a/packages/demobank-ui/src/pages/WireTransfer.tsx +++ b/packages/demobank-ui/src/pages/WireTransfer.tsx @@ -26,8 +26,8 @@ import { } from "@gnu-taler/web-util/browser"; import { Fragment, VNode, h } from "preact"; import { ErrorLoadingWithDebug } from "../components/ErrorLoadingWithDebug.js"; -import { useAccountDetails } from "../hooks/access.js"; -import { useBackendState } from "../hooks/backend.js"; +import { useAccountDetails } from "../hooks/account.js"; +import { useSessionState } from "../hooks/session.js"; import { LoginForm } from "./LoginForm.js"; import { PaytoWireTransferForm } from "./PaytoWireTransferForm.js"; import { RouteDefinition } from "../route.js"; @@ -54,7 +54,7 @@ export function WireTransfer({ onAuthorizationRequired: () => void; }): VNode { const { i18n } = useTranslationContext(); - const r = useBackendState(); + const r = useSessionState(); const account = r.state.status !== "loggedOut" ? r.state.username : "admin"; const result = useAccountDetails(account); diff --git a/packages/demobank-ui/src/pages/WithdrawalConfirmationQuestion.tsx b/packages/demobank-ui/src/pages/WithdrawalConfirmationQuestion.tsx index 39b94b349..4efc82017 100644 --- a/packages/demobank-ui/src/pages/WithdrawalConfirmationQuestion.tsx +++ b/packages/demobank-ui/src/pages/WithdrawalConfirmationQuestion.tsx @@ -36,9 +36,9 @@ import { import { ComponentChildren, Fragment, VNode, h } from "preact"; import { mutate } from "swr"; import { useBankCoreApiContext } from "../context/config.js"; -import { useBackendState } from "../hooks/backend.js"; import { useBankState } from "../hooks/bank-state.js"; import { usePreferences } from "../hooks/preferences.js"; +import { useSessionState } from "../hooks/session.js"; import { RouteDefinition } from "../route.js"; import { LoginForm } from "./LoginForm.js"; import { RenderAmount } from "./PaytoWireTransferForm.js"; @@ -68,7 +68,7 @@ export function WithdrawalConfirmationQuestion({ }: Props): VNode { const { i18n } = useTranslationContext(); const [settings] = usePreferences(); - const { state: credentials } = useBackendState(); + const { state: credentials } = useSessionState(); const creds = credentials.status !== "loggedIn" ? undefined : credentials; const [, updateBankState] = useBankState(); @@ -330,7 +330,7 @@ export function ShouldBeSameUser({ username: string; children: ComponentChildren; }): VNode { - const { state: credentials } = useBackendState(); + const { state: credentials } = useSessionState(); const { i18n } = useTranslationContext(); if (credentials.status === "loggedOut") { return ( diff --git a/packages/demobank-ui/src/pages/WithdrawalQRCode.tsx b/packages/demobank-ui/src/pages/WithdrawalQRCode.tsx index b128bd99f..9765147d1 100644 --- a/packages/demobank-ui/src/pages/WithdrawalQRCode.tsx +++ b/packages/demobank-ui/src/pages/WithdrawalQRCode.tsx @@ -30,7 +30,7 @@ import { } from "@gnu-taler/web-util/browser"; import { VNode, h } from "preact"; import { ErrorLoadingWithDebug } from "../components/ErrorLoadingWithDebug.js"; -import { useWithdrawalDetails } from "../hooks/access.js"; +import { useWithdrawalDetails } from "../hooks/account.js"; import { RouteDefinition } from "../route.js"; import { QrCodeSection } from "./QrCodeSection.js"; import { WithdrawalConfirmationQuestion } from "./WithdrawalConfirmationQuestion.js"; diff --git a/packages/demobank-ui/src/pages/account/CashoutListForAccount.tsx b/packages/demobank-ui/src/pages/account/CashoutListForAccount.tsx index fe64778dd..2216b96fc 100644 --- a/packages/demobank-ui/src/pages/account/CashoutListForAccount.tsx +++ b/packages/demobank-ui/src/pages/account/CashoutListForAccount.tsx @@ -16,9 +16,9 @@ import { useTranslationContext } from "@gnu-taler/web-util/browser"; import { Fragment, VNode, h } from "preact"; import { Cashouts } from "../../components/Cashouts/index.js"; -import { useBackendState } from "../../hooks/backend.js"; +import { useSessionState } from "../../hooks/session.js"; import { ProfileNavigation } from "../ProfileNavigation.js"; -import { CreateCashout } from "../business/CreateCashout.js"; +import { CreateCashout } from "../regional/CreateCashout.js"; import { RouteDefinition } from "../../route.js"; interface Props { @@ -48,7 +48,7 @@ export function CashoutListForAccount({ }: Props): VNode { const { i18n } = useTranslationContext(); - const { state: credentials } = useBackendState(); + const { state: credentials } = useSessionState(); const accountIsTheCurrentUser = credentials.status === "loggedIn" diff --git a/packages/demobank-ui/src/pages/account/ShowAccountDetails.tsx b/packages/demobank-ui/src/pages/account/ShowAccountDetails.tsx index 6aad8997a..8ab3998ad 100644 --- a/packages/demobank-ui/src/pages/account/ShowAccountDetails.tsx +++ b/packages/demobank-ui/src/pages/account/ShowAccountDetails.tsx @@ -33,8 +33,8 @@ import { Fragment, VNode, h } from "preact"; import { useState } from "preact/hooks"; import { ErrorLoadingWithDebug } from "../../components/ErrorLoadingWithDebug.js"; import { useBankCoreApiContext } from "../../context/config.js"; -import { useAccountDetails } from "../../hooks/access.js"; -import { useBackendState } from "../../hooks/backend.js"; +import { useAccountDetails } from "../../hooks/account.js"; +import { useSessionState } from "../../hooks/session.js"; import { useBankState } from "../../hooks/bank-state.js"; import { RouteDefinition } from "../../route.js"; import { LoginForm } from "../LoginForm.js"; @@ -65,7 +65,7 @@ export function ShowAccountDetails({ account: string; }): VNode { const { i18n } = useTranslationContext(); - const { state: credentials } = useBackendState(); + const { state: credentials } = useSessionState(); const creds = credentials.status !== "loggedIn" ? undefined : credentials; const { api } = useBankCoreApiContext(); const accountIsTheCurrentUser = diff --git a/packages/demobank-ui/src/pages/account/UpdateAccountPassword.tsx b/packages/demobank-ui/src/pages/account/UpdateAccountPassword.tsx index 305f041ec..b9a334088 100644 --- a/packages/demobank-ui/src/pages/account/UpdateAccountPassword.tsx +++ b/packages/demobank-ui/src/pages/account/UpdateAccountPassword.tsx @@ -29,7 +29,7 @@ import { import { Fragment, VNode, h } from "preact"; import { useState } from "preact/hooks"; import { useBankCoreApiContext } from "../../context/config.js"; -import { useBackendState } from "../../hooks/backend.js"; +import { useSessionState } from "../../hooks/session.js"; import { useBankState } from "../../hooks/bank-state.js"; import { RouteDefinition } from "../../route.js"; import { undefinedIfEmpty } from "../../utils.js"; @@ -62,7 +62,7 @@ export function UpdateAccountPassword({ account: string; }): VNode { const { i18n } = useTranslationContext(); - const { state: credentials } = useBackendState(); + const { state: credentials } = useSessionState(); const token = credentials.status !== "loggedIn" ? undefined : credentials.token; const { api } = useBankCoreApiContext(); diff --git a/packages/demobank-ui/src/pages/admin/AccountForm.tsx b/packages/demobank-ui/src/pages/admin/AccountForm.tsx index 5a5ce8c32..bce7afe11 100644 --- a/packages/demobank-ui/src/pages/admin/AccountForm.tsx +++ b/packages/demobank-ui/src/pages/admin/AccountForm.tsx @@ -33,7 +33,7 @@ import { import { ComponentChildren, VNode, h } from "preact"; import { useState } from "preact/hooks"; import { VersionHint, useBankCoreApiContext } from "../../context/config.js"; -import { useBackendState } from "../../hooks/backend.js"; +import { useSessionState } from "../../hooks/session.js"; import { ErrorMessageMappingFor, TanChannel, @@ -92,7 +92,7 @@ export function AccountForm<PurposeType extends keyof ChangeByPurposeType>({ }): VNode { const { config, hints, url } = useBankCoreApiContext(); const { i18n } = useTranslationContext(); - const { state: credentials } = useBackendState(); + const { state: credentials } = useSessionState(); const [form, setForm] = useState<AccountFormData>({}); const [errors, setErrors] = useState< diff --git a/packages/demobank-ui/src/pages/admin/AccountList.tsx b/packages/demobank-ui/src/pages/admin/AccountList.tsx index e0d368f04..4e465d4b5 100644 --- a/packages/demobank-ui/src/pages/admin/AccountList.tsx +++ b/packages/demobank-ui/src/pages/admin/AccountList.tsx @@ -23,7 +23,7 @@ import { Loading, useTranslationContext } from "@gnu-taler/web-util/browser"; import { Fragment, VNode, h } from "preact"; import { ErrorLoadingWithDebug } from "../../components/ErrorLoadingWithDebug.js"; import { useBankCoreApiContext } from "../../context/config.js"; -import { useBusinessAccounts } from "../../hooks/circuit.js"; +import { useBusinessAccounts } from "../../hooks/regional.js"; import { RenderAmount } from "../PaytoWireTransferForm.js"; import { RouteDefinition } from "../../route.js"; diff --git a/packages/demobank-ui/src/pages/admin/AdminHome.tsx b/packages/demobank-ui/src/pages/admin/AdminHome.tsx index 2cdc39261..752d86aa6 100644 --- a/packages/demobank-ui/src/pages/admin/AdminHome.tsx +++ b/packages/demobank-ui/src/pages/admin/AdminHome.tsx @@ -40,7 +40,7 @@ import { useState } from "preact/hooks"; import { ErrorLoadingWithDebug } from "../../components/ErrorLoadingWithDebug.js"; import { Transactions } from "../../components/Transactions/index.js"; import { useBankCoreApiContext } from "../../context/config.js"; -import { useConversionInfo, useLastMonitorInfo } from "../../hooks/circuit.js"; +import { useConversionInfo, useLastMonitorInfo } from "../../hooks/regional.js"; import { RouteDefinition } from "../../route.js"; import { RenderAmount } from "../PaytoWireTransferForm.js"; import { WireTransfer } from "../WireTransfer.js"; diff --git a/packages/demobank-ui/src/pages/admin/CreateNewAccount.tsx b/packages/demobank-ui/src/pages/admin/CreateNewAccount.tsx index e09164ffb..3ae2b636c 100644 --- a/packages/demobank-ui/src/pages/admin/CreateNewAccount.tsx +++ b/packages/demobank-ui/src/pages/admin/CreateNewAccount.tsx @@ -30,7 +30,7 @@ import { import { Fragment, VNode, h } from "preact"; import { useState } from "preact/hooks"; import { useBankCoreApiContext } from "../../context/config.js"; -import { useBackendState } from "../../hooks/backend.js"; +import { useSessionState } from "../../hooks/session.js"; import { RouteDefinition } from "../../route.js"; import { AccountForm } from "./AccountForm.js"; @@ -42,7 +42,7 @@ export function CreateNewAccount({ onCreateSuccess: () => void; }): VNode { const { i18n } = useTranslationContext(); - const { state: credentials } = useBackendState(); + const { state: credentials } = useSessionState(); const token = credentials.status !== "loggedIn" ? undefined : credentials.token; const { api } = useBankCoreApiContext(); diff --git a/packages/demobank-ui/src/pages/DownloadStats.tsx b/packages/demobank-ui/src/pages/admin/DownloadStats.tsx index 353238c13..66ef73d19 100644 --- a/packages/demobank-ui/src/pages/DownloadStats.tsx +++ b/packages/demobank-ui/src/pages/admin/DownloadStats.tsx @@ -29,10 +29,10 @@ import { } from "@gnu-taler/web-util/browser"; import { VNode, h } from "preact"; import { useState } from "preact/hooks"; -import { useBankCoreApiContext } from "../context/config.js"; -import { useBackendState } from "../hooks/backend.js"; -import { EmptyObject, RouteDefinition } from "../route.js"; -import { getTimeframesForDate } from "./admin/AdminHome.js"; +import { useBankCoreApiContext } from "../../context/config.js"; +import { useSessionState } from "../../hooks/session.js"; +import { EmptyObject, RouteDefinition } from "../../route.js"; +import { getTimeframesForDate } from "./AdminHome.js"; interface Props { routeCancel: RouteDefinition; @@ -54,7 +54,7 @@ type Options = { export function DownloadStats({ routeCancel }: Props): VNode { const { i18n } = useTranslationContext(); - const { state: credentials } = useBackendState(); + const { state: credentials } = useSessionState(); const creds = credentials.status !== "loggedIn" || !credentials.isUserAdministrator ? undefined diff --git a/packages/demobank-ui/src/pages/admin/RemoveAccount.tsx b/packages/demobank-ui/src/pages/admin/RemoveAccount.tsx index 6f02eae8f..6039db326 100644 --- a/packages/demobank-ui/src/pages/admin/RemoveAccount.tsx +++ b/packages/demobank-ui/src/pages/admin/RemoveAccount.tsx @@ -35,8 +35,8 @@ import { Fragment, VNode, h } from "preact"; import { useState } from "preact/hooks"; import { ErrorLoadingWithDebug } from "../../components/ErrorLoadingWithDebug.js"; import { useBankCoreApiContext } from "../../context/config.js"; -import { useAccountDetails } from "../../hooks/access.js"; -import { useBackendState } from "../../hooks/backend.js"; +import { useAccountDetails } from "../../hooks/account.js"; +import { useSessionState } from "../../hooks/session.js"; import { undefinedIfEmpty } from "../../utils.js"; import { LoginForm } from "../LoginForm.js"; import { doAutoFocus } from "../PaytoWireTransferForm.js"; @@ -62,7 +62,7 @@ export function RemoveAccount({ const result = useAccountDetails(account); const [accountName, setAccountName] = useState<string | undefined>(); - const { state } = useBackendState(); + const { state } = useSessionState(); const token = state.status !== "loggedIn" ? undefined : state.token; const { api } = useBankCoreApiContext(); const [notification, notify, handleError] = useLocalNotification(); diff --git a/packages/demobank-ui/src/pages/ConversionConfig.tsx b/packages/demobank-ui/src/pages/regional/ConversionConfig.tsx index 2d52cd99f..63423353b 100644 --- a/packages/demobank-ui/src/pages/ConversionConfig.tsx +++ b/packages/demobank-ui/src/pages/regional/ConversionConfig.tsx @@ -34,13 +34,14 @@ import { } from "@gnu-taler/web-util/browser"; import { Fragment, VNode, h } from "preact"; import { useEffect, useState } from "preact/hooks"; -import { useBankCoreApiContext } from "../context/config.js"; -import { useBackendState } from "../hooks/backend.js"; -import { TransferCalculation, useCashinEstimator, useCashoutEstimator, useConversionInfo } from "../hooks/circuit.js"; -import { RouteDefinition } from "../route.js"; -import { undefinedIfEmpty } from "../utils.js"; -import { InputAmount, RenderAmount } from "./PaytoWireTransferForm.js"; -import { ProfileNavigation } from "./ProfileNavigation.js"; +import { useBankCoreApiContext } from "../../context/config.js"; +import { useSessionState } from "../../hooks/session.js"; +import { TransferCalculation, useCashinEstimator, useCashoutEstimator, useConversionInfo } from "../../hooks/regional.js"; +import { RouteDefinition } from "../../route.js"; +import { undefinedIfEmpty } from "../../utils.js"; +import { InputAmount, RenderAmount } from "../PaytoWireTransferForm.js"; +import { ProfileNavigation } from "../ProfileNavigation.js"; +import { FormErrors, FormStatus, FormValues, RecursivePartial, UIField, useFormState } from "../../hooks/form.js"; interface Props { routeMyAccountDetails: RouteDefinition; @@ -52,87 +53,8 @@ interface Props { onUpdateSuccess: () => void; } -type UIField = { - value: string | undefined; - onUpdate: (s: string) => void; - error: TranslatedString | undefined; -} - -type FormHandler<T> = { - [k in keyof T]?: - T[k] extends string ? UIField : - T[k] extends AmountJson ? UIField : - FormHandler<T[k]>; -} - -type FormValues<T> = { - [k in keyof T]: - T[k] extends string ? (string | undefined) : - T[k] extends AmountJson ? (string | undefined) : - FormValues<T[k]>; -} - -type RecursivePartial<T> = { - [k in keyof T]?: - T[k] extends string ? (string) : - T[k] extends AmountJson ? (AmountJson) : - RecursivePartial<T[k]>; -} - -type FormErrors<T> = { - [k in keyof T]?: - T[k] extends string ? (TranslatedString) : - T[k] extends AmountJson ? (TranslatedString) : - FormErrors<T[k]>; -} - -type FormStatus<T> = { - status: "ok", - result: T, - errors: undefined, -} | { - status: "fail", - result: RecursivePartial<T>, - errors: FormErrors<T>, -} type FormType = { amount: AmountJson, conv: TalerBankConversionApi.ConversionRate } -function constructFormHandler<T>(form: FormValues<T>, updateForm: (d: FormValues<T>) => void, errors: FormErrors<T> | undefined): FormHandler<T> { - const keys = (Object.keys(form) as Array<keyof T>) - - const handler = keys.reduce((prev, fieldName) => { - const currentValue: any = form[fieldName]; - const currentError: any = errors ? errors[fieldName] : undefined; - function updater(newValue: any) { - updateForm({ ...form, [fieldName]: newValue }) - } - if (typeof currentValue === "object") { - const group = constructFormHandler(currentValue, updater, currentError) - // @ts-expect-error asdasd - prev[fieldName] = group - return prev; - } - const field: UIField = { - error: currentError, - value: currentValue, - onUpdate: updater - } - // @ts-expect-error asdasd - prev[fieldName] = field - return prev - }, {} as FormHandler<T>) - - return handler; -} - -function useFormState<T>(defaultValue: FormValues<T>, check: (f: FormValues<T>) => FormStatus<T>): [FormHandler<T>, FormStatus<T>] { - const [form, updateForm] = useState<FormValues<T>>(defaultValue) - - const status = check(form) - const handler = constructFormHandler(form, updateForm, status.errors) - - return [handler, status] -} function useComponentState({ onUpdateSuccess, @@ -143,23 +65,24 @@ function useComponentState({ routeMyAccountDetails, routeMyAccountPassword, }: Props): utils.RecursiveState<VNode> { + const { i18n } = useTranslationContext(); const result = useConversionInfo() const info = result && !(result instanceof TalerError) && result.type === "ok" ? result.body : undefined; - const { state: credentials } = useBackendState(); + const { state: credentials } = useSessionState(); const creds = credentials.status !== "loggedIn" || !credentials.isUserAdministrator ? undefined : credentials; if (!info) { - return <div>waiting...</div> + return <i18n.Translate>loading...</i18n.Translate> } if (!creds) { - return <div>only admin can setup conversion</div>; + return <i18n.Translate>only admin can setup conversion</i18n.Translate> } return () => { @@ -187,7 +110,7 @@ function useComponentState({ const [form, status] = useFormState<FormType>( initalState, - checkConversionForm(i18n, info.regional_currency, info.fiat_currency) + createFormValidator(i18n, info.regional_currency, info.fiat_currency) ) const { @@ -378,8 +301,6 @@ function useComponentState({ tiny={form?.conv?.cashin_tiny_amount} />} - - {section == "cashout" && <Fragment> <ConversionForm id="cashout" inputCurrency={info.regional_currency} @@ -392,9 +313,6 @@ function useComponentState({ /> </Fragment>} - - - {section == "detail" && <Fragment> <div class="px-6 pt-6"> <div class="justify-between items-center flex "> @@ -587,12 +505,16 @@ function useComponentState({ } } -/** - * Show histories of public accounts. - */ export const ConversionConfig = utils.recursive(useComponentState); -function checkConversionForm(i18n: InternationalizationAPI, regional: string, fiat: string) { +/** + * + * @param i18n + * @param regional + * @param fiat + * @returns form validator + */ +function createFormValidator(i18n: InternationalizationAPI, regional: string, fiat: string) { return function check(state: FormValues<FormType>): FormStatus<FormType> { const cashin_min_amount = Amounts.parse(`${fiat}:${state.conv.cashin_min_amount}`) @@ -905,82 +827,122 @@ function ConversionForm({ id, inputCurrency, outputCurrency, fee, minimum, ratio <section class="grid grid-cols-1 gap-y-3 text-gray-600"> <details class="group text-sm"> <summary class="flex cursor-pointer flex-row items-center justify-between "> - Rounding an amount of 1.24 with rounding value 0.1 + <i18n.Translate> + Rounding an amount of 1.24 with rounding value 0.1 + </i18n.Translate> <svg class="h-6 w-6 rotate-0 transform group-open:rotate-180" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" aria-hidden="true"> <path stroke-linecap="round" stroke-linejoin="round" d="M19 9l-7 7-7-7"></path> </svg> </summary> <p class="text-gray-900 my-4"> - Given the rounding value of 0.1 the possible values closest to 1.24 are: 1.1, 1.2, 1.3, 1.4. + <i18n.Translate> + Given the rounding value of 0.1 the possible values closest to 1.24 are: 1.1, 1.2, 1.3, 1.4. + </i18n.Translate> </p> <p class="text-gray-900 my-4"> - With the "zero" mode the value will be rounded to 1.2 + <i18n.Translate> + With the "zero" mode the value will be rounded to 1.2 + </i18n.Translate> </p> <p class="text-gray-900 my-4"> - With the "nearest" mode the value will be rounded to 1.2 + <i18n.Translate> + With the "nearest" mode the value will be rounded to 1.2 + </i18n.Translate> </p> <p class="text-gray-900 mt-4"> - With the "up" mode the value will be rounded to 1.3 + <i18n.Translate> + With the "up" mode the value will be rounded to 1.3 + </i18n.Translate> </p> </details> <details class="group "> <summary class="flex cursor-pointer flex-row items-center justify-between "> - Rounding an amount of 1.26 with rounding value 0.1 + <i18n.Translate> + Rounding an amount of 1.26 with rounding value 0.1 + </i18n.Translate> <svg class="h-6 w-6 rotate-0 transform group-open:rotate-180" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" aria-hidden="true"> <path stroke-linecap="round" stroke-linejoin="round" d="M19 9l-7 7-7-7"></path> </svg> </summary> <p class="text-gray-900 my-4"> - Given the rounding value of 0.1 the possible values closest to 1.24 are: 1.1, 1.2, 1.3, 1.4. + <i18n.Translate> + Given the rounding value of 0.1 the possible values closest to 1.24 are: 1.1, 1.2, 1.3, 1.4. + </i18n.Translate> </p> <p class="text-gray-900 my-4"> - With the "zero" mode the value will be rounded to 1.2 + <i18n.Translate> + With the "zero" mode the value will be rounded to 1.2 + </i18n.Translate> </p> <p class="text-gray-900 my-4"> - With the "nearest" mode the value will be rounded to 1.3 + <i18n.Translate> + With the "nearest" mode the value will be rounded to 1.3 + </i18n.Translate> </p> <p class="text-gray-900 my-4"> - With the "up" mode the value will be rounded to 1.3 + <i18n.Translate> + With the "up" mode the value will be rounded to 1.3 + </i18n.Translate> </p> </details> <details class="group "> <summary class="flex cursor-pointer flex-row items-center justify-between "> - Rounding an amount of 1.24 with rounding value 0.3 + <i18n.Translate> + Rounding an amount of 1.24 with rounding value 0.3 + </i18n.Translate> <svg class="h-6 w-6 rotate-0 transform group-open:rotate-180" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" aria-hidden="true"> <path stroke-linecap="round" stroke-linejoin="round" d="M19 9l-7 7-7-7"></path> </svg> </summary> <p class="text-gray-900 my-4"> - Given the rounding value of 0.3 the possible values closest to 1.24 are: 0.9, 1.2, 1.5, 1.8. + <i18n.Translate> + Given the rounding value of 0.3 the possible values closest to 1.24 are: 0.9, 1.2, 1.5, 1.8. + </i18n.Translate> </p> <p class="text-gray-900 my-4"> - With the "zero" mode the value will be rounded to 1.2 + <i18n.Translate> + With the "zero" mode the value will be rounded to 1.2 + </i18n.Translate> </p> <p class="text-gray-900 my-4"> - With the "nearest" mode the value will be rounded to 1.2 + <i18n.Translate> + With the "nearest" mode the value will be rounded to 1.2 + </i18n.Translate> </p> <p class="text-gray-900 my-4"> - With the "up" mode the value will be rounded to 1.5 + <i18n.Translate> + With the "up" mode the value will be rounded to 1.5 + </i18n.Translate> </p> </details> <details class="group "> <summary class="flex cursor-pointer flex-row items-center justify-between "> - Rounding an amount of 1.26 with rounding value 0.3 + <i18n.Translate> + Rounding an amount of 1.26 with rounding value 0.3 + </i18n.Translate> <svg class="h-6 w-6 rotate-0 transform group-open:rotate-180" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" aria-hidden="true"> <path stroke-linecap="round" stroke-linejoin="round" d="M19 9l-7 7-7-7"></path> </svg> </summary> <p class="text-gray-900 my-4"> - Given the rounding value of 0.3 the possible values closest to 1.24 are: 0.9, 1.2, 1.5, 1.8. + <i18n.Translate> + Given the rounding value of 0.3 the possible values closest to 1.24 are: 0.9, 1.2, 1.5, 1.8. + </i18n.Translate> </p> <p class="text-gray-900 my-4"> - With the "zero" mode the value will be rounded to 1.2 + <i18n.Translate> + With the "zero" mode the value will be rounded to 1.2 + </i18n.Translate> </p> <p class="text-gray-900 my-4"> - With the "nearest" mode the value will be rounded to 1.3 + <i18n.Translate> + With the "nearest" mode the value will be rounded to 1.3 + </i18n.Translate> </p> <p class="text-gray-900 my-4"> - With the "up" mode the value will be rounded to 1.3 + <i18n.Translate> + With the "up" mode the value will be rounded to 1.3 + </i18n.Translate> </p> </details> </section> diff --git a/packages/demobank-ui/src/pages/business/CreateCashout.tsx b/packages/demobank-ui/src/pages/regional/CreateCashout.tsx index 1a5fad1b1..a5b8f774a 100644 --- a/packages/demobank-ui/src/pages/business/CreateCashout.tsx +++ b/packages/demobank-ui/src/pages/regional/CreateCashout.tsx @@ -38,10 +38,10 @@ import { Fragment, VNode, h } from "preact"; import { useEffect, useState } from "preact/hooks"; import { ErrorLoadingWithDebug } from "../../components/ErrorLoadingWithDebug.js"; import { VersionHint, useBankCoreApiContext } from "../../context/config.js"; -import { useAccountDetails } from "../../hooks/access.js"; -import { useBackendState } from "../../hooks/backend.js"; +import { useAccountDetails } from "../../hooks/account.js"; +import { useSessionState } from "../../hooks/session.js"; import { useBankState } from "../../hooks/bank-state.js"; -import { TransferCalculation, useCashoutEstimator, useConversionInfo, useEstimator } from "../../hooks/circuit.js"; +import { TransferCalculation, useCashoutEstimator, useConversionInfo, useEstimator } from "../../hooks/regional.js"; import { RouteDefinition } from "../../route.js"; import { TanChannel, undefinedIfEmpty } from "../../utils.js"; import { LoginForm } from "../LoginForm.js"; @@ -82,7 +82,7 @@ export function CreateCashout({ estimateByCredit: calculateFromCredit, estimateByDebit: calculateFromDebit, } = useCashoutEstimator(); - const { state: credentials } = useBackendState(); + const { state: credentials } = useSessionState(); const creds = credentials.status !== "loggedIn" ? undefined : credentials; const [, updateBankState] = useBankState(); diff --git a/packages/demobank-ui/src/pages/business/ShowCashoutDetails.tsx b/packages/demobank-ui/src/pages/regional/ShowCashoutDetails.tsx index 33115c16a..415f88868 100644 --- a/packages/demobank-ui/src/pages/business/ShowCashoutDetails.tsx +++ b/packages/demobank-ui/src/pages/regional/ShowCashoutDetails.tsx @@ -29,7 +29,7 @@ import { import { format } from "date-fns"; import { VNode, h } from "preact"; import { ErrorLoadingWithDebug } from "../../components/ErrorLoadingWithDebug.js"; -import { useCashoutDetails, useConversionInfo } from "../../hooks/circuit.js"; +import { useCashoutDetails, useConversionInfo } from "../../hooks/regional.js"; import { RouteDefinition } from "../../route.js"; import { RenderAmount } from "../PaytoWireTransferForm.js"; import { Time } from "../../components/Time.js"; |