diff --git a/packages/demobank-ui/src/components/ErrorLoading.tsx b/packages/demobank-ui/src/components/ErrorLoading.tsx index a4faa4d5d..f83b61234 100644 --- a/packages/demobank-ui/src/components/ErrorLoading.tsx +++ b/packages/demobank-ui/src/components/ErrorLoading.tsx @@ -32,6 +32,9 @@ export function ErrorLoading({ error }: { error: HttpError{error.message}

+
+

Got status "{error.info.status}" on {error.info.url}

+
); diff --git a/packages/demobank-ui/src/components/Transactions/state.ts b/packages/demobank-ui/src/components/Transactions/state.ts index 30c48aa45..4b62b005e 100644 --- a/packages/demobank-ui/src/components/Transactions/state.ts +++ b/packages/demobank-ui/src/components/Transactions/state.ts @@ -44,7 +44,7 @@ export function useComponentState({ account }: Props): State { cp.targetType === "bitcoin" ? `${cp.targetPath.substring(0, 6)}...` : undefined) ?? "unkown"; - const when = AbsoluteTime.fromMilliseconds(tx.date / 1000); + const when = AbsoluteTime.fromProtocolTimestamp(tx.date); const amount = Amounts.parse(tx.amount); const subject = tx.subject; return { diff --git a/packages/demobank-ui/src/components/app.tsx b/packages/demobank-ui/src/components/app.tsx index ebda31035..a587c6f1e 100644 --- a/packages/demobank-ui/src/components/app.tsx +++ b/packages/demobank-ui/src/components/app.tsx @@ -29,6 +29,8 @@ import { useEffect, useState } from "preact/hooks"; import { Loading } from "./Loading.js"; import { getInitialBackendBaseURL } from "../hooks/backend.js"; import { BANK_INTEGRATION_PROTOCOL_VERSION, useConfigState } from "../hooks/config.js"; +import { ErrorLoading } from "./ErrorLoading.js"; +import { BankFrame } from "../pages/BankFrame.js"; const WITH_LOCAL_STORAGE_CACHE = false; /** @@ -76,12 +78,18 @@ function VersionCheck({ children }: { children: ComponentChildren }): VNode { if (checked === undefined) { return } - if (checked === false) { - return
- the bank backend is not supported. supported version "{BANK_INTEGRATION_PROTOCOL_VERSION}" -
+ if (typeof checked === "string") { + return + the bank backend is not supported. supported version "{BANK_INTEGRATION_PROTOCOL_VERSION}", server version "{checked}" + } - return {children} + if (checked === true) { + return {children} + } + + return + + } function localStorageProvider(): Map { diff --git a/packages/demobank-ui/src/declaration.d.ts b/packages/demobank-ui/src/declaration.d.ts index 8d729c1f7..d3d9e02ef 100644 --- a/packages/demobank-ui/src/declaration.d.ts +++ b/packages/demobank-ui/src/declaration.d.ts @@ -205,8 +205,7 @@ namespace SandboxBackend { // Transaction unique ID. Matches // $transaction_id from the URI. row_id: number; - date: number; - // date: Timestamp; + date: Timestamp; } interface CreateBankAccountTransactionCreate { diff --git a/packages/demobank-ui/src/hooks/config.ts b/packages/demobank-ui/src/hooks/config.ts index 4b22e8ad3..4cf677d35 100644 --- a/packages/demobank-ui/src/hooks/config.ts +++ b/packages/demobank-ui/src/hooks/config.ts @@ -1,5 +1,5 @@ import { LibtoolVersion } from "@gnu-taler/taler-util"; -import { useApiContext } from "@gnu-taler/web-util/browser"; +import { ErrorType, HttpError, HttpResponseServerError, RequestError, useApiContext } from "@gnu-taler/web-util/browser"; import { useEffect, useState } from "preact/hooks"; import { getInitialBackendBaseURL } from "./backend.js"; @@ -12,38 +12,32 @@ export const BANK_INTEGRATION_PROTOCOL_VERSION = "0:0:0"; async function getConfigState( request: ReturnType["request"], -): Promise { - try { - const url = getInitialBackendBaseURL(); - const result = await request( - url, - `config`, - ); - return result.data; - } catch (error) { - return undefined; - } +): Promise { + const url = getInitialBackendBaseURL(); + const result = await request(url, `config`); + return result.data; } -export function useConfigState(): boolean | undefined { - const [checked, setChecked] = useState() +export function useConfigState(): undefined | true | string | HttpError { + const [checked, setChecked] = useState>() const { request } = useApiContext(); useEffect(() => { - getConfigState(request) - .then((result) => { - if (!result) { - setChecked(false) + .then((s) => { + const r = LibtoolVersion.compare(BANK_INTEGRATION_PROTOCOL_VERSION, s.version) + if (r?.compatible) { + setChecked(true); } else { - const r = LibtoolVersion.compare(BANK_INTEGRATION_PROTOCOL_VERSION, result.version) - setChecked(r?.compatible); + setChecked(s.version) } }) - .catch((error) => { - setChecked(false); + .catch((error: unknown) => { + if (error instanceof RequestError) { + setChecked(error.cause); + } }); - }); + }, []); return checked; } diff --git a/packages/demobank-ui/src/pages/AccountPage/state.ts b/packages/demobank-ui/src/pages/AccountPage/state.ts index c212e7484..ca7e1d447 100644 --- a/packages/demobank-ui/src/pages/AccountPage/state.ts +++ b/packages/demobank-ui/src/pages/AccountPage/state.ts @@ -75,9 +75,7 @@ export function useComponentState({ account, goToBusinessAccount, goToConfirmOpe }; } - // FIXME: balance - const balanceIsDebit = true; - // data.balance.credit_debit_indicator == "debit"; + const balanceIsDebit = data.balance.credit_debit_indicator == "debit"; const limit = balanceIsDebit ? Amounts.sub(debitThreshold, balance).amount : Amounts.add(balance, debitThreshold).amount; diff --git a/packages/demobank-ui/src/pages/BankFrame.tsx b/packages/demobank-ui/src/pages/BankFrame.tsx index c4f872679..5c43d2c3e 100644 --- a/packages/demobank-ui/src/pages/BankFrame.tsx +++ b/packages/demobank-ui/src/pages/BankFrame.tsx @@ -15,7 +15,7 @@ */ import { Amounts, Logger, PaytoUriIBAN, TranslatedString, parsePaytoUri, stringifyPaytoUri } from "@gnu-taler/taler-util"; -import { notifyError, useNotifications, useTranslationContext } from "@gnu-taler/web-util/browser"; +import { notifyError, notifyException, useNotifications, useTranslationContext } from "@gnu-taler/web-util/browser"; import { ComponentChildren, Fragment, h, VNode } from "preact"; import { StateUpdater, useEffect, useErrorBoundary, useState } from "preact/hooks"; import { LangSelectorLikePy as LangSelector } from "../components/LangSelector.js"; @@ -54,7 +54,12 @@ export function BankFrame({ useEffect(() => { if (error) { - notifyError(i18n.str`Internal error, please report.`, (error instanceof Error ? error.message : String(error)) as TranslatedString) + const desc = (error instanceof Error ? error.stack : String(error)) as TranslatedString + if (error instanceof Error) { + notifyException(i18n.str`Internal error, please report.`, error) + } else { + notifyError(i18n.str`Internal error, please report.`, String(error) as TranslatedString) + } resetError() } }, [error]) @@ -386,6 +391,11 @@ function StatusBanner(): VNode { {n.message.description} } + {n.message.debug && +
+ {n.message.debug} +
+ } case "info": return
diff --git a/packages/demobank-ui/src/pages/WithdrawalQRCode.tsx b/packages/demobank-ui/src/pages/WithdrawalQRCode.tsx index 25c571e28..8f4e175f6 100644 --- a/packages/demobank-ui/src/pages/WithdrawalQRCode.tsx +++ b/packages/demobank-ui/src/pages/WithdrawalQRCode.tsx @@ -45,7 +45,6 @@ export function WithdrawalQRCode({ withdrawUri, onClose, }: Props): VNode { - const [settings, updateSettings] = useSettings(); const { i18n } = useTranslationContext(); const result = useWithdrawalDetails(withdrawUri.withdrawalOperationId); diff --git a/packages/web-util/src/hooks/index.ts b/packages/web-util/src/hooks/index.ts index c29de9023..cc3267dbd 100644 --- a/packages/web-util/src/hooks/index.ts +++ b/packages/web-util/src/hooks/index.ts @@ -4,6 +4,7 @@ export { useMemoryStorage } from "./useMemoryStorage.js"; export { useNotifications, notifyError, + notifyException, notifyInfo, notify, ErrorNotification, diff --git a/packages/web-util/src/hooks/useNotifications.ts b/packages/web-util/src/hooks/useNotifications.ts index 2f9df24f9..792095b06 100644 --- a/packages/web-util/src/hooks/useNotifications.ts +++ b/packages/web-util/src/hooks/useNotifications.ts @@ -36,6 +36,17 @@ export function notifyError( debug, }); } +export function notifyException( + title: TranslatedString, + ex: Error, +) { + notify({ + type: "error" as const, + title, + description: ex.message as TranslatedString, + debug: ex.stack, + }); +} export function notifyInfo(title: TranslatedString) { notify({ type: "info" as const,