Skip to content

Commit 033aea3

Browse files
refactor: use structure for step data and replace hardcoded storage keys
1 parent 3dcdb99 commit 033aea3

4 files changed

Lines changed: 67 additions & 67 deletions

File tree

app/components/new-join-steps/new-step-six.hbs

Lines changed: 37 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -18,20 +18,20 @@
1818
<div class="review-section__content">
1919
<div class="review-field">
2020
<span class="review-field__label">Full Name:</span>
21-
<span class="review-field__value {{unless this.stepOneData.fullName 'review-field__value--missing'}}">
22-
{{if this.stepOneData.fullName this.stepOneData.fullName 'Not provided'}}
21+
<span class="review-field__value {{unless this.stepData.one.fullName 'review-field__value--missing'}}">
22+
{{if this.stepData.one.fullName this.stepData.one.fullName 'Not provided'}}
2323
</span>
2424
</div>
2525
<div class="review-field">
2626
<span class="review-field__label">Location:</span>
27-
<span class="review-field__value {{unless this.hasLocation 'review-field__value--missing'}}">
27+
<span class="review-field__value {{unless this.locationDisplay 'review-field__value--missing'}}">
2828
{{this.locationDisplay}}
2929
</span>
3030
</div>
3131
<div class="review-field">
3232
<span class="review-field__label">Applying as:</span>
33-
<span class="review-field__value {{unless this.stepOneData.role 'review-field__value--missing'}}">
34-
{{if this.stepOneData.role this.stepOneData.role 'Not provided'}}
33+
<span class="review-field__value {{unless this.stepData.one.role 'review-field__value--missing'}}">
34+
{{if this.stepData.one.role this.stepData.one.role 'Not provided'}}
3535
</span>
3636
</div>
3737
<div class="review-field">
@@ -57,20 +57,20 @@
5757
<div class="review-section__content">
5858
<div class="review-field">
5959
<span class="review-field__label">Skills:</span>
60-
<span class="review-field__value {{unless this.stepTwoData.skills 'review-field__value--missing'}}">
61-
{{if this.stepTwoData.skills this.stepTwoData.skills 'Not provided'}}
60+
<span class="review-field__value {{unless this.stepData.two.skills 'review-field__value--missing'}}">
61+
{{if this.stepData.two.skills this.stepData.two.skills 'Not provided'}}
6262
</span>
6363
</div>
6464
<div class="review-field">
6565
<span class="review-field__label">Institution/Company:</span>
66-
<span class="review-field__value {{unless this.stepTwoData.company 'review-field__value--missing'}}">
67-
{{if this.stepTwoData.company this.stepTwoData.company 'Not provided'}}
66+
<span class="review-field__value {{unless this.stepData.two.company 'review-field__value--missing'}}">
67+
{{if this.stepData.two.company this.stepData.two.company 'Not provided'}}
6868
</span>
6969
</div>
7070
<div class="review-field">
7171
<span class="review-field__label">Introduction:</span>
72-
<span class="review-field__value {{unless this.stepTwoData.introduction 'review-field__value--missing'}}">
73-
{{if this.stepTwoData.introduction this.stepTwoData.introduction 'Not provided'}}
72+
<span class="review-field__value {{unless this.stepData.two.introduction 'review-field__value--missing'}}">
73+
{{if this.stepData.two.introduction this.stepData.two.introduction 'Not provided'}}
7474
</span>
7575
</div>
7676
</div>
@@ -90,14 +90,14 @@
9090
<div class="review-section__content">
9191
<div class="review-field">
9292
<span class="review-field__label">Hobbies:</span>
93-
<span class="review-field__value {{unless this.stepThreeData.hobbies 'review-field__value--missing'}}">
94-
{{if this.stepThreeData.hobbies this.stepThreeData.hobbies 'Not provided'}}
93+
<span class="review-field__value {{unless this.stepData.three.hobbies 'review-field__value--missing'}}">
94+
{{if this.stepData.three.hobbies this.stepData.three.hobbies 'Not provided'}}
9595
</span>
9696
</div>
9797
<div class="review-field">
9898
<span class="review-field__label">Fun Fact:</span>
99-
<span class="review-field__value {{unless this.stepThreeData.funFact 'review-field__value--missing'}}">
100-
{{if this.stepThreeData.funFact this.stepThreeData.funFact 'Not provided'}}
99+
<span class="review-field__value {{unless this.stepData.three.funFact 'review-field__value--missing'}}">
100+
{{if this.stepData.three.funFact this.stepData.three.funFact 'Not provided'}}
101101
</span>
102102
</div>
103103
</div>
@@ -117,55 +117,55 @@
117117
<div class="review-section__content">
118118
<div class="review-field">
119119
<span class="review-field__label">Phone Number:</span>
120-
<span class="review-field__value {{unless this.stepFourData.phoneNumber 'review-field__value--missing'}}">
121-
{{if this.stepFourData.phoneNumber this.stepFourData.phoneNumber 'Not provided'}}
120+
<span class="review-field__value {{unless this.stepData.four.phoneNumber 'review-field__value--missing'}}">
121+
{{if this.stepData.four.phoneNumber this.stepData.four.phoneNumber 'Not provided'}}
122122
</span>
123123
</div>
124124
<div class="review-field">
125125
<span class="review-field__label">Twitter:</span>
126-
<span class="review-field__value {{unless this.stepFourData.twitter 'review-field__value--missing'}}">
127-
{{if this.stepFourData.twitter this.stepFourData.twitter 'Not provided'}}
126+
<span class="review-field__value {{unless this.stepData.four.twitter 'review-field__value--missing'}}">
127+
{{if this.stepData.four.twitter this.stepData.four.twitter 'Not provided'}}
128128
</span>
129129
</div>
130130
{{#if this.showGitHub}}
131131
<div class="review-field">
132132
<span class="review-field__label">GitHub:</span>
133-
<span class="review-field__value {{unless this.stepFourData.github 'review-field__value--missing'}}">
134-
{{if this.stepFourData.github this.stepFourData.github 'Not provided'}}
133+
<span class="review-field__value {{unless this.stepData.four.github 'review-field__value--missing'}}">
134+
{{if this.stepData.four.github this.stepData.four.github 'Not provided'}}
135135
</span>
136136
</div>
137137
{{/if}}
138138
<div class="review-field">
139139
<span class="review-field__label">LinkedIn:</span>
140-
<span class="review-field__value {{unless this.stepFourData.linkedin 'review-field__value--missing'}}">
141-
{{if this.stepFourData.linkedin this.stepFourData.linkedin 'Not provided'}}
140+
<span class="review-field__value {{unless this.stepData.four.linkedin 'review-field__value--missing'}}">
141+
{{if this.stepData.four.linkedin this.stepData.four.linkedin 'Not provided'}}
142142
</span>
143143
</div>
144144
<div class="review-field">
145145
<span class="review-field__label">Instagram:</span>
146-
<span class="review-field__value {{if this.stepFourData.instagram '' 'review-field__value--empty'}}">
147-
{{if this.stepFourData.instagram this.stepFourData.instagram 'Not uploaded'}}
146+
<span class="review-field__value {{if this.stepData.four.instagram '' 'review-field__value--empty'}}">
147+
{{if this.stepData.four.instagram this.stepData.four.instagram 'Not uploaded'}}
148148
</span>
149149
</div>
150150
<div class="review-field">
151151
<span class="review-field__label">Peerlist:</span>
152-
<span class="review-field__value {{unless this.stepFourData.peerlist 'review-field__value--missing'}}">
153-
{{if this.stepFourData.peerlist this.stepFourData.peerlist 'Not provided'}}
152+
<span class="review-field__value {{unless this.stepData.four.peerlist 'review-field__value--missing'}}">
153+
{{if this.stepData.four.peerlist this.stepData.four.peerlist 'Not provided'}}
154154
</span>
155155
</div>
156156
{{#if this.showBehance}}
157157
<div class="review-field">
158158
<span class="review-field__label">Behance:</span>
159-
<span class="review-field__value {{unless this.stepFourData.behance 'review-field__value--missing'}}">
160-
{{if this.stepFourData.behance this.stepFourData.behance 'Not provided'}}
159+
<span class="review-field__value {{unless this.stepData.four.behance 'review-field__value--missing'}}">
160+
{{if this.stepData.four.behance this.stepData.four.behance 'Not provided'}}
161161
</span>
162162
</div>
163163
{{/if}}
164164
{{#if this.showDribble}}
165165
<div class="review-field">
166166
<span class="review-field__label">Dribble:</span>
167-
<span class="review-field__value {{unless this.stepFourData.dribble 'review-field__value--missing'}}">
168-
{{if this.stepFourData.dribble this.stepFourData.dribble 'Not provided'}}
167+
<span class="review-field__value {{unless this.stepData.four.dribble 'review-field__value--missing'}}">
168+
{{if this.stepData.four.dribble this.stepData.four.dribble 'Not provided'}}
169169
</span>
170170
</div>
171171
{{/if}}
@@ -186,20 +186,20 @@
186186
<div class="review-section__content">
187187
<div class="review-field">
188188
<span class="review-field__label">Why you want to join Real Dev Squad?:</span>
189-
<span class="review-field__value {{unless this.stepFiveData.whyRds 'review-field__value--missing'}}">
190-
{{if this.stepFiveData.whyRds this.stepFiveData.whyRds 'Not provided'}}
189+
<span class="review-field__value {{unless this.stepData.five.whyRds 'review-field__value--missing'}}">
190+
{{if this.stepData.five.whyRds this.stepData.five.whyRds 'Not provided'}}
191191
</span>
192192
</div>
193193
<div class="review-field">
194194
<span class="review-field__label">Hours per week:</span>
195-
<span class="review-field__value {{unless this.stepFiveData.numberOfHours 'review-field__value--missing'}}">
196-
{{if this.stepFiveData.numberOfHours this.stepFiveData.numberOfHours 'Not provided'}}
195+
<span class="review-field__value {{unless this.stepData.five.numberOfHours 'review-field__value--missing'}}">
196+
{{if this.stepData.five.numberOfHours this.stepData.five.numberOfHours 'Not provided'}}
197197
</span>
198198
</div>
199199
<div class="review-field">
200200
<span class="review-field__label">How did you hear about us?:</span>
201-
<span class="review-field__value {{unless this.stepFiveData.foundFrom 'review-field__value--missing'}}">
202-
{{if this.stepFiveData.foundFrom this.stepFiveData.foundFrom 'Not provided'}}
201+
<span class="review-field__value {{unless this.stepData.five.foundFrom 'review-field__value--missing'}}">
202+
{{if this.stepData.five.foundFrom this.stepData.five.foundFrom 'Not provided'}}
203203
</span>
204204
</div>
205205
</div>
Lines changed: 21 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,42 @@
11
import Component from '@glimmer/component';
22
import { tracked } from '@glimmer/tracking';
3+
import { getLocalStorageItem } from '../../utils/storage';
4+
import { STEP_DATA_STORAGE_KEY } from '../../constants/new-join-form';
35

46
export default class NewStepSixComponent extends Component {
5-
@tracked stepOneData = {};
6-
@tracked stepTwoData = {};
7-
@tracked stepThreeData = {};
8-
@tracked stepFourData = {};
9-
@tracked stepFiveData = {};
7+
@tracked stepData = {
8+
one: {},
9+
two: {},
10+
three: {},
11+
four: {},
12+
five: {},
13+
};
1014

1115
constructor(...args) {
1216
super(...args);
1317
this.loadAllStepData();
1418
}
1519

1620
loadAllStepData() {
17-
this.stepOneData = JSON.parse(
18-
localStorage.getItem('newStepOneData') || '{}',
21+
this.stepData.one = JSON.parse(
22+
getLocalStorageItem(STEP_DATA_STORAGE_KEY.stepOne),
1923
);
20-
this.stepTwoData = JSON.parse(
21-
localStorage.getItem('newStepTwoData') || '{}',
24+
this.stepData.two = JSON.parse(
25+
getLocalStorageItem(STEP_DATA_STORAGE_KEY.stepTwo),
2226
);
23-
this.stepThreeData = JSON.parse(
24-
localStorage.getItem('newStepThreeData') || '{}',
27+
this.stepData.three = JSON.parse(
28+
getLocalStorageItem(STEP_DATA_STORAGE_KEY.stepThree),
2529
);
26-
this.stepFourData = JSON.parse(
27-
localStorage.getItem('newStepFourData') || '{}',
30+
this.stepData.four = JSON.parse(
31+
getLocalStorageItem(STEP_DATA_STORAGE_KEY.stepFour),
2832
);
29-
this.stepFiveData = JSON.parse(
30-
localStorage.getItem('newStepFiveData') || '{}',
33+
this.stepData.five = JSON.parse(
34+
getLocalStorageItem(STEP_DATA_STORAGE_KEY.stepFive),
3135
);
3236
}
3337

3438
get userRole() {
35-
return this.stepOneData.role || '';
39+
return this.stepData.one.role || '';
3640
}
3741

3842
get showGitHub() {
@@ -48,18 +52,6 @@ export default class NewStepSixComponent extends Component {
4852
}
4953

5054
get locationDisplay() {
51-
const parts = [];
52-
if (this.stepOneData.city) parts.push(this.stepOneData.city);
53-
if (this.stepOneData.state) parts.push(this.stepOneData.state);
54-
if (this.stepOneData.country) parts.push(this.stepOneData.country);
55-
return parts.length > 0 ? parts.join(', ') : 'Not provided';
56-
}
57-
58-
get hasLocation() {
59-
return !!(
60-
this.stepOneData.country ||
61-
this.stepOneData.state ||
62-
this.stepOneData.city
63-
);
55+
return `${this.stepData.one.city}, ${this.stepData.one.state}, ${this.stepData.one.country}`;
6456
}
6557
}

app/components/new-stepper.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { tracked } from '@glimmer/tracking';
33
import { action } from '@ember/object';
44
import { inject as service } from '@ember/service';
55
import { NEW_FORM_STEPS } from '../constants/new-join-form';
6-
import { getLocalStorageItem, setLocalStorageItem } from '../../utils/storage';
6+
import { getLocalStorageItem, setLocalStorageItem } from '../utils/storage';
77

88
export default class NewStepperComponent extends Component {
99
MIN_STEP = 0;

app/constants/new-join-form.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -56,3 +56,11 @@ export const NEW_STEP_LIMITS = {
5656
foundFrom: { min: 1 },
5757
},
5858
};
59+
60+
export const STEP_DATA_STORAGE_KEY = {
61+
stepOne: 'newStepOneData',
62+
stepTwo: 'newStepTwoData',
63+
stepThree: 'newStepThreeData',
64+
stepFour: 'newStepFourData',
65+
stepFive: 'newStepFiveData',
66+
};

0 commit comments

Comments
 (0)