qa fixes #5429

Author: kkartunov

src/assets/images/checkmark-green.svg

@@ -20,6 +20,7 @@ import './style.scss';
 import bigCheckmark from 'assets/images/big-checkmark.png';
 import SadFace from 'assets/images/sad-face-icon.svg';
 import BackArrowGig from 'assets/images/back-arrow-gig-apply.svg';
+import CheckmarkGreen from 'assets/images/checkmark-green.svg';
 
 export default function GigApply(props) {
   const {
@@ -96,10 +97,10 @@ export default function GigApply(props) {
                 <div styleName="form-wrap">
                   {!_.isEmpty(recruitProfile)
                   && (
-                  <p styleName="info-text">
-                    <strong>It looks like you have applied to a gig previously. Perfect!&#10003;</strong><br />
-                    We have most of your information. Is there anything you would like to update to your Gig Work Profile?
-                  </p>
+                  <div styleName="info-text">
+                    <h6>It looks like you have applied to a gig previously. Perfect!<CheckmarkGreen /></h6>
+                    <p>We have most of your information. Is there anything you would like to update to your Gig Work Profile?</p>
+                  </div>
                   )}
                   <h4>PERSONAL INFORMATION</h4>
                   {_.isEmpty(recruitProfile)

src/shared/components/Gigs/GigApply/index.jsx

@@ -150,7 +150,21 @@
 
       .info-text {
         font-size: 16px;
-        margin-top: 35px;
+        margin-top: 55px;
+
+        h6 {
+          font-family: Barlow, sans-serif;
+          font-size: 16px;
+          line-height: 20px;
+          font-weight: 600;
+          margin-bottom: 8px;
+          display: flex;
+          align-items: center;
+
+          svg {
+            margin-left: 5px;
+          }
+        }
       }
 
       .form-section {

src/shared/components/Gigs/GigApply/style.scss

@@ -45,27 +45,48 @@ class RecruitCRMJobApplyContainer extends React.Component {
     this.validateForm = this.validateForm.bind(this);
   }
 
+  // eslint-disable-next-line consistent-return
   componentDidMount() {
     const { formData } = this.state;
     const { user, recruitProfile, searchCandidates } = this.props;
-    this.setState({
-      formData: _.merge(formData, user),
-    });
-    if (user && !recruitProfile) {
-      searchCandidates(user.email);
+    if (user) {
+      if (!recruitProfile) searchCandidates(user.email);
+      else {
+        const { country, skills } = formData;
+        const recruitSkills = recruitProfile.skill.split(',').map(s => s.toLowerCase());
+        return this.setState({
+          formData: _.merge(formData, user, {
+            phone: recruitProfile.contact_number,
+            country: _.map(
+              country,
+              c => ({
+                label: c.label,
+                selected: c.label.toLowerCase() === recruitProfile.locality.toLowerCase(),
+              }),
+            ),
+            skills: skills.map(s => ({
+              label: s.label,
+              selected: recruitSkills.includes(s.label.toLowerCase()),
+            })),
+            payExpectation: recruitProfile.salary_expectation,
+          }),
+        });
+      }
+      this.setState({
+        formData: _.merge(formData, user),
+      });
     }
   }
 
   componentDidUpdate(prevProps) {
-    const { recruitProfile } = this.props;
+    const { recruitProfile, user } = this.props;
     if (recruitProfile !== prevProps.recruitProfile && !_.isEmpty(recruitProfile)) {
       // when recruit profile loaded
       const { formData } = this.state;
       const { country, skills } = formData;
       const recruitSkills = recruitProfile.skill.split(',').map(s => s.toLowerCase());
       const updatedForm = {
-        formData: {
-          ...formData,
+        formData: _.merge(formData, user, {
           phone: recruitProfile.contact_number,
           country: _.map(
             country,
@@ -79,7 +100,7 @@ class RecruitCRMJobApplyContainer extends React.Component {
             selected: recruitSkills.includes(s.label.toLowerCase()),
           })),
           payExpectation: recruitProfile.salary_expectation,
-        },
+        }),
       };
       // eslint-disable-next-line react/no-did-update-set-state
       this.setState(updatedForm);