fix: chromatic storybook - CourseCatalogInjectedPopup (#106)

* chore: add pnpm peer deps

* fix: merge conflict and rebase

* chore: remove deps

src/stories/injected/CourseCatalogInjectedPopup.stories.ts

@@ -1,55 +1,8 @@
-import { Course, Status } from '@shared/types/Course';
-import { CourseMeeting, DAY_MAP } from '@shared/types/CourseMeeting';
-import { CourseSchedule } from '@shared/types/CourseSchedule';
-import Instructor from '@shared/types/Instructor';
 import { UserSchedule } from '@shared/types/UserSchedule';
 import type { Meta, StoryObj } from '@storybook/react';
 import CourseCatalogInjectedPopup from '@views/components/injected/CourseCatalogInjectedPopup/CourseCatalogInjectedPopup';
 
-const exampleCourse: 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: new CourseSchedule({
-        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/12345/',
-    flags: ['Writing', 'Independent Inquiry'],
-    instructionMode: 'In Person',
-    semester: {
-        code: '12345',
-        year: 2024,
-        season: 'Spring',
-    },
-});
+import { exampleCourse } from './mocked';
 
 const exampleSchedule: UserSchedule = new UserSchedule({
     courses: [exampleCourse],
@@ -57,20 +10,40 @@ const exampleSchedule: UserSchedule = new UserSchedule({
     hours: 0,
 });
 
-const meta: Meta<typeof CourseCatalogInjectedPopup> = {
+const meta = {
     title: 'Components/Injected/CourseCatalogInjectedPopup',
     component: CourseCatalogInjectedPopup,
-    argTypes: {
-        onClose: { action: 'onClose' },
+    args: {
+        course: exampleCourse,
+        activeSchedule: exampleSchedule,
+        onClose: () => {},
     },
-};
+    argTypes: {
+        course: {
+            control: {
+                type: 'object',
+            },
+        },
+        activeSchedule: {
+            control: {
+                type: 'object',
+            },
+        },
+        onClose: {
+            control: {
+                type: 'function',
+            },
+        },
+    },
+} satisfies Meta<typeof CourseCatalogInjectedPopup>;
 
 export default meta;
-type Story = StoryObj<typeof CourseCatalogInjectedPopup>;
+type Story = StoryObj<typeof meta>;
 
 export const Default: Story = {
     args: {
         course: exampleCourse,
         activeSchedule: exampleSchedule,
+        onClose: () => {},
     },
 };