Check if course already exists in term when adding it from course details dialog

src/app/degree-planner/shared/course-item/course-item.component.ts

@@ -137,7 +137,7 @@ export class CourseItemComponent implements OnInit {
             title: "Can't add course",
             confirmText: 'OK',
             dialogClass: 'alertDialog',
-            text: `This course already exists in selected term!`,
+            text: `This course already exists in selected term`,
           },
         })
         .afterClosed();

src/app/degree-planner/term-container/term-container.component.ts

@@ -153,7 +153,7 @@ export class TermContainerComponent implements OnInit, OnDestroy {
             title: "Can't add course to term",
             confirmText: 'OK',
             dialogClass: 'alertDialog',
-            text: `This course already exists in selected term!`,
+            text: `This course already exists in selected term`,
           },
         })
         .afterClosed();

src/app/shared/components/course-details/course-details.component.ts

-import { Component, OnInit, OnDestroy, Inject } from '@angular/core';
+import { Component, OnInit, OnDestroy, Inject, Input } from '@angular/core';
 import { MAT_DIALOG_DATA } from '@angular/material';
 import { FormBuilder, FormGroup } from '@angular/forms';
 import { Observable, Subscription } from 'rxjs';
-import { distinctUntilChanged, map } from 'rxjs/operators';
+import { distinctUntilChanged, map, filter } from 'rxjs/operators';
+import { MatDialog } from '@angular/material';
 import { Store, select } from '@ngrx/store';
 
 import { CourseDetails } from '@app/core/models/course-details';
@@ -10,32 +11,43 @@ import * as selectors from '@app/degree-planner/store/selectors';
 import * as utils from '@app/degree-planner/shared/utils';
 import { TermCode } from '@app/core/models/termcode';
 import { GlobalState } from '@app/core/state';
+import { Course } from '@app/core/models/course';
+import { PlannedTerm } from '@app/core/models/planned-term';
+import { ConfirmDialogComponent } from '@app/shared/dialogs/confirm-dialog/confirm-dialog.component';
 
 import {
   AddCourse,
   RemoveSaveForLater,
 } from '@app/degree-planner/store/actions/course.actions';
 
+const isntUndefined = <T>(thing: T | undefined): thing is T => {
+  return thing !== undefined;
+};
+
 @Component({
   selector: 'cse-course-details',
   templateUrl: './course-details.component.html',
   styleUrls: ['./course-details.component.scss'],
 })
 export class CourseDetailsComponent implements OnInit, OnDestroy {
+  @Input() termCode: TermCode;
   public courseDetails: CourseDetails;
   public type: 'course' | 'search' | 'saved';
   public selectedSearchTerm: string;
-
+  public term$: Observable<PlannedTerm>;
   public termSelector: FormGroup;
 
   public selectedSearchTerm$: Observable<string>;
   public droppableTermCodes$: Observable<string[]>;
   public searchTermSubscription: Subscription;
+  public termSubscription: Subscription;
+  public plannedCourses: ReadonlyArray<Course>;
 
   constructor(
     @Inject(MAT_DIALOG_DATA) public data: any,
     private store: Store<GlobalState>,
     private fb: FormBuilder,
+    public dialog: MatDialog,
   ) {
     this.courseDetails = data.courseDetails;
     this.type = data.courseType;
@@ -70,6 +82,7 @@ export class CourseDetailsComponent implements OnInit, OnDestroy {
 
   addCourseToPlan($event) {
     $event.preventDefault();
+
     const termCode = new TermCode(this.termSelector.value.term);
     const subjectCode = this.courseDetails.subject.subjectCode;
     const courseId = this.courseDetails.courseId;
@@ -81,15 +94,45 @@ export class CourseDetailsComponent implements OnInit, OnDestroy {
       catalogNumber: this.courseDetails.catalogNumber,
     };
 
-    switch (this.type) {
-      case 'search':
-        this.store.dispatch(new AddCourse(payload));
-        break;
+    this.term$ = this.store.pipe(
+      select(selectors.selectVisibleTerm, {
+        termCode: new TermCode(this.termSelector.value.term),
+      }),
+      filter(isntUndefined),
+      distinctUntilChanged(),
+    );
+    this.termSubscription = this.term$.subscribe(term => {
+      this.plannedCourses = term.plannedCourses;
+    });
+
+    const isCourseInPlannedCourses = this.plannedCourses.some(
+      course => course.courseId === this.courseDetails.courseId,
+    );
+
+    if (isCourseInPlannedCourses) {
+      this.dialog
+        .open(ConfirmDialogComponent, {
+          data: {
+            title: "Can't add course to term",
+            confirmText: 'OK',
+            dialogClass: 'alertDialog',
+            text: `This course already exists in selected term`,
+          },
+        })
+        .afterClosed();
+    } else {
+      switch (this.type) {
+        case 'search':
+          this.store.dispatch(new AddCourse(payload));
+          break;
 
-      case 'saved':
-        this.store.dispatch(new AddCourse(payload));
-        this.store.dispatch(new RemoveSaveForLater({ subjectCode, courseId }));
-        break;
+        case 'saved':
+          this.store.dispatch(new AddCourse(payload));
+          this.store.dispatch(
+            new RemoveSaveForLater({ subjectCode, courseId }),
+          );
+          break;
+      }
     }
   }
 }