feat: Calendar Schedule component finished, fix: list didn't allow updates when adding a new schedule (#115)
* Temporarily uninstalling husky cause github desktop has issues with it * Cleaned up some code. Removed unnecessary state value on injected popup * Should've fixed popup alignment issue. Still need to integrate course schedule with calendar. Still debugging. * Updated CalendarGridStories * Fix: change to ExampleCourse from exampleCourse * setCourse and calendar header need work * Update as part of merge * Fix: fixed build errors * Fix: Added Todo * Chore: Cleaned up useFlattenedCourseSchedule hook * fix: List now keeps track of state when existing items are switched, while adding new items to the end * Added back husky * Update src/views/components/calendar/Calendar/Calendar.tsx Co-authored-by: doprz <52579214+doprz@users.noreply.github.com> * refactor: added type-safety, destructuring, etc. ready for re-review * refactor: got rid of ts-ignore in openNewTabFromContentScript * Update src/views/components/calendar/CalendarHeader/CalenderHeader.tsx Co-authored-by: doprz <52579214+doprz@users.noreply.github.com> * refactor: using path aliasing Co-authored-by: doprz <52579214+doprz@users.noreply.github.com> * refactor: using path aliasing Co-authored-by: doprz <52579214+doprz@users.noreply.github.com> * refactor: using satisfies instead of as Co-authored-by: doprz <52579214+doprz@users.noreply.github.com> * refactor: using satisfies instead of as Co-authored-by: doprz <52579214+doprz@users.noreply.github.com> * style: reformatted spacing * style: eslint import order * refactor: added new constructor for UserSchedule to avoid passing down null values to child props --------- Co-authored-by: doprz <52579214+doprz@users.noreply.github.com>
This commit is contained in:
@@ -1,9 +1,15 @@
|
||||
import type { Course } from '@shared/types/Course';
|
||||
import { CalendarBottomBar } from '@views/components/calendar/CalendarBottomBar/CalendarBottomBar';
|
||||
import CalendarGrid from '@views/components/calendar/CalendarGrid/CalendarGrid';
|
||||
import CalendarHeader from '@views/components/calendar/CalendarHeader/CalenderHeader';
|
||||
import { CalendarSchedules } from '@views/components/calendar/CalendarSchedules/CalendarSchedules';
|
||||
import ImportantLinks from '@views/components/calendar/ImportantLinks';
|
||||
import CourseCatalogInjectedPopup from '@views/components/injected/CourseCatalogInjectedPopup/CourseCatalogInjectedPopup';
|
||||
import { useFlattenedCourseSchedule } from '@views/hooks/useFlattenedCourseSchedule';
|
||||
import React from 'react';
|
||||
import { ExampleCourse } from 'src/stories/components/PopupCourseBlock.stories';
|
||||
|
||||
|
||||
|
||||
export const flags = ['WR', 'QR', 'GC', 'CD', 'E', 'II'];
|
||||
|
||||
@@ -16,9 +22,12 @@ interface Props {
|
||||
* @returns
|
||||
*/
|
||||
export function Calendar(): JSX.Element {
|
||||
const { courseCells, activeSchedule } = useFlattenedCourseSchedule();
|
||||
const [course, setCourse] = React.useState<Course | null>(null);
|
||||
|
||||
return (
|
||||
<>
|
||||
<CalendarHeader />
|
||||
<div className = 'flex flex-col'>
|
||||
<CalendarHeader totalHours={activeSchedule.hours} scheduleName={activeSchedule.name} totalCourses={activeSchedule?.courses.length}/>
|
||||
<div className='h-screen w-full flex flex-col md:flex-row'>
|
||||
<div className='min-h-[30%] flex flex-col items-start gap-2.5 p-5 pl-7'>
|
||||
<div className='min-h-[30%]'>
|
||||
@@ -26,15 +35,18 @@ export function Calendar(): JSX.Element {
|
||||
</div>
|
||||
<ImportantLinks />
|
||||
</div>
|
||||
<div className='flex flex-grow flex-col gap-4 overflow-hidden'>
|
||||
<div className='flex flex-grow flex-col gap-4 overflow-hidden pr-12'>
|
||||
<div className='flex-grow overflow-auto'>
|
||||
<CalendarGrid />
|
||||
<CalendarGrid courseCells = {courseCells} setCourse={setCourse}/>
|
||||
</div>
|
||||
<div>
|
||||
<CalendarBottomBar />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
{/* TODO: Doesn't work when exampleCourse is replaced with an actual course through setCourse.
|
||||
Check CalendarGrid.tsx and AccountForCourseConflicts for an example */}
|
||||
{course ? <CourseCatalogInjectedPopup course = {ExampleCourse} activeSchedule = {activeSchedule} onClose={() => setCourse(null)}/> : null}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user