diff --git a/src/components/Modals/Onboarding/Onboarding.vue b/src/components/Modals/Onboarding/Onboarding.vue index d84405dc4..17646a514 100644 --- a/src/components/Modals/Onboarding/Onboarding.vue +++ b/src/components/Modals/Onboarding/Onboarding.vue @@ -57,6 +57,12 @@
Please fill out all required fields and try again.
+
+ Invalid major or minor. Delete the placeholder major or minor and try again. +
@@ -95,6 +101,7 @@ import OnboardingBasic from '@/components/Modals/Onboarding/OnboardingBasic.vue' import OnboardingTransfer from '@/components/Modals/Onboarding/OnboardingTransfer.vue'; import OnboardingReview from '@/components/Modals/Onboarding/OnboardingReview.vue'; import { db, onboardingDataCollection, usernameCollection } from '@/firebaseConfig'; +import { getMajorFullName, getMinorFullName } from '@/utilities'; import store from '@/store'; const placeholderText = 'Select one'; @@ -111,42 +118,53 @@ export default defineComponent({ data() { return { currentPage: 1, - isError: false, name: { ...this.userName }, onboarding: { ...this.onboardingData }, }; }, - methods: { - submitOnboarding() { - // Display error if a required field is empty, otherwise submit - if ( + computed: { + // Display error if a required field is empty + isError(): boolean { + return ( this.name.firstName === '' || this.name.lastName === '' || this.onboarding.college === '' || this.onboarding.gradYear === '' || this.onboarding.entranceYear === '' - ) { - this.isError = true; - } else { - db.batch() - .set(usernameCollection.doc(store.state.currentFirebaseUser.email), { - firstName: this.name.firstName, - middleName: this.name.middleName, - lastName: this.name.lastName, - }) - .set(onboardingDataCollection.doc(store.state.currentFirebaseUser.email), { - gradYear: this.onboarding.gradYear, - entranceYear: this.onboarding.entranceYear, - colleges: [{ acronym: this.onboarding.college }], - majors: this.onboarding.major.map(acronym => ({ acronym })), - minors: this.onboarding.minor.map(acronym => ({ acronym })), - exam: this.onboarding.exam, - class: this.onboarding.transferCourse, - tookSwim: this.onboarding.tookSwim, - }) - .commit(); - this.$emit('onboard'); - } + ); + }, + // Display error if onboarding data includes a major or minor that doesn't exist in requirementsJSON + isInvalidMajorOrMinorError(): boolean { + return ( + this.onboarding.major + .map(getMajorFullName) + .some((majorFullName: string) => majorFullName === '') || + this.onboarding.minor + .map(getMinorFullName) + .some((minorFullName: string) => minorFullName === '') + ); + }, + }, + methods: { + submitOnboarding() { + db.batch() + .set(usernameCollection.doc(store.state.currentFirebaseUser.email), { + firstName: this.name.firstName, + middleName: this.name.middleName, + lastName: this.name.lastName, + }) + .set(onboardingDataCollection.doc(store.state.currentFirebaseUser.email), { + gradYear: this.onboarding.gradYear, + entranceYear: this.onboarding.entranceYear, + colleges: [{ acronym: this.onboarding.college }], + majors: this.onboarding.major.map(acronym => ({ acronym })), + minors: this.onboarding.minor.map(acronym => ({ acronym })), + exam: this.onboarding.exam, + class: this.onboarding.transferCourse, + tookSwim: this.onboarding.tookSwim, + }) + .commit(); + this.$emit('onboard'); }, goBack() { this.currentPage = this.currentPage - 1 === 0 ? 0 : this.currentPage - 1; @@ -155,7 +173,10 @@ export default defineComponent({ this.currentPage = page; }, goNext() { - this.currentPage = this.currentPage === FINAL_PAGE ? FINAL_PAGE : this.currentPage + 1; + // Only move onto next page if error message is not displayed + if (!(this.isError || this.isInvalidMajorOrMinorError)) { + this.currentPage = this.currentPage === FINAL_PAGE ? FINAL_PAGE : this.currentPage + 1; + } }, updateBasic( gradYear: string, diff --git a/src/utilities.ts b/src/utilities.ts index 187f4c01a..363ecc5a0 100644 --- a/src/utilities.ts +++ b/src/utilities.ts @@ -33,15 +33,21 @@ export function getCurrentYearSuffix(): string { } export function getCollegeFullName(acronym: string): string { - return requirementJSON.college[acronym].name; + // Return empty string if college is not in requirementJSON + const college = requirementJSON.college[acronym]; + return college ? college.name : ''; } export function getMajorFullName(acronym: string): string { - return requirementJSON.major[acronym].name; + // Return empty string if major is not in requirementJSON + const major = requirementJSON.major[acronym]; + return major ? major.name : ''; } export function getMinorFullName(acronym: string): string { - return requirementJSON.minor[acronym].name; + // Return empty string if minor is not in requirementJSON + const minor = requirementJSON.minor[acronym]; + return minor ? minor.name : ''; } function getAllSubjects(): ReadonlySet {