Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(company data): improved white space handling and update identifier error messages #210

Merged
merged 2 commits into from
Jul 12, 2024
Merged

feat(company data): improved white space handling and update identifier error messages #210

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
a34fb0b
feat(company data): improved white space handling for company data
typecastcloud Jul 9, 2024
dbe7b4c
Update error messages for identifiers.
typecastcloud Jul 11, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
63 changes: 45 additions & 18 deletions src/components/cax-companyData.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -206,7 +206,7 @@ export const CompanyDataCax = () => {
}

const onSearchChange = (expr: string) => {
if (isBPN(expr)) {
if (isBPN(expr?.trim())) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

if we follow the discussed convention to always trim any input value I think it's better to do the trim inside the isBPN (and all other similar) functions so the code here would be better readable.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would be unexpected behavior for isXYZ functions imho. You check a value against REGEX. Trimming here is only valid because we take care of white spaces somewhere else.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

okay - there are different ways to solve that. Anyway the trim has to go somewhere. Thinking about different input fields the question becomes more generic and tricky anyway: for example let's consider spaces inside some values like IBAN or phone numbers and how the system should deal with those. From a user perspective i guess it is less annoying if the system automatically parses and reformats values instead of showing an error like when pasting IBANs, phone numbers, etc. which are common to be written with spaces.

fetchData(expr)
// make sure to catch any error
.catch((errorCode: number) => {
Expand All @@ -222,7 +222,7 @@ export const CompanyDataCax = () => {
const validateLegalEntity = (value: string) => {
setLegalEntity(value)

if (!Patterns.legalEntityPattern.test(value)) {
if (!Patterns.legalEntityPattern.test(value?.trim())) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

personally I'd prefer to replace all the Patterns.xyz.test(value) with isXYZ - here isLegalEntity just like isBPN above. Makes the code more readable.

setErrors((prevState) => ({
...prevState,
legalEntity: 'legalEntityError',
Expand All @@ -236,7 +236,7 @@ export const CompanyDataCax = () => {
const validateRegisteredName = (value: string) => {
setRegisteredName(value)

if (!Patterns.registeredNamePattern.test(value)) {
if (!Patterns.registeredNamePattern.test(value?.trim())) {
setErrors((prevState) => ({
...prevState,
registeredName: 'registerdNameError',
Expand All @@ -250,7 +250,7 @@ export const CompanyDataCax = () => {
const validateStreetHouseNumber = (value: string) => {
setStreetHouseNumber(value)

if (!isStreet(value)) {
if (!isStreet(value?.trim())) {
setErrors((prevState) => ({
...prevState,
streetHouseNumber: 'streetHouseNumberError',
Expand All @@ -269,7 +269,7 @@ export const CompanyDataCax = () => {
return
}

if (!Patterns.postalCodePattern.test(value)) {
if (!Patterns.postalCodePattern.test(value?.trim())) {
setErrors((prevState) => ({
...prevState,
postalCode: 'postalCodeError',
Expand All @@ -283,7 +283,7 @@ export const CompanyDataCax = () => {
const validateCity = (value: string) => {
setCity(value)

if (!isCity(value)) {
if (!isCity(value?.trim())) {
setErrors((prevState) => ({
...prevState,
city: 'cityError',
Expand All @@ -297,7 +297,7 @@ export const CompanyDataCax = () => {
const validateCountry = (value: string) => {
setChangedCountryValue(true)
setCountry(value?.toUpperCase())
if (!Patterns.countryPattern.test(value)) {
if (!Patterns.countryPattern.test(value?.trim())) {
setShowIdentifiers(false)
setErrors((prevState) => ({
...prevState,
Expand All @@ -318,7 +318,7 @@ export const CompanyDataCax = () => {
setErrors((prevState) => ({ ...prevState, region: '' }))
}

if (value && !Patterns.regionPattern.test(value)) {
if (value && !Patterns.regionPattern.test(value?.trim())) {
setErrors((prevState) => ({
...prevState,
region: 'regionError',
Expand All @@ -341,7 +341,7 @@ export const CompanyDataCax = () => {
: 'Worldwide'
if (
identifierType &&
!Patterns[countryCode][identifierType].test(value)
!Patterns[countryCode][identifierType].test(value?.trim())
) {
setErrors((prevState) => ({
...prevState,
Expand All @@ -367,18 +367,18 @@ export const CompanyDataCax = () => {

const nextClick = () => {
const companyData = { ...companyDetails }
companyData.bpn = bpn
companyData.name = legalEntity
companyData.shortName = registeredName
companyData.streetName = streetHouseNumber
companyData.region = region
companyData.city = city
companyData.zipCode = postalCode
companyData.countryAlpha2Code = country
companyData.bpn = bpn?.trim()
companyData.name = legalEntity?.trim()
companyData.shortName = registeredName?.trim()
companyData.streetName = streetHouseNumber?.trim()
companyData.region = region?.trim()
companyData.city = city?.trim()
companyData.zipCode = postalCode?.trim()
companyData.countryAlpha2Code = country?.trim()
companyData.uniqueIds = [
{
type: identifierType,
value: identifierNumber,
value: identifierNumber?.trim(),
},
]
//addCompanyData(companyData)
Expand Down Expand Up @@ -420,6 +420,9 @@ export const CompanyDataCax = () => {
onChange={(expr) => {
onSearchChange(expr)
}}
onBlur={(e) => {
setBpn(e.target.value.trim())
}}
/>
<label className="error-message">{bpnErrorMsg}</label>
</div>
Expand Down Expand Up @@ -469,6 +472,9 @@ export const CompanyDataCax = () => {
onChange={(e) => {
validateLegalEntity(e.target.value)
}}
onBlur={(e) => {
setLegalEntity(e.target.value.trim())
}}
/>
{errors.legalEntity && (
<label>{t(`registrationStepOne.${errors.legalEntity}`)}</label>
Expand All @@ -489,6 +495,9 @@ export const CompanyDataCax = () => {
onChange={(e) => {
validateRegisteredName(e.target.value)
}}
onBlur={(e) => {
setRegisteredName(e.target.value.trim())
}}
/>
{errors.registeredName && (
<label>
Expand Down Expand Up @@ -516,6 +525,9 @@ export const CompanyDataCax = () => {
onChange={(e) => {
validateStreetHouseNumber(e.target.value)
}}
onBlur={(e) => {
setStreetHouseNumber(e.target.value.trim())
}}
/>
{errors.streetHouseNumber && (
<label>
Expand All @@ -534,6 +546,9 @@ export const CompanyDataCax = () => {
onChange={(e) => {
validatePostalCode(e.target.value)
}}
onBlur={(e) => {
setPostalCode(e.target.value.trim())
}}
/>
{errors.postalCode && (
<label>{t(`registrationStepOne.${errors.postalCode}`)}</label>
Expand All @@ -551,6 +566,9 @@ export const CompanyDataCax = () => {
onChange={(e) => {
validateCity(e.target.value)
}}
onBlur={(e) => {
setCity(e.target.value.trim())
}}
/>
{errors.city && (
<label>{t(`registrationStepOne.${errors.city}`)}</label>
Expand Down Expand Up @@ -595,6 +613,9 @@ export const CompanyDataCax = () => {
onChange={(e) => {
validateRegion(e.target.value)
}}
onBlur={(e) => {
setRegion(e.target.value.trim())
}}
/>
{errors.region && (
<label>{t(`registrationStepOne.${errors.region}`)}</label>
Expand Down Expand Up @@ -624,6 +645,9 @@ export const CompanyDataCax = () => {
onChange={() => {
handleIdentifierSelect(id.type, id.value)
}}
onBlur={(e) => {
setIdentifierNumber(e.target.value.trim())
}}
defaultChecked={uniqueIds[0].type === id.type}
/>
<label>
Expand Down Expand Up @@ -685,6 +709,9 @@ export const CompanyDataCax = () => {
onChange={(e) => {
validateIdentifierNumber(e.target.value)
}}
onBlur={(e) => {
setIdentifierNumber(e.target.value.trim())
}}
/>
{errors.identifierNumber && (
<label>
Expand Down
12 changes: 6 additions & 6 deletions src/locales/de/translations.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,22 +73,22 @@
"identifierError": "No identifier found",
"identifierhelperText": "We have retrieved two registered identifiers. Please select the preferred identifier for your company registration.",
"pleaseSelect": "Please select",
"IN_COMMERCIAL_REG_NUMBER": "Please enter a valid number. Hint: Alphanumeric with hyphen with 6 to 21 digits.",
"IN_VAT_ID": "Please enter a valid number. Hint: Alphanumeric with hyphen with 5 to 6 digits.",
"IN_COMMERCIAL_REG_NUMBER": "Please enter a valid number. Hint: Alphanumeric with hyphen with 4 to 21 digits.",
"IN_VAT_ID": "Please enter a valid number. Hint: Alphanumeric with hyphen with 5 to 15 digits.",
"IN_LEI_CODE": "Please enter a valid number. Hint: Alphanumeric with exact 20 digits.",
"DE_COMMERCIAL_REG_NUMBER": "Please enter a valid number. Hint: Alphanumeric with hyphen and space with exact 9 digits.",
"DE_VAT_ID": "Please enter a valid number. Hint: Starting with DE and followed by 9 digit numbers",
"DE_LEI_CODE": "Please enter a valid number. Hint: Alphanumeric with exact 20 digits.",
"FR_COMMERCIAL_REG_NUMBER": "Please enter a valid number. Hint: Alphanumeric with space with 14 to 17 digits.",
"FR_VAT_ID": "Please enter a valid number. Hint: Alphanumeric with hyphen and space with 8 to 15 digits.",
"FR_LEI_CODE": "Please enter a valid number. Hint: Alphanumeric with exact 20 digits.",
"MX_COMMERCIAL_REG_NUMBER": "Please enter a valid number. Hint: Alphanumeric with hyphen with 6 to 21 digits.",
"MX_COMMERCIAL_REG_NUMBER": "Please enter a valid number. Hint: Alphanumeric with hyphen with 4 to 21 digits.",
"MX_VAT_ID": "Please enter a valid number. Hint: Alphanumeric with hyphen and & with 12 to 13 digits.",
"MX_LEI_CODE": "Please enter a valid number. Hint: Alphanumeric with exact 20 digits.",
"Worldwide_COMMERCIAL_REG_NUMBER": "Please enter a valid number. Hint: Alphanumeric with hyphen with 6 to 21 digits.",
"Worldwide_VAT_ID": "Please enter a valid number. Hint: Alphanumeric with hyphen and space with 8 to 15 digits.",
"Worldwide_COMMERCIAL_REG_NUMBER": "Please enter a valid number. Hint: Alphanumeric with hyphen with 4 to 21 digits.",
"Worldwide_VAT_ID": "Please enter a valid number. Hint: Alphanumeric with hyphen and space with 5 to 18 digits.",
"Worldwide_LEI_CODE": "Please enter a valid number. Hint: Alphanumeric with exact 20 digits.",
"Worldwide_EORI": "Please enter a valid number. Hint: Alphanumeric with space with exact 18 digits.",
"Worldwide_EORI": "Please enter a valid number. Hint: Starting with country code and followed by up to 15 alphanumeric characters.",
"submitError": "Something went wrong. Your entered data could not get saved. Please try again later or contact the administrator."
},
"finish": {
Expand Down
12 changes: 6 additions & 6 deletions src/locales/en/translations.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,22 +73,22 @@
"identifierError": "No identifier found",
"identifierhelperText": "We have retrieved two registered identifiers. Please select the preferred identifier for your company registration.",
"pleaseSelect": "Please select",
"IN_COMMERCIAL_REG_NUMBER": "Please enter a valid number. Hint: Alphanumeric with hyphen with 6 to 21 digits.",
"IN_VAT_ID": "Please enter a valid number. Hint: Alphanumeric with hyphen with 5 to 6 digits.",
"IN_COMMERCIAL_REG_NUMBER": "Please enter a valid number. Hint: Alphanumeric with hyphen with 4 to 21 digits.",
"IN_VAT_ID": "Please enter a valid number. Hint: Alphanumeric with hyphen with 5 to 15 digits.",
"IN_LEI_CODE": "Please enter a valid number. Hint: Alphanumeric with exact 20 digits.",
"DE_COMMERCIAL_REG_NUMBER": "Please enter a valid number. Hint: Alphanumeric with hyphen and space with exact 9 digits.",
"DE_VAT_ID": "Please enter a valid number. Hint: Starting with DE and followed by 9 digit numbers",
"DE_LEI_CODE": "Please enter a valid number. Hint: Alphanumeric with exact 20 digits.",
"FR_COMMERCIAL_REG_NUMBER": "Please enter a valid number. Hint: Alphanumeric with space with 14 to 17 digits.",
"FR_VAT_ID": "Please enter a valid number. Hint: Alphanumeric with hyphen and space with 8 to 15 digits.",
"FR_LEI_CODE": "Please enter a valid number. Hint: Alphanumeric with exact 20 digits.",
"MX_COMMERCIAL_REG_NUMBER": "Please enter a valid number. Hint: Alphanumeric with hyphen with 6 to 21 digits.",
"MX_COMMERCIAL_REG_NUMBER": "Please enter a valid number. Hint: Alphanumeric with hyphen with 4 to 21 digits.",
"MX_VAT_ID": "Please enter a valid number. Hint: Alphanumeric with hyphen and & with 12 to 13 digits.",
"MX_LEI_CODE": "Please enter a valid number. Hint: Alphanumeric with exact 20 digits.",
"Worldwide_COMMERCIAL_REG_NUMBER": "Please enter a valid number. Hint: Alphanumeric with hyphen with 6 to 21 digits.",
"Worldwide_VAT_ID": "Please enter a valid number. Hint: Alphanumeric with hyphen and space with 8 to 15 digits.",
"Worldwide_COMMERCIAL_REG_NUMBER": "Please enter a valid number. Hint: Alphanumeric with hyphen with 4 to 21 digits.",
"Worldwide_VAT_ID": "Please enter a valid number. Hint: Alphanumeric with hyphen and space with 5 to 18 digits.",
"Worldwide_LEI_CODE": "Please enter a valid number. Hint: Alphanumeric with exact 20 digits.",
"Worldwide_EORI": "Please enter a valid number. Hint: Alphanumeric with space with exact 18 digits.",
"Worldwide_EORI": "Please enter a valid number. Hint: Starting with country code and followed by up to 15 alphanumeric characters.",
"submitError": "Something went wrong. Your entered data could not get saved. Please try again later or contact the administrator."
},
"finish": {
Expand Down