diff --git a/src/Components/AddressPaymentInput.res b/src/Components/AddressPaymentInput.res
index 75b5af853..5b9dc389a 100644
--- a/src/Components/AddressPaymentInput.res
+++ b/src/Components/AddressPaymentInput.res
@@ -32,30 +32,6 @@ let showField = (val: PaymentType.addressType, type_: addressType) => {
}
}
-let checkPostalValidity = (
- postal: RecoilAtomTypes.field,
- setPostal: (
- . OrcaPaymentPage.RecoilAtomTypes.field => OrcaPaymentPage.RecoilAtomTypes.field,
- ) => unit,
- regex,
-) => {
- if Js.Re.test_(regex->Js.Re.fromString, postal.value) && postal.value !== "" && regex !== "" {
- setPostal(.prev => {
- ...prev,
- isValid: Some(true),
- errorString: "",
- })
- } else if (
- regex !== "" && !Js.Re.test_(regex->Js.Re.fromString, postal.value) && postal.value !== ""
- ) {
- setPostal(.prev => {
- ...prev,
- isValid: Some(false),
- errorString: "Invalid postal code",
- })
- }
-}
-
@react.component
let make = (~paymentType, ~className="") => {
let {localeString, themeObj} = Recoil.useRecoilValueFromAtom(configAtom)
@@ -89,6 +65,30 @@ let make = (~paymentType, ~className="") => {
let countryNames = getCountryNames(Country.country)
+ let checkPostalValidity = (
+ postal: RecoilAtomTypes.field,
+ setPostal: (
+ . OrcaPaymentPage.RecoilAtomTypes.field => OrcaPaymentPage.RecoilAtomTypes.field,
+ ) => unit,
+ regex,
+ ) => {
+ if Js.Re.test_(regex->Js.Re.fromString, postal.value) && postal.value !== "" && regex !== "" {
+ setPostal(.prev => {
+ ...prev,
+ isValid: Some(true),
+ errorString: "",
+ })
+ } else if (
+ regex !== "" && !Js.Re.test_(regex->Js.Re.fromString, postal.value) && postal.value !== ""
+ ) {
+ setPostal(.prev => {
+ ...prev,
+ isValid: Some(false),
+ errorString: localeString.postalCodeInvalidText,
+ })
+ }
+ }
+
React.useEffect0(() => {
open Promise
// Dynamically import/download Postal codes and states JSON
@@ -147,7 +147,7 @@ let make = (~paymentType, ~className="") => {
setPostalCode(.prev => {
...prev,
isValid: Some(false),
- errorString: "Invalid postal code",
+ errorString: localeString.postalCodeInvalidText,
})
}
}
@@ -173,31 +173,31 @@ let make = (~paymentType, ~className="") => {
if line1.value == "" {
setLine1(.prev => {
...prev,
- errorString: "Address line 1 cannot be empty",
+ errorString: localeString.line1EmptyText,
})
}
if line2.value == "" {
setLine2(.prev => {
...prev,
- errorString: "Address line 2 cannot be empty",
+ errorString: localeString.line2EmptyText,
})
}
if state.value == "" {
setState(.prev => {
...prev,
- errorString: "State cannot be empty",
+ errorString: localeString.stateEmptyText,
})
}
if postalCode.value == "" {
setPostalCode(.prev => {
...prev,
- errorString: "Postal code cannot be empty",
+ errorString: localeString.postalCodeEmptyText,
})
}
if city.value == "" {
setCity(.prev => {
...prev,
- errorString: "City cannot be empty",
+ errorString: localeString.cityEmptyText,
})
}
}
diff --git a/src/Components/BillingNamePaymentInput.res b/src/Components/BillingNamePaymentInput.res
index 947583a45..a9cb52a33 100644
--- a/src/Components/BillingNamePaymentInput.res
+++ b/src/Components/BillingNamePaymentInput.res
@@ -44,7 +44,7 @@ let make = (~paymentType, ~customFieldName=None, ~optionalRequiredFields=None, (
if billingName.value == "" {
setBillingName(.prev => {
...prev,
- errorString: `Please provide your ${fieldName}`,
+ errorString: fieldName->localeString.nameEmptyText,
})
} else {
switch optionalRequiredFields {
@@ -52,7 +52,7 @@ let make = (~paymentType, ~customFieldName=None, ~optionalRequiredFields=None, (
if !DynamicFieldsUtils.checkIfNameIsValid(requiredFields, BillingName, billingName) {
setBillingName(.prev => {
...prev,
- errorString: `Please provide your complete ${fieldName}`,
+ errorString: fieldName->localeString.completeNameEmptyText,
})
}
| None => ()
diff --git a/src/Components/DynamicFields.res b/src/Components/DynamicFields.res
index f089665ba..571e2dfb3 100644
--- a/src/Components/DynamicFields.res
+++ b/src/Components/DynamicFields.res
@@ -446,7 +446,7 @@ let make = (
~margin=`10px 0`,
(),
)}>
- {React.string("Billing Details")}
+ {React.string(localeString.billingDetailsText)}
{dynamicFieldsToRenderInsideBilling
->Js.Array2.mapi((item, index) => {
diff --git a/src/Components/EmailPaymentInput.res b/src/Components/EmailPaymentInput.res
index 44de30af0..a207be735 100644
--- a/src/Components/EmailPaymentInput.res
+++ b/src/Components/EmailPaymentInput.res
@@ -35,7 +35,7 @@ let make = (~paymentType) => {
setEmail(.prev => {
...prev,
errorString: switch prev.isValid {
- | Some(val) => val ? "" : "Invalid email address"
+ | Some(val) => val ? "" : localeString.emailInvalidText
| None => ""
},
})
@@ -49,7 +49,7 @@ let make = (~paymentType) => {
if email.value == "" {
setEmail(.prev => {
...prev,
- errorString: "Email cannot be empty",
+ errorString: localeString.emailEmptyText,
})
}
}
diff --git a/src/Components/FullNamePaymentInput.res b/src/Components/FullNamePaymentInput.res
index 2a277a617..adea5cb76 100644
--- a/src/Components/FullNamePaymentInput.res
+++ b/src/Components/FullNamePaymentInput.res
@@ -42,7 +42,7 @@ let make = (~paymentType, ~customFieldName=None, ~optionalRequiredFields=None) =
if fullName.value == "" {
setFullName(.prev => {
...prev,
- errorString: `Please provide your ${fieldName}`,
+ errorString: fieldName->localeString.nameEmptyText,
})
} else {
switch optionalRequiredFields {
@@ -50,7 +50,7 @@ let make = (~paymentType, ~customFieldName=None, ~optionalRequiredFields=None) =
if !DynamicFieldsUtils.checkIfNameIsValid(requiredFields, FullName, fullName) {
setFullName(.prev => {
...prev,
- errorString: `Please provide your complete ${fieldName}`,
+ errorString: fieldName->localeString.completeNameEmptyText,
})
}
| None => ()
diff --git a/src/LocaleString.res b/src/LocaleString.res
index 95485592a..c6b03c901 100644
--- a/src/LocaleString.res
+++ b/src/LocaleString.res
@@ -11,15 +11,23 @@ type localeStrings = {
sortCodeText: string,
cvcTextLabel: string,
emailLabel: string,
+ emailEmptyText: string,
+ emailInvalidText: string,
accountNumberText: string,
fullNameLabel: string,
line1Label: string,
line1Placeholder: string,
+ line1EmptyText: string,
line2Label: string,
line2Placeholder: string,
+ line2EmptyText: string,
cityLabel: string,
+ cityEmptyText: string,
postalCodeLabel: string,
+ postalCodeEmptyText: string,
+ postalCodeInvalidText: string,
stateLabel: string,
+ stateEmptyText: string,
fullNamePlaceholder: string,
countryLabel: string,
currencyLabel: string,
@@ -50,6 +58,9 @@ type localeStrings = {
cardHolderName: string,
on: string,
\"and": string,
+ nameEmptyText: string => string,
+ completeNameEmptyText: string => string,
+ billingDetailsText: string,
}
let defaultLocale = {
@@ -66,13 +77,21 @@ let defaultLocale = {
accountNumberText: "Account Number",
cvcTextLabel: "CVC",
emailLabel: "Email",
+ emailEmptyText: "Email cannot be empty",
+ emailInvalidText: "Invalid email address",
line1Label: "Address line 1",
line1Placeholder: "Street address",
+ line1EmptyText: "Address line 1 cannot be empty",
line2Label: "Address line 2",
line2Placeholder: "Apt., unit number, etc (optional)",
+ line2EmptyText: "Address line 2 cannot be empty",
cityLabel: "City",
+ cityEmptyText: "City cannot be empty",
postalCodeLabel: "Postal Code",
+ postalCodeEmptyText: "Postal code cannot be empty",
+ postalCodeInvalidText: "Invalid postal code",
stateLabel: "State",
+ stateEmptyText: "State cannot be empty",
fullNameLabel: "Full name",
fullNamePlaceholder: "First and last name",
countryLabel: "Country",
@@ -115,6 +134,9 @@ let defaultLocale = {
cardHolderName: "Card Holder Name",
on: "on",
\"and": "and",
+ nameEmptyText: str => `Please provide your ${str}`,
+ completeNameEmptyText: str => `Please provide your complete ${str}`,
+ billingDetailsText: "Billing Details",
}
type locale = {localeStrings: array
}
@@ -133,13 +155,21 @@ let localeStrings = [
cvcTextLabel: "CVC",
line1Label: "Address line 1",
line1Placeholder: "Street address",
+ line1EmptyText: "Address line 1 cannot be empty",
line2Label: "Address line 2",
line2Placeholder: "Apt., unit number, etc (optional)",
+ line2EmptyText: "Address line 2 cannot be empty",
cityLabel: "City",
+ cityEmptyText: "City cannot be empty",
postalCodeLabel: "Postal Code",
+ postalCodeEmptyText: "Postal code cannot be empty",
+ postalCodeInvalidText: "Invalid postal code",
stateLabel: "State",
+ stateEmptyText: "State cannot be empty",
accountNumberText: "Account Number",
emailLabel: "Email",
+ emailEmptyText: "Email cannot be empty",
+ emailInvalidText: "Invalid email address",
fullNameLabel: "Full name",
fullNamePlaceholder: "First and last name",
countryLabel: "Country",
@@ -182,6 +212,9 @@ let localeStrings = [
cardHolderName: "Card Holder Name",
on: "on",
\"and": "and",
+ nameEmptyText: str => `Please provide your ${str}`,
+ completeNameEmptyText: str => `Please provide your complete ${str}`,
+ billingDetailsText: "Billing Details",
},
{
locale: "he",
@@ -197,13 +230,21 @@ let localeStrings = [
cvcTextLabel: `קוד בגב הכרטיס`,
line1Label: `כתובת - שורה 1`,
line1Placeholder: `כתובת רחוב`,
+ line1EmptyText: `שורת כתובת 1 לא יכולה להיות ריקה`,
line2Label: `כתובת - שורה 2`,
line2Placeholder: `דירה, יחידה, וכדומה (אופציונלי)`,
+ line2EmptyText: `שורת כתובת 2 לא יכולה להיות ריקה`,
cityLabel: `עיר`,
+ cityEmptyText: `עיר לא יכולה להיות ריקה`,
postalCodeLabel: `מיקוד`,
+ postalCodeEmptyText: `מיקוד לא יכול להיות ריק`,
+ postalCodeInvalidText: `מיקוד לא חוקי`,
stateLabel: `מדינה`,
+ stateEmptyText: `המדינה לא יכולה להיות ריקה`,
accountNumberText: `מספר חשבון`,
emailLabel: `אימייל`,
+ emailEmptyText: `אימייל לא יכול להיות ריק`,
+ emailInvalidText: `כתובת אימייל לא חוקית`,
fullNameLabel: `שם מלא`,
fullNamePlaceholder: `שם פרטי ושם משפחה`,
countryLabel: `מדינה`,
@@ -246,6 +287,9 @@ let localeStrings = [
cardHolderName: `שם בעל הכרטיס`,
on: `עַל`,
\"and": `ו`,
+ nameEmptyText: str => `אנא ספק את שלך ${str}`,
+ completeNameEmptyText: str => `אנא ספק את המלא שלך ${str}`,
+ billingDetailsText: `פרטי תשלום`,
},
{
locale: `fr`,
@@ -261,13 +305,21 @@ let localeStrings = [
cvcTextLabel: `Code CVC`,
line1Label: `Adresse - Ligne 1`,
line1Placeholder: `Adresse de rue`,
+ line1EmptyText: `La ligne d'adresse 1 ne peut pas être vide`,
line2Label: `Adresse - Ligne 2`,
line2Placeholder: `Appartement, numéro d'unité, etc (facultatif)`,
+ line2EmptyText: `La ligne d'adresse 2 ne peut pas être vide`,
cityLabel: `Ville`,
+ cityEmptyText: `La ville ne peut pas être vide`,
postalCodeLabel: `Code postal`,
+ postalCodeEmptyText: `Le code postal ne peut pas être vide`,
+ postalCodeInvalidText: `Code postal invalide`,
stateLabel: `État`,
+ stateEmptyText: `L'état ne peut pas être vide`,
accountNumberText: `Numéro de compte`,
emailLabel: `E-mail`,
+ emailEmptyText: `L'e-mail ne peut pas être vide`,
+ emailInvalidText: "Adresse e-mail invalide",
fullNameLabel: `Nom complet`,
fullNamePlaceholder: `Prénom et nom de famille`,
countryLabel: `Pays`,
@@ -310,6 +362,9 @@ let localeStrings = [
cardHolderName: `Nom du titulaire`,
on: `sur`,
\"and": `et`,
+ nameEmptyText: str => `Veuillez fournir votre ${str}`,
+ completeNameEmptyText: str => `Veuillez fournir votre complet ${str}`,
+ billingDetailsText: "Détails de la facturation",
},
{
locale: "en-GB",
@@ -324,13 +379,21 @@ let localeStrings = [
sortCodeText: "Sort Code",
cvcTextLabel: "CVC",
emailLabel: "Email",
+ emailEmptyText: "Email cannot be empty",
+ emailInvalidText: "Invalid email address",
line1Label: "Address line 1",
line1Placeholder: "Street address",
+ line1EmptyText: "Address line 1 cannot be empty",
line2Label: "Address line 2",
line2Placeholder: "Apt., unit number, etc (optional)",
+ line2EmptyText: "Address line 2 cannot be empty",
cityLabel: "City",
+ cityEmptyText: "City cannot be empty",
postalCodeLabel: "Postal Code",
+ postalCodeEmptyText: "Postal code cannot be empty",
+ postalCodeInvalidText: "Invalid postal code",
stateLabel: "State",
+ stateEmptyText: "State cannot be empty",
accountNumberText: "Account Number",
fullNameLabel: "Full name",
fullNamePlaceholder: "First and last name",
@@ -374,6 +437,9 @@ let localeStrings = [
cardHolderName: "Card Holder Name",
on: "on",
\"and": "and",
+ nameEmptyText: str => `Please provide your ${str}`,
+ completeNameEmptyText: str => `Please provide your complete ${str}`,
+ billingDetailsText: "Billing Details",
},
{
locale: "ar",
@@ -389,14 +455,22 @@ let localeStrings = [
accountNumberText: `رقم حساب`,
cvcTextLabel: `رمز الحماية`,
emailLabel: `البريد الإلكتروني`,
+ emailEmptyText: `لا يمكن أن يكون البريد الإلكتروني فارغًا`,
+ emailInvalidText: `عنوان البريد الإلكتروني غير صالح`,
fullNameLabel: `الاسم الكامل`,
line1Label: `العنوان سطر 1`,
line1Placeholder: `.عنوان الشارع`,
+ line1EmptyText: `لا يمكن أن يكون سطر العنوان 1 فارغًا`,
line2Label: `سطر العنوان 2`,
line2Placeholder: `مناسب ، رقم الوحدة ، إلخ (اختياري)`,
+ line2EmptyText: `لا يمكن أن يكون سطر العنوان 2 فارغًا`,
postalCodeLabel: `رمز بريدي`,
+ postalCodeEmptyText: `لا يمكن أن يكون الرمز البريدي فارغًا`,
+ postalCodeInvalidText: `الرمز البريدي غير صالح`,
stateLabel: `ولاية`,
+ stateEmptyText: `لا يمكن أن تكون الحالة فارغة`,
cityLabel: `مدينة`,
+ cityEmptyText: `لا يمكن أن تكون المدينة فارغة`,
fullNamePlaceholder: `الاسم الأول والاسم الأخير`,
countryLabel: `دولة`,
currencyLabel: `عملة`,
@@ -438,6 +512,9 @@ let localeStrings = [
cardHolderName: `إسم صاحب البطاقة`,
on: `على`,
\"and": `و`,
+ nameEmptyText: str => `يرجى تقديم الخاص بك ${str}`,
+ completeNameEmptyText: str => `يرجى تقديم كامل الخاص بك ${str}`,
+ billingDetailsText: `تفاصيل الفاتورة`,
},
{
locale: "ja",
@@ -453,16 +530,24 @@ let localeStrings = [
cvcTextLabel: `セキュリティコード`,
accountNumberText: `口座番号`,
emailLabel: `Eメール`,
+ emailEmptyText: `電子メールを空にすることはできません`,
+ emailInvalidText: `無効なメールアドレス`,
fullNameLabel: `フルネーム`,
fullNamePlaceholder: `名前と苗字`,
line1Label: `住所1`,
line1Placeholder: `住所`,
+ line1EmptyText: `住所行 1 を空にすることはできません`,
line2Label: `住所2`,
postalCodeLabel: `郵便番号`,
+ postalCodeEmptyText: `郵便番号を空白にすることはできません`,
+ postalCodeInvalidText: `郵便番号が無効です`,
stateLabel: `州`,
+ stateEmptyText: `状態を空にすることはできません`,
cityLabel: `街`,
line2Placeholder: `アパート、ユニット番号など(任意)`,
+ line2EmptyText: `住所行 2 を空にすることはできません`,
countryLabel: `国`,
+ cityEmptyText: `都市を空にすることはできません`,
currencyLabel: "通貨",
bankLabel: `バンクを選択`,
redirectText: `注文を送信すると、安全に購入を完了するためにリダイレクトされます。`,
@@ -502,6 +587,9 @@ let localeStrings = [
cardHolderName: `クレジットカード名義人氏名`,
on: `の上`,
\"and": `そして`,
+ nameEmptyText: str => `あなたの情報を提供してください ${str}`,
+ completeNameEmptyText: str => `完全な情報を提供してください ${str}`,
+ billingDetailsText: `支払明細`,
},
{
locale: "de",
@@ -517,13 +605,21 @@ let localeStrings = [
cvcTextLabel: `CVC`,
line1Label: `Adresszeile 1`,
line1Placeholder: `Adresse`,
+ line1EmptyText: "Adresszeile 1 darf nicht leer sein",
line2Label: `Adresszeile 2`,
line2Placeholder: `Wohnung, Einheitennummer usw. (optional)`,
+ line2EmptyText: `Adresszeile 2 darf nicht leer sein`,
cityLabel: `Stadt`,
+ cityEmptyText: `Die Stadt darf nicht leer sein`,
postalCodeLabel: `Postleitzahl`,
+ postalCodeEmptyText: `Die Postleitzahl darf nicht leer sein`,
+ postalCodeInvalidText: `Ungültige Postleitzahl`,
stateLabel: `Zustand`,
+ stateEmptyText: `Der Status darf nicht leer sein`,
accountNumberText: `Accountnummer`,
emailLabel: `Email`,
+ emailEmptyText: `E-Mail darf nicht leer sein`,
+ emailInvalidText: `Ungültige E-Mail-Adresse`,
fullNameLabel: `Vollständiger Name`,
fullNamePlaceholder: `Vor-und Nachname`,
countryLabel: `Land`,
@@ -566,5 +662,8 @@ let localeStrings = [
cardHolderName: `Name des Karteninhabers`,
on: `An`,
\"and": `Und`,
+ nameEmptyText: str => `Bitte geben Sie Ihre an ${str}`,
+ completeNameEmptyText: str => `Bitte geben Sie Ihr vollständiges Formular an ${str}`,
+ billingDetailsText: `Rechnungsdetails`,
},
]
diff --git a/src/Payments/BankDebitModal.res b/src/Payments/BankDebitModal.res
index 702f4fd6d..732de6225 100644
--- a/src/Payments/BankDebitModal.res
+++ b/src/Payments/BankDebitModal.res
@@ -91,7 +91,8 @@ module AccountNumberCard = {
{React.string("000123456789")}
-
{React.string("1234")}
+
+
{React.string("1234")}
@@ -112,7 +113,7 @@ let make = (~setModalData) => {
let (sortCode, setSortCode) = React.useState(_ => "")
let (isRoutingValid, setIsRoutingValid) = React.useState(_ => None)
let (routingError, setRoutingError) = React.useState(_ => "")
- let {themeObj, config} = Recoil.useRecoilValueFromAtom(RecoilAtoms.configAtom)
+ let {themeObj, config, localeString} = Recoil.useRecoilValueFromAtom(RecoilAtoms.configAtom)
let (accountType, setAccountType) = React.useState(() => "Savings")
let (openModal, setOpenModal) = React.useState(_ => false)
@@ -188,7 +189,7 @@ let make = (~setModalData) => {
- {React.string("Billing Details")}
+ {React.string(localeString.billingDetailsText)}
{
active=submitActive
onclick={_ => {
setModalData(_ => Some({
- routingNumber: routingNumber,
+ routingNumber,
accountNumber: accountNum,
- accountHolderName: accountHolderName,
+ accountHolderName,
accountType: accountType->Js.String2.toLowerCase,
- iban: iban,
- sortCode: sortCode,
+ iban,
+ sortCode,
}))
Modal.close(setOpenModal)
}}
diff --git a/src/Utilities/DynamicFieldsUtils.res b/src/Utilities/DynamicFieldsUtils.res
index ec601b9f6..c21995fbf 100644
--- a/src/Utilities/DynamicFieldsUtils.res
+++ b/src/Utilities/DynamicFieldsUtils.res
@@ -657,6 +657,9 @@ let useSubmitCallback = () => {
)
let (city, setCity) = Recoil.useLoggedRecoilState(RecoilAtoms.userAddressCity, "city", logger)
let {billingAddress} = Recoil.useRecoilValueFromAtom(RecoilAtoms.optionAtom)
+
+ let {localeString} = Recoil.useRecoilValueFromAtom(RecoilAtoms.configAtom)
+
React.useCallback5((ev: Window.event) => {
let json = ev.data->Js.Json.parseExn
let confirm = json->Utils.getDictFromJson->ConfirmType.itemToObjMapper
@@ -664,31 +667,31 @@ let useSubmitCallback = () => {
if line1.value == "" {
setLine1(.prev => {
...prev,
- errorString: "Address line 1 cannot be empty",
+ errorString: localeString.line1EmptyText,
})
}
if line2.value == "" {
setLine2(.prev => {
...prev,
- errorString: billingAddress.isUseBillingAddress ? "" : "Address line 2 cannot be empty",
+ errorString: billingAddress.isUseBillingAddress ? "" : localeString.line2EmptyText,
})
}
if state.value == "" {
setState(.prev => {
...prev,
- errorString: "State cannot be empty",
+ errorString: localeString.stateEmptyText,
})
}
if postalCode.value == "" {
setPostalCode(.prev => {
...prev,
- errorString: "Postal code cannot be empty",
+ errorString: localeString.postalCodeEmptyText,
})
}
if city.value == "" {
setCity(.prev => {
...prev,
- errorString: "City cannot be empty",
+ errorString: localeString.cityEmptyText,
})
}
}