[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]
[taler-wallet-core] branch master updated (f1110e82 -> be489b6b)
|
From: |
gnunet |
|
Subject: |
[taler-wallet-core] branch master updated (f1110e82 -> be489b6b) |
|
Date: |
Tue, 29 Mar 2022 05:45:25 +0200 |
This is an automated email from the git hooks/post-receive script.
sebasjm pushed a change to branch master
in repository wallet-core.
from f1110e82 add eslint import rule
new 47f51ced import image as datauri, some eslint fixes
new be489b6b remove storybook
The 2 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails. The revisions
listed as "add" were already present in the repository and have only
been added to this reference.
Summary of changes:
.../taler-wallet-webextension/.storybook/.babelrc | 26 ---
.../taler-wallet-webextension/.storybook/main.js | 85 ----------
.../.storybook/preview.js | 179 ---------------------
.../build-fast-with-linaria.mjs | 2 +-
packages/taler-wallet-webextension/package.json | 5 -
.../src/NavigationBar.tsx | 2 -
.../src/components/Banner.stories.tsx | 10 +-
.../src/components/Banner.tsx | 2 +-
.../src/{popup => components}/index.stories.tsx | 6 +-
.../src/components/styled/index.tsx | 2 -
packages/taler-wallet-webextension/src/stories.tsx | 49 +++---
.../src/wallet/DepositPage.stories.tsx | 4 +-
.../src/wallet/Transaction.stories.tsx | 5 +-
13 files changed, 46 insertions(+), 331 deletions(-)
delete mode 100644 packages/taler-wallet-webextension/.storybook/.babelrc
delete mode 100644 packages/taler-wallet-webextension/.storybook/main.js
delete mode 100644 packages/taler-wallet-webextension/.storybook/preview.js
copy packages/taler-wallet-webextension/src/{popup =>
components}/index.stories.tsx (85%)
diff --git a/packages/taler-wallet-webextension/.storybook/.babelrc
b/packages/taler-wallet-webextension/.storybook/.babelrc
deleted file mode 100644
index 4476798e..00000000
--- a/packages/taler-wallet-webextension/.storybook/.babelrc
+++ /dev/null
@@ -1,26 +0,0 @@
-/*
- 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 <http://www.gnu.org/licenses/>
- */
-
- /**
- *
- * @author Sebastian Javier Marchano (sebasjm)
- */
-{
- //FIXME: check if we can remove this preset and just use default storybook
presets
- "presets": [
- "preact-cli/babel",
- ]
-}
\ No newline at end of file
diff --git a/packages/taler-wallet-webextension/.storybook/main.js
b/packages/taler-wallet-webextension/.storybook/main.js
deleted file mode 100644
index d3f21692..00000000
--- a/packages/taler-wallet-webextension/.storybook/main.js
+++ /dev/null
@@ -1,85 +0,0 @@
-/*
- 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 <http://www.gnu.org/licenses/>
- */
-
-/**
-*
-* @author Sebastian Javier Marchano (sebasjm)
-*/
-
-
-module.exports = {
- "stories": [
- "../src/**/*.stories.tsx",
- ],
- "addons": [
- "storybook-dark-mode",
- "@storybook/addon-a11y",
- "@storybook/addon-essentials" //docs, control, actions, viewport, toolbar,
background
- ],
- // sb does not yet support new jsx transform by default
- // https://github.com/storybookjs/storybook/issues/12881
- // https://github.com/storybookjs/storybook/issues/12952
- babel: async (options) => ({
- ...options,
- presets: [
- ...options.presets,
- [
- '@babel/preset-react', {
- runtime: 'automatic',
- },
- 'preset-react-jsx-transform'
- ],
- "@linaria",
- ],
- }),
- webpackFinal: (config) => {
- // should be removed after storybook 6.3
- //
https://github.com/storybookjs/storybook/issues/12853#issuecomment-821576113
- // removing workaround since this creates another problem
- // https://github.com/storybookjs/storybook/issues/16623
- // https://github.com/nodejs/node/issues/33460
- // FIXME: remove this comments in 2022 if no problem arise
- // config.resolve.alias = {
- // react: "preact/compat",
- // "react-dom": "preact/compat",
- // };
-
- // we need to add @linaria loader AFTER the babel-loader
- //
https://github.com/callstack/linaria/blob/master/docs/BUNDLERS_INTEGRATION.md#webpack
- config.module.rules[0] = {
- ...(config.module.rules[0]),
- loader: undefined, // Disable the predefined babel-loader on the rule
- use: [
- {
- ...(config.module.rules[0].use[0]),
- loader: 'babel-loader',
- },
- {
- loader: '@linaria/webpack-loader',
- options: {
- sourceMap: true, //always true since this is dev
- babelOptions: {
- presets: config.module.rules[0].use[0].options.presets,
- }
- // Pass the current babel options to linaria's babel instance
- }
- }
- ]
- };
-
- return config;
- },
-}
diff --git a/packages/taler-wallet-webextension/.storybook/preview.js
b/packages/taler-wallet-webextension/.storybook/preview.js
deleted file mode 100644
index 02d8a0e0..00000000
--- a/packages/taler-wallet-webextension/.storybook/preview.js
+++ /dev/null
@@ -1,179 +0,0 @@
-/*
- 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 <http://www.gnu.org/licenses/>
- */
-
-import { h, Fragment } from "preact"
-import { PopupNavBar, WalletNavBar } from '../src/NavigationBar'
-import { LogoHeader } from '../src/components/LogoHeader'
-import { TranslationProvider } from '../src/context/translation'
-import { PopupBox, WalletBox } from '../src/components/styled'
-export const parameters = {
- controls: { expanded: true },
-}
-
-export const globalTypes = {
- locale: {
- name: 'Locale',
- description: 'Internationalization locale',
- defaultValue: 'en',
- toolbar: {
- icon: 'globe',
- items: [
- { value: 'en', right: '🇺🇸', title: 'English' },
- { value: 'ja', right: '🇯🇵', title: 'Japanese' },
- { value: 'es', right: '🇪🇸', title: 'Spanish' },
- { value: 'de', right: '🇩🇪', title: 'German' },
- ],
- },
- },
-};
-
-
-
-export const decorators = [
- (Story, { kind }) => {
- if (kind.startsWith('popup')) {
-
- function Body() {
- const isTestingHeader = (/.*\/header\/?.*/.test(kind));
- if (isTestingHeader) {
- // simple box with correct width and height
- return <div style={{ width: "fit-content" }}>
- <Story />
- </div>
- }
-
- const path = /popup(\/.*).*/.exec(kind)[1];
- // add a fake header so it looks similar
- return <Fragment>
- <PopupNavBar path={path} devMode={path === '/dev'} />
- <PopupBox>
- <Story />
- </PopupBox>
- </Fragment>
- }
-
- return <div class="popup-container">
- <style>{`
- html {
- font-family: sans-serif; /* 1 */
- }
- body {
- margin: 0;
- }`}
- </style>
- <style>{`
- html {
- }
- h1 {
- font-size: 2em;
- }
- input {
- font: inherit;
- }
- body {
- margin: 0;
- font-size: 100%;
- padding: 0;
- overflow: hidden;
- background-color: #f8faf7;
- font-family: Arial, Helvetica, sans-serif;
- }`}
- </style>
- <div style={{ border: 'black solid 1px', width: "fit-content" }}>
- <Body />
- </div>
- </div>
- }
- if (kind.startsWith('cta')) {
- return <div>
- <style>{`
- html {
- font-family: sans-serif; /* 1 */
- }
- body {
- margin: 0;
- }`}
- </style>
- <style>{`
- html {
- }
- h1 {
- font-size: 2em;
- }
- input {
- font: inherit;
- }
- body {
- margin: 0;
- font-size: 100%;
- padding: 0;
- font-family: Arial, Helvetica, sans-serif;
- }`}
- </style>
- <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>
- }
- if (kind.startsWith('mui') || kind.startsWith('component')) {
- return <div style={{ display: 'flex', flexWrap: 'wrap' }}>
- <Story />
- </div>
- }
- if (kind.startsWith('wallet')) {
- const path = /wallet(\/.*).*/.exec(kind)[1];
- return <div class="wallet-container">
- <style>{`
- html {
- font-family: sans-serif; /* 1 */
- }
- body {
- margin: 0;
- }`}
- </style>
- <style>{`
- html {
- }
- h1 {
- font-size: 2em;
- }
- input {
- font: inherit;
- }
- body {
- margin: 0;
- font-size: 100%;
- padding: 0;
- background-color: #f8faf7;
- font-family: Arial, Helvetica, sans-serif;
- }`}
- </style>
- <LogoHeader />
- <WalletNavBar path={path} />
- <WalletBox>
- <Story />
- </WalletBox>
- </div>
- }
- return <div>
- <h1>this story is not under wallet or popup, check title property</h1>
- <Story />
- </div>
- },
- (Story, { globals }) => <TranslationProvider initial='en'
forceLang={globals.locale}>
- <Story />
- </TranslationProvider>,
-];
diff --git a/packages/taler-wallet-webextension/build-fast-with-linaria.mjs
b/packages/taler-wallet-webextension/build-fast-with-linaria.mjs
index 9cc776e0..37f6349e 100644
--- a/packages/taler-wallet-webextension/build-fast-with-linaria.mjs
+++ b/packages/taler-wallet-webextension/build-fast-with-linaria.mjs
@@ -52,7 +52,7 @@ export const buildConfig = {
minify: false,
loader: {
'.svg': 'text',
- '.png': 'file',
+ '.png': 'dataurl',
},
target: [
'es6'
diff --git a/packages/taler-wallet-webextension/package.json
b/packages/taler-wallet-webextension/package.json
index f61a0390..909b27d0 100644
--- a/packages/taler-wallet-webextension/package.json
+++ b/packages/taler-wallet-webextension/package.json
@@ -14,8 +14,6 @@
"compile": "rollup -c -m",
"compile:test": "rollup -c rollup.config.test.js -m",
"prepare": "rollup -c -m",
- "build-storybook": "build-storybook",
- "storybook": "start-storybook -s . -p 6006 --no-open",
"pretty": "prettier --write src",
"watch": "tsc --watch & rollup -w -c",
"i18n:extract": "pogen extract",
@@ -51,9 +49,6 @@
"@rollup/plugin-node-resolve": "^13.1.3",
"@rollup/plugin-replace": "^3.0.1",
"@rollup/plugin-typescript": "^8.3.0",
- "@storybook/addon-a11y": "^6.4.18",
- "@storybook/addon-essentials": "^6.4.18",
- "@storybook/preact": "6.4.18",
"@testing-library/preact": "^2.0.1",
"@testing-library/preact-hooks": "^1.1.0",
"@types/chai": "^4.3.0",
diff --git a/packages/taler-wallet-webextension/src/NavigationBar.tsx
b/packages/taler-wallet-webextension/src/NavigationBar.tsx
index 8b545b98..df779cae 100644
--- a/packages/taler-wallet-webextension/src/NavigationBar.tsx
+++ b/packages/taler-wallet-webextension/src/NavigationBar.tsx
@@ -75,7 +75,6 @@ export function PopupNavBar({ path = "" }: { path?: string
}): VNode {
<a href="/backup" class={path.startsWith("/backup") ? "active" : ""}>
<i18n.Translate>Backup</i18n.Translate>
</a>
- <a />
<a href="/settings">
<SvgIcon
title={i18n.str`Settings`}
@@ -105,7 +104,6 @@ export function WalletNavBar({ path = "" }: { path?: string
}): VNode {
</a>
</JustInDevMode>
- <a />
<a
href="/settings"
class={path.startsWith("/settings") ? "active" : ""}
diff --git
a/packages/taler-wallet-webextension/src/components/Banner.stories.tsx
b/packages/taler-wallet-webextension/src/components/Banner.stories.tsx
index e4fc63ac..f023e0d8 100644
--- a/packages/taler-wallet-webextension/src/components/Banner.stories.tsx
+++ b/packages/taler-wallet-webextension/src/components/Banner.stories.tsx
@@ -19,18 +19,18 @@
* @author Sebastian Javier Marchano (sebasjm)
*/
-import { Banner } from "./Banner.js";
import { Fragment, h, VNode } from "preact";
import { Avatar } from "../mui/Avatar.js";
-import { Icon, SvgIcon } from "./styled/index.js";
import { Typography } from "../mui/Typography.js";
-
+import { Banner } from "./Banner.js";
+import { SvgIcon } from "./styled/index.js";
+import wifiIcon from "../svg/wifi.svg";
export default {
title: "mui/banner",
component: Banner,
};
-function Wrapper({ children }: any) {
+function Wrapper({ children }: any): VNode {
return (
<div
style={{
@@ -48,7 +48,7 @@ function Wrapper({ children }: any) {
);
}
function SignalWifiOffIcon({ ...rest }: any): VNode {
- return <SvgIcon {...rest} />;
+ return <SvgIcon {...rest} dangerouslySetInnerHTML={{ __html: wifiIcon }} />;
}
export const BasicExample = () => (
diff --git a/packages/taler-wallet-webextension/src/components/Banner.tsx
b/packages/taler-wallet-webextension/src/components/Banner.tsx
index 7bbacee8..88b36430 100644
--- a/packages/taler-wallet-webextension/src/components/Banner.tsx
+++ b/packages/taler-wallet-webextension/src/components/Banner.tsx
@@ -19,7 +19,7 @@ interface Props extends JSX.HTMLAttributes<HTMLDivElement> {
};
}
-export function Banner({ title, elements, confirm, ...rest }: Props) {
+export function Banner({ title, elements, confirm, ...rest }: Props): VNode {
return (
<Fragment>
<Paper elevation={0} {...rest}>
diff --git a/packages/taler-wallet-webextension/src/popup/index.stories.tsx
b/packages/taler-wallet-webextension/src/components/index.stories.tsx
similarity index 85%
copy from packages/taler-wallet-webextension/src/popup/index.stories.tsx
copy to packages/taler-wallet-webextension/src/components/index.stories.tsx
index e027f261..7cf9d4c5 100644
--- a/packages/taler-wallet-webextension/src/popup/index.stories.tsx
+++ b/packages/taler-wallet-webextension/src/components/index.stories.tsx
@@ -19,7 +19,7 @@
* @author Sebastian Javier Marchano (sebasjm)
*/
-import * as a2 from "./Balance.stories.js";
-import * as a6 from "./TalerActionFound.stories.js";
+import * as a1 from "./Banner.stories.js";
+import * as a2 from "./PendingTransactions.stories.js";
-export default [a2, a6];
+export default [a1, a2];
diff --git a/packages/taler-wallet-webextension/src/components/styled/index.tsx
b/packages/taler-wallet-webextension/src/components/styled/index.tsx
index f01e97ee..73223859 100644
--- a/packages/taler-wallet-webextension/src/components/styled/index.tsx
+++ b/packages/taler-wallet-webextension/src/components/styled/index.tsx
@@ -137,7 +137,6 @@ export const WalletBox = styled.div<{ noPadding?: boolean
}>`
flex-direction: row;
justify-content: space-between;
display: flex;
- background-color: #f7f7f7;
button {
margin-right: 8px;
margin-left: 8px;
@@ -375,7 +374,6 @@ export const CenteredDialog = styled.div`
border-bottom-right-radius: 6px;
border-bottom-left-radius: 6px;
padding: 10px;
- background-color: #f5f5f5;
display: flex;
justify-content: space-between;
}
diff --git a/packages/taler-wallet-webextension/src/stories.tsx
b/packages/taler-wallet-webextension/src/stories.tsx
index 9b988b0d..10c903ae 100644
--- a/packages/taler-wallet-webextension/src/stories.tsx
+++ b/packages/taler-wallet-webextension/src/stories.tsx
@@ -22,7 +22,6 @@ import { setupI18n } from "@gnu-taler/taler-util";
import { styled } from "@linaria/react";
import {
ComponentChild,
- ComponentProps,
Fragment,
FunctionComponent,
h,
@@ -36,8 +35,13 @@ import * as mui from "./mui/index.stories.js";
import { PopupNavBar, WalletNavBar } from "./NavigationBar.js";
import * as popup from "./popup/index.stories.js";
import * as wallet from "./wallet/index.stories.js";
+import * as components from "./components/index.stories.js";
+import { strings } from "./i18n/strings.js";
-setupI18n("en", { en: {} });
+const url = new URL(window.location.href);
+const lang = url.searchParams.get("lang") || "en";
+
+setupI18n(lang, strings);
const Page = styled.div`
* {
@@ -60,6 +64,7 @@ const SideBar = styled.div`
height: calc(100vh - 20px);
overflow-y: visible;
overflow-x: hidden;
+ scroll-behavior: smooth;
& > {
ol {
padding: 4px;
@@ -86,9 +91,10 @@ const SideBar = styled.div`
const Content = styled.div`
width: 100%;
+ padding: 20px;
`;
-function parseExampleImport(group: string, im: any) {
+function parseExampleImport(group: string, im: any): ComponentItem {
const component = im.default.title;
return {
name: component,
@@ -106,13 +112,18 @@ function parseExampleImport(group: string, im: any) {
};
}
-const allExamples = Object.entries({ popup, wallet, mui }).map(
+const allExamples = Object.entries({ popup, wallet, mui, components }).map(
([title, value]) => ({
title,
list: value.default.map((s) => parseExampleImport(title, s)),
}),
);
+interface ComponentItem {
+ name: string;
+ examples: ExampleItem[];
+}
+
interface ExampleItem {
group: string;
component: string;
@@ -127,7 +138,7 @@ function findByGroupComponentName(
group: string,
component: string,
name: string,
-) {
+): ExampleItem | undefined {
const gl = allExamples.filter((e) => e.title === group);
if (gl.length === 0) {
return undefined;
@@ -163,7 +174,7 @@ function ExampleList({
name: string;
examples: ExampleItem[];
}[];
-}) {
+}): VNode {
const [open, setOpen] = useState(true);
return (
<ol>
@@ -173,17 +184,15 @@ function ExampleList({
<li>
<dl>
<dt>{k.name}</dt>
- {k.examples.map((r) => (
- <dd>
- <a
-
href={`#${encodeURIComponent(r.group)}-${encodeURIComponent(
- r.component,
- )}-${encodeURIComponent(r.name)}`}
- >
- {r.name}
- </a>
- </dd>
- ))}
+ {k.examples.map((r) => {
+ const e = encodeURIComponent;
+ const eId = `${e(r.group)}-${e(r.component)}-${e(r.name)}`;
+ return (
+ <dd id={eId}>
+ <a href={`#${eId}`}>{r.name}</a>
+ </dd>
+ );
+ })}
</dl>
</li>
))}
@@ -219,7 +228,7 @@ function ErrorReport({
}: {
children: ComponentChild;
selected: ExampleItem | undefined;
-}) {
+}): VNode {
const [error] = useErrorBoundary();
if (error) {
return (
@@ -261,13 +270,13 @@ function getSelectionFromLocationHash(): ExampleItem |
undefined {
);
}
-function Application() {
+function Application(): VNode {
const initialSelection = getSelectionFromLocationHash();
const [selected, updateSelected] = useState<ExampleItem | undefined>(
initialSelection,
);
- function updateSelectedFromHashChange({ newURL, oldURL }: any) {
+ function updateSelectedFromHashChange({ newURL, oldURL }: any): void {
const selected = getSelectionFromLocationHash();
updateSelected(selected);
}
diff --git
a/packages/taler-wallet-webextension/src/wallet/DepositPage.stories.tsx
b/packages/taler-wallet-webextension/src/wallet/DepositPage.stories.tsx
index 915bde01..ddd0926b 100644
--- a/packages/taler-wallet-webextension/src/wallet/DepositPage.stories.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/DepositPage.stories.tsx
@@ -19,7 +19,7 @@
* @author Sebastian Javier Marchano (sebasjm)
*/
-import { Amounts, Balance, parsePaytoUri } from "@gnu-taler/taler-util";
+import { Balance, parsePaytoUri } from "@gnu-taler/taler-util";
import { DepositFee } from
"@gnu-taler/taler-wallet-core/src/operations/deposits";
import { createExample } from "../test-utils.js";
import { View as TestedComponent } from "./DepositPage.js";
@@ -46,6 +46,7 @@ export const WithEmptyAccountList =
createExample(TestedComponent, {
available: "USD:10",
} as Balance,
],
+ currency: "USD",
onCalculateFee: alwaysReturnFeeToOne,
});
@@ -56,5 +57,6 @@ export const WithSomeBankAccounts =
createExample(TestedComponent, {
available: "USD:10",
} as Balance,
],
+ currency: "USD",
onCalculateFee: alwaysReturnFeeToOne,
});
diff --git
a/packages/taler-wallet-webextension/src/wallet/Transaction.stories.tsx
b/packages/taler-wallet-webextension/src/wallet/Transaction.stories.tsx
index f81487c8..b4dfb6ce 100644
--- a/packages/taler-wallet-webextension/src/wallet/Transaction.stories.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Transaction.stories.tsx
@@ -32,7 +32,6 @@ import {
TransactionWithdrawal,
WithdrawalType,
} from "@gnu-taler/taler-util";
-import { ComponentChildren, h } from "preact";
import { DevContextProviderForTesting } from "../context/devContext.js";
import {
createExample,
@@ -239,6 +238,8 @@ export const PaymentPending =
createExample(TestedComponent, {
transaction: { ...exampleData.payment, pending: true },
});
+import beer from "../../static-dev/beer.png";
+
export const PaymentWithProducts = createExample(TestedComponent, {
transaction: {
...exampleData.payment,
@@ -263,11 +264,13 @@ export const PaymentWithProducts =
createExample(TestedComponent, {
description: "beer",
unit: "pint",
quantity: 15,
+ image: beer,
},
{
description: "beer",
unit: "pint",
quantity: 15,
+ image: beer,
},
],
},
--
To stop receiving notification emails like this one, please contact
gnunet@gnunet.org.
- [taler-wallet-core] branch master updated (f1110e82 -> be489b6b),
gnunet <=