From 2e71117f59e0ae6106930e705ae6a54a9839281b Mon Sep 17 00:00:00 2001
From: Sebastian
Date: Thu, 23 Dec 2021 15:17:36 -0300
Subject: deposit from wallet webex: wip
---
.../src/NavigationBar.tsx | 1 +
.../src/components/BalanceTable.tsx | 18 +-
.../src/components/styled/index.tsx | 4 +
.../src/popup/BalancePage.tsx | 24 ++-
.../src/popup/DeveloperPage.tsx | 68 ++++--
.../src/popupEntryPoint.tsx | 4 +
.../src/wallet/BalancePage.tsx | 42 ++--
.../src/wallet/DepositPage.stories.tsx | 52 +++++
.../src/wallet/DepositPage.tsx | 234 +++++++++++++++++++++
.../src/wallet/Transaction.tsx | 10 +-
.../src/walletEntryPoint.tsx | 8 +
packages/taler-wallet-webextension/src/wxApi.ts | 23 +-
12 files changed, 440 insertions(+), 48 deletions(-)
create mode 100644 packages/taler-wallet-webextension/src/wallet/DepositPage.stories.tsx
create mode 100644 packages/taler-wallet-webextension/src/wallet/DepositPage.tsx
(limited to 'packages/taler-wallet-webextension/src')
diff --git a/packages/taler-wallet-webextension/src/NavigationBar.tsx b/packages/taler-wallet-webextension/src/NavigationBar.tsx
index 8dc73efdb..e7108679c 100644
--- a/packages/taler-wallet-webextension/src/NavigationBar.tsx
+++ b/packages/taler-wallet-webextension/src/NavigationBar.tsx
@@ -34,6 +34,7 @@ export enum Pages {
welcome = "/welcome",
balance = "/balance",
manual_withdraw = "/manual-withdraw",
+ deposit = "/deposit/:currency",
settings = "/settings",
dev = "/dev",
cta = "/cta",
diff --git a/packages/taler-wallet-webextension/src/components/BalanceTable.tsx b/packages/taler-wallet-webextension/src/components/BalanceTable.tsx
index e1c19cc23..cf396e129 100644
--- a/packages/taler-wallet-webextension/src/components/BalanceTable.tsx
+++ b/packages/taler-wallet-webextension/src/components/BalanceTable.tsx
@@ -16,9 +16,18 @@
import { amountFractionalBase, Amounts, Balance } from "@gnu-taler/taler-util";
import { h, VNode } from "preact";
-import { TableWithRoundRows as TableWithRoundedRows } from "./styled/index";
+import {
+ ButtonPrimary,
+ TableWithRoundRows as TableWithRoundedRows,
+} from "./styled/index";
-export function BalanceTable({ balances }: { balances: Balance[] }): VNode {
+export function BalanceTable({
+ balances,
+ goToWalletDeposit,
+}: {
+ balances: Balance[];
+ goToWalletDeposit: (currency: string) => void;
+}): VNode {
const currencyFormatter = new Intl.NumberFormat("en-US");
return (
@@ -40,6 +49,11 @@ export function BalanceTable({ balances }: { balances: Balance[] }): VNode {
>
{v}
+
+ goToWalletDeposit(av.currency)}>
+ Deposit
+
+ |
);
})}
diff --git a/packages/taler-wallet-webextension/src/components/styled/index.tsx b/packages/taler-wallet-webextension/src/components/styled/index.tsx
index a5c9f2837..216a1fabc 100644
--- a/packages/taler-wallet-webextension/src/components/styled/index.tsx
+++ b/packages/taler-wallet-webextension/src/components/styled/index.tsx
@@ -716,6 +716,10 @@ export const InputWithLabel = styled.div<{ invalid?: boolean }>`
}
`;
+export const ErrorText = styled.div`
+ color: red;
+`;
+
export const ErrorBox = styled.div`
border: 2px solid #f5c6cb;
border-radius: 0.25em;
diff --git a/packages/taler-wallet-webextension/src/popup/BalancePage.tsx b/packages/taler-wallet-webextension/src/popup/BalancePage.tsx
index 33164783d..40499b87c 100644
--- a/packages/taler-wallet-webextension/src/popup/BalancePage.tsx
+++ b/packages/taler-wallet-webextension/src/popup/BalancePage.tsx
@@ -21,18 +21,21 @@ import { ButtonPrimary, ErrorBox } from "../components/styled/index";
import { HookResponse, useAsyncAsHook } from "../hooks/useAsyncAsHook";
import { PageLink } from "../renderHtml";
import * as wxApi from "../wxApi";
-
+interface Props {
+ goToWalletDeposit: (currency: string) => void;
+ goToWalletManualWithdraw: () => void;
+}
export function BalancePage({
goToWalletManualWithdraw,
-}: {
- goToWalletManualWithdraw: () => void;
-}): VNode {
+ goToWalletDeposit,
+}: Props): VNode {
const state = useAsyncAsHook(wxApi.getBalance);
return (
);
}
@@ -40,12 +43,14 @@ export interface BalanceViewProps {
balance: HookResponse;
Linker: typeof PageLink;
goToWalletManualWithdraw: () => void;
+ goToWalletDeposit: (currency: string) => void;
}
export function BalanceView({
balance,
Linker,
goToWalletManualWithdraw,
+ goToWalletDeposit,
}: BalanceViewProps): VNode {
if (!balance) {
return Loading...
;
@@ -71,7 +76,8 @@ export function BalanceView({
help getting started?
-