diff options
Diffstat (limited to 'packages/taler-wallet-webextension')
9 files changed, 110 insertions, 47 deletions
diff --git a/packages/taler-wallet-webextension/src/components/WalletActivity.tsx b/packages/taler-wallet-webextension/src/components/WalletActivity.tsx new file mode 100644 index 000000000..a63ee97cb --- /dev/null +++ b/packages/taler-wallet-webextension/src/components/WalletActivity.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 <http://www.gnu.org/licenses/> + */ +import { + AbsoluteTime, + Amounts, + NotificationType, + Transaction, + TransactionMajorState, +} from "@gnu-taler/taler-util"; +import { WalletApiOperation } from "@gnu-taler/taler-wallet-core"; +import { Fragment, h, JSX, VNode } from "preact"; +import { useEffect } from "preact/hooks"; +import { useBackendContext } from "../context/backend.js"; +import { useTranslationContext } from "@gnu-taler/web-util/browser"; +import { useAsyncAsHook } from "../hooks/useAsyncAsHook.js"; +import { Avatar } from "../mui/Avatar.js"; +import { Grid } from "../mui/Grid.js"; +import { Typography } from "../mui/Typography.js"; +import Banner from "./Banner.js"; +import { Time } from "./Time.js"; + +interface Props extends JSX.HTMLAttributes { +} + +/** + * this cache will save the tx from the previous render + */ +const cache = { tx: [] as Transaction[] }; + +export function WalletActivity({ }: Props): VNode { + const api = useBackendContext(); + const state = useAsyncAsHook(() => + api.wallet.call(WalletApiOperation.GetTransactions, {}), + ); + const listenAllEvents = Array.from<NotificationType>({ length: 1 }); + + useEffect(() => { + return api.listener.onUpdateNotification( listenAllEvents, (notif) => { + console.log(notif) + }); + }); + + const transactions = + !state || state.hasError + ? cache.tx + : state.response.transactions.filter( + (t) => t.txState.major === TransactionMajorState.Pending, + ); + + if (state && !state.hasError) { + cache.tx = transactions; + } + if (!transactions.length) { + return <Fragment />; + } + return ( + <div> + this is shown below + </div> + ); +} diff --git a/packages/taler-wallet-webextension/src/cta/Payment/test.ts b/packages/taler-wallet-webextension/src/cta/Payment/test.ts index 5e009b3de..5847cc833 100644 --- a/packages/taler-wallet-webextension/src/cta/Payment/test.ts +++ b/packages/taler-wallet-webextension/src/cta/Payment/test.ts @@ -29,6 +29,7 @@ import { PreparePayResultPaymentPossible, PreparePayResultType, ScopeType, + TransactionMajorState, } from "@gnu-taler/taler-util"; import { WalletApiOperation } from "@gnu-taler/taler-wallet-core"; import { expect } from "chai"; @@ -549,8 +550,13 @@ describe("Payment CTA states", () => { // expect(r.totalFees).deep.equal(Amounts.parseOrThrow("USD:1")); expect(state.payHandler.onClick).not.undefined; - handler.notifyEventFromWallet( - NotificationType.TransactionStateTransition, + handler.notifyEventFromWallet({ + type: NotificationType.TransactionStateTransition, + newTxState: {} as any, + oldTxState: {} as any, + transactionId: "123", + } + ); }, (state) => { diff --git a/packages/taler-wallet-webextension/src/hooks/useSettings.ts b/packages/taler-wallet-webextension/src/hooks/useSettings.ts index c6b8c6b0e..8c9d09caf 100644 --- a/packages/taler-wallet-webextension/src/hooks/useSettings.ts +++ b/packages/taler-wallet-webextension/src/hooks/useSettings.ts @@ -45,6 +45,7 @@ export const codecForSettings = (): Codec<Settings> => .property("showRefeshTransactions", codecForBoolean()) .property("showExchangeManagement", codecForBoolean()) .property("selectTosFormat", codecForBoolean()) + .property("showWalletActivity", codecForBoolean()) .build("Settings"); const SETTINGS_KEY = buildStorageKey("wallet-settings", codecForSettings()); diff --git a/packages/taler-wallet-webextension/src/platform/api.ts b/packages/taler-wallet-webextension/src/platform/api.ts index 059b234cc..e3afe35bd 100644 --- a/packages/taler-wallet-webextension/src/platform/api.ts +++ b/packages/taler-wallet-webextension/src/platform/api.ts @@ -122,6 +122,7 @@ export interface Settings extends WebexWalletConfig { suspendIndividualTransaction: boolean; showExchangeManagement: boolean; selectTosFormat: boolean; + showWalletActivity: boolean; } export const defaultSettings: Settings = { @@ -137,6 +138,7 @@ export const defaultSettings: Settings = { showExchangeManagement: false, walletAllowHttp: false, selectTosFormat: false, + showWalletActivity: false, }; /** diff --git a/packages/taler-wallet-webextension/src/test-utils.ts b/packages/taler-wallet-webextension/src/test-utils.ts index e66693f53..d25326942 100644 --- a/packages/taler-wallet-webextension/src/test-utils.ts +++ b/packages/taler-wallet-webextension/src/test-utils.ts @@ -14,7 +14,7 @@ GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/> */ -import { NotificationType, TalerBankIntegrationHttpClient, TalerCoreBankHttpClient, TalerRevenueHttpClient, TalerWireGatewayHttpClient } from "@gnu-taler/taler-util"; +import { NotificationType, TalerBankIntegrationHttpClient, TalerCoreBankHttpClient, TalerRevenueHttpClient, TalerWireGatewayHttpClient, WalletNotification } from "@gnu-taler/taler-util"; import { WalletCoreApiClient, WalletCoreOpKeys, @@ -46,7 +46,7 @@ interface MockHandler { getCallingQueueState(): "empty" | string; - notifyEventFromWallet(event: NotificationType): void; + notifyEventFromWallet(notif: WalletNotification): void; } type CallRecord = WalletCallRecord | BackgroundCallRecord; @@ -65,7 +65,7 @@ interface BackgroundCallRecord { } type Subscriptions = { - [key in NotificationType]?: VoidFunction; + [key in NotificationType]?: (d: WalletNotification) => void; }; export function createWalletApiMock(): { @@ -117,7 +117,7 @@ export function createWalletApiMock(): { listener: { onUpdateNotification( mTypes: NotificationType[], - callback: (() => void) | undefined, + callback: ((d: WalletNotification) => void) | undefined, ): () => void { mTypes.forEach((m) => { subscriptions[m] = callback; @@ -164,11 +164,11 @@ export function createWalletApiMock(): { }); return handler; }, - notifyEventFromWallet(event: NotificationType): void { - const callback = subscriptions[event]; + notifyEventFromWallet(event: WalletNotification): void { + const callback = subscriptions[event.type]; if (!callback) throw Error(`Expected to have a subscription for ${event}`); - return callback(); + return callback(event); }, getCallingQueueState() { return calls.length === 0 ? "empty" : `${calls.length} left`; diff --git a/packages/taler-wallet-webextension/src/wallet/Application.tsx b/packages/taler-wallet-webextension/src/wallet/Application.tsx index 140bb5683..4fafc73ad 100644 --- a/packages/taler-wallet-webextension/src/wallet/Application.tsx +++ b/packages/taler-wallet-webextension/src/wallet/Application.tsx @@ -81,6 +81,7 @@ import { QrReaderPage } from "./QrReader.js"; import { SettingsPage } from "./Settings.js"; import { TransactionPage } from "./Transaction.js"; import { WelcomePage } from "./Welcome.js"; +import { WalletActivity } from "../components/WalletActivity.js"; export function Application(): VNode { const { i18n } = useTranslationContext(); @@ -609,6 +610,7 @@ function WalletTemplate({ {children} </AlertProvider> </WalletBox> + <WalletActivity /> </Fragment> ); } diff --git a/packages/taler-wallet-webextension/src/wallet/DeveloperPage.tsx b/packages/taler-wallet-webextension/src/wallet/DeveloperPage.tsx index d19fef155..adb114862 100644 --- a/packages/taler-wallet-webextension/src/wallet/DeveloperPage.tsx +++ b/packages/taler-wallet-webextension/src/wallet/DeveloperPage.tsx @@ -103,16 +103,16 @@ export function DeveloperPage({ }: Props): VNode { const hook = useAsyncAsHook(async () => { const list = await api.wallet.call(WalletApiOperation.ListExchanges, {}); const version = await api.wallet.call(WalletApiOperation.GetVersion, {}); - const operations: any[] = await api.wallet.call( - WalletApiOperation.GetPendingOperations, + const tasks = await api.wallet.call( + WalletApiOperation.GetActiveTasks, {}, ); const coins = await api.wallet.call(WalletApiOperation.DumpCoins, {}); - return { exchanges: list.exchanges, version, coins, operations }; + return { exchanges: list.exchanges, version, coins, tasks:tasks.tasks }; }); const exchangeList = hook && !hook.hasError ? hook.response.exchanges : []; const coins = hook && !hook.hasError ? hook.response.coins.coins : []; - const operations = hook && !hook.hasError ? hook.response.operations : []; + const tasks = hook && !hook.hasError ? hook.response.tasks : []; useEffect(() => { return api.listener.onUpdateNotification(listenAllEvents, hook?.retry); @@ -485,34 +485,6 @@ export function DeveloperPage({ }: Props): VNode { Set log level </Button> </Paper> - <Paper style={{ padding: 10, margin: 10 }}> - <h3>Exchange</h3> - <div> - <TextField - label="Exchange URL" - placeholder="exchange.demo.taler.net" - variant="filled" - // error={subject.error} - required - value={exchangeURL} - onChange={setExchangeURL} - /> - </div> - <Button - variant="contained" - onClick={async () => { - const resp = await fetch(new URL("/keys", exchangeURL).href); - const j = await resp.json(); - api.wallet.call(WalletApiOperation.AddGlobalCurrencyExchange, { - currency: j.currency, - exchangeBaseUrl: j.base_url, - exchangeMasterPub: j.master_public_key, - }); - }} - > - Set exchange as Global - </Button> - </Paper> {downloadedDatabase && ( <div> <i18n.Translate> @@ -573,19 +545,19 @@ export function DeveloperPage({ }: Props): VNode { ); })} <br /> - {operations && operations.length > 0 && ( + {tasks && tasks.length > 0 && ( <Fragment> <p> <i18n.Translate>Pending operations</i18n.Translate> </p> <dl> - {operations.reverse().map((o) => { + {tasks.map((o) => { return ( <NotifyUpdateFadeOut key={hashObjectId(o)}> <dt> - {o.type}{" "} + {o.id}{" "} <Time - timestamp={o.timestampDue} + timestamp={o.nextTry} format="yy/MM/dd HH:mm:ss" /> </dt> diff --git a/packages/taler-wallet-webextension/src/wallet/Settings.tsx b/packages/taler-wallet-webextension/src/wallet/Settings.tsx index fd2cf0b26..64a96d643 100644 --- a/packages/taler-wallet-webextension/src/wallet/Settings.tsx +++ b/packages/taler-wallet-webextension/src/wallet/Settings.tsx @@ -269,6 +269,10 @@ function AdvanceSettings(): VNode { label: i18n.str`Select terms of service format`, description: i18n.str`Allows to render the terms of service on different format selected by the user.`, }, + showWalletActivity: { + label: i18n.str`Show wallet activity`, + description: i18n.str`Show the wallet notification and observavility event in the UI.`, + }, }; return ( <Fragment> diff --git a/packages/taler-wallet-webextension/src/wxApi.ts b/packages/taler-wallet-webextension/src/wxApi.ts index b73b12263..df99d3f17 100644 --- a/packages/taler-wallet-webextension/src/wxApi.ts +++ b/packages/taler-wallet-webextension/src/wxApi.ts @@ -32,6 +32,7 @@ import { TalerErrorCode, TalerErrorDetail, WalletDiagnostics, + WalletNotification, } from "@gnu-taler/taler-util"; import { WalletCoreApiClient, @@ -170,7 +171,7 @@ class WalletApiClientImpl implements WalletCoreApiClient { function onUpdateNotification( messageTypes: Array<NotificationType>, - doCallback: undefined | (() => void), + doCallback: undefined | ((n:WalletNotification) => void), ): () => void { //if no callback, then ignore if (!doCallback) @@ -180,7 +181,8 @@ function onUpdateNotification( const onNewMessage = (message: MessageFromBackend): void => { const shouldNotify = message.type === "wallet" && messageTypes.includes(message.notification.type); if (shouldNotify) { - doCallback(); + message.notification + doCallback(message.notification); } }; return platform.listenToWalletBackground(onNewMessage); |