[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]
[taler-wallet-core] 02/02: validate iban
|
From: |
gnunet |
|
Subject: |
[taler-wallet-core] 02/02: validate iban |
|
Date: |
Fri, 07 Apr 2023 22:31:11 +0200 |
This is an automated email from the git hooks/post-receive script.
sebasjm pushed a commit to branch master
in repository wallet-core.
commit 958747bd08172ce00bc84ea3c543eac414a1d39b
Author: Sebastian <sebasjm@gmail.com>
AuthorDate: Fri Apr 7 17:31:01 2023 -0300
validate iban
---
.../src/wallet/ManageAccount/state.ts | 19 ++---
.../src/wallet/ManageAccount/stories.tsx | 15 ++--
.../src/wallet/ManageAccount/views.tsx | 99 ++++++++++++----------
.../src/wallet/Transaction.stories.tsx | 4 -
4 files changed, 69 insertions(+), 68 deletions(-)
diff --git
a/packages/taler-wallet-webextension/src/wallet/ManageAccount/state.ts
b/packages/taler-wallet-webextension/src/wallet/ManageAccount/state.ts
index d8bc7d980..d7c7d2b48 100644
--- a/packages/taler-wallet-webextension/src/wallet/ManageAccount/state.ts
+++ b/packages/taler-wallet-webextension/src/wallet/ManageAccount/state.ts
@@ -40,10 +40,18 @@ export function useComponentState({
api.wallet.call(WalletApiOperation.ListKnownBankAccounts, { currency }),
);
const { devMode } = useDevContext();
+ const accountType: Record<string, string> = {
+ iban: "IBAN",
+ // "x-taler-bank": "Taler Bank",
+ };
+ if (devMode) {
+ accountType["bitcoin"] = "Bitcoin";
+ accountType["x-taler-bank"] = "Taler Bank";
+ }
const [payto, setPayto] = useState("");
const [alias, setAlias] = useState("");
- const [type, setType] = useState("");
+ const [type, setType] = useState("iban");
if (!hook) {
return {
@@ -58,15 +66,6 @@ export function useComponentState({
};
}
- const accountType: Record<string, string> = {
- "": "Choose one account type",
- iban: "IBAN",
- // "x-taler-bank": "Taler Bank",
- };
- if (devMode) {
- accountType["bitcoin"] = "Bitcoin";
- accountType["x-taler-bank"] = "Taler Bank";
- }
const uri = parsePaytoUri(payto);
const found =
hook.response.accounts.findIndex(
diff --git
a/packages/taler-wallet-webextension/src/wallet/ManageAccount/stories.tsx
b/packages/taler-wallet-webextension/src/wallet/ManageAccount/stories.tsx
index e20d4e0e8..81c1fcf5a 100644
--- a/packages/taler-wallet-webextension/src/wallet/ManageAccount/stories.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/ManageAccount/stories.tsx
@@ -32,12 +32,11 @@ export const JustTwoBitcoinAccounts =
tests.createExample(ReadyView, {
currency: "ARS",
accountType: {
list: {
- "": "Choose one account type",
iban: "IBAN",
- // bitcoin: "Bitcoin",
- // "x-taler-bank": "Taler Bank",
+ bitcoin: "Bitcoin",
+ "x-taler-bank": "Taler Bank",
},
- value: "",
+ value: "bitcoin",
},
alias: {
value: "",
@@ -86,12 +85,11 @@ export const WithAllTypeOfAccounts =
tests.createExample(ReadyView, {
currency: "ARS",
accountType: {
list: {
- "": "Choose one account type",
iban: "IBAN",
- // bitcoin: "Bitcoin",
- // "x-taler-bank": "Taler Bank",
+ bitcoin: "Bitcoin",
+ "x-taler-bank": "Taler Bank",
},
- value: "",
+ value: "x-taler-bank",
},
alias: {
value: "",
@@ -167,7 +165,6 @@ export const AddingIbanAccount =
tests.createExample(ReadyView, {
currency: "ARS",
accountType: {
list: {
- "": "Choose one account type",
iban: "IBAN",
// bitcoin: "Bitcoin",
// "x-taler-bank": "Taler Bank",
diff --git
a/packages/taler-wallet-webextension/src/wallet/ManageAccount/views.tsx
b/packages/taler-wallet-webextension/src/wallet/ManageAccount/views.tsx
index 75e1feca4..fb32e5a59 100644
--- a/packages/taler-wallet-webextension/src/wallet/ManageAccount/views.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/ManageAccount/views.tsx
@@ -21,18 +21,14 @@ import {
PaytoUriIBAN,
PaytoUriTalerBank,
stringifyPaytoUri,
+ validateIban,
} from "@gnu-taler/taler-util";
import { styled } from "@linaria/react";
import { Fragment, h, VNode } from "preact";
import { useState } from "preact/hooks";
import { ErrorMessage } from "../../components/ErrorMessage.js";
import { SelectList } from "../../components/SelectList.js";
-import {
- Input,
- SubTitle,
- SvgIcon,
- WarningText,
-} from "../../components/styled/index.js";
+import { Input, SubTitle, SvgIcon } from "../../components/styled/index.js";
import { useTranslationContext } from "../../context/translation.js";
import { Button } from "../../mui/Button.js";
import { TextFieldHandler } from "../../mui/handlers.js";
@@ -111,38 +107,47 @@ export function ReadyView({
description={error}
/>
)}
- <p>
- <Input>
- <SelectList
- label={i18n.str`Select account type`}
- list={accountType.list}
- name="accountType"
- value={accountType.value}
- onChange={accountType.onChange}
+ <div style={{ width: "100%", display: "flex" }}>
+ {Object.entries(accountType.list).map(([key, name], idx) => (
+ <div
+ style={{
+ marginLeft: 8,
+ padding: 8,
+ borderTopLeftRadius: 5,
+ borderTopRightRadius: 5,
+ backgroundColor:
+ accountType.value === key ? "#0042b2" : "unset",
+ color: accountType.value === key ? "white" : "unset",
+ }}
+ onClick={(e) => {
+ if (accountType.onChange) {
+ accountType.onChange(key);
+ }
+ }}
+ >
+ {name}
+ </div>
+ ))}
+ </div>
+ <div style={{ border: "1px solid gray", padding: 8, borderRadius: 5 }}>
+ <p>
+ <CustomFieldByAccountType
+ type={accountType.value as AccountType}
+ field={uri}
/>
- </Input>
+ </p>
+ </div>
+ <p>
+ <TextField
+ label="Alias"
+ variant="filled"
+ placeholder="Easy to remember description"
+ fullWidth
+ disabled={accountType.value === ""}
+ value={alias.value}
+ onChange={alias.onInput}
+ />
</p>
- {accountType.value === "" ? undefined : (
- <Fragment>
- <p>
- <CustomFieldByAccountType
- type={accountType.value as AccountType}
- field={uri}
- />
- </p>
- <p>
- <TextField
- label="Alias"
- variant="filled"
- placeholder="Easy to remember description"
- fullWidth
- disabled={accountType.value === ""}
- value={alias.value}
- onChange={alias.onInput}
- />
- </p>
- </Fragment>
- )}
</section>
<section>
<Button
@@ -403,6 +408,9 @@ function BitcoinAddressAccount({ field }: { field:
TextFieldHandler }): VNode {
});
return (
<Fragment>
+ <h3>
+ <i18n.Translate>Bitcoin Account</i18n.Translate>
+ </h3>
<TextField
label="Bitcoin address"
variant="standard"
@@ -442,6 +450,9 @@ function TalerBankAddressAccount({
});
return (
<Fragment>
+ <h3>
+ <i18n.Translate>Taler Bank</i18n.Translate>
+ </h3>
<TextField
label="Bank host"
variant="standard"
@@ -493,7 +504,7 @@ function IbanAddressAccount({ field }: { field:
TextFieldHandler }): VNode {
: undefined,
iban: !iban
? i18n.str`Can't be empty`
- : !ibanRegex.test(iban)
+ : validateIban(iban).type === "invalid"
? i18n.str`Invalid iban`
: undefined,
name: !name ? i18n.str`Can't be empty` : undefined,
@@ -512,7 +523,10 @@ function IbanAddressAccount({ field }: { field:
TextFieldHandler }): VNode {
}
return (
<Fragment>
- <p>
+ <h3>
+ <i18n.Translate>International Bank Account Number</i18n.Translate>
+ </h3>
+ {/* <p>
<TextField
label="BIC"
variant="filled"
@@ -526,7 +540,7 @@ function IbanAddressAccount({ field }: { field:
TextFieldHandler }): VNode {
sendUpdateIfNoErrors(v, iban || "", name || "");
}}
/>
- </p>
+ </p> */}
<p>
<TextField
label="IBAN"
@@ -545,7 +559,7 @@ function IbanAddressAccount({ field }: { field:
TextFieldHandler }): VNode {
</p>
<p>
<TextField
- label="Receiver name"
+ label="Account name"
variant="filled"
placeholder="Name of the target bank account owner"
fullWidth
@@ -576,11 +590,6 @@ function CustomFieldByAccountType({
return (
<div>
- <WarningText>
- <i18n.Translate>
- We can not validate the account so make sure the value is correct.
- </i18n.Translate>
- </WarningText>
<AccountForm field={field} />
</div>
);
diff --git
a/packages/taler-wallet-webextension/src/wallet/Transaction.stories.tsx
b/packages/taler-wallet-webextension/src/wallet/Transaction.stories.tsx
index bf59573ec..5e0b0cbee 100644
--- a/packages/taler-wallet-webextension/src/wallet/Transaction.stories.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/Transaction.stories.tsx
@@ -42,10 +42,6 @@ import {
WithdrawalDetails,
WithdrawalType,
} from "@gnu-taler/taler-util";
-// import {
-// createExample,
-// createExampleWithCustomContext as createExampleInCustomContext,
-// } from "../test-utils.js";
import { tests } from "@gnu-taler/web-util/lib/index.browser";
import beer from "../../static-dev/beer.png";
import { TransactionView as TestedComponent } from "./Transaction.js";
--
To stop receiving notification emails like this one, please contact
gnunet@gnunet.org.