feat: Missing Sections Warning

[calebwongg]

Summary

Added a warning displaying the missing sections for a course on the added courses page.

When a user selects classes for a course, the required sections for a course are checked (e.g., lecture, lab, discussion) have been added. If any required section type is missing, the UI displays a warning so the user can correct their schedule.

Test Plan

• Add SOME sections of a course to schedule, and check the added courses tab to verify there is a warning for whichever section is missing
• Add all sections of a course to a schedule. In the added courses tab, ensure there are no warnings, and then delete one of the sections to verify a warning pops up. Add the section back to verify the warning disappears
• Check error handling for users importing saved courses
• Check UI on both light mode and dark mode

Issues

Closes #1330

Before

After

Future Followup

• Could add an alert for if a user schedules two different sections in two different categories (e.g. the user schedules a lecture 'A' but a discussion 'B')

Notes

• Missing sections are not checked for users who are importing courses that were saved to their profile (The only way to do it was to query websoc again when the user signs in). Hopefully should not be a problem since the scheduling period for next quarter is mostly over.

[KevinWu098]

Some misc. comments — I'll take another look once they're addressed and once the merge conflicts with main are resolved

[KevinWu098]

Looking really good. Mostly minor comments, except one longer set of comments regarding sectionTypes on load that (thankfully) is non-blocking.

However, I believe this PR introduces a bug when we undo an action on AA, which crashes the page. You can reproduce the error easily. I believe this may stem from our use of Set, which doesn't serialize well, so we may need to use an array as the type instead (this should be easy via gpt)

Sorry for all the back and forth!

[KevinWu098]

Also, just curious @calebwongg. What is the added fix / change in this PR that makes it not break like the previous attempt?

[calebwongg]

Also, just curious @calebwongg. What is the added fix / change in this PR that makes it not break like the previous attempt?

Making section types optional prevents the original reason why it broke:

sectionTypes?: Set;

When a user initially loaded in their saved classes, section types were not enriched when the page was loaded in, so my getMissingSections was looking for an attribute that didn't exist.

[KevinWu098]

Also, just curious @calebwongg. What is the added fix / change in this PR that makes it not break like the previous attempt?

Making section types optional prevents the original reason why it broke:

sectionTypes?: Set;

When a user initially loaded in their saved classes, section types were not enriched when the page was loaded in, so my getMissingSections was looking for an attribute that didn't exist.

hm... that's really interesting since you'd imagine that there would be a type error... perhaps related to #1372?

[calebwongg]

Also, just curious @calebwongg. What is the added fix / change in this PR that makes it not break like the previous attempt?

Making section types optional prevents the original reason why it broke:
sectionTypes?: Set;
When a user initially loaded in their saved classes, section types were not enriched when the page was loaded in, so my getMissingSections was looking for an attribute that didn't exist.

hm... that's really interesting since you'd imagine that there would be a type error... perhaps related to #1372?

Just did some further digging/clarifying...

I was wrong this was actually NOT what caused the break...it was the line sectionTypes: courseDetails.sectionTypes, in AppStoreActions.ts

I added section types in the declaration for courseDetails in backend/routers/websoc.ts, which is what now prevents the crash

` for (const course of department.courses) {

                const sectionTypesSet = new Set<WebsocSectionType>();
                course.sections.forEach((section) => {
                    sectionTypesSet.add(section.sectionType);
                });

                const sectionTypes = [...sectionTypesSet];

                for (const section of course.sections) {
                    courseInfo[section.sectionCode] = {
                        courseDetails: {
                            deptCode: department.deptCode,
                            courseNumber: course.courseNumber,
                            courseTitle: course.courseTitle,
                            courseComment: course.courseComment,
                            prerequisiteLink: course.prerequisiteLink,
                            sectionTypes: sectionTypes,
                        },
                        section: section,
                    };
                }

`

[KevinWu098]

/deploy

[KevinWu098]

LGTM — thanks for sticking with this!