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/src/components/styled/index.tsx4
-rw-r--r--packages/taler-wallet-webextension/src/cta/Withdraw.tsx17
-rw-r--r--packages/taler-wallet-webextension/src/wallet/Transaction.tsx53
3 files changed, 37 insertions, 37 deletions
diff --git a/packages/taler-wallet-webextension/src/components/styled/index.tsx b/packages/taler-wallet-webextension/src/components/styled/index.tsx
index 7c3bb3943..65c1f49e9 100644
--- a/packages/taler-wallet-webextension/src/components/styled/index.tsx
+++ b/packages/taler-wallet-webextension/src/components/styled/index.tsx
@@ -459,6 +459,10 @@ export const LightText = styled.div`
color: gray;
`
+export const WarningText = styled.div`
+ color: rgb(223, 117, 20);
+`
+
export const SmallText = styled.div`
font-size: small;
`
diff --git a/packages/taler-wallet-webextension/src/cta/Withdraw.tsx b/packages/taler-wallet-webextension/src/cta/Withdraw.tsx
index ecc0420be..6ef72cbe6 100644
--- a/packages/taler-wallet-webextension/src/cta/Withdraw.tsx
+++ b/packages/taler-wallet-webextension/src/cta/Withdraw.tsx
@@ -30,7 +30,7 @@ import { ExchangeXmlTos } from '../components/ExchangeToS';
import { LogoHeader } from '../components/LogoHeader';
import { Part } from '../components/Part';
import { SelectList } from '../components/SelectList';
-import { ButtonSuccess, ButtonWarning, LinkSuccess, LinkWarning, TermsOfService, WalletAction } from '../components/styled';
+import { ButtonSuccess, ButtonWarning, LinkSuccess, LinkWarning, TermsOfService, WalletAction, WarningText } from '../components/styled';
import { useAsyncAsHook } from '../hooks/useAsyncAsHook';
import {
acceptWithdrawal, getExchangeWithdrawalInfo, getWithdrawalDetailsForUri, setExchangeTosAccepted, listExchanges, getExchangeTos
@@ -142,6 +142,13 @@ export function View({ details, withdrawalFee, exchangeBaseUrl, knownExchanges,
</LinkSuccess>
</section>
}
+ {terms.status === 'notfound' &&
+ <section>
+ <WarningText>
+ {i18n.str`Exchange doesn't have terms of service`}
+ </WarningText>
+ </section>
+ }
{reviewing &&
<section>
{terms.status !== 'accepted' && terms.value && terms.value.type === 'xml' &&
@@ -216,10 +223,7 @@ export function View({ details, withdrawalFee, exchangeBaseUrl, knownExchanges,
{i18n.str`Confirm withdrawal`}
</ButtonSuccess>
}
- {terms.status === 'notfound' && <Fragment>
- <LinkWarning>
- {i18n.str`Exchange doesn't have terms of service`}
- </LinkWarning>
+ {terms.status === 'notfound' &&
<ButtonWarning
upperCased
disabled={!exchangeBaseUrl}
@@ -227,7 +231,6 @@ export function View({ details, withdrawalFee, exchangeBaseUrl, knownExchanges,
>
{i18n.str`Withdraw anyway`}
</ButtonWarning>
- </Fragment>
}
</section>
</WalletAction>
@@ -257,7 +260,7 @@ export function WithdrawPageWithParsedURI({ uri, uriInfo }: { uri: string, uriIn
amount: withdrawAmount,
tosAcceptedFormat: ['text/xml']
})
- return {tos, info}
+ return { tos, info }
})
if (!detailsHook) {
diff --git a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
index 052b77dd0..8a97ad50c 100644
--- a/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Transaction.tsx
@@ -22,7 +22,7 @@ import { useEffect, useState } from "preact/hooks";
import * as wxApi from "../wxApi";
import { Pages } from "../NavigationBar";
import emptyImg from "../../static/img/empty.png"
-import { Button, ButtonBox, ButtonBoxDestructive, ButtonDestructive, ButtonPrimary, ExtraLargeText, FontIcon, LargeText, ListOfProducts, PopupBox, Row, RowBorderGray, SmallLightText, WalletBox } from "../components/styled";
+import { Button, ButtonBox, ButtonBoxDestructive, ButtonDestructive, ButtonPrimary, ExtraLargeText, FontIcon, LargeText, ListOfProducts, PopupBox, Row, RowBorderGray, SmallLightText, WalletBox, WarningBox } from "../components/styled";
import { ErrorMessage } from "../components/ErrorMessage";
import { Part } from "../components/Part";
@@ -55,28 +55,21 @@ export function TransactionPage({ tid }: { tid: string; }): JSX.Element {
}
export interface WalletTransactionProps {
- transaction: Transaction,
- onDelete: () => void,
- onRetry: () => void,
- onBack: () => void,
+ transaction: Transaction;
+ onDelete: () => void;
+ onRetry: () => void;
+ onBack: () => void;
}
export function TransactionView({ transaction, onDelete, onRetry, onBack }: WalletTransactionProps) {
- function Status() {
- if (transaction.error) {
- return <span style={{ fontWeight: 'normal', fontSize: 16, color: 'red' }}>(failed)</span>
- }
- if (transaction.pending) {
- return <span style={{ fontWeight: 'normal', fontSize: 16, color: 'gray' }}>(pending...)</span>
- }
- return null
- }
-
function TransactionTemplate({ children }: { children: VNode[] }) {
return <WalletBox>
- <section>
+ <section style={{ padding: 8, textAlign: 'center'}}>
<ErrorMessage title={transaction?.error?.hint} />
+ {transaction.pending && <WarningBox>This transaction is not completed</WarningBox>}
+ </section>
+ <section>
<div style={{ textAlign: 'center' }}>
{children}
</div>
@@ -104,8 +97,8 @@ export function TransactionView({ transaction, onDelete, onRetry, onBack }: Wall
Amounts.parseOrThrow(transaction.amountEffective),
).amount
return <TransactionTemplate>
- <h2>Withdrawal <Status /></h2>
- <div>{transaction.timestamp.t_ms === 'never' ? 'never': format(transaction.timestamp.t_ms, 'dd MMMM yyyy, HH:mm')}</div>
+ <h2>Withdrawal</h2>
+ <div>{transaction.timestamp.t_ms === 'never' ? 'never' : format(transaction.timestamp.t_ms, 'dd MMMM yyyy, HH:mm')}</div>
<br />
<Part title="Total withdrawn" text={amountToString(transaction.amountEffective)} kind='positive' />
<Part title="Chosen amount" text={amountToString(transaction.amountRaw)} kind='neutral' />
@@ -125,8 +118,8 @@ export function TransactionView({ transaction, onDelete, onRetry, onBack }: Wall
).amount
return <TransactionTemplate>
- <h2>Payment <Status /></h2>
- <div>{transaction.timestamp.t_ms === 'never' ? 'never': format(transaction.timestamp.t_ms, 'dd MMMM yyyy, HH:mm')}</div>
+ <h2>Payment </h2>
+ <div>{transaction.timestamp.t_ms === 'never' ? 'never' : format(transaction.timestamp.t_ms, 'dd MMMM yyyy, HH:mm')}</div>
<br />
<Part big title="Total paid" text={amountToString(transaction.amountEffective)} kind='negative' />
<Part big title="Purchase amount" text={amountToString(transaction.amountRaw)} kind='neutral' />
@@ -138,7 +131,7 @@ export function TransactionView({ transaction, onDelete, onRetry, onBack }: Wall
<div>
{transaction.info.products && transaction.info.products.length > 0 &&
<ListOfProducts>
- {transaction.info.products.map(p => <RowBorderGray>
+ {transaction.info.products.map((p, k) => <RowBorderGray key={k}>
<a href="#" onClick={showLargePic}>
<img src={p.image ? p.image : emptyImg} />
</a>
@@ -159,8 +152,8 @@ export function TransactionView({ transaction, onDelete, onRetry, onBack }: Wall
Amounts.parseOrThrow(transaction.amountEffective),
).amount
return <TransactionTemplate>
- <h2>Deposit <Status /></h2>
- <div>{transaction.timestamp.t_ms === 'never' ? 'never': format(transaction.timestamp.t_ms, 'dd MMMM yyyy, HH:mm')}</div>
+ <h2>Deposit </h2>
+ <div>{transaction.timestamp.t_ms === 'never' ? 'never' : format(transaction.timestamp.t_ms, 'dd MMMM yyyy, HH:mm')}</div>
<br />
<Part big title="Total deposit" text={amountToString(transaction.amountEffective)} kind='negative' />
<Part big title="Purchase amount" text={amountToString(transaction.amountRaw)} kind='neutral' />
@@ -174,8 +167,8 @@ export function TransactionView({ transaction, onDelete, onRetry, onBack }: Wall
Amounts.parseOrThrow(transaction.amountEffective),
).amount
return <TransactionTemplate>
- <h2>Refresh <Status /></h2>
- <div>{transaction.timestamp.t_ms === 'never' ? 'never': format(transaction.timestamp.t_ms, 'dd MMMM yyyy, HH:mm')}</div>
+ <h2>Refresh</h2>
+ <div>{transaction.timestamp.t_ms === 'never' ? 'never' : format(transaction.timestamp.t_ms, 'dd MMMM yyyy, HH:mm')}</div>
<br />
<Part big title="Total refresh" text={amountToString(transaction.amountEffective)} kind='negative' />
<Part big title="Refresh amount" text={amountToString(transaction.amountRaw)} kind='neutral' />
@@ -189,8 +182,8 @@ export function TransactionView({ transaction, onDelete, onRetry, onBack }: Wall
Amounts.parseOrThrow(transaction.amountEffective),
).amount
return <TransactionTemplate>
- <h2>Tip <Status /></h2>
- <div>{transaction.timestamp.t_ms === 'never' ? 'never': format(transaction.timestamp.t_ms, 'dd MMMM yyyy, HH:mm')}</div>
+ <h2>Tip</h2>
+ <div>{transaction.timestamp.t_ms === 'never' ? 'never' : format(transaction.timestamp.t_ms, 'dd MMMM yyyy, HH:mm')}</div>
<br />
<Part big title="Total tip" text={amountToString(transaction.amountEffective)} kind='positive' />
<Part big title="Received amount" text={amountToString(transaction.amountRaw)} kind='neutral' />
@@ -204,8 +197,8 @@ export function TransactionView({ transaction, onDelete, onRetry, onBack }: Wall
Amounts.parseOrThrow(transaction.amountEffective),
).amount
return <TransactionTemplate>
- <h2>Refund <Status /></h2>
- <div>{transaction.timestamp.t_ms === 'never' ? 'never': format(transaction.timestamp.t_ms, 'dd MMMM yyyy, HH:mm')}</div>
+ <h2>Refund</h2>
+ <div>{transaction.timestamp.t_ms === 'never' ? 'never' : format(transaction.timestamp.t_ms, 'dd MMMM yyyy, HH:mm')}</div>
<br />
<Part big title="Total refund" text={amountToString(transaction.amountEffective)} kind='positive' />
<Part big title="Refund amount" text={amountToString(transaction.amountRaw)} kind='neutral' />
@@ -220,7 +213,7 @@ export function TransactionView({ transaction, onDelete, onRetry, onBack }: Wall
<div>
{transaction.info.products && transaction.info.products.length > 0 &&
<ListOfProducts>
- {transaction.info.products.map(p => <RowBorderGray>
+ {transaction.info.products.map((p, k) => <RowBorderGray key={k}>
<a href="#" onClick={showLargePic}>
<img src={p.image ? p.image : emptyImg} />
</a>