Unverified Commit 962fe417 authored by Zhou (Link)  Fang's avatar Zhou (Link) Fang Committed by GitHub
Browse files

Added Same as Member Rep checkbox for Signing Authority (#308)

* Added same as company rep for signing authority

* Added logic to update SA rep if sameAs is checked
parent 9941066b
...@@ -166,6 +166,10 @@ export function matchContactFields(existingContactData) { ...@@ -166,6 +166,10 @@ export function matchContactFields(existingContactData) {
lastName: existingSigningContact?.last_name || '', lastName: existingSigningContact?.last_name || '',
jobtitle: existingSigningContact?.job_title || '', jobtitle: existingSigningContact?.job_title || '',
email: existingSigningContact?.email || '', email: existingSigningContact?.email || '',
sameAsCompany: checkSameContact(
existingCompanyContact,
existingSigningContact
),
}, },
}; };
} }
......
...@@ -19,8 +19,7 @@ import TopSlideMsg from '../UIComponents/Notifications/TopSlideMsg'; ...@@ -19,8 +19,7 @@ import TopSlideMsg from '../UIComponents/Notifications/TopSlideMsg';
export default function Application() { export default function Application() {
const history = useHistory(); const history = useHistory();
const { currentFormId, furthestPage, setFurthestPage, currentUser } = const { currentFormId, furthestPage, setFurthestPage, currentUser } = useContext(MembershipContext);
useContext(MembershipContext);
const [updatedFormValues, setUpdatedFormValues] = useState(initialValues); const [updatedFormValues, setUpdatedFormValues] = useState(initialValues);
const [isStartNewForm, setIsStartNewForm] = useState(true); const [isStartNewForm, setIsStartNewForm] = useState(true);
const [isLoginExpired, setIsLoginExpired] = useState(false); const [isLoginExpired, setIsLoginExpired] = useState(false);
...@@ -29,8 +28,7 @@ export default function Application() { ...@@ -29,8 +28,7 @@ export default function Application() {
const [workingGroupsUserJoined, setWorkingGroupsUserJoined] = useState([]); const [workingGroupsUserJoined, setWorkingGroupsUserJoined] = useState([]);
const goToNextStep = (pageIndex, nextPage) => { const goToNextStep = (pageIndex, nextPage) => {
if (furthestPage.index <= pageIndex) if (furthestPage.index <= pageIndex) setFurthestPage({ index: pageIndex + 1, pathName: nextPage });
setFurthestPage({ index: pageIndex + 1, pathName: nextPage });
history.push(nextPage); history.push(nextPage);
}; };
...@@ -53,13 +51,7 @@ export default function Application() { ...@@ -53,13 +51,7 @@ export default function Application() {
}; };
const submitForm = () => { const submitForm = () => {
executeSendDataByStep( executeSendDataByStep(5, '', currentFormId, currentUser.name, '');
5,
'',
currentFormId,
currentUser.name,
''
);
goToNextStep(5, '/submitted'); goToNextStep(5, '/submitted');
}; };
...@@ -116,6 +108,16 @@ export default function Application() { ...@@ -116,6 +108,16 @@ export default function Application() {
}; };
executeSendDataByStep(1, theNewValue, currentFormId, currentUser.name, setFieldValueObj); executeSendDataByStep(1, theNewValue, currentFormId, currentUser.name, setFieldValueObj);
// Only make the API call when signingAuthorityRepresentative has an id
// If not, it means there is nothing in the db, so no need to update.
values.signingAuthorityRepresentative.id &&
executeSendDataByStep(
4,
values,
currentFormId,
currentUser.name,
setFieldValueObj
);
// Only need to call goToNextStep when is not using stepper // Only need to call goToNextStep when is not using stepper
!isUsingStepper && goToNextStep(1, '/membership-level'); !isUsingStepper && goToNextStep(1, '/membership-level');
}; };
...@@ -323,10 +325,7 @@ export default function Application() { ...@@ -323,10 +325,7 @@ export default function Application() {
<Route path="/signing-authority"> <Route path="/signing-authority">
{renderStepper()} {renderStepper()}
{furthestPage.index >= 4 ? ( {furthestPage.index >= 4 ? (
<SigningAuthority <SigningAuthority formik={formikSigningAuthority} formikOrgValue={formikCompanyInfo.values} />
formik={formikSigningAuthority}
updatedFormValues={updatedFormValues}
/>
) : ( ) : (
<Redirect to={furthestPage.pathName} /> <Redirect to={furthestPage.pathName} />
)} )}
...@@ -335,11 +334,11 @@ export default function Application() { ...@@ -335,11 +334,11 @@ export default function Application() {
<Route path="/review"> <Route path="/review">
{renderStepper()} {renderStepper()}
{furthestPage.index >= 5 ? ( {furthestPage.index >= 5 ? (
<Review <Review
values={updatedFormValues} values={updatedFormValues}
submitForm={submitForm} submitForm={submitForm}
isTermChecked={isTermChecked} isTermChecked={isTermChecked}
setIsTermChecked={setIsTermChecked} setIsTermChecked={setIsTermChecked}
/> />
) : ( ) : (
<Redirect to={furthestPage.pathName} /> <Redirect to={furthestPage.pathName} />
...@@ -347,20 +346,13 @@ export default function Application() { ...@@ -347,20 +346,13 @@ export default function Application() {
</Route> </Route>
<Route path="/submitted"> <Route path="/submitted">
{furthestPage.index >= 6 ? ( {furthestPage.index >= 6 ? <SubmitSuccess /> : <Redirect to={furthestPage.pathName} />}
<SubmitSuccess />
) : (
<Redirect to={furthestPage.pathName} />
)}
</Route> </Route>
<Redirect to="/" /> <Redirect to="/" />
</Switch> </Switch>
<TopSlideMsg <TopSlideMsg shouldShowUp={isLoginExpired} msgContent={LOGIN_EXPIRED_MSG} />
shouldShowUp={isLoginExpired}
msgContent={LOGIN_EXPIRED_MSG}
/>
</> </>
); );
} }
...@@ -105,6 +105,16 @@ const Contacts = ({ formik, formikWG }) => { ...@@ -105,6 +105,16 @@ const Contacts = ({ formik, formikWG }) => {
}); });
// only call setFieldValue when there is at least 1 wg rep has sameAsCompany: true // only call setFieldValue when there is at least 1 wg rep has sameAsCompany: true
isWGRepSameAsCompany && formikWG.setFieldValue('workingGroups', newWG); isWGRepSameAsCompany && formikWG.setFieldValue('workingGroups', newWG);
const isSigningAuthoritySameAsCompany = formik.values.signingAuthorityRepresentative.sameAsCompany;
if (isSigningAuthoritySameAsCompany) {
const newSigningAuthorityRepValues = {
...memberRepInfo,
id: formik.values.signingAuthorityRepresentative.id || '',
sameAsCompany: isSigningAuthoritySameAsCompany,
};
formik.setFieldValue('signingAuthorityRepresentative', newSigningAuthorityRepValues);
}
}; };
const generateSingleContact = (el, index, prefix, type, disableInput) => ( const generateSingleContact = (el, index, prefix, type, disableInput) => (
......
...@@ -3,6 +3,7 @@ import Input from '../../UIComponents/Inputs/Input'; ...@@ -3,6 +3,7 @@ import Input from '../../UIComponents/Inputs/Input';
import { formField } from '../../UIComponents/FormComponents/formFieldModel'; import { formField } from '../../UIComponents/FormComponents/formFieldModel';
import { useEffect } from 'react'; import { useEffect } from 'react';
import { scrollToTop } from '../../../Utils/formFunctionHelpers'; import { scrollToTop } from '../../../Utils/formFunctionHelpers';
import { Checkbox, FormControlLabel } from '@material-ui/core';
/** /**
* Have not added any API calls here, * Have not added any API calls here,
...@@ -11,7 +12,7 @@ import { scrollToTop } from '../../../Utils/formFunctionHelpers'; ...@@ -11,7 +12,7 @@ import { scrollToTop } from '../../../Utils/formFunctionHelpers';
*/ */
const sectionName = 'signing-authority'; const sectionName = 'signing-authority';
const SigningAuthority = ({ formik }) => { const SigningAuthority = ({ formik, formikOrgValue }) => {
const { signingAuthorityRepresentative } = formField; const { signingAuthorityRepresentative } = formField;
const name = 'signingAuthorityRepresentative'; const name = 'signingAuthorityRepresentative';
const generateSingleContact = (el) => ( const generateSingleContact = (el) => (
...@@ -21,6 +22,7 @@ const SigningAuthority = ({ formik }) => { ...@@ -21,6 +22,7 @@ const SigningAuthority = ({ formik }) => {
labelName={el.label} labelName={el.label}
placeholder={el.placeholder} placeholder={el.placeholder}
requiredMark={true} requiredMark={true}
disableInput={formik.values.signingAuthorityRepresentative.sameAsCompany}
ariaLabel={`${name}.${el.name}`} ariaLabel={`${name}.${el.name}`}
onChange={formik.handleChange} onChange={formik.handleChange}
value={formik.values.signingAuthorityRepresentative[`${el.name}`]} value={formik.values.signingAuthorityRepresentative[`${el.name}`]}
...@@ -36,6 +38,19 @@ const SigningAuthority = ({ formik }) => { ...@@ -36,6 +38,19 @@ const SigningAuthority = ({ formik }) => {
</div> </div>
); );
const handleCheckboxChange = (isChecked) => {
const repInfo = isChecked
? formikOrgValue.representative.member
: formik.values.signingAuthorityRepresentative;
const newValues = {
...repInfo,
sameAsCompany: isChecked,
id: formik.values.signingAuthorityRepresentative.id,
};
formik.setFieldValue('signingAuthorityRepresentative', newValues);
};
useEffect(() => { useEffect(() => {
scrollToTop(); scrollToTop();
}, []); }, []);
...@@ -48,6 +63,18 @@ const SigningAuthority = ({ formik }) => { ...@@ -48,6 +63,18 @@ const SigningAuthority = ({ formik }) => {
</h1> </h1>
<p>Please indicate the individual who has the signing authority for the agreement.</p> <p>Please indicate the individual who has the signing authority for the agreement.</p>
<FormControlLabel
control={
<Checkbox
name="signingAuthorityRepresentative.sameAsCompany"
color="primary"
checked={formik.values.signingAuthorityRepresentative.sameAsCompany}
onChange={(ev) => handleCheckboxChange(ev.target.checked)}
/>
}
label="Same as Member Representative"
/>
<div className="row"> <div className="row">
{signingAuthorityRepresentative.map((el, index) => index < 2 && generateSingleContact(el))} {signingAuthorityRepresentative.map((el, index) => index < 2 && generateSingleContact(el))}
</div> </div>
......
...@@ -59,10 +59,10 @@ const WorkingGroupRepresentative = ({ name, index, formik, formikOrgValue }) => ...@@ -59,10 +59,10 @@ const WorkingGroupRepresentative = ({ name, index, formik, formikOrgValue }) =>
<FormControlLabel <FormControlLabel
control={ control={
<Checkbox <Checkbox
name="representative.marketing.sameAsCompany" name={`workingGroups[${theIndex}].workingGroupRepresentative.sameAsCompany`}
color="primary" color="primary"
checked={formik.values.workingGroups[theIndex].workingGroupRepresentative.sameAsCompany} checked={formik.values.workingGroups[theIndex].workingGroupRepresentative.sameAsCompany}
onChange={(ev) => handleCheckboxChange(ev.target.checked, 'marketing')} onChange={(ev) => handleCheckboxChange(ev.target.checked)}
/> />
} }
label="Same as Member Representative" label="Same as Member Representative"
......
...@@ -113,6 +113,7 @@ export const initialValues = { ...@@ -113,6 +113,7 @@ export const initialValues = {
email: '', email: '',
jobtitle: '', jobtitle: '',
id: '', id: '',
sameAsCompany: false,
}, },
}; };
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment