aboutsummaryrefslogtreecommitdiff
path: root/src/webex
diff options
context:
space:
mode:
Diffstat (limited to 'src/webex')
-rw-r--r--src/webex/pages/popup.tsx37
-rw-r--r--src/webex/pages/return-coins.tsx287
-rw-r--r--src/webex/wxApi.ts4
3 files changed, 16 insertions, 312 deletions
diff --git a/src/webex/pages/popup.tsx b/src/webex/pages/popup.tsx
index e4eea4d9e..8a99a6d90 100644
--- a/src/webex/pages/popup.tsx
+++ b/src/webex/pages/popup.tsx
@@ -29,8 +29,6 @@ import * as i18n from "../i18n";
import { AmountJson } from "../../util/amounts";
import * as Amounts from "../../util/amounts";
-import { WalletBalance, WalletBalanceEntry } from "../../types/walletTypes";
-
import { abbrev, renderAmount, PageLink } from "../renderHtml";
import * as wxApi from "../wxApi";
@@ -40,6 +38,7 @@ import moment from "moment";
import { Timestamp } from "../../util/time";
import { classifyTalerUri, TalerUriType } from "../../util/taleruri";
import { PermissionsCheckbox } from "./welcome";
+import { BalancesResponse, Balance } from "../../types/walletTypes";
// FIXME: move to newer react functions
/* eslint-disable react/no-deprecated */
@@ -172,7 +171,7 @@ function EmptyBalanceView(): JSX.Element {
}
class WalletBalanceView extends React.Component<any, any> {
- private balance: WalletBalance;
+ private balance: BalancesResponse;
private gotError = false;
private canceler: (() => void) | undefined = undefined;
private unmount = false;
@@ -196,7 +195,7 @@ class WalletBalanceView extends React.Component<any, any> {
return;
}
this.updateBalanceRunning = true;
- let balance: WalletBalance;
+ let balance: BalancesResponse;
try {
balance = await wxApi.getBalance();
} catch (e) {
@@ -219,10 +218,14 @@ class WalletBalanceView extends React.Component<any, any> {
this.setState({});
}
- formatPending(entry: WalletBalanceEntry): JSX.Element {
+ formatPending(entry: Balance): JSX.Element {
let incoming: JSX.Element | undefined;
let payment: JSX.Element | undefined;
+ const available = Amounts.parseOrThrow(entry.available);
+ const pendingIncoming = Amounts.parseOrThrow(entry.pendingIncoming);
+ const pendingOutgoing = Amounts.parseOrThrow(entry.pendingOutgoing);
+
console.log(
"available: ",
entry.pendingIncoming ? renderAmount(entry.available) : null,
@@ -232,7 +235,7 @@ class WalletBalanceView extends React.Component<any, any> {
entry.pendingIncoming ? renderAmount(entry.pendingIncoming) : null,
);
- if (Amounts.isNonZero(entry.pendingIncoming)) {
+ if (Amounts.isNonZero(pendingIncoming)) {
incoming = (
<i18n.Translate wrap="span">
<span style={{ color: "darkgreen" }}>
@@ -244,18 +247,6 @@ class WalletBalanceView extends React.Component<any, any> {
);
}
- if (Amounts.isNonZero(entry.pendingPayment)) {
- payment = (
- <i18n.Translate wrap="span">
- <span style={{ color: "red" }}>
- {"-"}
- {renderAmount(entry.pendingPayment)}
- </span>{" "}
- being spent
- </i18n.Translate>
- );
- }
-
const l = [incoming, payment].filter((x) => x !== undefined);
if (l.length === 0) {
return <span />;
@@ -288,11 +279,11 @@ class WalletBalanceView extends React.Component<any, any> {
return <span></span>;
}
console.log(wallet);
- const listing = Object.keys(wallet.byCurrency).map((key) => {
- const entry: WalletBalanceEntry = wallet.byCurrency[key];
+ const listing = wallet.balances.map((entry) => {
+ const av = Amounts.parseOrThrow(entry.available);
return (
- <p key={key}>
- {bigAmount(entry.available)} {this.formatPending(entry)}
+ <p key={av.currency}>
+ {bigAmount(av)} {this.formatPending(entry)}
</p>
);
});
@@ -314,7 +305,6 @@ function formatAndCapitalize(text: string): string {
return text;
}
-
const HistoryComponent = (props: any): JSX.Element => {
return <span>TBD</span>;
};
@@ -330,7 +320,6 @@ class WalletSettings extends React.Component<any, any> {
}
}
-
function reload(): void {
try {
chrome.runtime.reload();
diff --git a/src/webex/pages/return-coins.tsx b/src/webex/pages/return-coins.tsx
index ccdb6db53..e8cf8c9dd 100644
--- a/src/webex/pages/return-coins.tsx
+++ b/src/webex/pages/return-coins.tsx
@@ -23,293 +23,8 @@
/**
* Imports.
*/
-
-import { AmountJson } from "../../util/amounts";
-import { Amounts } from "../../util/amounts";
-
-import { SenderWireInfos, WalletBalance } from "../../types/walletTypes";
-
-import * as i18n from "../i18n";
-
-import * as wire from "../../util/wire";
-
-import { getBalance, getSenderWireInfos, returnCoins } from "../wxApi";
-
-import { renderAmount } from "../renderHtml";
-
import * as React from "react";
-interface ReturnSelectionItemProps extends ReturnSelectionListProps {
- exchangeUrl: string;
- senderWireInfos: SenderWireInfos;
-}
-
-interface ReturnSelectionItemState {
- selectedValue: string;
- supportedWires: string[];
- selectedWire: string;
- currency: string;
-}
-
-class ReturnSelectionItem extends React.Component<
- ReturnSelectionItemProps,
- ReturnSelectionItemState
-> {
- constructor(props: ReturnSelectionItemProps) {
- super(props);
- const exchange = this.props.exchangeUrl;
- const wireTypes = this.props.senderWireInfos.exchangeWireTypes;
- const supportedWires = this.props.senderWireInfos.senderWires.filter(
- (x) => {
- return (
- wireTypes[exchange] &&
- wireTypes[exchange].indexOf((x as any).type) >= 0
- );
- },
- );
- this.state = {
- currency: props.balance.byExchange[props.exchangeUrl].available.currency,
- selectedValue: Amounts.stringify(
- props.balance.byExchange[props.exchangeUrl].available,
- ),
- selectedWire: "",
- supportedWires,
- };
- }
- render(): JSX.Element {
- const exchange = this.props.exchangeUrl;
- const byExchange = this.props.balance.byExchange;
- const wireTypes = this.props.senderWireInfos.exchangeWireTypes;
- return (
- <div key={exchange}>
- <h2>Exchange {exchange}</h2>
- <p>Available amount: {renderAmount(byExchange[exchange].available)}</p>
- <p>
- Supported wire methods:{" "}
- {wireTypes[exchange].length ? wireTypes[exchange].join(", ") : "none"}
- </p>
- <p>
- Wire {""}
- <input
- type="text"
- size={this.state.selectedValue.length || 1}
- value={this.state.selectedValue}
- onChange={(evt) =>
- this.setState({ selectedValue: evt.target.value })
- }
- style={{ textAlign: "center" }}
- />{" "}
- {this.props.balance.byExchange[exchange].available.currency} {""}
- to account {""}
- <select
- value={this.state.selectedWire}
- onChange={(evt) =>
- this.setState({ selectedWire: evt.target.value })
- }
- >
- <option style={{ display: "none" }}>Select account</option>
- {this.state.supportedWires.map((w, n) => (
- <option value={n.toString()} key={JSON.stringify(w)}>
- {n + 1}: {wire.summarizeWire(w)}
- </option>
- ))}
- </select>
- .
- </p>
- {this.state.selectedWire ? (
- <button
- className="pure-button button-success"
- onClick={() => this.select()}
- >
- {i18n.str`Wire to bank account`}
- </button>
- ) : null}
- </div>
- );
- }
-
- select(): void {
- let val: number;
- let selectedWire: number;
- try {
- val = Number.parseFloat(this.state.selectedValue);
- selectedWire = Number.parseInt(this.state.selectedWire);
- } catch (e) {
- console.error(e);
- return;
- }
- this.props.selectDetail({
- amount: Amounts.fromFloat(val, this.state.currency),
- exchange: this.props.exchangeUrl,
- senderWire: this.state.supportedWires[selectedWire],
- });
- }
-}
-
-interface ReturnSelectionListProps {
- balance: WalletBalance;
- senderWireInfos: SenderWireInfos;
- selectDetail(d: SelectedDetail): void;
-}
-
-class ReturnSelectionList extends React.Component<
- ReturnSelectionListProps,
- {}
-> {
- render(): JSX.Element {
- const byExchange = this.props.balance.byExchange;
- const exchanges = Object.keys(byExchange);
- if (!exchanges.length) {
- return (
- <p className="errorbox">Currently no funds available to transfer.</p>
- );
- }
- return (
- <div>
- {exchanges.map((e) => (
- <ReturnSelectionItem key={e} exchangeUrl={e} {...this.props} />
- ))}
- </div>
- );
- }
-}
-
-interface SelectedDetail {
- amount: AmountJson;
- senderWire: any;
- exchange: string;
-}
-
-interface ReturnConfirmationProps {
- detail: SelectedDetail;
- cancel(): void;
- confirm(): void;
-}
-
-class ReturnConfirmation extends React.Component<ReturnConfirmationProps, {}> {
- render(): JSX.Element {
- return (
- <div>
- <p>
- Please confirm if you want to transmit{" "}
- <strong>{renderAmount(this.props.detail.amount)}</strong> at {""}
- {this.props.detail.exchange} to account {""}
- <strong style={{ whiteSpace: "nowrap" }}>
- {wire.summarizeWire(this.props.detail.senderWire)}
- </strong>
- .
- </p>
- <button
- className="pure-button button-success"
- onClick={() => this.props.confirm()}
- >
- {i18n.str`Confirm`}
- </button>
- <button className="pure-button" onClick={() => this.props.cancel()}>
- {i18n.str`Cancel`}
- </button>
- </div>
- );
- }
-}
-
-interface ReturnCoinsState {
- balance: WalletBalance | undefined;
- senderWireInfos: SenderWireInfos | undefined;
- selectedReturn: SelectedDetail | undefined;
- /**
- * Last confirmed detail, so we can show a nice box.
- */
- lastConfirmedDetail: SelectedDetail | undefined;
-}
-
-class ReturnCoins extends React.Component<{}, ReturnCoinsState> {
- constructor(props: {}) {
- super(props);
- const port = chrome.runtime.connect();
- port.onMessage.addListener((msg: any) => {
- if (msg.notify) {
- console.log("got notified");
- this.update();
- }
- });
- this.update();
- this.state = {} as any;
- }
-
- async update(): Promise<void> {
- const balance = await getBalance();
- const senderWireInfos = await getSenderWireInfos();
- console.log("got swi", senderWireInfos);
- console.log("got bal", balance);
- this.setState({ balance, senderWireInfos });
- }
-
- selectDetail(d: SelectedDetail): void {
- this.setState({ selectedReturn: d });
- }
-
- async confirm(): Promise<void> {
- const selectedReturn = this.state.selectedReturn;
- if (!selectedReturn) {
- return;
- }
- await returnCoins(selectedReturn);
- await this.update();
- this.setState({
- selectedReturn: undefined,
- lastConfirmedDetail: selectedReturn,
- });
- }
-
- async cancel(): Promise<void> {
- this.setState({
- selectedReturn: undefined,
- lastConfirmedDetail: undefined,
- });
- }
-
- render(): JSX.Element {
- const balance = this.state.balance;
- const senderWireInfos = this.state.senderWireInfos;
- if (!balance || !senderWireInfos) {
- return <span>...</span>;
- }
- if (this.state.selectedReturn) {
- return (
- <div id="main">
- <ReturnConfirmation
- detail={this.state.selectedReturn}
- cancel={() => this.cancel()}
- confirm={() => this.confirm()}
- />
- </div>
- );
- }
- return (
- <div id="main">
- <h1>Wire electronic cash back to own bank account</h1>
- <p>
- You can send coins back into your own bank account. Note that
- you&apos;re acting as a merchant when doing this, and thus the same
- fees apply.
- </p>
- {this.state.lastConfirmedDetail ? (
- <p className="okaybox">
- Transfer of {renderAmount(this.state.lastConfirmedDetail.amount)}{" "}
- successfully initiated.
- </p>
- ) : null}
- <ReturnSelectionList
- selectDetail={(d) => this.selectDetail(d)}
- balance={balance}
- senderWireInfos={senderWireInfos}
- />
- </div>
- );
- }
-}
-
export function createReturnCoinsPage(): JSX.Element {
- return <ReturnCoins />;
+ return <span>Not implemented yet.</span>;
}
diff --git a/src/webex/wxApi.ts b/src/webex/wxApi.ts
index 99a581007..4e11463d6 100644
--- a/src/webex/wxApi.ts
+++ b/src/webex/wxApi.ts
@@ -34,12 +34,12 @@ import {
ConfirmPayResult,
SenderWireInfos,
TipStatus,
- WalletBalance,
PurchaseDetails,
WalletDiagnostics,
PreparePayResult,
AcceptWithdrawalResponse,
ExtendedPermissionsResponse,
+ BalancesResponse,
} from "../types/walletTypes";
/**
@@ -185,7 +185,7 @@ export function resetDb(): Promise<void> {
/**
* Get balances for all currencies/exchanges.
*/
-export function getBalance(): Promise<WalletBalance> {
+export function getBalance(): Promise<BalancesResponse> {
return callBackend("balances", {});
}
generated by cgit v1.2.3 (git 2.26.2) at 2024-11-05 15:04:24 +0000