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} )} - + {Object.keys(dropdownObj).map((key, index) => { return (