Merge pull request #77 from UTDNebula/gcal

Add to Google Calendar button
UTDNebula · Dec 12, 2024 · df8e1f0 · df8e1f0
2 parents 565aefc + f9c5dc8
commit df8e1f0
Show file tree

Hide file tree

Showing 6 changed files with 318 additions and 109 deletions.
diff --git a/.gitignore b/.gitignore
@@ -26,7 +26,10 @@ yarn-error.log*
 
 
 # local env files
-.env*
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
 
 out/
 build/

diff --git a/src/background/index.ts b/src/background/index.ts
@@ -1,15 +1,16 @@
 import { Storage } from '@plasmohq/storage';
 
 import {
-  type CourseHeader,
+  addGCalButtons,
   listenForTableChange,
   scrapeCourseData,
 } from '~content';
 import { neededOrigins } from '~data/config';
+import { type SearchQuery } from '~utils/SearchQuery';
 
 export interface ShowCourseTabPayload {
-  header: CourseHeader;
-  professors: string[];
+  header: string | SearchQuery;
+  professors: SearchQuery[];
 }
 
 // State vars
@@ -23,11 +24,29 @@ const realBrowser = process.env.PLASMO_BROWSER === 'chrome' ? chrome : browser;
 
 /** Injects the content script if we hit a course page */
 realBrowser.webNavigation.onHistoryStateUpdated.addListener((details) => {
-  if (
+  const onOptions =
     /^.*:\/\/utdallas\.collegescheduler\.com\/terms\/.*\/courses\/.+$/.test(
       details.url,
-    )
-  ) {
+    );
+  const onCurrentSchedule =
+    /^.*:\/\/utdallas\.collegescheduler\.com\/terms\/.*\/currentschedule$/.test(
+      details.url,
+    );
+  const onPotentialSchedule =
+    /^.*:\/\/utdallas\.collegescheduler\.com\/terms\/.*\/schedules/.test(
+      details.url,
+    );
+  if (onOptions) {
+    //Listen for table change to rescrape data
+    realBrowser.tabs.sendMessage(details.tabId, 'disconnectObserver');
+    realBrowser.scripting.executeScript({
+      target: {
+        tabId: details.tabId,
+      },
+      func: listenForTableChange,
+    });
+  }
+  if (onOptions || onCurrentSchedule || onPotentialSchedule) {
     //Scrape data
     realBrowser.scripting.executeScript(
       {
@@ -46,21 +65,25 @@ realBrowser.webNavigation.onHistoryStateUpdated.addListener((details) => {
         }
       },
     );
-    //Listen for table change to rescrape data
-    realBrowser.tabs.sendMessage(details.tabId, 'disconnectObserver');
-    realBrowser.scripting.executeScript({
-      target: {
-        tabId: details.tabId,
-      },
-      func: listenForTableChange,
-    });
     //Store tab info
     realBrowser.action.setBadgeText({ text: '!' });
     realBrowser.action.setBadgeBackgroundColor({ color: 'green' });
     courseTabId = details.tabId;
     storage.set('courseTabId', courseTabId);
     storage.set('courseTabUrl', details.url);
-  } else {
+  }
+  if (onCurrentSchedule) {
+    //Add GCal buttons
+    realBrowser.scripting.executeScript({
+      target: {
+        tabId: details.tabId,
+      },
+      // content script injection only works reliably on the prod packaged extension
+      // b/c of the plasmo dev server connections
+      func: addGCalButtons,
+    });
+  }
+  if (!onOptions && !onCurrentSchedule && !onPotentialSchedule) {
     realBrowser.action.setBadgeText({ text: '' });
   }
 });

diff --git a/src/components/CourseOverview.tsx b/src/components/CourseOverview.tsx
@@ -6,36 +6,43 @@ import type { GenericFetchedData, GradesType } from '~pages';
 import { type SearchQuery, searchQueryLabel } from '~utils/SearchQuery';
 
 type CourseOverviewProps = {
-  course: SearchQuery;
-  grades: GenericFetchedData<GradesType>;
+  header: string | SearchQuery;
+  grades: undefined | GenericFetchedData<GradesType>;
 };
 
-const CourseOverview = ({ course, grades }: CourseOverviewProps) => {
+const CourseOverview = ({ header, grades }: CourseOverviewProps) => {
+  const isCourse = typeof header !== 'string';
   return (
     <div className="flex flex-col items-center gap-2">
-      <p className="text-2xl font-bold">{searchQueryLabel(course)}</p>
-      {(grades.state === 'loading' && (
-        <Skeleton variant="rounded">
-          <p className="text-lg font-semibold">Overall grade: A+</p>
-        </Skeleton>
-      )) ||
-        (grades.state === 'done' && (
-          <p className="text-lg font-semibold">
-            {'Overall grade: ' + grades.data.letter_grade}
-          </p>
-        ))}
-      <a
-        href={
-          TRENDS_URL +
-          'dashboard?searchTerms=' +
-          encodeURIComponent(searchQueryLabel(course))
-        }
-        target="_blank"
-        className="underline text-blue-600 hover:text-blue-800 visited:text-purple-600"
-        rel="noreferrer"
-      >
-        See on Trends
-      </a>
+      <p className="text-2xl font-bold">
+        {isCourse ? searchQueryLabel(header) : header}
+      </p>
+      {isCourse && (
+        <>
+          {(grades.state === 'loading' && (
+            <Skeleton variant="rounded">
+              <p className="text-lg font-semibold">Overall grade: A+</p>
+            </Skeleton>
+          )) ||
+            (grades.state === 'done' && (
+              <p className="text-lg font-semibold">
+                {'Overall grade: ' + grades.data.letter_grade}
+              </p>
+            ))}
+          <a
+            href={
+              TRENDS_URL +
+              'dashboard?searchTerms=' +
+              encodeURIComponent(searchQueryLabel(header))
+            }
+            target="_blank"
+            className="underline text-blue-600 hover:text-blue-800 visited:text-purple-600"
+            rel="noreferrer"
+          >
+            See on Trends
+          </a>
+        </>
+      )}
     </div>
   );
 };

diff --git a/src/components/SearchResultsTable.tsx b/src/components/SearchResultsTable.tsx
@@ -37,9 +37,19 @@ type RowProps = {
   backupGrades: GenericFetchedData<GradesType>;
   rmp: GenericFetchedData<RMPInterface>;
   setPage: (arg0: SearchQuery) => void;
+  showProfNameOnly: boolean;
+  fallbackToProfOnly: boolean;
 };
 
-function Row({ course, grades, backupGrades, rmp, setPage }: RowProps) {
+function Row({
+  course,
+  grades,
+  backupGrades,
+  rmp,
+  setPage,
+  showProfNameOnly,
+  fallbackToProfOnly,
+}: RowProps) {
   const [open, setOpen] = useState(false);
   const canOpen =
     !(typeof grades === 'undefined' || grades.state === 'error') ||
@@ -95,7 +105,9 @@ function Row({ course, grades, backupGrades, rmp, setPage }: RowProps) {
               }
               className="leading-tight text-lg text-gray-600 dark:text-gray-200 cursor-text w-fit"
             >
-              {searchQueryLabel(convertToProfOnly(course))}
+              {searchQueryLabel(
+                showProfNameOnly ? convertToProfOnly(course) : course,
+              )}
             </Typography>
           </Tooltip>
         </TableCell>
@@ -136,7 +148,8 @@ function Row({ course, grades, backupGrades, rmp, setPage }: RowProps) {
           </Tooltip>
         </TableCell>
         <TableCell align="center" className="border-b-0">
-          {((typeof grades === 'undefined' || grades.state === 'error') &&
+          {(fallbackToProfOnly &&
+            (typeof grades === 'undefined' || grades.state === 'error') &&
             (((typeof backupGrades === 'undefined' ||
               backupGrades.state === 'error') && <></>) ||
               (backupGrades.state === 'loading' && (
@@ -250,13 +263,17 @@ type SearchResultsTableProps = {
   grades: { [key: string]: GenericFetchedData<GradesType> };
   rmp: { [key: string]: GenericFetchedData<RMPInterface> };
   setPage: (arg0: SearchQuery) => void;
+  showProfNameOnly: boolean;
+  fallbackToProfOnly: boolean;
 };
 
 const SearchResultsTable = ({
   results,
   grades,
   rmp,
   setPage,
+  showProfNameOnly,
+  fallbackToProfOnly,
 }: SearchResultsTableProps) => {
   //Table sorting category
   const [orderBy, setOrderBy] = useState<'none' | 'gpa' | 'rating'>('none');
@@ -392,6 +409,8 @@ const SearchResultsTable = ({
               backupGrades={grades[searchQueryLabel(convertToProfOnly(result))]}
               rmp={rmp[searchQueryLabel(convertToProfOnly(result))]}
               setPage={setPage}
+              showProfNameOnly={showProfNameOnly}
+              fallbackToProfOnly={fallbackToProfOnly}
             />
           ))}
         </TableBody>