diff options
author | Sebastian <sebasjm@gmail.com> | 2021-11-16 13:59:53 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2021-11-16 14:01:38 -0300 |
commit | a994009d2f094c4d9c12da68dac3abb28bdef4b3 (patch) | |
tree | e403a58663f81889982635ffb324f9739e6976b3 /packages/taler-wallet-webextension/src/popup | |
parent | c33ed919719845f518d6491ef37df6ae16820dd0 (diff) | |
download | wallet-core-a994009d2f094c4d9c12da68dac3abb28bdef4b3.tar.xz |
reserveCreated new design
Diffstat (limited to 'packages/taler-wallet-webextension/src/popup')
4 files changed, 24 insertions, 23 deletions
diff --git a/packages/taler-wallet-webextension/src/popup/BackupPage.tsx b/packages/taler-wallet-webextension/src/popup/BackupPage.tsx index 894c8a791..ae93f8a40 100644 --- a/packages/taler-wallet-webextension/src/popup/BackupPage.tsx +++ b/packages/taler-wallet-webextension/src/popup/BackupPage.tsx @@ -24,18 +24,18 @@ import { formatDuration, intervalToDuration, } from "date-fns"; -import { Fragment, JSX, VNode, h } from "preact"; +import { Fragment, h, VNode } from "preact"; import { BoldLight, ButtonPrimary, ButtonSuccess, Centered, - CenteredText, CenteredBoldText, + CenteredText, PopupBox, RowBorderGray, - SmallText, SmallLightText, + SmallText, } from "../components/styled"; import { useBackupStatus } from "../hooks/useBackupStatus"; import { Pages } from "../NavigationBar"; @@ -72,8 +72,9 @@ export function BackupView({ return ( <PopupBox> <section> - {providers.map((provider) => ( + {providers.map((provider, idx) => ( <BackupLayout + key={idx} status={provider.paymentStatus} timestamp={provider.lastSuccessfulBackupTimestamp} id={provider.syncProviderBaseUrl} @@ -117,7 +118,7 @@ interface TransactionLayoutProps { active: boolean; } -function BackupLayout(props: TransactionLayoutProps): JSX.Element { +function BackupLayout(props: TransactionLayoutProps): VNode { const date = !props.timestamp ? undefined : new Date(props.timestamp.t_ms); const dateStr = date?.toLocaleString([], { dateStyle: "medium", diff --git a/packages/taler-wallet-webextension/src/popup/BalancePage.tsx b/packages/taler-wallet-webextension/src/popup/BalancePage.tsx index 2913f60e0..a23c81cd1 100644 --- a/packages/taler-wallet-webextension/src/popup/BalancePage.tsx +++ b/packages/taler-wallet-webextension/src/popup/BalancePage.tsx @@ -18,17 +18,14 @@ import { amountFractionalBase, Amounts, Balance, - BalancesResponse, i18n, } from "@gnu-taler/taler-util"; -import { JSX, h, Fragment } from "preact"; -import { ErrorMessage } from "../components/ErrorMessage"; +import { h, VNode } from "preact"; import { - PopupBox, - Centered, ButtonPrimary, ErrorBox, Middle, + PopupBox, } from "../components/styled/index"; import { BalancesHook, useBalances } from "../hooks/useBalances"; import { PageLink, renderAmount } from "../renderHtml"; @@ -37,7 +34,7 @@ export function BalancePage({ goToWalletManualWithdraw, }: { goToWalletManualWithdraw: () => void; -}) { +}): VNode { const balance = useBalances(); return ( <BalanceView @@ -53,11 +50,11 @@ export interface BalanceViewProps { goToWalletManualWithdraw: () => void; } -function formatPending(entry: Balance): JSX.Element { - let incoming: JSX.Element | undefined; - let payment: JSX.Element | undefined; +function formatPending(entry: Balance): VNode { + let incoming: VNode | undefined; + let payment: VNode | undefined; - const available = Amounts.parseOrThrow(entry.available); + // const available = Amounts.parseOrThrow(entry.available); const pendingIncoming = Amounts.parseOrThrow(entry.pendingIncoming); const pendingOutgoing = Amounts.parseOrThrow(entry.pendingOutgoing); @@ -105,8 +102,8 @@ export function BalanceView({ balance, Linker, goToWalletManualWithdraw, -}: BalanceViewProps) { - function Content() { +}: BalanceViewProps): VNode { + function Content(): VNode { if (!balance) { return <span />; } @@ -139,7 +136,7 @@ export function BalanceView({ return ( <section data-expanded data-centered> <table style={{ width: "100%" }}> - {balance.response.balances.map((entry) => { + {balance.response.balances.map((entry, idx) => { const av = Amounts.parseOrThrow(entry.available); // Create our number formatter. let formatter; @@ -168,7 +165,7 @@ export function BalanceView({ const fontSize = v.length < 8 ? "3em" : v.length < 13 ? "2em" : "1em"; return ( - <tr> + <tr key={idx}> <td style={{ height: 50, diff --git a/packages/taler-wallet-webextension/src/popup/Debug.tsx b/packages/taler-wallet-webextension/src/popup/Debug.tsx index 8722c1cf8..b0e8543fc 100644 --- a/packages/taler-wallet-webextension/src/popup/Debug.tsx +++ b/packages/taler-wallet-webextension/src/popup/Debug.tsx @@ -14,12 +14,12 @@ TALER; see the file COPYING. If not, see <http://www.gnu.org/licenses/> */ -import { JSX, h } from "preact"; +import { h, VNode } from "preact"; import { Diagnostics } from "../components/Diagnostics"; import { useDiagnostics } from "../hooks/useDiagnostics.js"; import * as wxApi from "../wxApi"; -export function DeveloperPage(props: any): JSX.Element { +export function DeveloperPage(): VNode { const [status, timedOut] = useDiagnostics(); return ( <div> @@ -36,6 +36,7 @@ export function DeveloperPage(props: any): JSX.Element { export function reload(): void { try { + // eslint-disable-next-line no-undef chrome.runtime.reload(); window.close(); } catch (e) { @@ -57,7 +58,9 @@ export async function confirmReset(): Promise<void> { export function openExtensionPage(page: string) { return () => { + // eslint-disable-next-line no-undef chrome.tabs.create({ + // eslint-disable-next-line no-undef url: chrome.extension.getURL(page), }); }; diff --git a/packages/taler-wallet-webextension/src/popup/History.tsx b/packages/taler-wallet-webextension/src/popup/History.tsx index 8fe6de16c..2228271dc 100644 --- a/packages/taler-wallet-webextension/src/popup/History.tsx +++ b/packages/taler-wallet-webextension/src/popup/History.tsx @@ -21,14 +21,14 @@ import { Transaction, TransactionsResponse, } from "@gnu-taler/taler-util"; -import { h, JSX } from "preact"; +import { h, VNode } from "preact"; import { useEffect, useState } from "preact/hooks"; import { PopupBox } from "../components/styled"; import { TransactionItem } from "../components/TransactionItem"; import { useBalances } from "../hooks/useBalances"; import * as wxApi from "../wxApi"; -export function HistoryPage(props: any): JSX.Element { +export function HistoryPage(): VNode { const [transactions, setTransactions] = useState< TransactionsResponse | undefined >(undefined); |