Squashed commit of the following:

commit c46e4a51c9 Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Mon Feb 19 21:37:46 2024 -0600 change from reducer pattern to state variables, remove chartData from state commit 36bcdd2522 Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Mon Feb 19 21:15:41 2024 -0600 change grade distribution colors to match updated figma commit 11a50df88d Merge: c16b301 b4c96a9 Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Mon Feb 19 17:57:13 2024 -0600 Merge branch 'hackathon' into abhinavchadaga/course-catalog-popup commit c16b301ff0 Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Mon Feb 19 17:47:21 2024 -0600 Kinda complete the handlers commit 1ac1d9095a Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Sun Feb 18 17:36:59 2024 -0600 Bunch of renaming commit 925829ad41 Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Sun Feb 18 17:24:53 2024 -0600 Fix syllabi url Remove unused variable and unnecessary args to url commit f2e5d51eb3 Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Sun Feb 18 17:24:22 2024 -0600 Add TODO replace current grade colors with a tailwind palette commit 747ee44440 Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Sun Feb 18 01:26:51 2024 -0600 Minor tweaks change style in header commit ddfe952a32 Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Sun Feb 18 01:26:38 2024 -0600 Add Grade Distribution Stuff commit c27bf3c390 Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Sun Feb 18 01:26:13 2024 -0600 Modify story to use proper course info commit 7afdbac1b8 Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Sat Feb 17 16:37:01 2024 -0600 description stuff done commit 1a89432276 Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Sat Feb 17 15:26:32 2024 -0600 Rename CoursePopup Old one to "Old", remove "2" from new one commit 4c2b31e61a Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Sat Feb 17 15:23:01 2024 -0600 add todo for calendar button commit 11b7a51ded Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Sat Feb 17 15:22:18 2024 -0600 add course button onclick handlers commit f2dfcec838 Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Sat Feb 17 14:52:38 2024 -0600 some unocss updates commit f9f375514b Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Sat Feb 17 13:00:46 2024 -0600 Add rmp callback commit 122fc6dbdd Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Sat Feb 17 13:00:16 2024 -0600 Change test course to 314 commit 19b124b3bd Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Sat Feb 17 12:19:21 2024 -0600 complete CourseHeaderAndActions Component added course buttons, using proper subcomponents now. commit 2eea01fc74 Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Sat Feb 17 11:22:12 2024 -0600 use chip component in header commit 9cb13c8fd1 Merge: a62b718 9392085 Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Sat Feb 17 11:21:12 2024 -0600 Merge branch 'hackathon' into abhinavchadaga/course-catalog-popup commit a62b718c43 Merge: 43d2675 7b7b858 Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Sat Feb 17 10:57:24 2024 -0600 Merge branch 'hackathon' into abhinavchadaga/course-catalog-popup commit 43d2675be5 Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Sat Feb 17 10:54:49 2024 -0600 some work on course popup update the stories and create the header component commit 31bcef3099 Merge: 874f8d5 fa1d737 Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Wed Feb 14 14:33:16 2024 -0600 Merge branch 'main' into abhinavchadaga/course-catalog-popup pulling from main commit 874f8d56cb Author: Abhinav Chadaga <abhinav.chadaga@utexas.edu> Date: Wed Feb 14 14:30:24 2024 -0600 some work
2024-02-19 22:39:26 -06:00
parent e0212d5109
commit c4a738f281
19 changed files with 458 additions and 4 deletions
--- a/src/views/components/injected/CoursePopupOld/CourseDescription/CourseDescription.tsx
+++ b/src/views/components/injected/CoursePopupOld/CourseDescription/CourseDescription.tsx
@@ -0,0 +1,91 @@
+import { Course } from '@shared/types/Course';
+import clsx from 'clsx';
+import React, { useEffect, useState } from 'react';
+import Spinner from '@views/components/common/Spinner/Spinner';
+import Text from '@views/components/common/Text/Text';
+import { CourseCatalogScraper } from '@views/lib/CourseCatalogScraper';
+import { SiteSupport } from '@views/lib/getSiteSupport';
+import Card from '../../../common/Card/Card';
+import styles from './CourseDescription.module.scss';
+
+type Props = {
+    course: Course;
+};
+
+enum LoadStatus {
+    LOADING = 'LOADING',
+    DONE = 'DONE',
+    ERROR = 'ERROR',
+}
+
+/**
+ *
+ */
+export default function CourseDescription({ course }: Props) {
+    const [description, setDescription] = useState<string[]>([]);
+    const [status, setStatus] = useState<LoadStatus>(LoadStatus.LOADING);
+
+    useEffect(() => {
+        fetchDescription(course)
+            .then(description => {
+                setStatus(LoadStatus.DONE);
+                setDescription(description);
+            })
+            .catch(() => {
+                setStatus(LoadStatus.ERROR);
+            });
+    }, [course]);
+
+    return (
+        <Card className={styles.container}>
+            {status === LoadStatus.ERROR && (
+                <Text color='speedway_brick' /* size='medium' weight='bold' align='center'  */>
+                    Please refresh the page and log back in using your UT EID and password
+                </Text>
+            )}
+            {status === LoadStatus.LOADING && <Spinner className={styles.spinner} />}
+            {status === LoadStatus.DONE && (
+                <ul className={styles.description}>
+                    {description.map(paragraph => (
+                        <li key={paragraph}>
+                            <DescriptionLine line={paragraph} />
+                        </li>
+                    ))}
+                </ul>
+            )}
+        </Card>
+    );
+}
+
+interface LineProps {
+    line: string;
+}
+
+function DescriptionLine({ line }: LineProps) {
+    const lowerCaseLine = line.toLowerCase();
+
+    const className = clsx({
+        [styles.prerequisite]: lowerCaseLine.includes('prerequisite'),
+        [styles.onlyOne]:
+            lowerCaseLine.includes('may be') || lowerCaseLine.includes('only one') || lowerCaseLine.includes('may not'),
+        [styles.restriction]: lowerCaseLine.includes('restrict'),
+    });
+
+    return (
+        <Text className={className} /*  size='medium'   */>
+            {line}
+        </Text>
+    );
+}
+
+async function fetchDescription(course: Course): Promise<string[]> {
+    if (!course.description?.length) {
+        const response = await fetch(course.url);
+        const text = await response.text();
+        const doc = new DOMParser().parseFromString(text, 'text/html');
+
+        const scraper = new CourseCatalogScraper(SiteSupport.COURSE_CATALOG_DETAILS);
+        course.description = scraper.getDescription(doc);
+    }
+    return course.description;
+}