Skip to content

Commit 1c4a31d

Browse files
jmgasperjmgasper
authored
Merge pull request #681 from topcoder-platform/issue-675
The entered data is not saved if the user clicks Back button in any step
2 parents eb005f1 + 0491212 commit 1c4a31d

File tree

7 files changed

+88
-39
lines changed

7 files changed

+88
-39
lines changed

‎src/apps/onboarding/src/components/skill-tag/index.tsx‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,12 +12,18 @@ import styles from './styles.module.scss'
1212
interface SkillTagProps {
1313
skill: Skill
1414
onDelete?: () => void
15+
disabled?: boolean
1516
}
1617

1718
const SkillTag: FC<SkillTagProps> = (props: SkillTagProps) => (
1819
<div className={classNames('d-flex align-items-center', styles.container)}>
1920
{props.skill.name}
20-
<button type='button' className={styles.btnDelete} onClick={props.onDelete}>
21+
<button
22+
type='button'
23+
className={styles.btnDelete}
24+
onClick={props.onDelete}
25+
disabled={props.disabled}
26+
>
2127
<img width={7} height={7} src={XIcon} alt='' />
2228
</button>
2329
</div>

‎src/apps/onboarding/src/components/skill-tag/styles.module.scss‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,4 +16,8 @@
1616
flex-shrink: 0;
1717
width: 15px;
1818
height: 15px;
19+
20+
&:disabled {
21+
opacity: 0.2;
22+
}
1923
}

‎src/apps/onboarding/src/pages/educations/index.tsx‎

Lines changed: 24 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,25 @@ export const PageEducationsContent: FC<{
3939
/* eslint-disable react-hooks/exhaustive-deps */
4040
}, [props.reduxEducations])
4141

42+
useEffect(() => {
43+
const saveData: any = async () => {
44+
setLoading(true)
45+
if (!props.reduxEducations) {
46+
await props.createMemberEducations(educations || [])
47+
} else {
48+
await props.updateMemberEducations(educations || [])
49+
}
50+
51+
setLoading(false)
52+
}
53+
54+
if (!!educations && !_.isEqual(props.reduxEducations, educations)) {
55+
saveData()
56+
.then(_.noop)
57+
}
58+
/* eslint-disable react-hooks/exhaustive-deps */
59+
}, [educations])
60+
4261
return (
4362
<div className={classNames('d-flex flex-column', styles.container)}>
4463
<h2>Add your education information</h2>
@@ -57,13 +76,17 @@ export const PageEducationsContent: FC<{
5776
setEditingEducation(education)
5877
setShowAddEducationModal(true)
5978
}}
79+
disabled={loading}
80+
className={styles.btn}
6081
>
6182
<img width={15} height={15} src={IconEdit} alt='' />
6283
</button>
6384
<button
6485
aria-label='edit'
6586
type='button'
6687
onClick={() => setEducations(_.filter(educations, w => w.id !== education.id))}
88+
disabled={loading}
89+
className={styles.btn}
6790
>
6891
<img width={15} height={15} src={IconTrash} alt='' />
6992
</button>
@@ -111,19 +134,7 @@ export const PageEducationsContent: FC<{
111134
size='lg'
112135
primary
113136
iconToLeft
114-
disabled={loading || props.loadingMemberTraits}
115-
onClick={async () => {
116-
setLoading(true)
117-
if (!_.isEqual(props.reduxEducations, educations)) {
118-
if (!props.reduxEducations) {
119-
await props.createMemberEducations(educations || [])
120-
} else {
121-
await props.updateMemberEducations(educations || [])
122-
}
123-
}
124-
125-
setLoading(false)
126-
}}
137+
disabled={loading}
127138
>
128139
next
129140
</Button>

‎src/apps/onboarding/src/pages/educations/styles.module.scss‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,3 +10,7 @@
1010
margin-top: auto;
1111
margin-bottom: 32px;
1212
}
13+
14+
.btn:disabled {
15+
opacity: 0.2;
16+
}

‎src/apps/onboarding/src/pages/skills/index.tsx‎

Lines changed: 17 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,20 @@ const PageSkillsContent: FC<{
3333
/* eslint-disable react-hooks/exhaustive-deps */
3434
}, [props.memberInfo])
3535

36+
useEffect(() => {
37+
const saveData: any = async () => {
38+
setLoading(true)
39+
await props.updateMemberSkills([...(skillsFilter || [])])
40+
setLoading(false)
41+
}
42+
43+
if (!!skillsFilter && !_.isEqual(props.memberInfo?.emsiSkills, skillsFilter)) {
44+
saveData()
45+
.then(_.noop)
46+
}
47+
/* eslint-disable react-hooks/exhaustive-deps */
48+
}, [skillsFilter])
49+
3650
return (
3751
<div className={classNames('d-flex flex-column', styles.container)}>
3852
<h2>What skills do you have?</h2>
@@ -58,6 +72,7 @@ const PageSkillsContent: FC<{
5872
<SkillTag
5973
key={skillItem.name}
6074
skill={skillItem}
75+
disabled={loading}
6176
onDelete={() => {
6277
setSkillsFilter(
6378
_.filter(skillsFilter, skill => skill.name !== skillItem.name),
@@ -121,6 +136,7 @@ const PageSkillsContent: FC<{
121136
size='lg'
122137
primary
123138
iconToLeft
139+
disabled={loading}
124140
onClick={() => navigate('../start')}
125141
>
126142
back
@@ -130,15 +146,7 @@ const PageSkillsContent: FC<{
130146
primary
131147
iconToLeft
132148
disabled={loading}
133-
onClick={async () => {
134-
setLoading(true)
135-
if (!_.isEqual(props.memberInfo?.emsiSkills, skillsFilter)) {
136-
await props.updateMemberSkills([...(skillsFilter || [])])
137-
}
138-
139-
setLoading(false)
140-
navigate('../works')
141-
}}
149+
onClick={() => navigate('../works')}
142150
>
143151
next
144152
</Button>

‎src/apps/onboarding/src/pages/works/index.tsx‎

Lines changed: 27 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,25 @@ export const PageWorksContent: FC<{
3939
/* eslint-disable react-hooks/exhaustive-deps */
4040
}, [props.reduxWorks])
4141

42+
useEffect(() => {
43+
const saveData: any = async () => {
44+
setLoading(true)
45+
if (!props.reduxWorks) {
46+
await props.createMemberWorks(works || [])
47+
} else {
48+
await props.updateMemberWorks(works || [])
49+
}
50+
51+
setLoading(false)
52+
}
53+
54+
if (!!works && !_.isEqual(props.reduxWorks, works)) {
55+
saveData()
56+
.then(_.noop)
57+
}
58+
/* eslint-disable react-hooks/exhaustive-deps */
59+
}, [works])
60+
4261
return (
4362
<div className={classNames('d-flex flex-column', styles.container)}>
4463
<h2>Add your work experience here</h2>
@@ -58,13 +77,17 @@ export const PageWorksContent: FC<{
5877
setEditingWork(work)
5978
setShowAddWorkModal(true)
6079
}}
80+
disabled={loading}
81+
className={styles.btn}
6182
>
6283
<img width={15} height={15} src={IconEdit} alt='' />
6384
</button>
6485
<button
6586
aria-label='delete'
6687
type='button'
6788
onClick={() => setWorks(_.filter(works, w => w.id !== work.id))}
89+
disabled={loading}
90+
className={styles.btn}
6891
>
6992
<img width={15} height={15} src={IconTrash} alt='' />
7093
</button>
@@ -89,7 +112,7 @@ export const PageWorksContent: FC<{
89112
secondary
90113
iconToLeft
91114
onClick={() => setShowAddWorkModal(true)}
92-
disabled={props.loadingMemberTraits}
115+
disabled={props.loadingMemberTraits || loading}
93116
>
94117
+ add work experience
95118
</Button>
@@ -113,6 +136,7 @@ export const PageWorksContent: FC<{
113136
size='lg'
114137
primary
115138
iconToLeft
139+
disabled={loading}
116140
onClick={() => navigate('../skills')}
117141
>
118142
back
@@ -121,20 +145,8 @@ export const PageWorksContent: FC<{
121145
size='lg'
122146
primary
123147
iconToLeft
124-
disabled={loading || props.loadingMemberTraits}
125-
onClick={async () => {
126-
setLoading(true)
127-
if (!_.isEqual(props.reduxWorks, works)) {
128-
if (!props.reduxWorks) {
129-
await props.createMemberWorks(works || [])
130-
} else {
131-
await props.updateMemberWorks(works || [])
132-
}
133-
}
134-
135-
setLoading(false)
136-
navigate('../educations')
137-
}}
148+
disabled={loading}
149+
onClick={() => navigate('../educations')}
138150
>
139151
next
140152
</Button>

‎src/apps/onboarding/src/pages/works/styles.module.scss‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,4 +17,8 @@
1717

1818
.textPosition {
1919
font-weight: 700;
20-
}
20+
}
21+
22+
.btn:disabled {
23+
opacity: 0.2;
24+
}

0 commit comments

Comments
 (0)