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:
Som Gupta
2024-02-29 20:15:45 -06:00
committed by doprz
parent 3a48859ddd
commit a99a55788a
15 changed files with 899 additions and 301 deletions

View File

@@ -10,6 +10,7 @@ import { handleOpenCalendar } from '@views/components/injected/CourseCatalogInje
import useSchedules from '@views/hooks/useSchedules';
import { openTabFromContentScript } from '@views/lib/openNewTabFromContentScript';
import React from 'react';
import { act } from 'react-dom/test-utils';
import { tailwindColorways } from 'src/shared/util/storybook';
import CalendarIcon from '~icons/material-symbols/calendar-month';
@@ -21,14 +22,21 @@ import SettingsIcon from '~icons/material-symbols/settings';
* This component displays the main schedule, courses, and options buttons.
*/
export default function PopupMain() {
const [activeSchedule] = useSchedules();
const draggableElements = activeSchedule?.courses.map((course, i) => (
<PopupCourseBlock key={course.uniqueId} course={course} colors={tailwindColorways[i]} />
const [activeSchedule, schedules] = useSchedules();
const coursesLength = activeSchedule ? activeSchedule.courses.length : 0;
if (!activeSchedule) {
return;
}
const draggableElements = activeSchedule?.courses.map((course, i) => (
<PopupCourseBlock
key={course.uniqueId}
course={course}
colors={tailwindColorways[i]}
/>
));
const handleOpenOptions = async () => {
// Not sure if it's bad practice to export this
const url = chrome.runtime.getURL('/src/pages/options/index.html');
await openTabFromContentScript(url);
};
@@ -60,11 +68,11 @@ export default function PopupMain() {
<Divider orientation='horizontal' className='my-4' size='100%' />
<div className='mb-4 border border-ut-offwhite rounded p-2 text-left'>
<Text as='div' variant='h1-course' className='color-ut-burntorange'>
MAIN SCHEDULE:
{`${activeSchedule.name}`}:
</Text>
<div className='flex items-center justify-start gap2.5 color-ut-black'>
<Text variant='h1'>22 HOURS</Text>
<Text variant='h2-course'>8 Courses</Text>
<Text variant='h1'>{`${activeSchedule.hours} HOURS`}</Text>
<Text variant='h2-course'>{`${coursesLength} Courses`}</Text>
</div>
</div>
{/* Integrate the List component here */}