diff --git a/components/account/personaldetails.js b/components/account/personaldetails.js
index e627d0e1..b8cb9f50 100644
--- a/components/account/personaldetails.js
+++ b/components/account/personaldetails.js
@@ -309,7 +309,7 @@ let PersonalDetails = (props) => {
name="telephone1"
id="telephone1"
component={RenderTextfield}
- type="number"
+ type="text"
className="govuk-input govuk-input--width-20"
validate={[required, phoneNumber]}
label={t("account:account-telephone-label")}
diff --git a/components/account/personaldetailsComplete.js b/components/account/personaldetailsComplete.js
index 53222775..533de234 100644
--- a/components/account/personaldetailsComplete.js
+++ b/components/account/personaldetailsComplete.js
@@ -30,7 +30,7 @@ const PersonalDetailsComplete = (props) => {
<>
{t("account:account-complete-para-1")}
- {t("account:account-complete-para-2")}
+ {/* {t("account:account-complete-para-2")}
*/}
{
name="telephone1"
id="telephone1"
component={RenderTextfield}
- type="number"
+ type="text"
className="govuk-input govuk-input--width-20"
validate={[required, phoneNumber]}
label={t(
diff --git a/components/elements/index.js b/components/elements/index.js
index 1a120f29..a7ba5b79 100644
--- a/components/elements/index.js
+++ b/components/elements/index.js
@@ -70,7 +70,11 @@ const RenderTextfield = ({
: 100
: 200
}
- // pattern={custom.hasOwnProperty("pattern") && custom.pattern}
+ pattern={
+ custom.hasOwnProperty("pattern")
+ ? custom.pattern
+ : undefined
+ }
/>
>
@@ -379,24 +383,40 @@ export const RenderRichMultiline = ({
return (
<>
-
-
-
+
+
+
+ {error && (
+
+ Error:{" "}
+ {error}
+
+ )}
+
+
+
+
>
);
};
@@ -503,6 +523,7 @@ const RenderDatePicker = ({
}) => {
const router = useRouter();
+ let { t } = useTranslation();
var startDateArr =
custom.dateStart != "0" ? custom.dateStart.split("") : custom.dateStart;
var endDateArr =
@@ -560,6 +581,9 @@ const RenderDatePicker = ({
>
{FieldsTranslations(label)}
+ {custom.hint != false && (
+ {t(custom.hint)}
+ )}
{touched && error && (
)
) : (
@@ -649,6 +674,7 @@ export function DateFieldPicker(props) {
errorMsg="Select a date"
dateStart={dateStart}
dateEnd={dateEnd}
+ hint={props.hint}
/>
)}
@@ -1230,7 +1256,7 @@ const RenderPickList = ({
dropdownObj = dropdownObj[0];
const required = (value) => {
- return value || value == 0 ? undefined : "Requirewwwd";
+ return value || value == 0 ? undefined : "Is required";
};
return (
@@ -1251,13 +1277,10 @@ const RenderPickList = ({
{error}
)}
-