diff options
Diffstat (limited to 'packages/taler-wallet-webextension/src/wallet/AddExchange/views.tsx')
-rw-r--r-- | packages/taler-wallet-webextension/src/wallet/AddExchange/views.tsx | 113 |
1 files changed, 76 insertions, 37 deletions
diff --git a/packages/taler-wallet-webextension/src/wallet/AddExchange/views.tsx b/packages/taler-wallet-webextension/src/wallet/AddExchange/views.tsx index 489d7eb3b..21309fd7b 100644 --- a/packages/taler-wallet-webextension/src/wallet/AddExchange/views.tsx +++ b/packages/taler-wallet-webextension/src/wallet/AddExchange/views.tsx @@ -17,13 +17,18 @@ import { useTranslationContext } from "@gnu-taler/web-util/browser"; import { Fragment, h, VNode } from "preact"; import { ErrorMessage } from "../../components/ErrorMessage.js"; -import { Input, LightText, SubTitle, Title, WarningBox } from "../../components/styled/index.js"; +import { + Input, + LightText, + SubTitle, + Title, + WarningBox, +} from "../../components/styled/index.js"; import { TermsOfService } from "../../components/TermsOfService/index.js"; import { Button } from "../../mui/Button.js"; import { State } from "./index.js"; import { assertUnreachable } from "@gnu-taler/taler-util"; - export function VerifyView({ expectedCurrency, onCancel, @@ -57,40 +62,71 @@ export function VerifyView({ {(() => { if (!result) return; if (result.type == "ok") { - return <LightText> - <i18n.Translate> - An exchange has been found! Review the information and click next - </i18n.Translate> - </LightText> + return ( + <LightText> + <i18n.Translate> + An exchange has been found! Review the information and click + next + </i18n.Translate> + </LightText> + ); } switch (result.case) { case "already-active": { - return <WarningBox> - <i18n.Translate>This exchange is already in your list.</i18n.Translate> - </WarningBox> + return ( + <WarningBox> + <i18n.Translate> + This exchange is already in your list. + </i18n.Translate> + </WarningBox> + ); } case "invalid-protocol": { - return <WarningBox> - <i18n.Translate>Only exchange accessible through "http" and "https" are allowed.</i18n.Translate> - </WarningBox> + return ( + <WarningBox> + <i18n.Translate> + Only exchange accessible through "http" and "https" are + allowed. + </i18n.Translate> + </WarningBox> + ); } case "invalid-version": { - return <WarningBox> - <i18n.Translate>This exchange protocol version is not supported: "{result.body}".</i18n.Translate> - </WarningBox> + return ( + <WarningBox> + <i18n.Translate> + This exchange protocol version is not supported: " + {result.body}". + </i18n.Translate> + </WarningBox> + ); } case "invalid-currency": { - return <WarningBox> - <i18n.Translate>This exchange currency "{result.body}" doesn't match the expected currency {expectedCurrency}.</i18n.Translate> - </WarningBox> + return ( + <WarningBox> + <i18n.Translate> + This exchange currency "{result.body}" doesn't match + the expected currency {expectedCurrency}. + </i18n.Translate> + </WarningBox> + ); + } + case "not-found": { + return ( + <WarningBox> + <i18n.Translate> + No exchange found in that URL. + </i18n.Translate> + </WarningBox> + ); } default: { - assertUnreachable(result.case) + assertUnreachable(result.case); } } })()} <p> - <Input invalid={result && result.type !== "ok"} > + <Input invalid={result && result.type !== "ok"}> <label>URL</label> <input type="text" @@ -98,7 +134,7 @@ export function VerifyView({ value={url.value} onInput={(e) => { if (url.onInput) { - url.onInput(e.currentTarget.value) + url.onInput(e.currentTarget.value); } }} /> @@ -138,10 +174,7 @@ export function VerifyView({ </Button> <Button variant="contained" - disabled={ - !result || - result.type !== "ok" - } + disabled={!result || result.type !== "ok"} onClick={onAccept} > <i18n.Translate>Next</i18n.Translate> @@ -149,14 +182,22 @@ export function VerifyView({ </footer> <section> <ul> - {knownExchanges.map(ex => { - return <li><a href="#" onClick={(e) => { - if (url.onInput) { - url.onInput(ex.href) - } - e.preventDefault() - }}> - {ex.href}</a></li> + {knownExchanges.map((ex) => { + return ( + <li key={ex.href}> + <a + href="#" + onClick={(e) => { + if (url.onInput) { + url.onInput(ex.href); + } + e.preventDefault(); + }} + > + {ex.href} + </a> + </li> + ); })} </ul> </section> @@ -164,7 +205,6 @@ export function VerifyView({ ); } - export function ConfirmView({ url, onCancel, @@ -186,8 +226,7 @@ export function ConfirmView({ </div> </section> - - <TermsOfService key="terms" exchangeUrl={url} > + <TermsOfService key="terms" exchangeUrl={url}> <footer> <Button key="cancel" |