From 60bf82acab391ec239fc0bdb227dab25d445c921 Mon Sep 17 00:00:00 2001 From: Sebastian Date: Tue, 22 Feb 2022 11:01:47 -0300 Subject: show all coins in devmode --- .../src/popup/DeveloperPage.tsx | 177 +++++++++++++++++++-- packages/taler-wallet-webextension/src/wxApi.ts | 6 +- 2 files changed, 171 insertions(+), 12 deletions(-) diff --git a/packages/taler-wallet-webextension/src/popup/DeveloperPage.tsx b/packages/taler-wallet-webextension/src/popup/DeveloperPage.tsx index f4b49c230..3326be8df 100644 --- a/packages/taler-wallet-webextension/src/popup/DeveloperPage.tsx +++ b/packages/taler-wallet-webextension/src/popup/DeveloperPage.tsx @@ -14,7 +14,13 @@ TALER; see the file COPYING. If not, see */ -import { NotificationType } from "@gnu-taler/taler-util"; +import { + Amounts, + Balance, + CoinDumpJson, + ExchangeListItem, + NotificationType, +} from "@gnu-taler/taler-util"; import { PendingTaskInfo } from "@gnu-taler/taler-wallet-core"; import { format } from "date-fns"; import { Fragment, h, VNode } from "preact"; @@ -25,29 +31,42 @@ import { Time } from "../components/Time"; import { useAsyncAsHook } from "../hooks/useAsyncAsHook"; import { useDiagnostics } from "../hooks/useDiagnostics"; import * as wxApi from "../wxApi"; +import BalanceStories from "./Balance.stories"; export function DeveloperPage(): VNode { const [status, timedOut] = useDiagnostics(); const listenAllEvents = Array.from({ length: 1 }); listenAllEvents.includes = () => true; // includes every event - const operationsResponse = useAsyncAsHook( - wxApi.getPendingOperations, - listenAllEvents, - ); - const operations = - operationsResponse === undefined - ? [] - : operationsResponse.hasError - ? [] - : operationsResponse.response.pendingOperations; + const response = useAsyncAsHook(async () => { + const op = await wxApi.getPendingOperations(); + const c = await wxApi.dumpCoins(); + const ex = await wxApi.listExchanges(); + return { + operations: op.pendingOperations, + coins: c.coins, + exchanges: ex.exchanges, + }; + }, listenAllEvents); + + const nonResponse = { operations: [], coins: [], exchanges: [] }; + const { operations, coins, exchanges } = + response === undefined + ? nonResponse + : response.hasError + ? nonResponse + : response.response; + + const balanceResponse = useAsyncAsHook(wxApi.getBalance); return ( { const db = await wxApi.exportDB(); return JSON.stringify(db); @@ -56,10 +75,26 @@ export function DeveloperPage(): VNode { ); } +type CoinsInfo = CoinDumpJson["coins"]; +type CalculatedCoinfInfo = { + denom_value: number; + remain_value: number; + status: string; + from_refresh: boolean; + id: string; +}; + +type SplitedCoinInfo = { + spent: CalculatedCoinfInfo[]; + usable: CalculatedCoinfInfo[]; +}; + export interface Props { status: any; timedOut: boolean; operations: PendingTaskInfo[]; + coins: CoinsInfo; + exchanges: ExchangeListItem[]; onDownloadDatabase: () => Promise; } @@ -71,6 +106,7 @@ export function View({ status, timedOut, operations, + coins, onDownloadDatabase, }: Props): VNode { const [downloadedDatabase, setDownloadedDatabase] = useState< @@ -87,6 +123,30 @@ export function View({ async function onImportDatabase(str: string): Promise { return wxApi.importDB(JSON.parse(str)); } + const currencies: { [ex: string]: string } = {}; + const money_by_exchange = coins.reduce( + (prev, cur) => { + const denom = Amounts.parseOrThrow(cur.denom_value); + if (!prev[cur.exchange_base_url]) { + prev[cur.exchange_base_url] = []; + currencies[cur.exchange_base_url] = denom.currency; + } + prev[cur.exchange_base_url].push({ + denom_value: parseFloat(Amounts.stringifyValue(denom)), + remain_value: parseFloat( + Amounts.stringifyValue(Amounts.parseOrThrow(cur.remaining_value)), + ), + status: cur.coin_suspended ? "suspended" : "ok", + from_refresh: cur.refresh_parent_coin_pub !== undefined, + id: cur.coin_pub, + }); + return prev; + }, + {} as { + [exchange_name: string]: CalculatedCoinfInfo[]; + }, + ); + return (

Debug tools:

@@ -135,6 +195,28 @@ export function View({
)}
+

Coins:

+ {Object.keys(money_by_exchange).map((ex) => { + const allcoins = money_by_exchange[ex]; + allcoins.sort((a, b) => { + return b.denom_value - a.denom_value; + }); + + const coins = allcoins.reduce( + (prev, cur) => { + if (cur.remain_value > 0) prev.usable.push(cur); + if (cur.remain_value === 0) prev.spent.push(cur); + return prev; + }, + { + spent: [], + usable: [], + } as SplitedCoinInfo, + ); + + return ; + })} +
{operations && operations.length > 0 && ( @@ -157,6 +239,79 @@ export function View({ ); } +function ShowAllCoins({ + ex, + coins, + currencies, +}: { + ex: string; + coins: SplitedCoinInfo; + currencies: { [ex: string]: string }; +}) { + const [collapsedSpent, setCollapsedSpent] = useState(true); + const [collapsedUnspent, setCollapsedUnspent] = useState(false); + const total = coins.usable.reduce((prev, cur) => prev + cur.denom_value, 0); + return ( + +

+ {ex}: {total} {currencies[ex]} +

+

+ usable coins +

+ {collapsedUnspent ? ( +
setCollapsedUnspent(false)}>click to show
+ ) : ( + setCollapsedUnspent(true)}> + + + + + + + + {coins.usable.map((c) => { + return ( + + + + + + + + ); + })} +
iddenomvaluestatusfrom refresh?
{c.id.substring(0, 5)}{c.denom_value}{c.remain_value}{c.status}{c.from_refresh ? "true" : "false"}
+ )} +

spent coins

+ {collapsedSpent ? ( +
setCollapsedSpent(false)}>click to show
+ ) : ( + setCollapsedSpent(true)}> + + + + + + + + {coins.spent.map((c) => { + return ( + + + + + + + + ); + })} +
iddenomvaluestatusrefresh?
{c.id.substring(0, 5)}{c.denom_value}{c.remain_value}{c.status}{c.from_refresh ? "true" : "false"}
+ )} + + ); +} + function toBase64(str: string): string { return btoa( encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, function (match, p1) { diff --git a/packages/taler-wallet-webextension/src/wxApi.ts b/packages/taler-wallet-webextension/src/wxApi.ts index d02a017a1..309a2bc98 100644 --- a/packages/taler-wallet-webextension/src/wxApi.ts +++ b/packages/taler-wallet-webextension/src/wxApi.ts @@ -24,7 +24,7 @@ import { AcceptExchangeTosRequest, AcceptManualWithdrawalResult, AcceptTipRequest, AcceptWithdrawalResponse, - AddExchangeRequest, AmountString, ApplyRefundResponse, BalancesResponse, ConfirmPayResult, + AddExchangeRequest, AmountString, ApplyRefundResponse, BalancesResponse, CoinDumpJson, ConfirmPayResult, CoreApiResponse, CreateDepositGroupRequest, CreateDepositGroupResponse, DeleteTransactionRequest, ExchangesListRespose, GetExchangeTosResult, GetExchangeWithdrawalInfo, GetFeeForDepositRequest, @@ -356,6 +356,10 @@ export function getExchangeTos( }); } +export function dumpCoins(): Promise { + return callBackend("dumpCoins", {}); +} + export function getPendingOperations(): Promise { return callBackend("getPendingOperations", {}); } -- cgit v1.2.3