aboutsummaryrefslogtreecommitdiff
path: root/packages/taler-wallet-webextension/src/wallet
diff options
context:
space:
mode:
Diffstat (limited to 'packages/taler-wallet-webextension/src/wallet')
-rw-r--r--packages/taler-wallet-webextension/src/wallet/Application.tsx25
-rw-r--r--packages/taler-wallet-webextension/src/wallet/CreateManualWithdraw.tsx8
-rw-r--r--packages/taler-wallet-webextension/src/wallet/DestinationSelection.tsx47
-rw-r--r--packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/index.ts63
-rw-r--r--packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/state.ts28
-rw-r--r--packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/stories.tsx29
-rw-r--r--packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/test.ts31
-rw-r--r--packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/views.tsx37
-rw-r--r--packages/taler-wallet-webextension/src/wallet/ExchangeSelection/index.ts2
-rw-r--r--packages/taler-wallet-webextension/src/wallet/Invoice/index.ts62
-rw-r--r--packages/taler-wallet-webextension/src/wallet/Invoice/state.ts28
-rw-r--r--packages/taler-wallet-webextension/src/wallet/Invoice/stories.tsx29
-rw-r--r--packages/taler-wallet-webextension/src/wallet/Invoice/test.ts31
-rw-r--r--packages/taler-wallet-webextension/src/wallet/Invoice/views.tsx37
14 files changed, 429 insertions, 28 deletions
diff --git a/packages/taler-wallet-webextension/src/wallet/Application.tsx b/packages/taler-wallet-webextension/src/wallet/Application.tsx
index 316a1c0e5..b39a7936b 100644
--- a/packages/taler-wallet-webextension/src/wallet/Application.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Application.tsx
@@ -37,7 +37,10 @@ import {
import { PaymentPage } from "../cta/Payment/index.js";
import { RefundPage } from "../cta/Refund/index.js";
import { TipPage } from "../cta/Tip/index.js";
-import { WithdrawPage } from "../cta/Withdraw/index.js";
+import {
+ WithdrawPageFromParams,
+ WithdrawPageFromURI,
+} from "../cta/Withdraw/index.js";
import { DepositPage as DepositPageCTA } from "../cta/Deposit/index.js";
import { Pages, WalletNavBar } from "../NavigationBar.js";
import { DeveloperPage } from "./DeveloperPage.js";
@@ -151,7 +154,10 @@ export function Application(): VNode {
path={Pages.receiveCash.pattern}
component={DestinationSelectionGetCash}
goToWalletManualWithdraw={(amount?: string) =>
- redirectTo(Pages.balanceManualWithdraw({ amount }))
+ redirectTo(Pages.ctaWithdrawManual({ amount }))
+ }
+ goToWalletWalletInvoice={(amount?: string) =>
+ redirectTo(Pages.ctaWithdrawManual({ amount }))
}
/>
<Route
@@ -163,12 +169,6 @@ export function Application(): VNode {
/>
<Route
- path={Pages.balanceManualWithdraw.pattern}
- component={ManualWithdrawPage}
- onCancel={() => redirectTo(Pages.balance)}
- />
-
- <Route
path={Pages.balanceDeposit.pattern}
component={DepositPage}
onCancel={(currency: string) => {
@@ -237,7 +237,7 @@ export function Application(): VNode {
path={Pages.ctaPay}
component={PaymentPage}
goToWalletManualWithdraw={(amount?: string) =>
- redirectTo(Pages.balanceManualWithdraw({ amount }))
+ redirectTo(Pages.ctaWithdrawManual({ amount }))
}
cancel={() => redirectTo(Pages.balance)}
/>
@@ -253,7 +253,12 @@ export function Application(): VNode {
/>
<Route
path={Pages.ctaWithdraw}
- component={WithdrawPage}
+ component={WithdrawPageFromURI}
+ cancel={() => redirectTo(Pages.balance)}
+ />
+ <Route
+ path={Pages.ctaWithdrawManual.pattern}
+ component={WithdrawPageFromParams}
cancel={() => redirectTo(Pages.balance)}
/>
<Route
diff --git a/packages/taler-wallet-webextension/src/wallet/CreateManualWithdraw.tsx b/packages/taler-wallet-webextension/src/wallet/CreateManualWithdraw.tsx
index b9c83c06e..5320c6fe2 100644
--- a/packages/taler-wallet-webextension/src/wallet/CreateManualWithdraw.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/CreateManualWithdraw.tsx
@@ -176,7 +176,9 @@ export function CreateManualWithdraw({
return (
<section>
<SubTitle>
- <i18n.Translate>Manual Withdrawal</i18n.Translate>
+ <i18n.Translate>
+ Manual Withdrawal for {state.currency.value}
+ </i18n.Translate>
</SubTitle>
<LightText>
<i18n.Translate>
@@ -212,7 +214,9 @@ export function CreateManualWithdraw({
/>
)}
<SubTitle>
- <i18n.Translate>Manual Withdrawal</i18n.Translate>
+ <i18n.Translate>
+ Manual Withdrawal for {state.currency.value}
+ </i18n.Translate>
</SubTitle>
<LightText>
<i18n.Translate>
diff --git a/packages/taler-wallet-webextension/src/wallet/DestinationSelection.tsx b/packages/taler-wallet-webextension/src/wallet/DestinationSelection.tsx
index c62504538..4952ad225 100644
--- a/packages/taler-wallet-webextension/src/wallet/DestinationSelection.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/DestinationSelection.tsx
@@ -18,21 +18,17 @@ import { Amounts } from "@gnu-taler/taler-util";
import { styled } from "@linaria/react";
import { Fragment, h, VNode } from "preact";
import { useState } from "preact/hooks";
-import { ErrorMessage } from "../components/ErrorMessage.js";
import { Loading } from "../components/Loading.js";
import { LoadingError } from "../components/LoadingError.js";
import { SelectList } from "../components/SelectList.js";
import {
Input,
- InputWithLabel,
LightText,
LinkPrimary,
- SubTitle,
SvgIcon,
} from "../components/styled/index.js";
import { useTranslationContext } from "../context/translation.js";
import { useAsyncAsHook } from "../hooks/useAsyncAsHook.js";
-import { Alert } from "../mui/Alert.js";
import { Button } from "../mui/Button.js";
import { Grid } from "../mui/Grid.js";
import { Paper } from "../mui/Paper.js";
@@ -54,6 +50,7 @@ interface Props {
action: "send" | "get";
amount?: string;
goToWalletManualWithdraw: (amount: string) => void;
+ goToWalletWalletInvoice: (amount: string) => void;
}
type Contact = {
@@ -264,6 +261,7 @@ function RowExample({
export function DestinationSelectionGetCash({
amount: initialAmount,
goToWalletManualWithdraw,
+ goToWalletWalletInvoice,
}: Props): VNode {
const parsedInitialAmount = !initialAmount
? undefined
@@ -293,6 +291,7 @@ export function DestinationSelectionGetCash({
description: "account ending with 3454",
},
];
+ const previous = previous1;
if (!currency) {
return (
@@ -331,13 +330,13 @@ export function DestinationSelectionGetCash({
</Grid>
<Grid container spacing={1} columns={1}>
- {previous2.length > 0 ? (
+ {previous.length > 0 ? (
<Fragment>
<p>Use previous origins:</p>
<Grid item xs={1}>
<Paper style={{ padding: 8 }}>
<ContactTable>
- {previous2.map((info, i) => (
+ {previous.map((info, i) => (
<tr key={i}>
<td>
<RowExample info={info} disabled={invalid} />
@@ -349,9 +348,15 @@ export function DestinationSelectionGetCash({
</Grid>
</Fragment>
) : undefined}
- <Grid item>
- <p>Or specify a new origin for the money</p>
- </Grid>
+ {previous.length > 0 ? (
+ <Grid item>
+ <p>Or specify a new origin for the money</p>
+ </Grid>
+ ) : (
+ <Grid item>
+ <p>Specify a origin for the money</p>
+ </Grid>
+ )}
<Grid item container columns={2} spacing={1}>
<Grid item xs={1}>
<Paper style={{ padding: 8 }}>
@@ -369,7 +374,12 @@ export function DestinationSelectionGetCash({
<Grid item xs={1}>
<Paper style={{ padding: 8 }}>
<p>From another wallet</p>
- <Button disabled>Invoice</Button>
+ <Button
+ disabled={invalid}
+ onClick={async () => goToWalletWalletInvoice(currencyAndAmount)}
+ >
+ Invoice
+ </Button>
</Paper>
</Grid>
</Grid>
@@ -409,6 +419,7 @@ export function DestinationSelectionSendCash({
description: "account ending with 3454",
},
];
+ const previous = previous1;
if (!currency) {
return <div>currency not provided</div>;
@@ -440,13 +451,13 @@ export function DestinationSelectionSendCash({
</div>
<Grid container spacing={1} columns={1}>
- {previous2.length > 0 ? (
+ {previous.length > 0 ? (
<Fragment>
<p>Use previous destinations:</p>
<Grid item xs={1}>
<Paper style={{ padding: 8 }}>
<ContactTable>
- {previous2.map((info, i) => (
+ {previous.map((info, i) => (
<tr key={i}>
<td>
<RowExample info={info} disabled={invalid} />
@@ -458,9 +469,15 @@ export function DestinationSelectionSendCash({
</Grid>
</Fragment>
) : undefined}
- <Grid item>
- <p>Or specify a new destination for the money</p>
- </Grid>
+ {previous.length > 0 ? (
+ <Grid item>
+ <p>Or specify a new destination for the money</p>
+ </Grid>
+ ) : (
+ <Grid item>
+ <p>Specify a destination for the money</p>
+ </Grid>
+ )}
<Grid item container columns={2} spacing={1}>
<Grid item xs={1}>
<Paper style={{ padding: 8 }}>
diff --git a/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/index.ts b/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/index.ts
new file mode 100644
index 000000000..2773e66f7
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/index.ts
@@ -0,0 +1,63 @@
+/*
+ This file is part of GNU Taler
+ (C) 2022 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 { Loading } from "../../components/Loading.js";
+import { HookError } from "../../hooks/useAsyncAsHook.js";
+import { compose, StateViewMap } from "../../utils/index.js";
+import { LoadingUriView, ReadyView } from "./views.js";
+import * as wxApi from "../../wxApi.js";
+import { useComponentState } from "./state.js";
+
+export interface Props {
+ p: string;
+}
+
+export type State =
+ | State.Loading
+ | State.LoadingUriError
+ | State.Ready;
+
+export namespace State {
+
+ export interface Loading {
+ status: "loading";
+ error: undefined;
+ }
+
+ export interface LoadingUriError {
+ status: "loading-uri";
+ error: HookError;
+ }
+
+ export interface BaseInfo {
+ error: undefined;
+ }
+ export interface Ready extends BaseInfo {
+ status: "ready";
+ error: undefined;
+ }
+}
+
+const viewMapping: StateViewMap<State> = {
+ loading: Loading,
+ "loading-uri": LoadingUriView,
+ "ready": ReadyView,
+};
+
+
+export const ComponentName = compose("ComponentName", (p: Props) => useComponentState(p, wxApi), viewMapping)
+
+
diff --git a/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/state.ts b/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/state.ts
new file mode 100644
index 000000000..45b174063
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/state.ts
@@ -0,0 +1,28 @@
+/*
+ This file is part of GNU Taler
+ (C) 2022 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 * as wxApi from "../../wxApi.js";
+import { Props, State } from "./index.js";
+
+export function useComponentState(
+ { p }: Props,
+ api: typeof wxApi,
+): State {
+ return {
+ status: "ready",
+ error: undefined,
+ }
+}
diff --git a/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/stories.tsx b/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/stories.tsx
new file mode 100644
index 000000000..696e424c4
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/stories.tsx
@@ -0,0 +1,29 @@
+/*
+ This file is part of GNU Taler
+ (C) 2022 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)
+ */
+
+import { createExample } from "../../test-utils.js";
+import { ReadyView } from "./views.js";
+
+export default {
+ title: "example",
+};
+
+export const Ready = createExample(ReadyView, {});
diff --git a/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/test.ts b/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/test.ts
new file mode 100644
index 000000000..631e76d01
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/test.ts
@@ -0,0 +1,31 @@
+/*
+ This file is part of GNU Taler
+ (C) 2022 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)
+ */
+
+import { expect } from "chai";
+
+describe("test description", () => {
+
+ it("should assert", () => {
+
+ expect([]).deep.equals([])
+ });
+})
+
diff --git a/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/views.tsx b/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/views.tsx
new file mode 100644
index 000000000..5784a7db5
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/wallet/EmptyComponentExample/views.tsx
@@ -0,0 +1,37 @@
+/*
+ This file is part of GNU Taler
+ (C) 2022 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, VNode } from "preact";
+import { LoadingError } from "../../components/LoadingError.js";
+import { useTranslationContext } from "../../context/translation.js";
+import { State } from "./index.js";
+
+export function LoadingUriView({ error }: State.LoadingUriError): VNode {
+ const { i18n } = useTranslationContext();
+
+ return (
+ <LoadingError
+ title={<i18n.Translate>Could not load</i18n.Translate>}
+ error={error}
+ />
+ );
+}
+
+export function ReadyView({ error }: State.Ready): VNode {
+ const { i18n } = useTranslationContext();
+
+ return <div />;
+}
diff --git a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/index.ts b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/index.ts
index 1484ef7f4..37fdc8f5e 100644
--- a/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/index.ts
+++ b/packages/taler-wallet-webextension/src/wallet/ExchangeSelection/index.ts
@@ -88,7 +88,7 @@ const viewMapping: StateViewMap<State> = {
"ready": ReadyView,
};
-export const ExchangeSelectionPage = compose("Tip", (p: Props) => useComponentState(p, wxApi), viewMapping)
+export const ExchangeSelectionPage = compose("ExchangeSelectionPage", (p: Props) => useComponentState(p, wxApi), viewMapping)
export interface FeeDescription {
value: AmountJson;
diff --git a/packages/taler-wallet-webextension/src/wallet/Invoice/index.ts b/packages/taler-wallet-webextension/src/wallet/Invoice/index.ts
new file mode 100644
index 000000000..edb8721ac
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/wallet/Invoice/index.ts
@@ -0,0 +1,62 @@
+/*
+ This file is part of GNU Taler
+ (C) 2022 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 { Loading } from "../../components/Loading.js";
+import { HookError } from "../../hooks/useAsyncAsHook.js";
+import { compose, StateViewMap } from "../../utils/index.js";
+import { LoadingUriView, ReadyView } from "./views.js";
+import * as wxApi from "../../wxApi.js";
+import { useComponentState } from "./state.js";
+
+export interface Props {
+ p: string;
+}
+
+export type State =
+ | State.Loading
+ | State.LoadingUriError
+ | State.Ready;
+
+export namespace State {
+
+ export interface Loading {
+ status: "loading";
+ error: undefined;
+ }
+
+ export interface LoadingUriError {
+ status: "loading-uri";
+ error: HookError;
+ }
+
+ export interface BaseInfo {
+ error: undefined;
+ }
+ export interface Ready extends BaseInfo {
+ status: "ready";
+ error: undefined;
+ }
+}
+
+const viewMapping: StateViewMap<State> = {
+ loading: Loading,
+ "loading-uri": LoadingUriView,
+ "ready": ReadyView,
+};
+
+
+export const InvoicePage = compose("InvoicePage", (p: Props) => useComponentState(p, wxApi), viewMapping)
+
diff --git a/packages/taler-wallet-webextension/src/wallet/Invoice/state.ts b/packages/taler-wallet-webextension/src/wallet/Invoice/state.ts
new file mode 100644
index 000000000..45b174063
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/wallet/Invoice/state.ts
@@ -0,0 +1,28 @@
+/*
+ This file is part of GNU Taler
+ (C) 2022 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 * as wxApi from "../../wxApi.js";
+import { Props, State } from "./index.js";
+
+export function useComponentState(
+ { p }: Props,
+ api: typeof wxApi,
+): State {
+ return {
+ status: "ready",
+ error: undefined,
+ }
+}
diff --git a/packages/taler-wallet-webextension/src/wallet/Invoice/stories.tsx b/packages/taler-wallet-webextension/src/wallet/Invoice/stories.tsx
new file mode 100644
index 000000000..75f78be1d
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/wallet/Invoice/stories.tsx
@@ -0,0 +1,29 @@
+/*
+ This file is part of GNU Taler
+ (C) 2022 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)
+ */
+
+import { createExample } from "../../test-utils.js";
+import { ReadyView } from "./views.js";
+
+export default {
+ title: "wallet/invoice",
+};
+
+export const Ready = createExample(ReadyView, {});
diff --git a/packages/taler-wallet-webextension/src/wallet/Invoice/test.ts b/packages/taler-wallet-webextension/src/wallet/Invoice/test.ts
new file mode 100644
index 000000000..631e76d01
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/wallet/Invoice/test.ts
@@ -0,0 +1,31 @@
+/*
+ This file is part of GNU Taler
+ (C) 2022 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)
+ */
+
+import { expect } from "chai";
+
+describe("test description", () => {
+
+ it("should assert", () => {
+
+ expect([]).deep.equals([])
+ });
+})
+
diff --git a/packages/taler-wallet-webextension/src/wallet/Invoice/views.tsx b/packages/taler-wallet-webextension/src/wallet/Invoice/views.tsx
new file mode 100644
index 000000000..5784a7db5
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/wallet/Invoice/views.tsx
@@ -0,0 +1,37 @@
+/*
+ This file is part of GNU Taler
+ (C) 2022 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, VNode } from "preact";
+import { LoadingError } from "../../components/LoadingError.js";
+import { useTranslationContext } from "../../context/translation.js";
+import { State } from "./index.js";
+
+export function LoadingUriView({ error }: State.LoadingUriError): VNode {
+ const { i18n } = useTranslationContext();
+
+ return (
+ <LoadingError
+ title={<i18n.Translate>Could not load</i18n.Translate>}
+ error={error}
+ />
+ );
+}
+
+export function ReadyView({ error }: State.Ready): VNode {
+ const { i18n } = useTranslationContext();
+
+ return <div />;
+}