aboutsummaryrefslogtreecommitdiff
path: root/packages
diff options
context:
space:
mode:
Diffstat (limited to 'packages')
-rw-r--r--packages/taler-wallet-webextension/src/popup/BackupPage.tsx2
-rw-r--r--packages/taler-wallet-webextension/src/popup/ProviderAddConfirmProvider.stories.tsx60
-rw-r--r--packages/taler-wallet-webextension/src/popup/ProviderAddPage.tsx107
-rw-r--r--packages/taler-wallet-webextension/src/popup/ProviderAddSetUrl.stories.tsx46
-rw-r--r--packages/taler-wallet-webextension/src/popup/ProviderDetail.stories.tsx (renamed from packages/taler-wallet-webextension/src/popup/Provider.stories.tsx)5
-rw-r--r--packages/taler-wallet-webextension/src/popup/ProviderDetailPage.tsx (renamed from packages/taler-wallet-webextension/src/popup/ProviderPage.tsx)43
-rw-r--r--packages/taler-wallet-webextension/src/popup/Transaction.tsx14
-rw-r--r--packages/taler-wallet-webextension/src/popup/popup.tsx5
-rw-r--r--packages/taler-wallet-webextension/src/popupEntryPoint.tsx27
9 files changed, 258 insertions, 51 deletions
diff --git a/packages/taler-wallet-webextension/src/popup/BackupPage.tsx b/packages/taler-wallet-webextension/src/popup/BackupPage.tsx
index 968898a63..e0e41427b 100644
--- a/packages/taler-wallet-webextension/src/popup/BackupPage.tsx
+++ b/packages/taler-wallet-webextension/src/popup/BackupPage.tsx
@@ -99,7 +99,7 @@ function BackupLayout(props: TransactionLayoutProps): JSX.Element {
{dateStr && <div style={{ fontSize: "small", color: "gray" }}>{dateStr}</div>}
{!dateStr && <div style={{ fontSize: "small", color: "red" }}>never synced</div>}
<div style={{ fontVariant: "small-caps", fontSize: "x-large" }}>
- <a href={Pages.provider.replace(':currency', props.id)}><span>{props.title}</span></a>
+ <a href={Pages.provider_detail.replace(':currency', props.id)}><span>{props.title}</span></a>
</div>
<div>{props.subtitle}</div>
diff --git a/packages/taler-wallet-webextension/src/popup/ProviderAddConfirmProvider.stories.tsx b/packages/taler-wallet-webextension/src/popup/ProviderAddConfirmProvider.stories.tsx
new file mode 100644
index 000000000..679a7ce43
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/popup/ProviderAddConfirmProvider.stories.tsx
@@ -0,0 +1,60 @@
+/*
+ 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)
+*/
+
+import { FunctionalComponent } from 'preact';
+import { ConfirmProviderView as TestedComponent } from './ProviderAddPage';
+
+export default {
+ title: 'popup/backup/confirm',
+ component: TestedComponent,
+ argTypes: {
+ onRetry: { action: 'onRetry' },
+ onDelete: { action: 'onDelete' },
+ onBack: { action: 'onBack' },
+ }
+};
+
+
+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, {
+ currency: 'KUDOS',
+ url: 'https://sync.demo.taler.net/',
+ provider: {
+ annual_fee: 'KUDOS:0.1',
+ storage_limit_in_megabytes: 20,
+ supported_protocol_version: '1'
+ }
+});
+
+export const FreeService = createExample(TestedComponent, {
+ currency: 'ARS',
+ url: 'https://sync.taler:9667/',
+ provider: {
+ annual_fee: 'ARS:0',
+ storage_limit_in_megabytes: 20,
+ supported_protocol_version: '1'
+ }
+});
diff --git a/packages/taler-wallet-webextension/src/popup/ProviderAddPage.tsx b/packages/taler-wallet-webextension/src/popup/ProviderAddPage.tsx
new file mode 100644
index 000000000..7b8712eca
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/popup/ProviderAddPage.tsx
@@ -0,0 +1,107 @@
+import { Amounts, BackupBackupProviderTerms, i18n } from "@gnu-taler/taler-util";
+import { privateDecrypt } from "crypto";
+import { add, addYears } from "date-fns";
+import { VNode } from "preact";
+import { useState } from "preact/hooks";
+import * as wxApi from "../wxApi";
+import ProviderAddConfirmProviderStories from "./ProviderAddConfirmProvider.stories";
+
+interface Props {
+ currency: string;
+}
+
+export function ProviderAddPage({ currency }: Props): VNode {
+ const [verifying, setVerifying] = useState<{ url: string, provider: BackupBackupProviderTerms } | undefined>(undefined)
+ if (!verifying) {
+ return <SetUrlView
+ currency={currency}
+ onCancel={() => {
+ setVerifying(undefined);
+ }}
+ onVerify={(url) => {
+ return fetch(url).then(r => r.json())
+ .then((provider) => setVerifying({ url, provider }))
+ .catch((e) => e.message)
+ }}
+ />
+ }
+ return <ConfirmProviderView
+ provider={verifying.provider}
+ currency={currency}
+ url={verifying.url}
+ onCancel={() => {
+ setVerifying(undefined);
+ }}
+ onConfirm={() => {
+ wxApi.addBackupProvider(verifying.url).then(_ => history.go(-1))
+ }}
+
+ />
+}
+
+export interface SetUrlViewProps {
+ currency: string,
+ onCancel: () => void;
+ onVerify: (s: string) => Promise<string | undefined>;
+}
+
+export function SetUrlView({ currency, onCancel, onVerify }: SetUrlViewProps) {
+ const [value, setValue] = useState<string>("")
+ const [error, setError] = useState<string | undefined>(undefined)
+ return <div style={{ display: 'flex', flexDirection: 'column' }}>
+ <section style={{ height: 'calc(320px - 34px - 34px - 16px)', overflow: 'auto' }}>
+ <div>
+ Add backup provider for storing <b>{currency}</b>
+ </div>
+ {error && <div class="errorbox" style={{ marginTop: 10 }} >
+ <p>{error}</p>
+ </div>}
+ <h3>Backup provider URL</h3>
+ <input style={{ width: 'calc(100% - 8px)' }} value={value} onChange={(e) => setValue(e.currentTarget.value)} />
+ <p>
+ Backup providers may charge for their service
+ </p>
+ </section>
+ <footer style={{ marginTop: 'auto', display: 'flex', flexShrink: 0 }}>
+ <button class="pure-button" onClick={onCancel}><i18n.Translate>cancel</i18n.Translate></button>
+ <div style={{ width: '100%', flexDirection: 'row', justifyContent: 'flex-end', display: 'flex' }}>
+ <button class="pure-button button-secondary" style={{ marginLeft: 5 }} onClick={() => onVerify(value).then(r => r ? setError(r) : undefined)}><i18n.Translate>verify service terms</i18n.Translate></button>
+ </div>
+ </footer>
+ </div>
+}
+
+export interface ConfirmProviderViewProps {
+ provider: BackupBackupProviderTerms,
+ currency: string,
+ url: string,
+ onCancel: () => void;
+ onConfirm: () => void
+}
+export function ConfirmProviderView({ url, provider, currency, onCancel, onConfirm }: ConfirmProviderViewProps) {
+ return <div style={{ display: 'flex', flexDirection: 'column' }}>
+
+ <section style={{ height: 'calc(320px - 34px - 34px - 16px)', overflow: 'auto' }}>
+ <div>
+ Verify provider service terms for storing <b>{currency}</b>
+ </div>
+ <h3>{url}</h3>
+ <p>
+ {Amounts.isZero(provider.annual_fee) ? 'free of charge' : provider.annual_fee} for a year of backup service
+ </p>
+ <p>
+ {provider.storage_limit_in_megabytes} megabytes of storage
+ </p>
+ </section>
+ <footer style={{ marginTop: 'auto', display: 'flex', flexShrink: 0 }}>
+ <button class="pure-button" onClick={onCancel}>
+ <i18n.Translate>cancel</i18n.Translate>
+ </button>
+ <div style={{ width: '100%', flexDirection: 'row', justifyContent: 'flex-end', display: 'flex' }}>
+ <button class="pure-button button-success" style={{ marginLeft: 5 }} onClick={onConfirm}>
+ <i18n.Translate>confirm</i18n.Translate>
+ </button>
+ </div>
+ </footer>
+ </div>
+}
diff --git a/packages/taler-wallet-webextension/src/popup/ProviderAddSetUrl.stories.tsx b/packages/taler-wallet-webextension/src/popup/ProviderAddSetUrl.stories.tsx
new file mode 100644
index 000000000..8b9075165
--- /dev/null
+++ b/packages/taler-wallet-webextension/src/popup/ProviderAddSetUrl.stories.tsx
@@ -0,0 +1,46 @@
+/*
+ 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)
+*/
+
+import { ProviderPaymentType } from '@gnu-taler/taler-wallet-core';
+import { FunctionalComponent } from 'preact';
+import { SetUrlView as TestedComponent } from './ProviderAddPage';
+
+export default {
+ title: 'popup/backup/add',
+ component: TestedComponent,
+ argTypes: {
+ onRetry: { action: 'onRetry' },
+ onDelete: { action: 'onDelete' },
+ onBack: { action: 'onBack' },
+ }
+};
+
+
+function createExample<Props>(Component: FunctionalComponent<Props>, props: Partial<Props>) {
+ const r = (args: any) => <Component {...args} />
+ r.args = props
+ return r
+}
+
+export const SetUrl = createExample(TestedComponent, {
+ currency: 'ARS',
+});
+
diff --git a/packages/taler-wallet-webextension/src/popup/Provider.stories.tsx b/packages/taler-wallet-webextension/src/popup/ProviderDetail.stories.tsx
index 7b059103b..01c0a5f05 100644
--- a/packages/taler-wallet-webextension/src/popup/Provider.stories.tsx
+++ b/packages/taler-wallet-webextension/src/popup/ProviderDetail.stories.tsx
@@ -21,7 +21,7 @@
import { ProviderPaymentType } from '@gnu-taler/taler-wallet-core';
import { FunctionalComponent } from 'preact';
-import { ProviderView as TestedComponent } from './ProviderPage';
+import { ProviderView as TestedComponent } from './ProviderDetailPage';
export default {
title: 'popup/backup/details',
@@ -77,6 +77,9 @@ export const ActiveErrorSync = createExample(TestedComponent, {
"lastSuccessfulBackupTimestamp": {
"t_ms": 1625063925078
},
+ lastAttemptedBackupTimestamp: {
+ "t_ms": 1625063925078
+ },
"paymentProposalIds": [
"43Q5WWRJPNS4SE9YKS54H9THDS94089EDGXW9EHBPN6E7M184XEG"
],
diff --git a/packages/taler-wallet-webextension/src/popup/ProviderPage.tsx b/packages/taler-wallet-webextension/src/popup/ProviderDetailPage.tsx
index 1112017fc..59e6cda1b 100644
--- a/packages/taler-wallet-webextension/src/popup/ProviderPage.tsx
+++ b/packages/taler-wallet-webextension/src/popup/ProviderDetailPage.tsx
@@ -15,48 +15,34 @@
*/
-import { i18n, Timestamp } from "@gnu-taler/taler-util";
+import { BackupBackupProviderTerms, i18n, Timestamp } from "@gnu-taler/taler-util";
import { ProviderInfo, ProviderPaymentType } from "@gnu-taler/taler-wallet-core";
-import { formatDuration, intervalToDuration } from "date-fns";
-import { VNode } from "preact";
+import { formatDuration, intervalToDuration, format } from "date-fns";
+import { Fragment, VNode } from "preact";
import { useRef, useState } from "preact/hooks";
import { useBackupStatus } from "../hooks/useProvidersByCurrency";
import * as wxApi from "../wxApi";
interface Props {
currency: string;
+ onAddProvider: (c: string) => void;
+ onBack: () => void;
}
-export function ProviderPage({ currency }: Props): VNode {
+export function ProviderDetailPage({ currency, onAddProvider, onBack }: Props): VNode {
const status = useBackupStatus()
- const [adding, setAdding] = useState<boolean>(false)
if (!status) {
return <div>Loading...</div>
}
- if (adding) {
- return <AddProviderView onConfirm={(value) => {
- console.log(value)
- wxApi.addBackupProvider(value).then(_ => history.go(-1))
- setAdding(false)
- }} />
- }
const info = status.providers[currency];
return <ProviderView currency={currency} info={info}
onSync={() => { null }}
onDelete={() => { null }}
- onBack={() => { history.go(-1); }}
- onAddProvider={() => { setAdding(true) }}
+ onBack={onBack}
+ onAddProvider={() => onAddProvider(currency)}
/>;
}
-function AddProviderView({ onConfirm }: { onConfirm: (s: string) => void }) {
- const textInput = useRef<HTMLInputElement>(null)
- return <div>
- <input ref={textInput} />
- <button onClick={() => onConfirm(textInput?.current.value)}>confirm</button>
- </div>
-}
-
export interface ViewProps {
currency: string;
info?: ProviderInfo;
@@ -69,7 +55,7 @@ export interface ViewProps {
export function ProviderView({ currency, info, onDelete, onSync, onBack, onAddProvider }: ViewProps): VNode {
function Footer() {
return <footer style={{ marginTop: 'auto', display: 'flex', flexShrink: 0 }}>
- <button onClick={onBack}><i18n.Translate>back</i18n.Translate></button>
+ <button class="pure-button" onClick={onBack}><i18n.Translate>back</i18n.Translate></button>
<div style={{ width: '100%', flexDirection: 'row', justifyContent: 'flex-end', display: 'flex' }}>
{info && <button class="pure-button button-destructive" onClick={onDelete}><i18n.Translate>remove</i18n.Translate></button>}
{info && <button class="pure-button button-secondary" style={{ marginLeft: 5 }} onClick={onSync}><i18n.Translate>sync now</i18n.Translate></button>}
@@ -79,9 +65,12 @@ export function ProviderView({ currency, info, onDelete, onSync, onBack, onAddPr
}
function Error() {
if (info?.lastError) {
- return <div class="errorbox" style={{ marginTop: 10 }} >
- <p>{info.lastError.hint}</p>
- </div>
+ return <Fragment>
+ <div class="errorbox" style={{ marginTop: 10 }} >
+ <div style={{ height: 0, textAlign: 'right', color: 'gray', fontSize: 'small' }}>{!info.lastAttemptedBackupTimestamp || info.lastAttemptedBackupTimestamp.t_ms === 'never' ? 'never' : format(new Date(info.lastAttemptedBackupTimestamp.t_ms), 'dd/MM/yyyy HH:mm:ss')}</div>
+ <p>{info.lastError.hint}</p>
+ </div>
+ </Fragment>
}
if (info?.backupProblem) {
switch (info.backupProblem.type) {
@@ -129,7 +118,7 @@ export function ProviderView({ currency, info, onDelete, onSync, onBack, onAddPr
}
`}</style>
<div style={{ display: 'flex', flexDirection: 'column' }}>
- <section style={{ flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 16px)', overflow: 'auto' }}>
+ <section style={{ flex: '1 0 auto', height: 'calc(320px - 34px - 34px - 16px)', overflow: 'auto' }}>
<span style={{ padding: 5, display: 'inline-block', backgroundColor: colorByStatus(info?.paymentStatus.type), borderRadius: 5, color: 'white' }}>{info?.paymentStatus.type}</span>
{info && <span style={{ float: "right", fontSize: "small", color: "gray", padding: 5 }}>
From <b>{info.syncProviderBaseUrl}</b>
diff --git a/packages/taler-wallet-webextension/src/popup/Transaction.tsx b/packages/taler-wallet-webextension/src/popup/Transaction.tsx
index d6a85d64d..c5274da58 100644
--- a/packages/taler-wallet-webextension/src/popup/Transaction.tsx
+++ b/packages/taler-wallet-webextension/src/popup/Transaction.tsx
@@ -62,7 +62,7 @@ export function TransactionView({ transaction, onDelete, onRetry, onBack }: Wall
function Footer() {
return <footer style={{ marginTop: 'auto', display: 'flex', flexShrink: 0 }}>
- <button onClick={onBack}><i18n.Translate>back</i18n.Translate></button>
+ <button class="pure-button" onClick={onBack}><i18n.Translate>back</i18n.Translate></button>
<div style={{ width: '100%', flexDirection: 'row', justifyContent: 'flex-end', display: 'flex' }}>
{transaction?.error ? <button class="pure-button button-secondary" style={{marginRight: 5}} onClick={onRetry}><i18n.Translate>retry</i18n.Translate></button> : null }
<button class="pure-button button-destructive" onClick={onDelete}><i18n.Translate>delete</i18n.Translate></button>
@@ -96,7 +96,7 @@ export function TransactionView({ transaction, onDelete, onRetry, onBack }: Wall
).amount
return (
<div style={{ display: 'flex', flexDirection: 'column' }} >
- <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 16px)', overflow: 'auto' }}>
+ <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 34px - 16px)', overflow: 'auto' }}>
<span style="font-size:small; color:gray">{transaction.timestamp.t_ms === "never" ? "never" : format(transaction.timestamp.t_ms, 'dd/MM/yyyy HH:mm:ss')}</span>
<span style="float: right; font-size:small; color:gray">
From <b>{transaction.exchangeBaseUrl}</b>
@@ -122,7 +122,7 @@ export function TransactionView({ transaction, onDelete, onRetry, onBack }: Wall
return (
<div style={{ display: 'flex', flexDirection: 'column' }} >
- <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 16px)', overflow: 'auto' }}>
+ <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 34px - 16px)', overflow: 'auto' }}>
<span style="flat: left; font-size:small; color:gray">{transaction.timestamp.t_ms === "never" ? "never" : format(transaction.timestamp.t_ms, 'dd/MM/yyyy HH:mm:ss')}</span>
<span style="float: right; font-size:small; color:gray">
To <b>{transaction.info.merchant.name}</b>
@@ -161,7 +161,7 @@ export function TransactionView({ transaction, onDelete, onRetry, onBack }: Wall
).amount
return (
<div style={{ display: 'flex', flexDirection: 'column' }} >
- <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 16px)', overflow: 'auto' }}>
+ <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 34px - 16px)', overflow: 'auto' }}>
<span style="flat: left; font-size:small; color:gray">{transaction.timestamp.t_ms === "never" ? "never" : format(transaction.timestamp.t_ms, 'dd/MM/yyyy HH:mm:ss')}</span>
<span style="float: right; font-size:small; color:gray">
To <b>{transaction.targetPaytoUri}</b>
@@ -182,7 +182,7 @@ export function TransactionView({ transaction, onDelete, onRetry, onBack }: Wall
).amount
return (
<div style={{ display: 'flex', flexDirection: 'column' }} >
- <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 16px)', overflow: 'auto' }}>
+ <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 34px - 16px)', overflow: 'auto' }}>
<span style="flat: left; font-size:small; color:gray">{transaction.timestamp.t_ms === "never" ? "never" : format(transaction.timestamp.t_ms, 'dd/MM/yyyy HH:mm:ss')}</span>
<span style="float: right; font-size:small; color:gray">
From <b>{transaction.exchangeBaseUrl}</b>
@@ -203,7 +203,7 @@ export function TransactionView({ transaction, onDelete, onRetry, onBack }: Wall
).amount
return (
<div style={{ display: 'flex', flexDirection: 'column' }} >
- <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 16px)', overflow: 'auto' }}>
+ <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 34px - 16px)', overflow: 'auto' }}>
<span style="flat: left; font-size:small; color:gray">{transaction.timestamp.t_ms === "never" ? "never" : format(transaction.timestamp.t_ms, 'dd/MM/yyyy HH:mm:ss')}</span>
<span style="float: right; font-size:small; color:gray">
From <b>{transaction.merchantBaseUrl}</b>
@@ -224,7 +224,7 @@ export function TransactionView({ transaction, onDelete, onRetry, onBack }: Wall
).amount
return (
<div style={{ display: 'flex', flexDirection: 'column' }} >
- <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 45px - 16px)', overflow: 'auto' }}>
+ <section style={{ color: transaction.pending ? 'gray' : '', flex: '1 0 auto', height: 'calc(320px - 34px - 34px - 16px)', overflow: 'auto' }}>
<span style="flat: left; font-size:small; color:gray">{transaction.timestamp.t_ms === "never" ? "never" : format(transaction.timestamp.t_ms, 'dd/MM/yyyy HH:mm:ss')}</span>
<span style="float: right; font-size:small; color:gray">
From <b>{transaction.info.merchant.name}</b>
diff --git a/packages/taler-wallet-webextension/src/popup/popup.tsx b/packages/taler-wallet-webextension/src/popup/popup.tsx
index 6b8f110e1..2ed9dbab9 100644
--- a/packages/taler-wallet-webextension/src/popup/popup.tsx
+++ b/packages/taler-wallet-webextension/src/popup/popup.tsx
@@ -36,7 +36,8 @@ export enum Pages {
backup = '/backup',
history = '/history',
transaction = '/transaction/:tid',
- provider = '/provider/:currency',
+ provider_detail = '/provider/:currency',
+ provider_add = '/provider/:currency/add',
}
interface TabProps {
@@ -47,7 +48,7 @@ interface TabProps {
function Tab(props: TabProps): JSX.Element {
let cssClass = "";
- if (props.current === props.target) {
+ if (props.current?.startsWith(props.target)) {
cssClass = "active";
}
return (
diff --git a/packages/taler-wallet-webextension/src/popupEntryPoint.tsx b/packages/taler-wallet-webextension/src/popupEntryPoint.tsx
index 8fb5121e5..d73b3566b 100644
--- a/packages/taler-wallet-webextension/src/popupEntryPoint.tsx
+++ b/packages/taler-wallet-webextension/src/popupEntryPoint.tsx
@@ -20,25 +20,25 @@
* @author Florian Dold <dold@taler.net>
*/
-import { Fragment, render } from "preact";
import { setupI18n } from "@gnu-taler/taler-util";
-import { strings } from "./i18n/strings";
+import { createHashHistory } from "history";
+import { render } from "preact";
+import Router, { route, Route } from "preact-router";
import { useEffect } from "preact/hooks";
+import { DevContextProvider } from "./context/useDevContext";
+import { useTalerActionURL } from "./hooks/useTalerActionURL";
+import { strings } from "./i18n/strings";
+import { BackupPage } from "./popup/BackupPage";
+import { BalancePage } from "./popup/Balance";
+import { DeveloperPage as DeveloperPage } from "./popup/Debug";
+import { HistoryPage } from "./popup/History";
import {
Pages, WalletNavBar
} from "./popup/popup";
-import { HistoryPage } from "./popup/History";
-import { DeveloperPage as DeveloperPage } from "./popup/Debug";
+import { ProviderAddPage } from "./popup/ProviderAddPage";
+import { ProviderDetailPage } from "./popup/ProviderDetailPage";
import { SettingsPage } from "./popup/Settings";
import { TransactionPage } from "./popup/Transaction";
-import { BalancePage } from "./popup/Balance";
-import Match from "preact-router/match";
-import Router, { getCurrentUrl, route, Route } from "preact-router";
-import { useTalerActionURL } from "./hooks/useTalerActionURL";
-import { createHashHistory } from "history";
-import { DevContextProvider } from "./context/useDevContext";
-import { BackupPage } from "./popup/BackupPage";
-import { ProviderPage } from "./popup/ProviderPage.js";
function main(): void {
try {
@@ -100,7 +100,8 @@ function Application() {
<Route path={Pages.dev} component={DeveloperPage} />
<Route path={Pages.history} component={HistoryPage} />
<Route path={Pages.backup} component={BackupPage} />
- <Route path={Pages.provider} component={ProviderPage} />
+ <Route path={Pages.provider_detail} component={ProviderDetailPage} />
+ <Route path={Pages.provider_add} component={ProviderAddPage} />
<Route path={Pages.transaction} component={TransactionPage} />
<Route default component={Redirect} to={Pages.balance} />
</Router>
generated by cgit v1.2.3 (git 2.26.2) at 2024-11-09 08:15:04 +0000