diff options
Diffstat (limited to 'packages/taler-wallet-webextension')
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> |