feat: abhinavchadaga/course-catalog-popup (#128)

* some work

* some work on course popup

update the stories and create the header component

* use chip component in header

* complete CourseHeaderAndActions Component

added course buttons, using proper subcomponents now.

* Change test course to 314

* Add rmp callback

* some unocss updates

* add course button onclick handlers

* add todo for calendar button

* Rename CoursePopup

Old one to "Old", remove "2" from new one

* description stuff done

* Modify story to use proper course info

* Add Grade Distribution Stuff

* Minor tweaks

change style in header

* Add TODO

replace current grade colors with a tailwind palette

* Fix syllabi url

Remove unused variable and unnecessary args to url

* Bunch of renaming

* Kinda complete the handlers

* change grade distribution colors to match updated figma

* change from reducer pattern to state variables, remove chartData from state

* add additional story

* disabled add when course is not open

* use array fill

* Some changes with the instructor names

* trying to get the CES stuff to work

* CES button is working

* remove a todo

* add actual color for dminus

* fix description, start no distribution state

* post merge fixes

* small fixes

* fix: import as type

* fix: some better typescript stuff i think

* fix: manifest.ts

* fix: pr feedback

* fix: remove old CoursePopup component

* fix: course catalog injected popup story should useScott's 314 class since it actually has data

* fix: build error in background.ts:

* chore: run eslint autofix on CourseCatalogInjectedPopup.stories.ts

* chore: run prettier on CourseCatalogInjectedPopup.stories.ts

src/stories/injected/mocked.ts

@@ -1,5 +1,5 @@
 import { Course, Status } from '@shared/types/Course';
-import { CourseMeeting } from '@shared/types/CourseMeeting';
+import { CourseMeeting, DAY_MAP } from '@shared/types/CourseMeeting';
 import Instructor from '@shared/types/Instructor';
 import { UserSchedule } from '@shared/types/UserSchedule';
 
@@ -47,7 +47,7 @@ export const exampleCourse: Course = new Course({
         season: 'Spring',
         year: 2024,
     },
-    status: Status.CANCELLED,
+    status: Status.OPEN,
     uniqueId: 12345,
     url: 'https://utdirect.utexas.edu/apps/registrar/course_schedule/20242/12345/',
 });
@@ -55,5 +55,106 @@ export const exampleCourse: Course = new Course({
 export const exampleSchedule: UserSchedule = new UserSchedule({
     courses: [exampleCourse],
     name: 'Example Schedule',
-    hours: 0,
+    hours: 3,
+});
+
+export const bevoCourse: Course = new Course({
+    uniqueId: 47280,
+    number: '311C',
+    fullName: "BVO 311C BEVO'S SEMINAR LONGHORN CARE",
+    courseName: "BEVO'S SEMINAR LONGHORN CARE",
+    department: 'BVO',
+    creditHours: 3,
+    status: Status.OPEN,
+    instructors: [new Instructor({ fullName: 'BEVO', firstName: '', lastName: 'BEVO', middleInitial: '' })],
+    isReserved: false,
+    description: [
+        'Restricted to Students in the School of Longhorn Enthusiasts',
+        'Immerse yourself in the daily routine of a longhorn—sunrise pasture walks and the best shady spots for a midday siesta. Understand the behavioral science behind our mascot’s stoic demeanor during games.',
+        'BVO 311C and 312H may not both be counted.',
+        'Prerequisite: Grazing 311 or 311H.',
+        'May be counted toward the Independent Inquiry flag requirement. May be counted toward the Writing flag requirement',
+        'Offered on the letter-grade basis only.',
+    ],
+    schedule: {
+        meetings: [
+            new CourseMeeting({
+                days: ['Tuesday', 'Thursday'],
+                startTime: 480,
+                endTime: 570,
+                location: { building: 'UTC', room: '123' },
+            }),
+            new CourseMeeting({
+                days: ['Thursday'],
+                startTime: 570,
+                endTime: 630,
+                location: { building: 'JES', room: '123' },
+            }),
+        ],
+    },
+    url: 'https://utdirect.utexas.edu/apps/registrar/course_schedule/20242/12345/',
+    flags: ['Independent Inquiry', 'Writing'],
+    instructionMode: 'In Person',
+    semester: {
+        code: '12345',
+        year: 2024,
+        season: 'Spring',
+    },
+});
+
+export const bevoScheule: UserSchedule = new UserSchedule({
+    courses: [bevoCourse],
+    name: 'Bevo Schedule',
+    hours: 3,
+});
+
+export const MikeScottCS314Course: Course = new Course({
+    uniqueId: 50805,
+    number: '314',
+    fullName: 'C S 314 DATA STRUCTURES',
+    courseName: 'DATA STRUCTURES',
+    department: 'C S',
+    creditHours: 3,
+    status: Status.OPEN,
+    instructors: [
+        new Instructor({ fullName: 'SCOTT, MICHAEL', firstName: 'MICHAEL', lastName: 'SCOTT', middleInitial: 'D' }),
+    ],
+    isReserved: true,
+    description: [
+        'Second part of a two-part sequence in programming. Introduction to specifications, simple unit testing, and debugging; building and using canonical data structures; algorithm analysis and reasoning techniques such as assertions and invariants.',
+        'Computer Science 314 and 314H may not both be counted.',
+        'BVO 311C and 312H may not both be counted.',
+        'Prerequisite: Computer Science 312 or 312H with a grade of at least C-.',
+        'May be counted toward the Quantitative Reasoning flag requirement.',
+    ],
+    schedule: {
+        meetings: [
+            new CourseMeeting({
+                days: [DAY_MAP.T, DAY_MAP.TH],
+                startTime: 480,
+                endTime: 570,
+                location: { building: 'UTC', room: '123' },
+            }),
+            new CourseMeeting({
+                days: [DAY_MAP.TH],
+                startTime: 570,
+                endTime: 630,
+                location: { building: 'JES', room: '123' },
+            }),
+        ],
+    },
+    url: 'https://utdirect.utexas.edu/apps/registrar/course_schedule/20242/50825/',
+    flags: ['Writing', 'Independent Inquiry'],
+    instructionMode: 'In Person',
+    semester: {
+        code: '12345',
+        year: 2024,
+        season: 'Spring',
+    },
+});
+
+export const MikeScottCS314Schedule: UserSchedule = new UserSchedule({
+    courses: [MikeScottCS314Course],
+    name: 'Mike Scott CS314 Schedule',
+    hours: 3,
 });