allow input eng name or chi name

src/pages/authentication/auth-forms/CustomFormWizard.js

@@ -303,13 +303,13 @@ const CustomFormWizard = (props) => {
         selectedAddress4, selectedAddress5,
         termsAndConAccept, termsAndConNotAccept, fileList])
 
-    useEffect(()=>{
+    useEffect(() => {
         setDistrictErrStr("");
-        if(selectedAddress5?.type === "hongKong"){
-            if(selectedAddress4 ==null || selectedAddress4 == ""|| selectedAddress4 == {})
+        if (selectedAddress5?.type === "hongKong") {
+            if (selectedAddress4 == null || selectedAddress4 == "" || selectedAddress4 == {})
                 setDistrictErrStr(getRequiredErrStr("district"))
         }
-    },[selectedAddress4, selectedAddress5])
+    }, [selectedAddress4, selectedAddress5])
 
     useEffect(() => {
         props.step == 2 ? _onSubmit() : null;
@@ -541,11 +541,11 @@ const CustomFormWizard = (props) => {
         return <Typography variant="errorMessage1">{errorMsg}</Typography>
     }
 
-    function getMaxErrStr(num, fieldname){
-        return displayErrorMsg(intl.formatMessage({ id: 'noMoreThenNWords' },{num:num, fieldname:fieldname?intl.formatMessage({ id: fieldname})+": ":""}));
+    function getMaxErrStr(num, fieldname) {
+        return displayErrorMsg(intl.formatMessage({ id: 'noMoreThenNWords' }, { num: num, fieldname: fieldname ? intl.formatMessage({ id: fieldname }) + ": " : "" }));
     }
-    function getRequiredErrStr(fieldname){
-        return displayErrorMsg(intl.formatMessage({ id: 'require'},{fieldname:fieldname?intl.formatMessage({ id: fieldname}):""}));
+    function getRequiredErrStr(fieldname) {
+        return displayErrorMsg(intl.formatMessage({ id: 'require' }, { fieldname: fieldname ? intl.formatMessage({ id: fieldname }) : "" }));
     }
 
     const formik = useFormik({
@@ -581,14 +581,17 @@ const CustomFormWizard = (props) => {
                 .matches(/^(?=.*[0-9])/, { message: displayErrorMsg(intl.formatMessage({ id: 'atLeast1Number' })) })
                 .matches(/^(?=.*[!@#%&])/, { message: displayErrorMsg(intl.formatMessage({ id: 'atLeast1SpecialChar' })) }),
             confirmPassword: yup.string().min(8, displayErrorMsg(intl.formatMessage({ id: 'atLeast8CharPassword' }))).required(displayErrorMsg(intl.formatMessage({ id: 'pleaseConfirmPassword' }))).oneOf([yup.ref('password'), null], displayErrorMsg(intl.formatMessage({ id: 'samePassword' }))),
-            enName: yup.string().max(40, getMaxErrStr(40)).required(displayErrorMsg(intl.formatMessage({ id: 'userRequireEnglishName' }))),
-            chName: yup.string().max(6, getMaxErrStr(6)).required(displayErrorMsg(intl.formatMessage({ id: 'userRequireChineseName' }))),
+            enName: yup.string().max(40, getMaxErrStr(40)),
+            chName: yup.string().max(6, getMaxErrStr(6)).when('enName', {
+                is: (enName) => enName?false:true,
+                then: yup.string().required(displayErrorMsg(intl.formatMessage({ id: 'userRequireChineseName' })))
+              }),
             address1: yup.string().max(40, getMaxErrStr(40, "addressLine1")).required(displayErrorMsg(intl.formatMessage({ id: 'validateAddressLine1' }))),
             address2: yup.string().max(40, getMaxErrStr(40, "addressLine2")),
             address3: yup.string().max(40, getMaxErrStr(40, "addressLine3")),
             email: yup.string().email(displayErrorMsg(intl.formatMessage({ id: 'validEmailFormat' }))).max(128, getMaxErrStr(128)).required(displayErrorMsg(intl.formatMessage({ id: 'requireEmail' }))),
             emailConfirm: yup.string().email(displayErrorMsg(intl.formatMessage({ id: 'validEmailFormat' }))).max(128, getMaxErrStr(128)).required(displayErrorMsg(intl.formatMessage({ id: 'requireEmail' }))).oneOf([yup.ref('email'), null], displayErrorMsg(intl.formatMessage({ id: 'validSameEmail' }))),
-            idNo: yup.string().required(displayErrorMsg(`${intl.formatMessage({ id: 'require' })}${selectedIdDocInputType}${intl.formatMessage({ id: 'number' })}`))
+            idNo: yup.string().required(getRequiredErrStr('number'))
                 .matches(/^[aA-zZ0-9\s]+$/, { message: displayErrorMsg(`${selectedIdDocInputType}${intl.formatMessage({ id: 'noSpecialCharacter' })}`) })
                 .matches(/^\S*$/, { message: displayErrorMsg(`${selectedIdDocInputType}${intl.formatMessage({ id: 'noSpace' })}`) })
                 .test('checkIDCardFormat', displayErrorMsg(`${intl.formatMessage({ id: 'requiredValid' })}${selectedIdDocInputType}${intl.formatMessage({ id: 'number' })}`), function (value) {
@@ -648,7 +651,7 @@ const CustomFormWizard = (props) => {
             // faxCountryCode: yup.string().min(3,'請輸入3位數字'),
             phone: yup.string().min(8, displayErrorMsg(intl.formatMessage({ id: 'requireAtLeast8Number' }))).required(displayErrorMsg(intl.formatMessage({ id: 'requireContactNumber' }))),
             // fax: yup.string().min(8,'請輸入8位數字'),
-            captchaField: yup.string().max(5,  getMaxErrStr(5)).required(displayErrorMsg(intl.formatMessage({ id: 'requireVerify' }))),//.oneOf([captcha], displayErrorMsg('請輸入有效驗證')),
+            captchaField: yup.string().max(5, getMaxErrStr(5)).required(displayErrorMsg(intl.formatMessage({ id: 'requireVerify' }))),//.oneOf([captcha], displayErrorMsg('請輸入有效驗證')),
         }),
     });
 
@@ -934,7 +937,7 @@ const CustomFormWizard = (props) => {
                                                 />
                                                 {formik.touched.idDocType && (
                                                     selectedIdDocType === null || selectedIdDocType?.type == null ?
-                                                        <FormHelperText error id="helper-text-idDocType-signup" sx={{fontSize:16,fontWeight: 'bold',}}>
+                                                        <FormHelperText error id="helper-text-idDocType-signup" sx={{ fontSize: 16, fontWeight: 'bold', }}>
                                                             <FormattedMessage id="requireIdDocType" />
                                                         </FormHelperText> : ''
                                                 )}
@@ -1067,12 +1070,17 @@ const CustomFormWizard = (props) => {
                                         }
                                     </Grid>
                                 </Grid>
+                                <Grid item xs={12} md={12}>
+                                    <Typography variant="subtitle1">
+                                        (<FormattedMessage id="registerNameLabel" />)
+                                    </Typography>
+                                </Grid>
                                 <Grid item xs={12} md={6}>
                                     <Stack spacing={1}>
                                         <InputLabel htmlFor="enName-signup">
                                             <Typography variant="pnspsFormHeader">
                                                 <FormattedMessage id="userEnglishName" />
-                                                {selectedIdDocType.type === "CNID" ? "" : <span style={{ color: '#f10000' }}>*</span>}
+                                                {selectedIdDocType.type === "CNID" ? "" : <span style={{ color: '#f10000' }}></span>}
                                             </Typography>
                                         </InputLabel>
                                         <OutlinedInput
@@ -1105,7 +1113,7 @@ const CustomFormWizard = (props) => {
                                         <InputLabel htmlFor="chName-signup">
                                             <Typography variant="pnspsFormHeader">
                                                 <FormattedMessage id="userChineseName" />
-                                                <span style={{ color: '#f10000' }}>*</span>
+                                                <span style={{ color: '#f10000' }}></span>
                                             </Typography>
                                         </InputLabel>
                                         <OutlinedInput
@@ -1199,7 +1207,7 @@ const CustomFormWizard = (props) => {
                                             value={selectedAddress4}
                                             options={ComboData.district}
                                             disabled={checkCountry}
-                                            error={Boolean(districtErrStr!="")}
+                                            error={Boolean(districtErrStr != "")}
                                             onBlur={formik.handleBlur}
                                             getOptionLabel={(option) => option.type ? intl.formatMessage({ id: option.type }) : ""}
                                             onChange={(event, newValue) => {
@@ -1252,7 +1260,7 @@ const CustomFormWizard = (props) => {
                                                 {formik.errors.address3}
                                             </FormHelperText>
                                         )}
-                                         {districtErrStr!= "" && (
+                                        {districtErrStr != "" && (
                                             <FormHelperText error >
                                                 {districtErrStr}
                                             </FormHelperText>
@@ -1685,8 +1693,8 @@ const CustomFormWizard = (props) => {
                                             <FormattedMessage id="idDocType" />:
                                         </Typography>
                                         <Typography variant="pnspsFormHeader" name="preview-idDocType">
-                                            {intl.formatMessage({ id: selectedIdDocType?.label??" " })}
-                                           
+                                            {intl.formatMessage({ id: selectedIdDocType?.label ?? " " })}
+
                                         </Typography>
                                     </Stack>
                                 </Grid>

src/translations/en.json

@@ -150,6 +150,7 @@
   "registerNewBusinessUser": "Apply as organisation/company user",
   "becomeNewBusinessUser": "Become New Organisation/Company user",
   "userName": "Username",
+  "registerNameLabel": "Please provide either an English name or a Chinese name, at a minimum.",
   "userChineseName": "Chinese Name",
   "userEnglishName": "English Name",
   "userContactName": "Name",

src/translations/zh-CN.json

@@ -144,6 +144,7 @@
   "registerNewBusinessUser": "申请机构／公司用户",
   "becomeNewBusinessUser": "成为新的机构／公司用户",
   "userName": "用户名称",
+  "registerNameLabel": "请至少输入英文姓名或中文姓名。",
   "userChineseName": "中文姓名",
   "userEnglishName": "英文姓名",
   "userContactName": "姓名",

src/translations/zh-HK.json

@@ -147,6 +147,7 @@
   "registerNewBusinessUser": "申請機構／公司用戶",
   "becomeNewBusinessUser": "成為新的機構／公司用戶",
   "userName": "用戶名稱",
+  "registerNameLabel": "請至少輸入英文姓名或中文姓名。",
   "userChineseName": "中文姓名",
   "userEnglishName": "英文姓名",
   "userContactName": "姓名",