Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
207 changes: 207 additions & 0 deletions app/components/new-join-steps/new-step-six.hbs
Original file line number Diff line number Diff line change
@@ -0,0 +1,207 @@
<div class="step-container">
<div class="form-header__text">
<h1 class="section-heading">{{@heading}}</h1>
<p class="section-instruction">{{@subHeading}}</p>
</div>

<div class="review-section">
<div class="review-section__header">
<h3 class="review-section__title">Personal Information</h3>
<Reusables::Button
@text="Edit"
@variant="light btn--sm"
@test="edit-step-1"
@type="button"
@onClick={{fn @navigateToStep 1}}
/>
</div>
<div class="review-section__content">
<div class="review-field">
<span class="review-field__label">Full Name:</span>
<span class="review-field__value {{unless this.stepData.one.fullName 'review-field__value--missing'}}">
{{if this.stepData.one.fullName this.stepData.one.fullName 'Not provided'}}
</span>
</div>
<div class="review-field">
<span class="review-field__label">Location:</span>
<span class="review-field__value {{unless this.locationDisplay 'review-field__value--missing'}}">
{{this.locationDisplay}}
</span>
</div>
<div class="review-field">
<span class="review-field__label">Applying as:</span>
<span class="review-field__value {{unless this.stepData.one.role 'review-field__value--missing'}}">
{{if this.stepData.one.role this.stepData.one.role 'Not provided'}}
</span>
</div>
<div class="review-field">
<span class="review-field__label">Profile Image:</span>
<span class="review-field__value review-field__value--empty">
Not uploaded
</span>
</div>
</div>
</div>

<div class="review-section">
<div class="review-section__header">
<h3 class="review-section__title">Professional Details</h3>
<Reusables::Button
@text="Edit"
@variant="light btn--sm"
@test="edit-step-2"
@type="button"
@onClick={{fn @navigateToStep 2}}
/>
</div>
<div class="review-section__content">
<div class="review-field">
<span class="review-field__label">Skills:</span>
<span class="review-field__value {{unless this.stepData.two.skills 'review-field__value--missing'}}">
{{if this.stepData.two.skills this.stepData.two.skills 'Not provided'}}
</span>
</div>
<div class="review-field">
<span class="review-field__label">Institution/Company:</span>
<span class="review-field__value {{unless this.stepData.two.company 'review-field__value--missing'}}">
{{if this.stepData.two.company this.stepData.two.company 'Not provided'}}
</span>
</div>
<div class="review-field">
<span class="review-field__label">Introduction:</span>
<span class="review-field__value {{unless this.stepData.two.introduction 'review-field__value--missing'}}">
{{if this.stepData.two.introduction this.stepData.two.introduction 'Not provided'}}
</span>
</div>
</div>
</div>

<div class="review-section">
<div class="review-section__header">
<h3 class="review-section__title">Hobbies & Interests</h3>
<Reusables::Button
@text="Edit"
@variant="light btn--sm"
@test="edit-step-3"
@type="button"
@onClick={{fn @navigateToStep 3}}
/>
</div>
<div class="review-section__content">
<div class="review-field">
<span class="review-field__label">Hobbies:</span>
<span class="review-field__value {{unless this.stepData.three.hobbies 'review-field__value--missing'}}">
{{if this.stepData.three.hobbies this.stepData.three.hobbies 'Not provided'}}
</span>
</div>
<div class="review-field">
<span class="review-field__label">Fun Fact:</span>
<span class="review-field__value {{unless this.stepData.three.funFact 'review-field__value--missing'}}">
{{if this.stepData.three.funFact this.stepData.three.funFact 'Not provided'}}
</span>
</div>
</div>
</div>

<div class="review-section">
<div class="review-section__header">
<h3 class="review-section__title">Social Profiles</h3>
<Reusables::Button
@text="Edit"
@variant="light btn--sm"
@test="edit-step-4"
@type="button"
@onClick={{fn @navigateToStep 4}}
/>
</div>
<div class="review-section__content">
<div class="review-field">
<span class="review-field__label">Phone Number:</span>
<span class="review-field__value {{unless this.stepData.four.phoneNumber 'review-field__value--missing'}}">
{{if this.stepData.four.phoneNumber this.stepData.four.phoneNumber 'Not provided'}}
</span>
</div>
<div class="review-field">
<span class="review-field__label">Twitter:</span>
<span class="review-field__value {{unless this.stepData.four.twitter 'review-field__value--missing'}}">
{{if this.stepData.four.twitter this.stepData.four.twitter 'Not provided'}}
</span>
</div>
{{#if this.showGitHub}}
<div class="review-field">
<span class="review-field__label">GitHub:</span>
<span class="review-field__value {{unless this.stepData.four.github 'review-field__value--missing'}}">
{{if this.stepData.four.github this.stepData.four.github 'Not provided'}}
</span>
</div>
{{/if}}
<div class="review-field">
<span class="review-field__label">LinkedIn:</span>
<span class="review-field__value {{unless this.stepData.four.linkedin 'review-field__value--missing'}}">
{{if this.stepData.four.linkedin this.stepData.four.linkedin 'Not provided'}}
</span>
</div>
<div class="review-field">
<span class="review-field__label">Instagram:</span>
<span class="review-field__value {{if this.stepData.four.instagram '' 'review-field__value--empty'}}">
{{if this.stepData.four.instagram this.stepData.four.instagram 'Not uploaded'}}
</span>
</div>
<div class="review-field">
<span class="review-field__label">Peerlist:</span>
<span class="review-field__value {{unless this.stepData.four.peerlist 'review-field__value--missing'}}">
{{if this.stepData.four.peerlist this.stepData.four.peerlist 'Not provided'}}
</span>
</div>
{{#if this.showBehance}}
<div class="review-field">
<span class="review-field__label">Behance:</span>
<span class="review-field__value {{unless this.stepData.four.behance 'review-field__value--missing'}}">
{{if this.stepData.four.behance this.stepData.four.behance 'Not provided'}}
</span>
</div>
{{/if}}
{{#if this.showDribble}}
<div class="review-field">
<span class="review-field__label">Dribble:</span>
<span class="review-field__value {{unless this.stepData.four.dribble 'review-field__value--missing'}}">
{{if this.stepData.four.dribble this.stepData.four.dribble 'Not provided'}}
</span>
</div>
{{/if}}
</div>
</div>

<div class="review-section">
<div class="review-section__header">
<h3 class="review-section__title">Why Real Dev Squad?</h3>
<Reusables::Button
@text="Edit"
@variant="light btn--sm"
@test="edit-step-5"
@type="button"
@onClick={{fn @navigateToStep 5}}
/>
</div>
<div class="review-section__content">
<div class="review-field">
<span class="review-field__label">Why you want to join Real Dev Squad?:</span>
<span class="review-field__value {{unless this.stepData.five.whyRds 'review-field__value--missing'}}">
{{if this.stepData.five.whyRds this.stepData.five.whyRds 'Not provided'}}
</span>
</div>
<div class="review-field">
<span class="review-field__label">Hours per week:</span>
<span class="review-field__value {{unless this.stepData.five.numberOfHours 'review-field__value--missing'}}">
{{if this.stepData.five.numberOfHours this.stepData.five.numberOfHours 'Not provided'}}
</span>
</div>
<div class="review-field">
<span class="review-field__label">How did you hear about us?:</span>
<span class="review-field__value {{unless this.stepData.five.foundFrom 'review-field__value--missing'}}">
{{if this.stepData.five.foundFrom this.stepData.five.foundFrom 'Not provided'}}
</span>
</div>
</div>
</div>
</div>
57 changes: 57 additions & 0 deletions app/components/new-join-steps/new-step-six.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';
import { getLocalStorageItem } from '../../utils/storage';
import { STEP_DATA_STORAGE_KEY } from '../../constants/new-join-form';

export default class NewStepSixComponent extends Component {
@tracked stepData = {
one: {},
two: {},
three: {},
four: {},
five: {},
};

constructor(...args) {
super(...args);
this.loadAllStepData();
}

loadAllStepData() {
this.stepData.one = JSON.parse(
getLocalStorageItem(STEP_DATA_STORAGE_KEY.stepOne),
);
this.stepData.two = JSON.parse(
getLocalStorageItem(STEP_DATA_STORAGE_KEY.stepTwo),
);
this.stepData.three = JSON.parse(
getLocalStorageItem(STEP_DATA_STORAGE_KEY.stepThree),
);
this.stepData.four = JSON.parse(
getLocalStorageItem(STEP_DATA_STORAGE_KEY.stepFour),
);
this.stepData.five = JSON.parse(
getLocalStorageItem(STEP_DATA_STORAGE_KEY.stepFive),
);
}

get userRole() {
return this.stepData.one.role || '';
}

get showGitHub() {
return this.userRole === 'Developer';
}

get showBehance() {
return this.userRole === 'Designer';
}

get showDribble() {
return this.userRole === 'Designer';
}

get locationDisplay() {
return `${this.stepData.one.city}, ${this.stepData.one.state}, ${this.stepData.one.country}`;
}
}
33 changes: 33 additions & 0 deletions app/components/new-join-steps/thank-you-screen.hbs
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
<div class="thank-you-screen" data-test="thank-you-screen">
<div class="thank-you-screen__logo" data-test="thank-you-logo">
<FaIcon @icon="check" @size="2x" />
</div>

<div class="form-header__text">
<h1 class="section-heading">{{@firstName}}, thank you for applying to RDS.</h1>
<p class="section-instruction">Great work filling up the application. However, it takes more to join us early.</p>
</div>

<div class="thank-you-screen__info-container">
<div class="thank-you-screen__info-item--bullet">
Head over to Application Tracking Page.
</div>

<div class="thank-you-screen__info-item--bullet">
Checkout AI review and and edit your application to improve application rank.
</div>

<div class="thank-you-screen__info-item--bullet">
Complete quests to improve your ranking and increase your chances of early reviews.
</div>
</div>

<div class="application-id">
<h3>Application ID</h3>
<p>{{@applicationId}}</p>
</div>

<div class="thank-you-screen__actions">
<Reusables::Button @text="Track application" @variant="dark" @test="track-application" @type="button" />
</div>
</div>
68 changes: 28 additions & 40 deletions app/components/new-stepper.hbs
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
<section class='stepper' data-test="stepper">

{{#if (not-eq this.currentStep this.MIN_STEP)}}
{{#if (and (not-eq this.currentStep this.MIN_STEP) (not-eq this.currentStep 7))}}
<NewJoinSteps::StepperHeader @currentStep={{this.currentStep}} @totalSteps={{this.MAX_STEP}} />
{{/if}}

Expand All @@ -13,57 +12,46 @@
@disabled={{not this.joinApplicationTerms.hasUserAcceptedTerms}} />
</div>

{{else if (eq this.currentStep 1)}}
<NewJoinSteps::NewStepOne @setIsPreValid={{this.setIsPreValid}} @isValid={{this.isValid}}
{{else if (eq this.currentStep 1)}}
<NewJoinSteps::NewStepOne @setIsPreValid={{this.setIsPreValid}} @isValid={{this.isValid}}
@setIsValid={{this.setIsValid}} />

{{else if (eq this.currentStep 2)}}
<NewJoinSteps::NewStepTwo
@setIsPreValid={{this.setIsPreValid}}
@isValid={{this.isValid}}
@setIsValid={{this.setIsValid}}
@heading={{this.currentHeading}}
@subHeading={{this.currentSubheading}}
/>
{{else if (eq this.currentStep 2)}}
<NewJoinSteps::NewStepTwo @setIsPreValid={{this.setIsPreValid}} @isValid={{this.isValid}}
@setIsValid={{this.setIsValid}} @heading={{this.currentHeading}} @subHeading={{this.currentSubheading}} />

{{else if (eq this.currentStep 3)}}
<NewJoinSteps::NewStepThree @setIsPreValid={{this.setIsPreValid}} @isValid={{this.isValid}}
@setIsValid={{this.setIsValid}} @heading={{this.currentHeading}} @subHeading={{this.currentSubheading}} />

{{else if (eq this.currentStep 4)}}
<NewJoinSteps::NewStepFour @setIsPreValid={{this.setIsPreValid}} @isValid={{this.isValid}}
@setIsValid={{this.setIsValid}} @heading={{this.currentHeading}} @subHeading={{this.currentSubheading}} />

{{else if (eq this.currentStep 5)}}
<NewJoinSteps::NewStepFive @setIsPreValid={{this.setIsPreValid}} @isValid={{this.isValid}}
@setIsValid={{this.setIsValid}} @heading={{this.currentHeading}} @subHeading={{this.currentSubheading}} />

{{else if (eq this.currentStep 3)}}
<NewJoinSteps::NewStepThree
@setIsPreValid={{this.setIsPreValid}}
@isValid={{this.isValid}}
@setIsValid={{this.setIsValid}}
@heading={{this.currentHeading}}
@subHeading={{this.currentSubheading}}
/>
{{else if (eq this.currentStep 6)}}
<NewJoinSteps::NewStepSix @heading={{this.currentHeading}} @subHeading={{this.currentSubheading}}
@navigateToStep={{this.navigateToStep}} @onSubmit={{this.handleSubmit}} />

{{else if (eq this.currentStep 4)}}
<NewJoinSteps::NewStepFour
@setIsPreValid={{this.setIsPreValid}}
@isValid={{this.isValid}}
@setIsValid={{this.setIsValid}}
@heading={{this.currentHeading}}
@subHeading={{this.currentSubheading}}
/>

{{else if (eq this.currentStep 5)}}
<NewJoinSteps::NewStepFive
@setIsPreValid={{this.setIsPreValid}}
@isValid={{this.isValid}}
@setIsValid={{this.setIsValid}}
@heading={{this.currentHeading}}
@subHeading={{this.currentSubheading}}
/>
{{else if (eq this.currentStep 7)}}
<NewJoinSteps::ThankYouScreen @firstName={{this.firstName}} @applicationId={{this.applicationId}}
@onTrackApplication={{this.handleTrackApplication}} />
{{/if}}
</form>

{{#if (not-eq this.currentStep this.MIN_STEP)}}
{{#if (and (not-eq this.currentStep this.MIN_STEP) (not-eq this.currentStep 7))}}
<div class="new-stepper__buttons">
{{#if this.showPreviousButton}}
<Reusables::Button @text="Previous" @variant="light" @test="prev-btn" @type="button" @onClick={{this.decrementStep}}
@class="prev-button" />
{{/if}}

<Reusables::Button @text="Next" @variant="dark" @test="next-btn" @type="button" @onClick={{this.incrementStep}}
@disabled={{this.isNextButtonDisabled}} @class="next-button" />
<Reusables::Button @text={{if this.isReviewStep "Submit" "Next" }} @variant="dark" @class="next-button" @test={{if
this.isReviewStep "submit-review" "next-btn" }} @type="button" @onClick={{if this.isReviewStep this.handleSubmit
this.incrementStep}} @disabled={{unless this.isReviewStep this.isNextButtonDisabled}} />
</div>
{{/if}}
</section>
Loading