aboutsummaryrefslogtreecommitdiff
path: root/packages/taler-wallet-webextension
diff options
context:
space:
mode:
Diffstat (limited to 'packages/taler-wallet-webextension')
-rw-r--r--packages/taler-wallet-webextension/.storybook/preview.js10
-rwxr-xr-xpackages/taler-wallet-webextension/clean_and_build_fast.sh4
-rw-r--r--packages/taler-wallet-webextension/package.json5
-rw-r--r--packages/taler-wallet-webextension/rollup.config.js17
-rw-r--r--packages/taler-wallet-webextension/src/NavigationBar.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/components/Checkbox.tsx1
-rw-r--r--packages/taler-wallet-webextension/src/components/DebugCheckbox.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/components/Diagnostics.tsx5
-rw-r--r--packages/taler-wallet-webextension/src/components/EditableText.tsx6
-rw-r--r--packages/taler-wallet-webextension/src/components/ErrorMessage.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/components/LogoHeader.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/components/SelectList.tsx1
-rw-r--r--packages/taler-wallet-webextension/src/cta/Pay.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/cta/Refund.tsx1
-rw-r--r--packages/taler-wallet-webextension/src/cta/Tip.tsx1
-rw-r--r--packages/taler-wallet-webextension/src/cta/Withdraw.tsx3
-rw-r--r--packages/taler-wallet-webextension/src/cta/payback.tsx1
-rw-r--r--packages/taler-wallet-webextension/src/cta/reset-required.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/cta/return-coins.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/popup/Backup.stories.tsx8
-rw-r--r--packages/taler-wallet-webextension/src/popup/BackupPage.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/popup/Balance.stories.tsx9
-rw-r--r--packages/taler-wallet-webextension/src/popup/BalancePage.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/popup/Debug.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/popup/History.stories.tsx8
-rw-r--r--packages/taler-wallet-webextension/src/popup/History.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/popup/Popup.stories.tsx8
-rw-r--r--packages/taler-wallet-webextension/src/popup/ProviderAddConfirmProvider.stories.tsx8
-rw-r--r--packages/taler-wallet-webextension/src/popup/ProviderAddPage.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/popup/ProviderAddSetUrl.stories.tsx8
-rw-r--r--packages/taler-wallet-webextension/src/popup/ProviderDetail.stories.tsx8
-rw-r--r--packages/taler-wallet-webextension/src/popup/ProviderDetailPage.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/popup/Settings.stories.tsx9
-rw-r--r--packages/taler-wallet-webextension/src/popup/Settings.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/popup/Transaction.stories.tsx8
-rw-r--r--packages/taler-wallet-webextension/src/popup/Transaction.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/popupEntryPoint.tsx4
-rw-r--r--packages/taler-wallet-webextension/src/renderHtml.tsx3
-rw-r--r--packages/taler-wallet-webextension/src/test-utils.ts6
-rw-r--r--packages/taler-wallet-webextension/src/wallet/History.stories.tsx9
-rw-r--r--packages/taler-wallet-webextension/src/wallet/History.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/wallet/Welcome.tsx1
-rw-r--r--packages/taler-wallet-webextension/src/walletEntryPoint.tsx2
-rw-r--r--packages/taler-wallet-webextension/static/popup.html2
-rw-r--r--packages/taler-wallet-webextension/static/wallet.html2
-rw-r--r--packages/taler-wallet-webextension/tsconfig.json5
46 files changed, 77 insertions, 118 deletions
diff --git a/packages/taler-wallet-webextension/.storybook/preview.js b/packages/taler-wallet-webextension/.storybook/preview.js
index 1b6f62400..920e6b1ca 100644
--- a/packages/taler-wallet-webextension/.storybook/preview.js
+++ b/packages/taler-wallet-webextension/.storybook/preview.js
@@ -14,7 +14,7 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
-import { Fragment } from "preact"
+import { h, Fragment } from "preact"
import { NavBar } from '../src/NavigationBar'
import { LogoHeader } from '../src/components/LogoHeader'
import { TranslationProvider } from '../src/context/translation'
@@ -123,8 +123,8 @@ export const decorators = [
font-family: Arial, Helvetica, sans-serif;
}`}
</style>
- <link key="1" rel="stylesheet" type="text/css" href="/style/pure.css" />
- <link key="2" rel="stylesheet" type="text/css" href="/style/wallet.css" />
+ <link key="1" rel="stylesheet" type="text/css" href="/static/style/pure.css" />
+ <link key="2" rel="stylesheet" type="text/css" href="/static/style/wallet.css" />
<Story />
</div>
}
@@ -158,8 +158,8 @@ export const decorators = [
</style>
<LogoHeader />
<NavBar path={path} devMode={path === '/dev'} />
- {/* <link key="1" rel="stylesheet" type="text/css" href="/style/pure.css" />
- <link key="2" rel="stylesheet" type="text/css" href="/style/wallet.css" /> */}
+ <link key="1" rel="stylesheet" type="text/css" href="/static/style/pure.css" />
+ <link key="2" rel="stylesheet" type="text/css" href="/static/style/wallet.css" />
<Story />
</div>
}
diff --git a/packages/taler-wallet-webextension/clean_and_build_fast.sh b/packages/taler-wallet-webextension/clean_and_build_fast.sh
new file mode 100755
index 000000000..707070437
--- /dev/null
+++ b/packages/taler-wallet-webextension/clean_and_build_fast.sh
@@ -0,0 +1,4 @@
+#!/usr/bin/env bash
+# This file is in the public domain.
+rm -rf dist lib tsconfig.tsbuildinfo && (cd ../.. && rm -rf build/web && ./contrib/build-fast-web.sh) && rm -rf extension/ && ./pack.sh && (cd extension/ && unzip taler*.zip)
+
diff --git a/packages/taler-wallet-webextension/package.json b/packages/taler-wallet-webextension/package.json
index e41c6cb86..74b57637f 100644
--- a/packages/taler-wallet-webextension/package.json
+++ b/packages/taler-wallet-webextension/package.json
@@ -19,6 +19,7 @@
"@gnu-taler/taler-util": "workspace:*",
"@gnu-taler/taler-wallet-core": "workspace:*",
"date-fns": "^2.22.1",
+ "history": "4.10.1",
"preact": "^10.5.13",
"preact-router": "^3.2.1",
"tslib": "^2.1.0"
@@ -27,15 +28,12 @@
"@babel/core": "^7.14.0",
"@babel/plugin-transform-react-jsx-source": "^7.12.13",
"@babel/preset-typescript": "^7.13.0",
-
"@linaria/babel-preset": "^3.0.0-beta.4",
"@linaria/core": "^3.0.0-beta.4",
"@linaria/react": "^3.0.0-beta.7",
"@linaria/rollup": "^3.0.0-beta.7",
- "@linaria/shaker": "^3.0.0-beta.7",
"@linaria/webpack-loader": "^3.0.0-beta.7",
"@rollup/plugin-alias": "^3.1.2",
-
"@rollup/plugin-commonjs": "^17.0.0",
"@rollup/plugin-image": "^2.0.6",
"@rollup/plugin-json": "^4.1.0",
@@ -54,7 +52,6 @@
"babel-plugin-transform-react-jsx": "^6.24.1",
"enzyme": "^3.11.0",
"enzyme-adapter-preact-pure": "^3.1.0",
- "history": "4.10.1",
"jest": "^26.6.3",
"jest-preset-preact": "^4.0.3",
"preact-cli": "^3.0.5",
diff --git a/packages/taler-wallet-webextension/rollup.config.js b/packages/taler-wallet-webextension/rollup.config.js
index 5a3f0db5f..150db1fff 100644
--- a/packages/taler-wallet-webextension/rollup.config.js
+++ b/packages/taler-wallet-webextension/rollup.config.js
@@ -44,9 +44,6 @@ const makePlugins = () => [
linaria({
sourceMap: process.env.NODE_ENV !== 'production',
}),
- css({
- output: 'styles.css',
- }),
];
@@ -59,7 +56,12 @@ const webExtensionWalletEntryPoint = {
exports: "none",
name: "webExtensionWalletEntry",
},
- plugins: makePlugins(),
+ plugins: [
+ ...makePlugins(),
+ css({
+ output: 'walletEntryPoint.css',
+ }),
+ ],
};
const webExtensionPopupEntryPoint = {
@@ -70,7 +72,12 @@ const webExtensionPopupEntryPoint = {
exports: "none",
name: "webExtensionPopupEntry",
},
- plugins: makePlugins(),
+ plugins: [
+ ...makePlugins(),
+ css({
+ output: 'popupEntryPoint.css',
+ }),
+ ],
};
const webExtensionBackgroundPageScript = {
diff --git a/packages/taler-wallet-webextension/src/NavigationBar.tsx b/packages/taler-wallet-webextension/src/NavigationBar.tsx
index e07032d0a..9ddf610cd 100644
--- a/packages/taler-wallet-webextension/src/NavigationBar.tsx
+++ b/packages/taler-wallet-webextension/src/NavigationBar.tsx
@@ -25,7 +25,7 @@
* Imports.
*/
import { i18n } from "@gnu-taler/taler-util";
-import { ComponentChildren, JSX } from "preact";
+import { ComponentChildren, JSX, h } from "preact";
import Match from "preact-router/match";
import { useDevContext } from "./context/devContext";
import { PopupNavigation } from './components/styled'
diff --git a/packages/taler-wallet-webextension/src/components/Checkbox.tsx b/packages/taler-wallet-webextension/src/components/Checkbox.tsx
index 6b3dc024e..2d7b98087 100644
--- a/packages/taler-wallet-webextension/src/components/Checkbox.tsx
+++ b/packages/taler-wallet-webextension/src/components/Checkbox.tsx
@@ -15,6 +15,7 @@
*/
import { JSX } from "preact/jsx-runtime";
+import { h } from "preact";
interface Props {
enabled: boolean;
diff --git a/packages/taler-wallet-webextension/src/components/DebugCheckbox.tsx b/packages/taler-wallet-webextension/src/components/DebugCheckbox.tsx
index 7534629fb..f0c682ccb 100644
--- a/packages/taler-wallet-webextension/src/components/DebugCheckbox.tsx
+++ b/packages/taler-wallet-webextension/src/components/DebugCheckbox.tsx
@@ -14,7 +14,7 @@
TALER; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
- import { JSX } from "preact";
+ import { JSX, h } from "preact";
export function DebugCheckbox({ enabled, onToggle }: { enabled: boolean; onToggle: () => void; }): JSX.Element {
return (
diff --git a/packages/taler-wallet-webextension/src/components/Diagnostics.tsx b/packages/taler-wallet-webextension/src/components/Diagnostics.tsx
index b36525dbf..c98710149 100644
--- a/packages/taler-wallet-webextension/src/components/Diagnostics.tsx
+++ b/packages/taler-wallet-webextension/src/components/Diagnostics.tsx
@@ -1,8 +1,7 @@
-import { useState, useEffect } from "preact/hooks";
-import { getDiagnostics } from "../wxApi";
-import { PageLink } from "../renderHtml";
import { WalletDiagnostics } from "@gnu-taler/taler-util";
+import { h } from "preact";
import { JSX } from "preact/jsx-runtime";
+import { PageLink } from "../renderHtml";
interface Props {
timedOut: boolean;
diff --git a/packages/taler-wallet-webextension/src/components/EditableText.tsx b/packages/taler-wallet-webextension/src/components/EditableText.tsx
index 82983d13a..6f3388bf9 100644
--- a/packages/taler-wallet-webextension/src/components/EditableText.tsx
+++ b/packages/taler-wallet-webextension/src/components/EditableText.tsx
@@ -14,7 +14,7 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
-import { VNode } from "preact";
+import { h } from "preact";
import { useRef, useState } from "preact/hooks";
import { JSX } from "preact/jsx-runtime";
@@ -27,7 +27,7 @@ interface Props {
}
export function EditableText({ name, value, onChange, label, description }: Props): JSX.Element {
const [editing, setEditing] = useState(false)
- const ref = useRef<HTMLInputElement>()
+ const ref = useRef<HTMLInputElement>(null)
let InputText;
if (!editing) {
InputText = () => <div style={{ display: 'flex', justifyContent: 'space-between' }}>
@@ -42,7 +42,7 @@ export function EditableText({ name, value, onChange, label, description }: Prop
type="text"
id={`text-${name}`}
/>
- <button onClick={() => { onChange(ref.current.value).then(r => setEditing(false)) }}>confirm</button>
+ <button onClick={() => { if (ref.current) onChange(ref.current.value).then(r => setEditing(false)) }}>confirm</button>
</div>
}
return (
diff --git a/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx b/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx
index 6bbdd26dc..4aef66d36 100644
--- a/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx
+++ b/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx
@@ -1,4 +1,4 @@
-import { VNode } from "preact";
+import { VNode, h } from "preact";
import { useState } from "preact/hooks";
import arrowDown from '../../static/img/chevron-down.svg';
import { ErrorBox } from "./styled";
diff --git a/packages/taler-wallet-webextension/src/components/LogoHeader.tsx b/packages/taler-wallet-webextension/src/components/LogoHeader.tsx
index 0217289eb..b45dcb353 100644
--- a/packages/taler-wallet-webextension/src/components/LogoHeader.tsx
+++ b/packages/taler-wallet-webextension/src/components/LogoHeader.tsx
@@ -1,3 +1,5 @@
+import { h } from "preact";
+
export function LogoHeader() {
return <div style={{
display: 'flex',
diff --git a/packages/taler-wallet-webextension/src/components/SelectList.tsx b/packages/taler-wallet-webextension/src/components/SelectList.tsx
index 74b221777..f92bcfb2e 100644
--- a/packages/taler-wallet-webextension/src/components/SelectList.tsx
+++ b/packages/taler-wallet-webextension/src/components/SelectList.tsx
@@ -16,6 +16,7 @@
import { JSX } from "preact/jsx-runtime";
import { NiceSelect } from "./styled/index";
+import { h } from "preact";
interface Props {
value: string;
diff --git a/packages/taler-wallet-webextension/src/cta/Pay.tsx b/packages/taler-wallet-webextension/src/cta/Pay.tsx
index a5849bb28..24c76ce6c 100644
--- a/packages/taler-wallet-webextension/src/cta/Pay.tsx
+++ b/packages/taler-wallet-webextension/src/cta/Pay.tsx
@@ -39,7 +39,7 @@ import {
ContractTerms,
ConfirmPayResultType,
} from "@gnu-taler/taler-util";
-import { JSX, VNode } from "preact";
+import { JSX, VNode, h } from "preact";
interface Props {
talerPayUri?: string
diff --git a/packages/taler-wallet-webextension/src/cta/Refund.tsx b/packages/taler-wallet-webextension/src/cta/Refund.tsx
index bb26d933b..943095360 100644
--- a/packages/taler-wallet-webextension/src/cta/Refund.tsx
+++ b/packages/taler-wallet-webextension/src/cta/Refund.tsx
@@ -28,6 +28,7 @@ import {
} from "@gnu-taler/taler-util";
import { useEffect, useState } from "preact/hooks";
import { JSX } from "preact/jsx-runtime";
+import { h } from 'preact';
interface Props {
talerRefundUri?: string
diff --git a/packages/taler-wallet-webextension/src/cta/Tip.tsx b/packages/taler-wallet-webextension/src/cta/Tip.tsx
index 69886668b..dc1feaed3 100644
--- a/packages/taler-wallet-webextension/src/cta/Tip.tsx
+++ b/packages/taler-wallet-webextension/src/cta/Tip.tsx
@@ -25,6 +25,7 @@ import { PrepareTipResult } from "@gnu-taler/taler-util";
import { AmountView } from "../renderHtml";
import * as wxApi from "../wxApi";
import { JSX } from "preact/jsx-runtime";
+import { h } from 'preact';
interface Props {
talerTipUri?: string
diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw.tsx b/packages/taler-wallet-webextension/src/cta/Withdraw.tsx
index b5182b070..d5f3c89ae 100644
--- a/packages/taler-wallet-webextension/src/cta/Withdraw.tsx
+++ b/packages/taler-wallet-webextension/src/cta/Withdraw.tsx
@@ -30,6 +30,7 @@ import {
onUpdateNotification,
getWithdrawalDetailsForUri,
} from "../wxApi";
+import { h } from 'preact';
import { WithdrawUriInfoResponse } from "@gnu-taler/taler-util";
import { JSX } from "preact/jsx-runtime";
import { WalletAction } from '../components/styled';
@@ -131,7 +132,7 @@ export function WithdrawPage({ talerWithdrawUri, ...rest }: Props): JSX.Element
setSelectedExchange(res.defaultExchangeBaseUrl);
}
} catch (e) {
- console.error('error',JSON.stringify(e,undefined,2))
+ console.error('error', JSON.stringify(e, undefined, 2))
setError(true)
}
};
diff --git a/packages/taler-wallet-webextension/src/cta/payback.tsx b/packages/taler-wallet-webextension/src/cta/payback.tsx
index 4233b1f96..1e27fd912 100644
--- a/packages/taler-wallet-webextension/src/cta/payback.tsx
+++ b/packages/taler-wallet-webextension/src/cta/payback.tsx
@@ -15,6 +15,7 @@
*/
import { JSX } from "preact/jsx-runtime";
+import { h } from 'preact';
/**
* View and edit auditors.
diff --git a/packages/taler-wallet-webextension/src/cta/reset-required.tsx b/packages/taler-wallet-webextension/src/cta/reset-required.tsx
index 87751561c..e66c0db57 100644
--- a/packages/taler-wallet-webextension/src/cta/reset-required.tsx
+++ b/packages/taler-wallet-webextension/src/cta/reset-required.tsx
@@ -20,7 +20,7 @@
* @author Florian Dold
*/
-import { Component, JSX } from "preact";
+import { Component, JSX, h } from "preact";
import * as wxApi from "../wxApi";
interface State {
diff --git a/packages/taler-wallet-webextension/src/cta/return-coins.tsx b/packages/taler-wallet-webextension/src/cta/return-coins.tsx
index 2273d1454..43d73b5fe 100644
--- a/packages/taler-wallet-webextension/src/cta/return-coins.tsx
+++ b/packages/taler-wallet-webextension/src/cta/return-coins.tsx
@@ -15,7 +15,7 @@
*/
import { JSX } from "preact/jsx-runtime";
-
+import { h } from 'preact';
/**
* Return coins to own bank account.
*
diff --git a/packages/taler-wallet-webextension/src/popup/Backup.stories.tsx b/packages/taler-wallet-webextension/src/popup/Backup.stories.tsx
index 1c1c47663..d256f6d98 100644
--- a/packages/taler-wallet-webextension/src/popup/Backup.stories.tsx
+++ b/packages/taler-wallet-webextension/src/popup/Backup.stories.tsx
@@ -21,8 +21,8 @@
import { ProviderPaymentType } from '@gnu-taler/taler-wallet-core';
import { addDays } from 'date-fns';
-import { FunctionalComponent } from 'preact';
import { BackupView as TestedComponent } from './BackupPage';
+import { createExample } from '../test-utils';
export default {
title: 'popup/backup/list',
@@ -35,12 +35,6 @@ export default {
};
-function createExample<Props>(Component: FunctionalComponent<Props>, props: Partial<Props>) {
- const r = (args: any) => <Component {...args} />
- r.args = props
- return r
-}
-
export const LotOfProviders = createExample(TestedComponent, {
providers: [{
"active": true,
diff --git a/packages/taler-wallet-webextension/src/popup/BackupPage.tsx b/packages/taler-wallet-webextension/src/popup/BackupPage.tsx
index 72139e1f8..695f3abaa 100644
--- a/packages/taler-wallet-webextension/src/popup/BackupPage.tsx
+++ b/packages/taler-wallet-webextension/src/popup/BackupPage.tsx
@@ -18,7 +18,7 @@
import { i18n, Timestamp } from "@gnu-taler/taler-util";
import { ProviderInfo, ProviderPaymentStatus } from "@gnu-taler/taler-wallet-core";
import { differenceInMonths, formatDuration, intervalToDuration } from "date-fns";
-import { Fragment, JSX, VNode } from "preact";
+import { Fragment, JSX, VNode, h } from "preact";
import {
BoldLight, ButtonPrimary, ButtonSuccess, Centered,
CenteredText, CenteredTextBold, PopupBox, RowBorderGray,
diff --git a/packages/taler-wallet-webextension/src/popup/Balance.stories.tsx b/packages/taler-wallet-webextension/src/popup/Balance.stories.tsx
index a1b5e7c52..4a2e1045b 100644
--- a/packages/taler-wallet-webextension/src/popup/Balance.stories.tsx
+++ b/packages/taler-wallet-webextension/src/popup/Balance.stories.tsx
@@ -19,7 +19,7 @@
* @author Sebastian Javier Marchano (sebasjm)
*/
-import { ComponentChildren, FunctionalComponent, h } from 'preact';
+import { createExample, NullLink } from '../test-utils';
import { BalanceView as TestedComponent } from './BalancePage';
export default {
@@ -30,16 +30,9 @@ export default {
};
-function createExample<Props>(Component: FunctionalComponent<Props>, props: Partial<Props>) {
- const r = (args: any) => <Component {...args} />
- r.args = props
- return r
-}
-
export const NotYetLoaded = createExample(TestedComponent, {
});
-const NullLink = ({ children }: { children?: ComponentChildren }) => h('a', { children, href: 'javascript:void(0);' })
export const GotError = createExample(TestedComponent, {
balance: {
error: true
diff --git a/packages/taler-wallet-webextension/src/popup/BalancePage.tsx b/packages/taler-wallet-webextension/src/popup/BalancePage.tsx
index 5a2b9f747..350d4b861 100644
--- a/packages/taler-wallet-webextension/src/popup/BalancePage.tsx
+++ b/packages/taler-wallet-webextension/src/popup/BalancePage.tsx
@@ -19,7 +19,7 @@ import {
Balance, BalancesResponse,
i18n
} from "@gnu-taler/taler-util";
-import { JSX } from "preact";
+import { JSX, h } from "preact";
import { PopupBox, Centered } from "../components/styled/index";
import { BalancesHook, useBalances } from "../hooks/useBalances";
import { PageLink, renderAmount } from "../renderHtml";
diff --git a/packages/taler-wallet-webextension/src/popup/Debug.tsx b/packages/taler-wallet-webextension/src/popup/Debug.tsx
index 33b82b05b..3968b0191 100644
--- a/packages/taler-wallet-webextension/src/popup/Debug.tsx
+++ b/packages/taler-wallet-webextension/src/popup/Debug.tsx
@@ -14,7 +14,7 @@
TALER; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
-import { JSX } from "preact";
+import { JSX, h } from "preact";
import { Diagnostics } from "../components/Diagnostics";
import { useDiagnostics } from "../hooks/useDiagnostics.js";
import * as wxApi from "../wxApi";
diff --git a/packages/taler-wallet-webextension/src/popup/History.stories.tsx b/packages/taler-wallet-webextension/src/popup/History.stories.tsx
index 5337a6c1c..c92033d49 100644
--- a/packages/taler-wallet-webextension/src/popup/History.stories.tsx
+++ b/packages/taler-wallet-webextension/src/popup/History.stories.tsx
@@ -26,7 +26,7 @@ import {
TransactionWithdrawal,
WithdrawalType
} from '@gnu-taler/taler-util';
-import { FunctionalComponent } from 'preact';
+import { createExample } from '../test-utils';
import { HistoryView as TestedComponent } from './History';
export default {
@@ -105,12 +105,6 @@ const exampleData = {
} as TransactionRefund,
}
-function createExample<Props>(Component: FunctionalComponent<Props>, props: Partial<Props>) {
- const r = (args: any) => <Component {...args} />
- r.args = props
- return r
-}
-
export const Empty = createExample(TestedComponent, {
list: [],
balances: [{
diff --git a/packages/taler-wallet-webextension/src/popup/History.tsx b/packages/taler-wallet-webextension/src/popup/History.tsx
index 7c9eae54b..fd97d975f 100644
--- a/packages/taler-wallet-webextension/src/popup/History.tsx
+++ b/packages/taler-wallet-webextension/src/popup/History.tsx
@@ -16,7 +16,7 @@
import { AmountString, Balance, Timestamp, Transaction, TransactionsResponse, TransactionType } from "@gnu-taler/taler-util";
import { formatDistance } from "date-fns";
-import { JSX } from "preact";
+import { JSX, h } from "preact";
import { useEffect, useState } from "preact/hooks";
import imageBank from '../../static/img/ri-bank-line.svg';
import imageHandHeart from '../../static/img/ri-hand-heart-line.svg';
diff --git a/packages/taler-wallet-webextension/src/popup/Popup.stories.tsx b/packages/taler-wallet-webextension/src/popup/Popup.stories.tsx
index ce5b11c32..cd443e9d4 100644
--- a/packages/taler-wallet-webextension/src/popup/Popup.stories.tsx
+++ b/packages/taler-wallet-webextension/src/popup/Popup.stories.tsx
@@ -19,7 +19,7 @@
* @author Sebastian Javier Marchano (sebasjm)
*/
-import { Fragment, FunctionalComponent } from 'preact';
+import { createExample } from '../test-utils';
import { NavBar as TestedComponent } from '../NavigationBar';
export default {
@@ -33,12 +33,6 @@ export default {
};
-function createExample<Props>(Component: FunctionalComponent<Props>, props: Partial<Props>) {
- const r = (args: any) => <Component {...args} />
- r.args = props
- return r
-}
-
export const OnBalance = createExample(TestedComponent, {
devMode:false,
path:'/balance'
diff --git a/packages/taler-wallet-webextension/src/popup/ProviderAddConfirmProvider.stories.tsx b/packages/taler-wallet-webextension/src/popup/ProviderAddConfirmProvider.stories.tsx
index f286870c1..de1f67b96 100644
--- a/packages/taler-wallet-webextension/src/popup/ProviderAddConfirmProvider.stories.tsx
+++ b/packages/taler-wallet-webextension/src/popup/ProviderAddConfirmProvider.stories.tsx
@@ -19,7 +19,7 @@
* @author Sebastian Javier Marchano (sebasjm)
*/
-import { FunctionalComponent } from 'preact';
+import { createExample } from '../test-utils';
import { ConfirmProviderView as TestedComponent } from './ProviderAddPage';
export default {
@@ -33,12 +33,6 @@ export default {
};
-function createExample<Props>(Component: FunctionalComponent<Props>, props: Partial<Props>) {
- const r = (args: any) => <Component {...args} />
- r.args = props
- return r
-}
-
export const DemoService = createExample(TestedComponent, {
url: 'https://sync.demo.taler.net/',
provider: {
diff --git a/packages/taler-wallet-webextension/src/popup/ProviderAddPage.tsx b/packages/taler-wallet-webextension/src/popup/ProviderAddPage.tsx
index 2680345f7..050614978 100644
--- a/packages/taler-wallet-webextension/src/popup/ProviderAddPage.tsx
+++ b/packages/taler-wallet-webextension/src/popup/ProviderAddPage.tsx
@@ -1,6 +1,6 @@
import { Amounts, BackupBackupProviderTerms, canonicalizeBaseUrl, i18n } from "@gnu-taler/taler-util";
import { verify } from "@gnu-taler/taler-wallet-core/src/crypto/primitives/nacl-fast";
-import { VNode } from "preact";
+import { VNode, h } from "preact";
import { useEffect, useState } from "preact/hooks";
import { Checkbox } from "../components/Checkbox";
import { ErrorMessage } from "../components/ErrorMessage";
diff --git a/packages/taler-wallet-webextension/src/popup/ProviderAddSetUrl.stories.tsx b/packages/taler-wallet-webextension/src/popup/ProviderAddSetUrl.stories.tsx
index dfee115bb..2daf49e0c 100644
--- a/packages/taler-wallet-webextension/src/popup/ProviderAddSetUrl.stories.tsx
+++ b/packages/taler-wallet-webextension/src/popup/ProviderAddSetUrl.stories.tsx
@@ -19,7 +19,7 @@
* @author Sebastian Javier Marchano (sebasjm)
*/
-import { FunctionalComponent } from 'preact';
+import { createExample } from '../test-utils';
import { SetUrlView as TestedComponent } from './ProviderAddPage';
export default {
@@ -33,12 +33,6 @@ export default {
};
-function createExample<Props>(Component: FunctionalComponent<Props>, props: Partial<Props>) {
- const r = (args: any) => <Component {...args} />
- r.args = props
- return r
-}
-
export const Initial = createExample(TestedComponent, {
});
diff --git a/packages/taler-wallet-webextension/src/popup/ProviderDetail.stories.tsx b/packages/taler-wallet-webextension/src/popup/ProviderDetail.stories.tsx
index d82e8f588..4416608f8 100644
--- a/packages/taler-wallet-webextension/src/popup/ProviderDetail.stories.tsx
+++ b/packages/taler-wallet-webextension/src/popup/ProviderDetail.stories.tsx
@@ -20,7 +20,7 @@
*/
import { ProviderPaymentType } from '@gnu-taler/taler-wallet-core';
-import { FunctionalComponent } from 'preact';
+import { createExample } from '../test-utils';
import { ProviderView as TestedComponent } from './ProviderDetailPage';
export default {
@@ -34,12 +34,6 @@ export default {
};
-function createExample<Props>(Component: FunctionalComponent<Props>, props: Partial<Props>) {
- const r = (args: any) => <Component {...args} />
- r.args = props
- return r
-}
-
export const Active = createExample(TestedComponent, {
info: {
"active": true,
diff --git a/packages/taler-wallet-webextension/src/popup/ProviderDetailPage.tsx b/packages/taler-wallet-webextension/src/popup/ProviderDetailPage.tsx
index 707e6c33a..bfc32a8f3 100644
--- a/packages/taler-wallet-webextension/src/popup/ProviderDetailPage.tsx
+++ b/packages/taler-wallet-webextension/src/popup/ProviderDetailPage.tsx
@@ -18,7 +18,7 @@
import { i18n, Timestamp } from "@gnu-taler/taler-util";
import { ProviderInfo, ProviderPaymentStatus, ProviderPaymentType } from "@gnu-taler/taler-wallet-core";
import { format, formatDuration, intervalToDuration } from "date-fns";
-import { Fragment, VNode } from "preact";
+import { Fragment, VNode, h } from "preact";
import { ErrorMessage } from "../components/ErrorMessage";
import { Button, ButtonDestructive, ButtonPrimary, PaymentStatus, PopupBox, SmallTextLight } from "../components/styled";
import { useProviderStatus } from "../hooks/useProviderStatus";
diff --git a/packages/taler-wallet-webextension/src/popup/Settings.stories.tsx b/packages/taler-wallet-webextension/src/popup/Settings.stories.tsx
index 07e1538b7..06e33c9d3 100644
--- a/packages/taler-wallet-webextension/src/popup/Settings.stories.tsx
+++ b/packages/taler-wallet-webextension/src/popup/Settings.stories.tsx
@@ -19,7 +19,7 @@
* @author Sebastian Javier Marchano (sebasjm)
*/
-import { FunctionalComponent } from 'preact';
+import { createExample } from '../test-utils';
import { SettingsView as TestedComponent } from './Settings';
export default {
@@ -30,13 +30,6 @@ export default {
}
};
-
-function createExample<Props>(Component: FunctionalComponent<Props>, props: Partial<Props>) {
- const r = (args: any) => <Component {...args} />
- r.args = props
- return r
-}
-
export const AllOff = createExample(TestedComponent, {
deviceName: 'this-is-the-device-name',
setDeviceName: () => Promise.resolve(),
diff --git a/packages/taler-wallet-webextension/src/popup/Settings.tsx b/packages/taler-wallet-webextension/src/popup/Settings.tsx
index 40ab51561..52e72ee2f 100644
--- a/packages/taler-wallet-webextension/src/popup/Settings.tsx
+++ b/packages/taler-wallet-webextension/src/popup/Settings.tsx
@@ -16,7 +16,7 @@
import { i18n } from "@gnu-taler/taler-util";
-import { VNode } from "preact";
+import { VNode, h } from "preact";
import { Checkbox } from "../components/Checkbox";
import { EditableText } from "../components/EditableText";
import { SelectList } from "../components/SelectList";
diff --git a/packages/taler-wallet-webextension/src/popup/Transaction.stories.tsx b/packages/taler-wallet-webextension/src/popup/Transaction.stories.tsx
index 4e63b9242..65302babb 100644
--- a/packages/taler-wallet-webextension/src/popup/Transaction.stories.tsx
+++ b/packages/taler-wallet-webextension/src/popup/Transaction.stories.tsx
@@ -26,7 +26,7 @@ import {
TransactionWithdrawal,
WithdrawalType
} from '@gnu-taler/taler-util';
-import { FunctionalComponent } from 'preact';
+import { createExample } from '../test-utils';
import { TransactionView as TestedComponent } from './Transaction';
export default {
@@ -117,12 +117,6 @@ const transactionError = {
message: 'message'
}
-function createExample<Props>(Component: FunctionalComponent<Props>, props: Partial<Props>) {
- const r = (args: any) => <Component {...args} />
- r.args = props
- return r
-}
-
export const Withdraw = createExample(TestedComponent, {
transaction: exampleData.withdraw
});
diff --git a/packages/taler-wallet-webextension/src/popup/Transaction.tsx b/packages/taler-wallet-webextension/src/popup/Transaction.tsx
index 8177b74ad..117a098bc 100644
--- a/packages/taler-wallet-webextension/src/popup/Transaction.tsx
+++ b/packages/taler-wallet-webextension/src/popup/Transaction.tsx
@@ -16,7 +16,7 @@
import { AmountJson, Amounts, i18n, Transaction, TransactionType } from "@gnu-taler/taler-util";
import { format } from "date-fns";
-import { Fragment, JSX, VNode } from "preact";
+import { Fragment, JSX, VNode, h } from "preact";
import { route } from 'preact-router';
import { useEffect, useState } from "preact/hooks";
import * as wxApi from "../wxApi";
diff --git a/packages/taler-wallet-webextension/src/popupEntryPoint.tsx b/packages/taler-wallet-webextension/src/popupEntryPoint.tsx
index 4a9fe9abc..77c19c150 100644
--- a/packages/taler-wallet-webextension/src/popupEntryPoint.tsx
+++ b/packages/taler-wallet-webextension/src/popupEntryPoint.tsx
@@ -22,9 +22,9 @@
import { setupI18n } from "@gnu-taler/taler-util";
import { createHashHistory } from "history";
-import { render } from "preact";
+import { render, h } from "preact";
import Router, { route, Route } from "preact-router";
-import { useEffect } from "preact/hooks";
+import { useEffect, useState } from "preact/hooks";
import { DevContextProvider } from "./context/devContext";
import { useTalerActionURL } from "./hooks/useTalerActionURL";
import { strings } from "./i18n/strings";
diff --git a/packages/taler-wallet-webextension/src/renderHtml.tsx b/packages/taler-wallet-webextension/src/renderHtml.tsx
index 1101b80d6..bbe8e465c 100644
--- a/packages/taler-wallet-webextension/src/renderHtml.tsx
+++ b/packages/taler-wallet-webextension/src/renderHtml.tsx
@@ -28,8 +28,7 @@ import {
Amounts,
amountFractionalBase,
} from "@gnu-taler/taler-util";
-import { Component, ComponentChildren, JSX } from "preact";
-import { JSXInternal } from "preact/src/jsx";
+import { Component, ComponentChildren, JSX, h } from "preact";
/**
* Render amount as HTML, which non-breaking space between
diff --git a/packages/taler-wallet-webextension/src/test-utils.ts b/packages/taler-wallet-webextension/src/test-utils.ts
index 16262b3c2..7ef47b314 100644
--- a/packages/taler-wallet-webextension/src/test-utils.ts
+++ b/packages/taler-wallet-webextension/src/test-utils.ts
@@ -1,4 +1,4 @@
-import { FunctionalComponent, h as render } from 'preact';
+import { ComponentChildren, FunctionalComponent, h as render } from 'preact';
export function createExample<Props>(Component: FunctionalComponent<Props>, props: Partial<Props>) {
const r = (args: any) => render(Component, args)
@@ -6,3 +6,7 @@ export function createExample<Props>(Component: FunctionalComponent<Props>, prop
return r
}
+
+export function NullLink({ children }: { children?: ComponentChildren }) {
+ return render('a', { children, href: 'javascript:void(0);' })
+}
diff --git a/packages/taler-wallet-webextension/src/wallet/History.stories.tsx b/packages/taler-wallet-webextension/src/wallet/History.stories.tsx
index f50fd3b68..7db13fef5 100644
--- a/packages/taler-wallet-webextension/src/wallet/History.stories.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/History.stories.tsx
@@ -26,8 +26,9 @@ import {
TransactionWithdrawal,
WithdrawalType
} from '@gnu-taler/taler-util';
-import { FunctionalComponent } from 'preact';
import { HistoryView as TestedComponent } from './History';
+import { createExample } from '../test-utils';
+
export default {
title: 'wallet/history/list',
@@ -106,12 +107,6 @@ const exampleData = {
} as TransactionRefund,
}
-function createExample<Props>(Component: FunctionalComponent<Props>, props: Partial<Props>) {
- const r = (args: any) => <Component {...args} />
- r.args = props
- return r
-}
-
export const Empty = createExample(TestedComponent, {
list: [],
balances: [{
diff --git a/packages/taler-wallet-webextension/src/wallet/History.tsx b/packages/taler-wallet-webextension/src/wallet/History.tsx
index 6ef5047ae..7f9a9b1a8 100644
--- a/packages/taler-wallet-webextension/src/wallet/History.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/History.tsx
@@ -16,7 +16,7 @@
import { AmountString, Balance, Timestamp, Transaction, TransactionsResponse, TransactionType } from "@gnu-taler/taler-util";
import { format } from "date-fns";
-import { Fragment, JSX } from "preact";
+import { Fragment, JSX, h } from "preact";
import { useEffect, useState } from "preact/hooks";
import imageBank from '../../static/img/ri-bank-line.svg';
import imageHandHeart from '../../static/img/ri-hand-heart-line.svg';
diff --git a/packages/taler-wallet-webextension/src/wallet/Welcome.tsx b/packages/taler-wallet-webextension/src/wallet/Welcome.tsx
index 0738e14b6..d11070d9a 100644
--- a/packages/taler-wallet-webextension/src/wallet/Welcome.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Welcome.tsx
@@ -27,6 +27,7 @@ import { Diagnostics } from "../components/Diagnostics";
import { WalletBox } from "../components/styled";
import { useDiagnostics } from "../hooks/useDiagnostics";
import { WalletDiagnostics } from "@gnu-taler/taler-util";
+import { h } from 'preact';
export function WelcomePage() {
const [permissionsEnabled, togglePermissions] = useExtendedPermissions()
diff --git a/packages/taler-wallet-webextension/src/walletEntryPoint.tsx b/packages/taler-wallet-webextension/src/walletEntryPoint.tsx
index f8191a0fb..61df45e7e 100644
--- a/packages/taler-wallet-webextension/src/walletEntryPoint.tsx
+++ b/packages/taler-wallet-webextension/src/walletEntryPoint.tsx
@@ -20,7 +20,7 @@
* @author Florian Dold <dold@taler.net>
*/
-import { Fragment, render } from "preact";
+import { Fragment, render, h } from "preact";
import { setupI18n } from "@gnu-taler/taler-util";
import { strings } from "./i18n/strings";
import { createHashHistory } from 'history';
diff --git a/packages/taler-wallet-webextension/static/popup.html b/packages/taler-wallet-webextension/static/popup.html
index 06e447924..9c1246456 100644
--- a/packages/taler-wallet-webextension/static/popup.html
+++ b/packages/taler-wallet-webextension/static/popup.html
@@ -4,7 +4,7 @@
<meta charset="utf-8" />
<link rel="stylesheet" type="text/css" href="/static/style/pure.css" />
<link rel="stylesheet" type="text/css" href="/static/style/popup.css" />
- <link rel="stylesheet" type="text/css" href="/dist/styles.css" />
+ <link rel="stylesheet" type="text/css" href="/dist/popupEntryPoint.css" />
<link rel="icon" href="/static/img/icon.png" />
<script src="/dist/popupEntryPoint.js"></script>
</head>
diff --git a/packages/taler-wallet-webextension/static/wallet.html b/packages/taler-wallet-webextension/static/wallet.html
index 817e8bfb8..a1c069d74 100644
--- a/packages/taler-wallet-webextension/static/wallet.html
+++ b/packages/taler-wallet-webextension/static/wallet.html
@@ -4,7 +4,7 @@
<meta charset="utf-8" />
<link rel="stylesheet" type="text/css" href="/static/style/pure.css" />
<link rel="stylesheet" type="text/css" href="/static/style/wallet.css" />
- <link rel="stylesheet" type="text/css" href="/dist/styles.css" />
+ <link rel="stylesheet" type="text/css" href="/dist/popupEntryPoint.css" />
<link rel="icon" href="/static/img/icon.png" />
<script src="/dist/walletEntryPoint.js"></script>
</head>
diff --git a/packages/taler-wallet-webextension/tsconfig.json b/packages/taler-wallet-webextension/tsconfig.json
index cff3d8857..75e2ce016 100644
--- a/packages/taler-wallet-webextension/tsconfig.json
+++ b/packages/taler-wallet-webextension/tsconfig.json
@@ -2,8 +2,9 @@
"compilerOptions": {
"composite": true,
"lib": ["es6", "DOM"],
- "jsx": "react-jsx",
- "jsxImportSource": "preact",
+ "jsx": "react",
+ "jsxFactory": "h",
+ "jsxFragmentFactory": "Fragment",
"moduleResolution": "Node",
"module": "ESNext",
"target": "ES6",