[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]
[taler-wallet-core] 02/02: fix: username regex and error message word-br
|
From: |
gnunet |
|
Subject: |
[taler-wallet-core] 02/02: fix: username regex and error message word-break |
|
Date: |
Wed, 07 Dec 2022 22:46:42 +0100 |
This is an automated email from the git hooks/post-receive script.
sebasjm pushed a commit to branch master
in repository wallet-core.
commit c54476c40e76645b5ffb507558d6a83f0e697dc7
Author: Sebastian <sebasjm@gmail.com>
AuthorDate: Wed Dec 7 18:46:30 2022 -0300
fix: username regex and error message word-break
---
.../src/pages/home/PaytoWireTransferForm.tsx | 50 +++++++++++-----------
.../src/pages/home/RegistrationPage.tsx | 14 +++++-
.../src/pages/home/WalletWithdrawForm.tsx | 48 +++++++++++----------
packages/demobank-ui/src/scss/bank.scss | 8 ++--
4 files changed, 67 insertions(+), 53 deletions(-)
diff --git a/packages/demobank-ui/src/pages/home/PaytoWireTransferForm.tsx
b/packages/demobank-ui/src/pages/home/PaytoWireTransferForm.tsx
index bfb2f2fef..6abcebcd8 100644
--- a/packages/demobank-ui/src/pages/home/PaytoWireTransferForm.tsx
+++ b/packages/demobank-ui/src/pages/home/PaytoWireTransferForm.tsx
@@ -118,30 +118,32 @@ export function PaytoWireTransferForm({
/>
<br />
<label for="amount">{i18n.str`Amount:`}</label>
- <input
- type="text"
- readonly
- class="currency-indicator"
- size={currency?.length}
- maxLength={currency?.length}
- tabIndex={-1}
- value={currency}
- />
-
- <input
- type="number"
- name="amount"
- id="amount"
- placeholder="amount"
- required
- value={submitData?.amount ?? ""}
- onInput={(e): void => {
- submitDataSetter((submitData) => ({
- ...submitData,
- amount: e.currentTarget.value,
- }));
- }}
- />
+ <div style={{ width: "max-content" }}>
+ <input
+ type="text"
+ readonly
+ class="currency-indicator"
+ size={currency?.length}
+ maxLength={currency?.length}
+ tabIndex={-1}
+ value={currency}
+ />
+
+ <input
+ type="number"
+ name="amount"
+ id="amount"
+ placeholder="amount"
+ required
+ value={submitData?.amount ?? ""}
+ onInput={(e): void => {
+ submitDataSetter((submitData) => ({
+ ...submitData,
+ amount: e.currentTarget.value,
+ }));
+ }}
+ />
+ </div>
<ShowInputErrorLabel
message={errorsWire?.amount}
isDirty={submitData?.amount !== undefined}
diff --git a/packages/demobank-ui/src/pages/home/RegistrationPage.tsx
b/packages/demobank-ui/src/pages/home/RegistrationPage.tsx
index c91eef7a0..ecec5793c 100644
--- a/packages/demobank-ui/src/pages/home/RegistrationPage.tsx
+++ b/packages/demobank-ui/src/pages/home/RegistrationPage.tsx
@@ -44,6 +44,8 @@ export function RegistrationPage(): VNode {
);
}
+const usernameRegex = /^[a-z][a-zA-Z0-9]+$/;
+
/**
* Collect and submit registration data.
*/
@@ -57,8 +59,16 @@ function RegistrationForm(): VNode {
const { i18n } = useTranslationContext();
const errors = undefinedIfEmpty({
- username: !username ? i18n.str`Missing username` : undefined,
- password: !password ? i18n.str`Missing password` : undefined,
+ username: !username
+ ? i18n.str`Missing username`
+ : !usernameRegex.test(username)
+ ? i18n.str`Use only letter and numbers starting with a lower case letter`
+ : undefined,
+ password: !password
+ ? i18n.str`Missing password`
+ : !usernameRegex.test(password)
+ ? i18n.str`Use only letter and numbers starting with a lower case letter`
+ : undefined,
repeatPassword: !repeatPassword
? i18n.str`Missing password`
: repeatPassword !== password
diff --git a/packages/demobank-ui/src/pages/home/WalletWithdrawForm.tsx
b/packages/demobank-ui/src/pages/home/WalletWithdrawForm.tsx
index 29fc1eb6a..bc3880ee2 100644
--- a/packages/demobank-ui/src/pages/home/WalletWithdrawForm.tsx
+++ b/packages/demobank-ui/src/pages/home/WalletWithdrawForm.tsx
@@ -46,29 +46,31 @@ export function WalletWithdrawForm({
<p>
<label for="withdraw-amount">{i18n.str`Amount to withdraw:`}</label>
- <input
- type="text"
- readonly
- class="currency-indicator"
- size={currency?.length ?? 5}
- maxLength={currency?.length}
- tabIndex={-1}
- value={currency}
- />
-
- <input
- type="number"
- ref={ref}
- id="withdraw-amount"
- name="withdraw-amount"
- value={submitAmount}
- onChange={(e): void => {
- // FIXME: validate using 'parseAmount()',
- // deactivate submit button as long as
- // amount is not valid
- submitAmount = e.currentTarget.value;
- }}
- />
+ <div style={{ width: "max-content" }}>
+ <input
+ type="text"
+ readonly
+ class="currency-indicator"
+ size={currency?.length ?? 5}
+ maxLength={currency?.length}
+ tabIndex={-1}
+ value={currency}
+ />
+
+ <input
+ type="number"
+ ref={ref}
+ id="withdraw-amount"
+ name="withdraw-amount"
+ value={submitAmount}
+ onChange={(e): void => {
+ // FIXME: validate using 'parseAmount()',
+ // deactivate submit button as long as
+ // amount is not valid
+ submitAmount = e.currentTarget.value;
+ }}
+ />
+ </div>
</p>
<p>
<div>
diff --git a/packages/demobank-ui/src/scss/bank.scss
b/packages/demobank-ui/src/scss/bank.scss
index dba2ee3d3..e8a4d664c 100644
--- a/packages/demobank-ui/src/scss/bank.scss
+++ b/packages/demobank-ui/src/scss/bank.scss
@@ -88,7 +88,7 @@ input[type="number"]::-webkit-inner-spin-button {
display: none;
padding: 8px 16px;
border: 2px solid #c1c1c1;
- width: max-content;
+ width: min-content;
}
.tabcontent.active {
@@ -168,7 +168,7 @@ input {
margin-right: auto;
padding: 16px 16px;
border-radius: 8px;
- width: max-content;
+ width: min-content;
.formFieldLabel {
margin: 2px 2px;
}
@@ -210,7 +210,7 @@ input {
margin-right: auto;
padding: 16px 16px;
border-radius: 8px;
- width: max-content;
+ width: min-content;
.formFieldLabel {
margin: 2px 2px;
}
@@ -244,7 +244,7 @@ input {
margin-right: auto;
padding: 16px 16px;
border-radius: 8px;
- width: max-content;
+ width: min-content;
.formFieldLabel {
margin: 2px 2px;
}
--
To stop receiving notification emails like this one, please contact
gnunet@gnunet.org.