Files
UT-Registration-Plus/src/stories/injected/CourseCatalogInjectedPopup.stories.ts
Abhinav Chadaga 89d03f4244 feat: course-catalog-injected-popup (#98)
* 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

* Apply suggestions from code review

---------

Co-authored-by: doprz <52579214+doprz@users.noreply.github.com>
2024-03-06 15:11:32 -06:00

110 lines
3.3 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import { UserSchedule } from '@shared/types/UserSchedule';
import type { Meta, StoryObj } from '@storybook/react';
import CourseCatalogInjectedPopup from '@views/components/injected/CourseCatalogInjectedPopup/CourseCatalogInjectedPopup';
import { exampleCourse } from './mocked';
const exampleSchedule: UserSchedule = new UserSchedule({
courses: [exampleCourse],
name: 'Example Schedule',
hours: 0,
});
// TODO (achadaga): import this after
// https://github.com/Longhorn-Developers/UT-Registration-Plus/pull/106 is merged
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 mascots 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: new CourseSchedule({
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',
},
});
const meta = {
title: 'Components/Injected/CourseCatalogInjectedPopup',
component: CourseCatalogInjectedPopup,
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 meta>;
export const OpenCourse: Story = {
args: {
course: exampleCourse,
activeSchedule: exampleSchedule,
onClose: () => {},
},
};
export const ClosedCourse: Story = {
args: {
course: {
...exampleCourse,
status: Status.CLOSED,
} satisfies Course,
},
};
export const CourseWithNoData: Story = {
args: {
course: bevoCourse,
},
};