From f45ef767016a425d04cce7755b27aceff292603c Mon Sep 17 00:00:00 2001 From: Sebastian Date: Thu, 24 Mar 2022 16:02:38 -0300 Subject: esbuild configuration --- packages/taler-util/package.json | 3 - packages/taler-util/src/bitcoin.ts | 8 +-- packages/taler-util/src/payto.ts | 33 +++++++++- .../babel.config-linaria.json | 11 ++-- .../build-fast-with-linaria.mjs | 77 ++++++++++++++++++++++ .../clean_and_build_fast.sh | 11 ---- packages/taler-wallet-webextension/encode.mjs | 3 - packages/taler-wallet-webextension/esbuild.sh | 17 +++++ packages/taler-wallet-webextension/pack.sh | 8 +-- packages/taler-wallet-webextension/package.json | 3 +- .../run-test-in-browser.html | 9 +-- .../src/NavigationBar.tsx | 15 ++++- .../src/components/Banner.stories.tsx | 6 +- .../src/components/ErrorMessage.tsx | 7 +- .../src/components/ErrorTalerOperation.tsx | 6 +- .../src/components/LogoHeader.tsx | 13 ++-- .../src/components/MultiActionButton.tsx | 7 +- .../src/components/styled/index.tsx | 25 +++---- .../src/hooks/useTalerActionURL.test.ts | 18 ++--- .../src/mui/Button.stories.tsx | 4 +- .../src/mui/index.stories.tsx | 27 ++++++++ .../src/popup/BalancePage.tsx | 2 +- .../taler-wallet-webextension/src/stories.test.ts | 3 +- .../src/svg/chevron-down.svg | 7 ++ .../src/svg/delete_24px.svg | 1 + .../src/svg/logo-2021.svg | 9 +++ .../src/svg/ri-bank-line.svg | 1 + .../src/svg/ri-file-unknown-line.svg | 1 + .../src/svg/ri-hand-heart-line.svg | 1 + .../src/svg/ri-refresh-line.svg | 1 + .../src/svg/ri-refund-2-line.svg | 1 + .../src/svg/ri-shopping-cart-line.svg | 1 + .../src/svg/send_24px.svg | 1 + .../src/svg/settings_black_24dp.svg | 6 ++ .../src/svg/spinner-bars.svg | 53 +++++++++++++++ .../taler-wallet-webextension/src/svg/wifi.svg | 3 + .../taler-wallet-webextension/src/test-utils.ts | 17 +++-- .../src/wallet/ManualWithdrawPage.tsx | 14 +++- .../src/wallet/ReserveCreated.tsx | 18 +++-- .../static/img/chevron-down.svg | 7 -- .../static/img/delete_24px.svg | 1 - .../static/img/logo-2021.svg | 1 - .../static/img/ri-bank-line.svg | 1 - .../static/img/ri-file-unknown-line.svg | 1 - .../static/img/ri-hand-heart-line.svg | 1 - .../static/img/ri-refresh-line.svg | 1 - .../static/img/ri-refund-2-line.svg | 1 - .../static/img/ri-shopping-cart-line.svg | 1 - .../static/img/send_24px.svg | 1 - .../static/img/settings_black_24dp.svg | 6 -- .../static/img/spinner-bars.svg | 53 --------------- .../taler-wallet-webextension/static/img/wifi.svg | 3 - pnpm-lock.yaml | 9 +++ 53 files changed, 357 insertions(+), 181 deletions(-) create mode 100644 packages/taler-wallet-webextension/build-fast-with-linaria.mjs delete mode 100755 packages/taler-wallet-webextension/clean_and_build_fast.sh delete mode 100644 packages/taler-wallet-webextension/encode.mjs create mode 100755 packages/taler-wallet-webextension/esbuild.sh create mode 100644 packages/taler-wallet-webextension/src/mui/index.stories.tsx create mode 100644 packages/taler-wallet-webextension/src/svg/chevron-down.svg create mode 100644 packages/taler-wallet-webextension/src/svg/delete_24px.svg create mode 100644 packages/taler-wallet-webextension/src/svg/logo-2021.svg create mode 100644 packages/taler-wallet-webextension/src/svg/ri-bank-line.svg create mode 100644 packages/taler-wallet-webextension/src/svg/ri-file-unknown-line.svg create mode 100644 packages/taler-wallet-webextension/src/svg/ri-hand-heart-line.svg create mode 100644 packages/taler-wallet-webextension/src/svg/ri-refresh-line.svg create mode 100644 packages/taler-wallet-webextension/src/svg/ri-refund-2-line.svg create mode 100644 packages/taler-wallet-webextension/src/svg/ri-shopping-cart-line.svg create mode 100644 packages/taler-wallet-webextension/src/svg/send_24px.svg create mode 100644 packages/taler-wallet-webextension/src/svg/settings_black_24dp.svg create mode 100644 packages/taler-wallet-webextension/src/svg/spinner-bars.svg create mode 100644 packages/taler-wallet-webextension/src/svg/wifi.svg delete mode 100644 packages/taler-wallet-webextension/static/img/chevron-down.svg delete mode 100644 packages/taler-wallet-webextension/static/img/delete_24px.svg delete mode 100644 packages/taler-wallet-webextension/static/img/logo-2021.svg delete mode 100644 packages/taler-wallet-webextension/static/img/ri-bank-line.svg delete mode 100644 packages/taler-wallet-webextension/static/img/ri-file-unknown-line.svg delete mode 100644 packages/taler-wallet-webextension/static/img/ri-hand-heart-line.svg delete mode 100644 packages/taler-wallet-webextension/static/img/ri-refresh-line.svg delete mode 100644 packages/taler-wallet-webextension/static/img/ri-refund-2-line.svg delete mode 100644 packages/taler-wallet-webextension/static/img/ri-shopping-cart-line.svg delete mode 100644 packages/taler-wallet-webextension/static/img/send_24px.svg delete mode 100644 packages/taler-wallet-webextension/static/img/settings_black_24dp.svg delete mode 100644 packages/taler-wallet-webextension/static/img/spinner-bars.svg delete mode 100644 packages/taler-wallet-webextension/static/img/wifi.svg diff --git a/packages/taler-util/package.json b/packages/taler-util/package.json index 6a46de897..42ca8cb2a 100644 --- a/packages/taler-util/package.json +++ b/packages/taler-util/package.json @@ -2,9 +2,6 @@ "name": "@gnu-taler/taler-util", "version": "0.9.0-dev.1", "description": "Generic helper functionality for GNU Taler", - "exports": { - ".": "./lib/index.node.js" - }, "module": "./lib/index.node.js", "main": "./lib/index.node.js", "browser": { diff --git a/packages/taler-util/src/bitcoin.ts b/packages/taler-util/src/bitcoin.ts index f4d3cfeb9..85a176dc6 100644 --- a/packages/taler-util/src/bitcoin.ts +++ b/packages/taler-util/src/bitcoin.ts @@ -24,8 +24,8 @@ import * as segwit from "./segwit_addr" */ export interface SegwitAddrs { - segwitAddr1: string, - segwitAddr2: string, + addr1: string, + addr2: string, } function buf2hex(buffer: Uint8Array) { // buffer is an ArrayBuffer @@ -57,8 +57,8 @@ export function generateFakeSegwitAddress(reservePub: string, addr: string): Seg if (prefix === undefined) throw new Error('unknown bitcoin net') return { - segwitAddr1: segwit.default.encode(prefix, 0, first_part), - segwitAddr2: segwit.default.encode(prefix, 0, second_part), + addr1: segwit.default.encode(prefix, 0, first_part), + addr2: segwit.default.encode(prefix, 0, second_part), } } diff --git a/packages/taler-util/src/payto.ts b/packages/taler-util/src/payto.ts index fc3380555..a7736ea74 100644 --- a/packages/taler-util/src/payto.ts +++ b/packages/taler-util/src/payto.ts @@ -14,9 +14,10 @@ GNU Taler; see the file COPYING. If not, see */ +import { generateFakeSegwitAddress } from "./index.js"; import { URLSearchParams } from "./url.js"; -export type PaytoUri = PaytoUriUnknown | PaytoUriIBAN | PaytoUriTalerBank; +export type PaytoUri = PaytoUriUnknown | PaytoUriIBAN | PaytoUriTalerBank | PaytoUriBitcoin; interface PaytoUriGeneric { targetType: string; @@ -41,6 +42,13 @@ interface PaytoUriTalerBank extends PaytoUriGeneric { account: string; } +interface PaytoUriBitcoin extends PaytoUriGeneric { + isKnown: true; + targetType: 'bitcoin', + generateSegwitAddress: (r: string) => { addr1: string, addr2: string }; + addr1?: string, addr2?: string, +} + const paytoPfx = "payto://"; /** @@ -104,6 +112,29 @@ export function parsePaytoUri(s: string): PaytoUri | undefined { iban: targetPath }; + } + if (targetType === 'bitcoin') { + + const result: PaytoUriBitcoin = { + isKnown: true, + targetPath, + targetType, + params, + generateSegwitAddress: (): any => null + } + + //generate segwit address just once, save addr in payto object + //and use it as cache + function generateSegwitAddress(reserve: string) { + if (result.addr1 && result.addr2) return { addr1: result.addr1, addr2: result.addr2 }; + const { addr1, addr2 } = generateFakeSegwitAddress(reserve, targetPath) + result.addr1 = addr1 + result.addr2 = addr2 + return { addr1, addr2 } + } + result.generateSegwitAddress = generateSegwitAddress + return result; + } return { targetPath, diff --git a/packages/taler-wallet-webextension/babel.config-linaria.json b/packages/taler-wallet-webextension/babel.config-linaria.json index abf87db8a..70d5a3c74 100644 --- a/packages/taler-wallet-webextension/babel.config-linaria.json +++ b/packages/taler-wallet-webextension/babel.config-linaria.json @@ -13,8 +13,7 @@ You should have received a copy of the GNU General Public License along with GNU Taler; see the file COPYING. If not, see */ - - /** +/** * * @author Sebastian Javier Marchano (sebasjm) */ @@ -24,7 +23,7 @@ * This file should be used from @linaria/rollup plugin only */ { - "presets": [ - "preact-cli/babel", - ] -} + "presets": [ + "preact-cli/babel", + ] +} \ No newline at end of file diff --git a/packages/taler-wallet-webextension/build-fast-with-linaria.mjs b/packages/taler-wallet-webextension/build-fast-with-linaria.mjs new file mode 100644 index 000000000..890217ae2 --- /dev/null +++ b/packages/taler-wallet-webextension/build-fast-with-linaria.mjs @@ -0,0 +1,77 @@ + +import linaria from '@linaria/esbuild' +import esbuild from 'esbuild' +import path from "path" +import fs from "fs" + +function getFilesInDirectory(startPath, regex) { + if (!fs.existsSync(startPath)) { + return; + } + const files = fs.readdirSync(startPath); + const result = files.flatMap(file => { + const filename = path.join(startPath, file); + + const stat = fs.lstatSync(filename); + if (stat.isDirectory()) { + return getFilesInDirectory(filename, regex); + } + else if (regex.test(filename)) { + return filename + } + }).filter(x => !!x) + + return result +} + +const allTestFiles = getFilesInDirectory(path.join(process.cwd(), 'src'), /.test.ts$/) + +const preact = path.join(process.cwd(), "node_modules", "preact", "compat", "dist", "compat.module.js"); +const preactCompatPlugin = { + name: "preact-compat", + setup(build) { + build.onResolve({ filter: /^(react-dom|react)$/ }, args => ({ path: preact })); + } +} + +const entryPoints = [ + 'src/popupEntryPoint.tsx', 'src/walletEntryPoint.tsx', 'src/background.ts', 'src/browserWorkerEntry.ts' +] + +await esbuild + .build({ + entryPoints: [...entryPoints, ...allTestFiles], + bundle: true, + outdir: 'dist', + minify: false, + loader: { + '.svg': 'text', + '.png': 'file', + }, + target: [ + 'es6' + ], + format: 'iife', + platform: 'browser', + sourcemap: 'external', + jsxFactory: 'h', + jsxFragment: 'Fragment', + // define: { + // 'process.env.NODE_ENV': '"development"', + // }, + plugins: [ + preactCompatPlugin, + linaria.default({ + babelOptions: { + babelrc: false, + configFile: './babel.config-linaria.json', + }, + sourceMap: true, + }), + ], + }) + .catch((e) => { + console.log(e) + process.exit(1) + }); + diff --git a/packages/taler-wallet-webextension/clean_and_build_fast.sh b/packages/taler-wallet-webextension/clean_and_build_fast.sh deleted file mode 100755 index 61015d0ce..000000000 --- a/packages/taler-wallet-webextension/clean_and_build_fast.sh +++ /dev/null @@ -1,11 +0,0 @@ -#!/usr/bin/env bash -# This file is in the public domain. -set -e - -mv node_modules{,_saved} -rm -rf dist lib tsconfig.tsbuildinfo -(cd ../.. && rm -rf build/web && ./contrib/build-fast-web.sh) -rm -rf extension/ -./pack.sh - -mv node_modules{_saved,} diff --git a/packages/taler-wallet-webextension/encode.mjs b/packages/taler-wallet-webextension/encode.mjs deleted file mode 100644 index 16de7f642..000000000 --- a/packages/taler-wallet-webextension/encode.mjs +++ /dev/null @@ -1,3 +0,0 @@ -import {encodeCrock, stringToBytes} from "../taler-util/lib/talerCrypto.js"; -const pepe =process.argv[2] -console.log(pepe, encodeCrock(stringToBytes(pepe))); diff --git a/packages/taler-wallet-webextension/esbuild.sh b/packages/taler-wallet-webextension/esbuild.sh new file mode 100755 index 000000000..202012e7a --- /dev/null +++ b/packages/taler-wallet-webextension/esbuild.sh @@ -0,0 +1,17 @@ +#!/bin/bash + +set -e + +#rm -rf dist lib tsconfig.tsbuildinfo .linaria-cache + +echo typecheck and bundle... +node build-fast-with-linaria.mjs & +pnpm tsc --noEmit & +wait + +echo testing... +pnpm test -- -R dot + +echo packing... +rm -rf extension/ +./pack.sh diff --git a/packages/taler-wallet-webextension/pack.sh b/packages/taler-wallet-webextension/pack.sh index a3876f4c7..4fb419991 100755 --- a/packages/taler-wallet-webextension/pack.sh +++ b/packages/taler-wallet-webextension/pack.sh @@ -15,14 +15,14 @@ zipfile="taler-wallet-webextension-${vers_manifest}.zip" TEMP_DIR=$(mktemp -d) jq '. | .name = "GNU Taler Wallet" ' manifest-v2.json > $TEMP_DIR/manifest.json cp -r dist static $TEMP_DIR -(cd $TEMP_DIR && zip -r "$zipfile" dist static manifest.json) +(cd $TEMP_DIR && zip -q -r "$zipfile" dist static manifest.json) mkdir -p extension/v2 mv "$TEMP_DIR/$zipfile" ./extension/v2/ rm -rf $TEMP_DIR # also provide unpacked version rm -rf extension/v2/unpacked mkdir -p extension/v2/unpacked -(cd extension/v2/unpacked && unzip ../$zipfile) +(cd extension/v2/unpacked && unzip -q ../$zipfile) echo "Packed webextension: extension/v2/$zipfile" cp -rf src extension/v2/unpacked @@ -33,12 +33,12 @@ zipfile="taler-wallet-webextension-${vers_manifest}.zip" TEMP_DIR=$(mktemp -d) jq '. | .name = "GNU Taler Wallet" ' manifest-v3.json > $TEMP_DIR/manifest.json cp -r dist static $TEMP_DIR -(cd $TEMP_DIR && zip -r "$zipfile" dist static manifest.json) +(cd $TEMP_DIR && zip -q -r "$zipfile" dist static manifest.json) mkdir -p extension/v3 mv "$TEMP_DIR/$zipfile" ./extension/v3/ rm -rf $TEMP_DIR # also provide unpacked version rm -rf extension/v3/unpacked mkdir -p extension/v3/unpacked -(cd extension/v3/unpacked && unzip ../$zipfile) +(cd extension/v3/unpacked && unzip -q ../$zipfile) echo "Packed webextension: extension/v3/$zipfile" diff --git a/packages/taler-wallet-webextension/package.json b/packages/taler-wallet-webextension/package.json index eaad4a4fc..f61a03903 100644 --- a/packages/taler-wallet-webextension/package.json +++ b/packages/taler-wallet-webextension/package.json @@ -37,6 +37,7 @@ "@babel/core": "7.13.16", "@babel/plugin-transform-react-jsx-source": "^7.12.13", "@babel/preset-typescript": "^7.13.0", + "@babel/runtime": "^7.17.8", "@gnu-taler/pogen": "workspace:*", "@linaria/babel-preset": "3.0.0-beta.4", "@linaria/core": "3.0.0-beta.4", @@ -85,4 +86,4 @@ "pogen": { "domain": "taler-wallet-webex" } -} \ No newline at end of file +} diff --git a/packages/taler-wallet-webextension/run-test-in-browser.html b/packages/taler-wallet-webextension/run-test-in-browser.html index 0c7d9f6f0..b027c0716 100644 --- a/packages/taler-wallet-webextension/run-test-in-browser.html +++ b/packages/taler-wallet-webextension/run-test-in-browser.html @@ -2,16 +2,18 @@ Mocha Tests - +
- + - + @@ -20,4 +22,3 @@ - diff --git a/packages/taler-wallet-webextension/src/NavigationBar.tsx b/packages/taler-wallet-webextension/src/NavigationBar.tsx index 85e1f1884..680c34a9b 100644 --- a/packages/taler-wallet-webextension/src/NavigationBar.tsx +++ b/packages/taler-wallet-webextension/src/NavigationBar.tsx @@ -24,10 +24,15 @@ /** * Imports. */ -import { VNode, h } from "preact"; +import { h, VNode } from "preact"; import { JustInDevMode } from "./components/JustInDevMode"; -import { NavigationHeader, NavigationHeaderHolder } from "./components/styled"; +import { + NavigationHeader, + NavigationHeaderHolder, + SvgIcon, +} from "./components/styled"; import { useTranslationContext } from "./context/translation"; +import settingsIcon from "./svg/settings_black_24dp.svg"; /** * List of pages used by the wallet @@ -72,7 +77,11 @@ export function PopupNavBar({ path = "" }: { path?: string }): VNode { -
+ ); diff --git a/packages/taler-wallet-webextension/src/components/Banner.stories.tsx b/packages/taler-wallet-webextension/src/components/Banner.stories.tsx index 4d5b22208..258bd0676 100644 --- a/packages/taler-wallet-webextension/src/components/Banner.stories.tsx +++ b/packages/taler-wallet-webextension/src/components/Banner.stories.tsx @@ -22,7 +22,7 @@ import { Banner } from "./Banner"; import { Fragment, h, VNode } from "preact"; import { Avatar } from "../mui/Avatar"; -import { Icon } from "./styled"; +import { Icon, SvgIcon } from "./styled"; import { Typography } from "../mui/Typography"; export default { @@ -48,7 +48,7 @@ function Wrapper({ children }: any) { ); } function SignalWifiOffIcon({ ...rest }: any): VNode { - return ; + return ; } export const BasicExample = () => ( @@ -67,7 +67,7 @@ export const BasicExample = () => ( , + icon: , description: ( You have lost connection to the internet. This app is offline. diff --git a/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx b/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx index 085bf0b82..d6765c13d 100644 --- a/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx +++ b/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx @@ -15,7 +15,7 @@ */ import { VNode, h, ComponentChildren } from "preact"; import { useState } from "preact/hooks"; -import arrowDown from "../../static/img/chevron-down.svg"; +import arrowDown from "../svg/chevron-down.svg"; import { ErrorBox } from "./styled"; export function ErrorMessage({ @@ -36,7 +36,10 @@ export function ErrorMessage({ setShowErrorDetail((v) => !v); }} > - +
)}
diff --git a/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx b/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx index 38d6ec561..9fd8f7a03 100644 --- a/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx +++ b/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx @@ -16,7 +16,7 @@ import { TalerErrorDetail } from "@gnu-taler/taler-util"; import { Fragment, h, VNode } from "preact"; import { useState } from "preact/hooks"; -import arrowDown from "../../static/img/chevron-down.svg"; +import arrowDown from "../svg/chevron-down.svg"; import { useDevContext } from "../context/devContext"; import { ErrorBox } from "./styled"; @@ -45,12 +45,12 @@ export function ErrorTalerOperation({ setShowErrorDetail((v) => !v); }} > - )} diff --git a/packages/taler-wallet-webextension/src/components/LogoHeader.tsx b/packages/taler-wallet-webextension/src/components/LogoHeader.tsx index 6c47dc92a..573221614 100644 --- a/packages/taler-wallet-webextension/src/components/LogoHeader.tsx +++ b/packages/taler-wallet-webextension/src/components/LogoHeader.tsx @@ -15,6 +15,7 @@ */ import { h } from "preact"; +import logo from "../svg/logo-2021.svg"; export function LogoHeader() { return ( @@ -25,14 +26,10 @@ export function LogoHeader() { margin: "2em", }} > - +
); } diff --git a/packages/taler-wallet-webextension/src/components/MultiActionButton.tsx b/packages/taler-wallet-webextension/src/components/MultiActionButton.tsx index 1f46cf82c..866bd0379 100644 --- a/packages/taler-wallet-webextension/src/components/MultiActionButton.tsx +++ b/packages/taler-wallet-webextension/src/components/MultiActionButton.tsx @@ -1,5 +1,5 @@ import { h, VNode } from "preact"; -import arrowDown from "../../static/img/chevron-down.svg"; +import arrowDown from "../svg/chevron-down.svg"; import { ButtonBoxPrimary, ButtonPrimary, ParagraphClickable } from "./styled"; import { useState } from "preact/hooks"; @@ -91,7 +91,10 @@ export function MultiActionButton({ borderBottomLeftRadius: 0, }} > - +
); diff --git a/packages/taler-wallet-webextension/src/components/styled/index.tsx b/packages/taler-wallet-webextension/src/components/styled/index.tsx index 608e4af7c..13e3189fb 100644 --- a/packages/taler-wallet-webextension/src/components/styled/index.tsx +++ b/packages/taler-wallet-webextension/src/components/styled/index.tsx @@ -778,9 +778,6 @@ export const WarningBox = styled(ErrorBox)` border-color: #ffecb5; `; -import settingsIcon from "../../../static/img/settings_black_24dp.svg"; -import wifiIcon from "../../../static/img/wifi.svg"; - export const NavigationHeaderHolder = styled.div` width: 100%; display: flex; @@ -809,27 +806,25 @@ export const NavigationHeader = styled.div` line-height: 35px; } - & > a > div.settings-icon { - mask: url(${settingsIcon}) no-repeat center; - background-color: white; - width: 24px; - height: 24px; - margin-left: auto; - margin-right: 8px; - padding: 4px; - } & > a.active { background-color: #f8faf7; color: #0042b2; font-weight: bold; } - & > a.active > div.settings-icon { - background-color: #0042b2; +`; + +export const SvgIcon = styled.div<{ color: string }>` + & > svg { + fill: ${({ color }) => color}; } + width: 24px; + height: 24px; + margin-left: auto; + margin-right: 8px; + padding: 4px; `; export const Icon = styled.div` - mask: url(${wifiIcon}) no-repeat center; background-color: gray; width: 24px; height: 24px; diff --git a/packages/taler-wallet-webextension/src/hooks/useTalerActionURL.test.ts b/packages/taler-wallet-webextension/src/hooks/useTalerActionURL.test.ts index 95c77cd76..082b3a05c 100644 --- a/packages/taler-wallet-webextension/src/hooks/useTalerActionURL.test.ts +++ b/packages/taler-wallet-webextension/src/hooks/useTalerActionURL.test.ts @@ -17,11 +17,10 @@ import { useTalerActionURL } from "./useTalerActionURL" import { mountHook } from "../test-utils"; import { IoCProviderForTesting } from "../context/iocContext"; import { h, VNode } from "preact"; -import { act } from "preact/test-utils"; +import { expect } from "chai"; describe('useTalerActionURL hook', () => { - // eslint-disable-next-line jest/expect-expect it('should be set url to undefined when dismiss', async () => { const ctx = ({ children }: { children: any }): VNode => { @@ -36,24 +35,25 @@ describe('useTalerActionURL hook', () => { { const [url] = result.current! - if (url !== undefined) throw Error('invalid') + expect(url).undefined; } - await waitNextUpdate() + await waitNextUpdate("waiting for useEffect") { const [url] = result.current! - if (url !== "asd") throw Error(`invalid: ${url}`) + expect(url).equals("asd"); } - await act(() => { - const [, setDismissed] = result.current! - setDismissed(true) - }) + const [, setDismissed] = result.current! + setDismissed(true) + + await waitNextUpdate("after dismiss") { const [url] = result.current! if (url !== undefined) throw Error('invalid') + expect(url).undefined; } }) diff --git a/packages/taler-wallet-webextension/src/mui/Button.stories.tsx b/packages/taler-wallet-webextension/src/mui/Button.stories.tsx index a6863add3..9750c6a94 100644 --- a/packages/taler-wallet-webextension/src/mui/Button.stories.tsx +++ b/packages/taler-wallet-webextension/src/mui/Button.stories.tsx @@ -21,8 +21,8 @@ import { Button } from "./Button"; import { Fragment, h } from "preact"; -import DeleteIcon from "../../static/img/delete_24px.svg"; -import SendIcon from "../../static/img/send_24px.svg"; +import DeleteIcon from "../svg/delete_24px.svg"; +import SendIcon from "../svg/send_24px.svg"; import { styled } from "@linaria/react"; export default { diff --git a/packages/taler-wallet-webextension/src/mui/index.stories.tsx b/packages/taler-wallet-webextension/src/mui/index.stories.tsx new file mode 100644 index 000000000..7755c6f6a --- /dev/null +++ b/packages/taler-wallet-webextension/src/mui/index.stories.tsx @@ -0,0 +1,27 @@ +/* + This file is part of GNU Taler + (C) 2021 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 + */ + +/** + * + * @author Sebastian Javier Marchano (sebasjm) + */ + +import * as a1 from "./Button.stories"; +import * as a3 from "./Grid.stories"; +import * as a4 from "./Paper.stories"; +import * as a5 from "./TextField.stories"; + +export default [a1, a3, a4, a5]; diff --git a/packages/taler-wallet-webextension/src/popup/BalancePage.tsx b/packages/taler-wallet-webextension/src/popup/BalancePage.tsx index 9de12da4c..2dc0f81e3 100644 --- a/packages/taler-wallet-webextension/src/popup/BalancePage.tsx +++ b/packages/taler-wallet-webextension/src/popup/BalancePage.tsx @@ -119,7 +119,7 @@ export function BalanceView({ {currencyWithNonZeroAmount.length > 0 && ( ( - Deposit {{s}} + Deposit {{s}} )} actions={currencyWithNonZeroAmount} onClick={(c) => goToWalletDeposit(c)} diff --git a/packages/taler-wallet-webextension/src/stories.test.ts b/packages/taler-wallet-webextension/src/stories.test.ts index db697460f..dc33dbde5 100644 --- a/packages/taler-wallet-webextension/src/stories.test.ts +++ b/packages/taler-wallet-webextension/src/stories.test.ts @@ -20,6 +20,7 @@ */ import * as popup from "./popup/index.stories"; import * as wallet from "./wallet/index.stories"; +import * as mui from "./mui/index.stories"; import { setupI18n } from "@gnu-taler/taler-util"; import { renderNodeOrBrowser } from "./test-utils"; @@ -40,7 +41,7 @@ function testThisStory(st: any): any { } describe("render every storybook example", () => { - [popup, wallet].forEach(function testAll(st: any) { + [popup, wallet, mui].forEach(function testAll(st: any) { if (Array.isArray(st.default)) { st.default.forEach(testAll) } else { diff --git a/packages/taler-wallet-webextension/src/svg/chevron-down.svg b/packages/taler-wallet-webextension/src/svg/chevron-down.svg new file mode 100644 index 000000000..36adbc1c6 --- /dev/null +++ b/packages/taler-wallet-webextension/src/svg/chevron-down.svg @@ -0,0 +1,7 @@ + + + + + diff --git a/packages/taler-wallet-webextension/src/svg/delete_24px.svg b/packages/taler-wallet-webextension/src/svg/delete_24px.svg new file mode 100644 index 000000000..0d0b74d16 --- /dev/null +++ b/packages/taler-wallet-webextension/src/svg/delete_24px.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/taler-wallet-webextension/src/svg/logo-2021.svg b/packages/taler-wallet-webextension/src/svg/logo-2021.svg new file mode 100644 index 000000000..8c5ff3e5b --- /dev/null +++ b/packages/taler-wallet-webextension/src/svg/logo-2021.svg @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/packages/taler-wallet-webextension/src/svg/ri-bank-line.svg b/packages/taler-wallet-webextension/src/svg/ri-bank-line.svg new file mode 100644 index 000000000..8d987df79 --- /dev/null +++ b/packages/taler-wallet-webextension/src/svg/ri-bank-line.svg @@ -0,0 +1 @@ + diff --git a/packages/taler-wallet-webextension/src/svg/ri-file-unknown-line.svg b/packages/taler-wallet-webextension/src/svg/ri-file-unknown-line.svg new file mode 100644 index 000000000..5203d49f5 --- /dev/null +++ b/packages/taler-wallet-webextension/src/svg/ri-file-unknown-line.svg @@ -0,0 +1 @@ + diff --git a/packages/taler-wallet-webextension/src/svg/ri-hand-heart-line.svg b/packages/taler-wallet-webextension/src/svg/ri-hand-heart-line.svg new file mode 100644 index 000000000..a9c195eac --- /dev/null +++ b/packages/taler-wallet-webextension/src/svg/ri-hand-heart-line.svg @@ -0,0 +1 @@ + diff --git a/packages/taler-wallet-webextension/src/svg/ri-refresh-line.svg b/packages/taler-wallet-webextension/src/svg/ri-refresh-line.svg new file mode 100644 index 000000000..6efa8554b --- /dev/null +++ b/packages/taler-wallet-webextension/src/svg/ri-refresh-line.svg @@ -0,0 +1 @@ + diff --git a/packages/taler-wallet-webextension/src/svg/ri-refund-2-line.svg b/packages/taler-wallet-webextension/src/svg/ri-refund-2-line.svg new file mode 100644 index 000000000..5805daf09 --- /dev/null +++ b/packages/taler-wallet-webextension/src/svg/ri-refund-2-line.svg @@ -0,0 +1 @@ + diff --git a/packages/taler-wallet-webextension/src/svg/ri-shopping-cart-line.svg b/packages/taler-wallet-webextension/src/svg/ri-shopping-cart-line.svg new file mode 100644 index 000000000..50dabf446 --- /dev/null +++ b/packages/taler-wallet-webextension/src/svg/ri-shopping-cart-line.svg @@ -0,0 +1 @@ + diff --git a/packages/taler-wallet-webextension/src/svg/send_24px.svg b/packages/taler-wallet-webextension/src/svg/send_24px.svg new file mode 100644 index 000000000..95fe7a4c6 --- /dev/null +++ b/packages/taler-wallet-webextension/src/svg/send_24px.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/taler-wallet-webextension/src/svg/settings_black_24dp.svg b/packages/taler-wallet-webextension/src/svg/settings_black_24dp.svg new file mode 100644 index 000000000..adcd50405 --- /dev/null +++ b/packages/taler-wallet-webextension/src/svg/settings_black_24dp.svg @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/packages/taler-wallet-webextension/src/svg/spinner-bars.svg b/packages/taler-wallet-webextension/src/svg/spinner-bars.svg new file mode 100644 index 000000000..f6f7dfcb3 --- /dev/null +++ b/packages/taler-wallet-webextension/src/svg/spinner-bars.svg @@ -0,0 +1,53 @@ + + + + + + + + + + + + + + + + + + + + + + + diff --git a/packages/taler-wallet-webextension/src/svg/wifi.svg b/packages/taler-wallet-webextension/src/svg/wifi.svg new file mode 100644 index 000000000..ad712435d --- /dev/null +++ b/packages/taler-wallet-webextension/src/svg/wifi.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/packages/taler-wallet-webextension/src/test-utils.ts b/packages/taler-wallet-webextension/src/test-utils.ts index 30b37ab8c..24dba8c7b 100644 --- a/packages/taler-wallet-webextension/src/test-utils.ts +++ b/packages/taler-wallet-webextension/src/test-utils.ts @@ -14,10 +14,16 @@ GNU Taler; see the file COPYING. If not, see */ -import { PendingTestFunction, TestFunction } from "mocha"; -import { ComponentChildren, Fragment, FunctionalComponent, h as create, render as renderIntoDom, VNode } from "preact"; +import { ComponentChildren, Fragment, FunctionalComponent, h as create, options, render as renderIntoDom, VNode } from "preact"; import { render as renderToString } from "preact-render-to-string"; +// When doing tests we want the requestAnimationFrame to be as fast as possible. +// without this option the RAF will timeout after 100ms making the tests slower +options.requestAnimationFrame = (fn: () => void) => { + // console.log("RAF called") + return fn() +} + export function createExample( Component: FunctionalComponent, props: Partial, @@ -59,7 +65,7 @@ export function renderNodeOrBrowser(Component: any, args: any): void { interface Mounted { unmount: () => void; result: { current: T | null }; - waitNextUpdate: () => Promise; + waitNextUpdate: (s?: string) => Promise; } const isNode = typeof window === "undefined" @@ -84,10 +90,11 @@ export function mountHook(callback: () => T, Context?: ({ children }: { child const vdom = !Context ? create(Component, {}) : create(Context, { children: [create(Component, {})] },); // waiter callback - async function waitNextUpdate(): Promise { + async function waitNextUpdate(_label = ""): Promise { + if (_label) _label = `. label: "${_label}"` await new Promise((res, rej) => { const tid = setTimeout(() => { - rej(Error("waiting for an update but the hook didn't make one")) + rej(Error(`waiting for an update but the hook didn't make one${_label}`)) }, 100) listener.push(() => { diff --git a/packages/taler-wallet-webextension/src/wallet/ManualWithdrawPage.tsx b/packages/taler-wallet-webextension/src/wallet/ManualWithdrawPage.tsx index 05c518508..bea8f0029 100644 --- a/packages/taler-wallet-webextension/src/wallet/ManualWithdrawPage.tsx +++ b/packages/taler-wallet-webextension/src/wallet/ManualWithdrawPage.tsx @@ -19,6 +19,8 @@ import { AmountJson, Amounts, NotificationType, + parsePaytoUri, + PaytoUri, } from "@gnu-taler/taler-util"; import { h, VNode } from "preact"; import { useState } from "preact/hooks"; @@ -41,6 +43,8 @@ export function ManualWithdrawPage({ currency, onCancel }: Props): VNode { response: AcceptManualWithdrawalResult; exchangeBaseUrl: string; amount: AmountJson; + paytoURI: PaytoUri | undefined; + payto: string; } | undefined >(undefined); @@ -60,7 +64,12 @@ export function ManualWithdrawPage({ currency, onCancel }: Props): VNode { exchangeBaseUrl, Amounts.stringify(amount), ); - setSuccess({ exchangeBaseUrl, response, amount }); + const payto = response.exchangePaytoUris[0]; + const paytoURI = parsePaytoUri(payto); + if (paytoURI && paytoURI.isKnown && paytoURI.targetType === "bitcoin") { + paytoURI.generateSegwitAddress(response.reservePub); + } + setSuccess({ exchangeBaseUrl, response, amount, paytoURI, payto }); } catch (e) { if (e instanceof Error) { setError(e.message); @@ -75,7 +84,8 @@ export function ManualWithdrawPage({ currency, onCancel }: Props): VNode { return ( @@ -39,11 +41,7 @@ export function ReserveCreated({ } function TransferDetails(): VNode { if (!paytoURI) return ; - if (paytoURI.targetType === "bitcoin") { - const { segwitAddr1, segwitAddr2 } = generateFakeSegwitAddress( - reservePub, - paytoURI.targetPath, - ); + if (paytoURI.isKnown && paytoURI.targetType === "bitcoin") { const min = segwitMinAmount(); return (
@@ -64,10 +62,10 @@ export function ReserveCreated({ {paytoURI.targetPath} {Amounts.stringifyValue(amount)} BTC
  • - {segwitAddr1} {Amounts.stringifyValue(min)} BTC + {paytoURI.addr1} {Amounts.stringifyValue(min)} BTC
  • - {segwitAddr2} {Amounts.stringifyValue(min)} BTC + {paytoURI.addr2} {Amounts.stringifyValue(min)} BTC
    • @@ -79,10 +77,10 @@ export function ReserveCreated({ {paytoURI.targetPath},{Amounts.stringifyValue(amount)}
  • - {segwitAddr1},{Amounts.stringifyValue(min)} + {paytoURI.addr1},{Amounts.stringifyValue(min)}
  • - {segwitAddr2},{Amounts.stringifyValue(min)} + {paytoURI.addr2},{Amounts.stringifyValue(min)}
    • diff --git a/packages/taler-wallet-webextension/static/img/chevron-down.svg b/packages/taler-wallet-webextension/static/img/chevron-down.svg deleted file mode 100644 index 36adbc1c6..000000000 --- a/packages/taler-wallet-webextension/static/img/chevron-down.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - diff --git a/packages/taler-wallet-webextension/static/img/delete_24px.svg b/packages/taler-wallet-webextension/static/img/delete_24px.svg deleted file mode 100644 index 0d0b74d16..000000000 --- a/packages/taler-wallet-webextension/static/img/delete_24px.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/packages/taler-wallet-webextension/static/img/logo-2021.svg b/packages/taler-wallet-webextension/static/img/logo-2021.svg deleted file mode 100644 index e72611eba..000000000 --- a/packages/taler-wallet-webextension/static/img/logo-2021.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/packages/taler-wallet-webextension/static/img/ri-bank-line.svg b/packages/taler-wallet-webextension/static/img/ri-bank-line.svg deleted file mode 100644 index 8d987df79..000000000 --- a/packages/taler-wallet-webextension/static/img/ri-bank-line.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/packages/taler-wallet-webextension/static/img/ri-file-unknown-line.svg b/packages/taler-wallet-webextension/static/img/ri-file-unknown-line.svg deleted file mode 100644 index 5203d49f5..000000000 --- a/packages/taler-wallet-webextension/static/img/ri-file-unknown-line.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/packages/taler-wallet-webextension/static/img/ri-hand-heart-line.svg b/packages/taler-wallet-webextension/static/img/ri-hand-heart-line.svg deleted file mode 100644 index a9c195eac..000000000 --- a/packages/taler-wallet-webextension/static/img/ri-hand-heart-line.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/packages/taler-wallet-webextension/static/img/ri-refresh-line.svg b/packages/taler-wallet-webextension/static/img/ri-refresh-line.svg deleted file mode 100644 index 6efa8554b..000000000 --- a/packages/taler-wallet-webextension/static/img/ri-refresh-line.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/packages/taler-wallet-webextension/static/img/ri-refund-2-line.svg b/packages/taler-wallet-webextension/static/img/ri-refund-2-line.svg deleted file mode 100644 index 5805daf09..000000000 --- a/packages/taler-wallet-webextension/static/img/ri-refund-2-line.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/packages/taler-wallet-webextension/static/img/ri-shopping-cart-line.svg b/packages/taler-wallet-webextension/static/img/ri-shopping-cart-line.svg deleted file mode 100644 index 50dabf446..000000000 --- a/packages/taler-wallet-webextension/static/img/ri-shopping-cart-line.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/packages/taler-wallet-webextension/static/img/send_24px.svg b/packages/taler-wallet-webextension/static/img/send_24px.svg deleted file mode 100644 index 95fe7a4c6..000000000 --- a/packages/taler-wallet-webextension/static/img/send_24px.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/packages/taler-wallet-webextension/static/img/settings_black_24dp.svg b/packages/taler-wallet-webextension/static/img/settings_black_24dp.svg deleted file mode 100644 index adcd50405..000000000 --- a/packages/taler-wallet-webextension/static/img/settings_black_24dp.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - - \ No newline at end of file diff --git a/packages/taler-wallet-webextension/static/img/spinner-bars.svg b/packages/taler-wallet-webextension/static/img/spinner-bars.svg deleted file mode 100644 index f6f7dfcb3..000000000 --- a/packages/taler-wallet-webextension/static/img/spinner-bars.svg +++ /dev/null @@ -1,53 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - diff --git a/packages/taler-wallet-webextension/static/img/wifi.svg b/packages/taler-wallet-webextension/static/img/wifi.svg deleted file mode 100644 index ad712435d..000000000 --- a/packages/taler-wallet-webextension/static/img/wifi.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - \ No newline at end of file diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index d16a9b05c..8197c8369 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -325,6 +325,7 @@ importers: '@babel/core': 7.13.16 '@babel/plugin-transform-react-jsx-source': ^7.12.13 '@babel/preset-typescript': ^7.13.0 + '@babel/runtime': ^7.17.8 '@gnu-taler/pogen': workspace:* '@gnu-taler/taler-util': workspace:* '@gnu-taler/taler-wallet-core': workspace:* @@ -384,6 +385,7 @@ importers: '@babel/core': 7.13.16 '@babel/plugin-transform-react-jsx-source': 7.14.5_@babel+core@7.13.16 '@babel/preset-typescript': 7.15.0_@babel+core@7.13.16 + '@babel/runtime': 7.17.8 '@gnu-taler/pogen': link:../pogen '@linaria/babel-preset': 3.0.0-beta.4_@babel+core@7.13.16 '@linaria/core': 3.0.0-beta.4 @@ -3000,6 +3002,13 @@ packages: regenerator-runtime: 0.13.9 dev: true + /@babel/runtime/7.17.8: + resolution: {integrity: sha512-dQpEpK0O9o6lj6oPu0gRDbbnk+4LeHlNcBpspf6Olzt3GIX4P1lWF1gS+pHLDFlaJvbR6q7jCfQ08zA4QJBnmA==} + engines: {node: '>=6.9.0'} + dependencies: + regenerator-runtime: 0.13.9 + dev: true + /@babel/template/7.14.5: resolution: {integrity: sha512-6Z3Po85sfxRGachLULUhOmvAaOo7xCvqGQtxINai2mEGPFm6pQ4z5QInFnUrRpfoSV60BnjyF5F3c+15fxFV1g==} engines: {node: '>=6.9.0'} -- cgit v1.2.3