From 7c621727680749b76adfca1c44856a601408082e Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Tue, 3 Dec 2024 18:03:51 +0000
Subject: [PATCH 1/4] Bump cross-spawn from 7.0.3 to 7.0.6

Bumps [cross-spawn](https://github.com/moxystudio/node-cross-spawn) from 7.0.3 to 7.0.6.
- [Changelog](https://github.com/moxystudio/node-cross-spawn/blob/master/CHANGELOG.md)
- [Commits](https://github.com/moxystudio/node-cross-spawn/compare/v7.0.3...v7.0.6)

---
updated-dependencies:
- dependency-name: cross-spawn
  dependency-type: indirect
...

Signed-off-by: dependabot[bot] <support@github.com>
---
 package-lock.json | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index a4e37f4..b5c0cb7 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -7003,9 +7003,9 @@
       }
     },
     "node_modules/cross-spawn": {
-      "version": "7.0.3",
-      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
-      "integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==",
+      "version": "7.0.6",
+      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
+      "integrity": "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==",
       "dependencies": {
         "path-key": "^3.1.0",
         "shebang-command": "^2.0.0",

From d0ca5f7dc57b2f78da6a132055366beeef2b307a Mon Sep 17 00:00:00 2001
From: Tyler Hill <gotyhill@gmail.com>
Date: Tue, 3 Dec 2024 12:13:52 -0600
Subject: [PATCH 2/4] Fix loading jumping

---
 src/components/CourseOverview.tsx     | 22 ++++++++++++--------
 src/components/SearchResultsTable.tsx | 18 ++++++++---------
 src/components/SingleProfInfo.tsx     | 29 ++++++++++++++++-----------
 3 files changed, 40 insertions(+), 29 deletions(-)

diff --git a/src/components/CourseOverview.tsx b/src/components/CourseOverview.tsx
index 34b99aa..b06f149 100644
--- a/src/components/CourseOverview.tsx
+++ b/src/components/CourseOverview.tsx
@@ -1,3 +1,4 @@
+import { Skeleton } from '@mui/material';
 import React from 'react';
 
 import { TRENDS_URL } from '~data/config';
@@ -11,15 +12,20 @@ type CourseOverviewProps = {
 
 const CourseOverview = ({ course, grades }: CourseOverviewProps) => {
   return (
-    <div className="flex flex-col gap-2">
-      <p className="text-2xl font-bold text-center">
+    <div className="flex flex-col items-center gap-2">
+      <p className="text-2xl font-bold">
         {searchQueryLabel(course)}
       </p>
-      {grades.state === 'done' && (
-        <p className="text-lg font-semibold text-center">
-          {'Overall grade: ' + grades.data.letter_grade}
-        </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 +
@@ -27,7 +33,7 @@ const CourseOverview = ({ course, grades }: CourseOverviewProps) => {
           encodeURIComponent(searchQueryLabel(course))
         }
         target="_blank"
-        className="underline text-blue-600 hover:text-blue-800 visited:text-purple-600 text-center"
+        className="underline text-blue-600 hover:text-blue-800 visited:text-purple-600"
         rel="noreferrer"
       >
         See on Trends
diff --git a/src/components/SearchResultsTable.tsx b/src/components/SearchResultsTable.tsx
index 1b40772..be7a060 100644
--- a/src/components/SearchResultsTable.tsx
+++ b/src/components/SearchResultsTable.tsx
@@ -117,16 +117,16 @@ function Row({ course, grades, backupGrades, rmp, setPage }: RowProps) {
             </IconButton>
           </Tooltip>
         </TableCell>
-        <TableCell align="right" className="border-b-0">
+        <TableCell align="center" className="border-b-0">
           {((typeof grades === 'undefined' || grades.state === 'error') &&
             (((typeof backupGrades === 'undefined' ||
               backupGrades.state === 'error') && <></>) ||
               (backupGrades.state === 'loading' && (
                 <Skeleton
                   variant="rounded"
-                  className="rounded-full px-5 py-2 ml-auto"
+                  className="rounded-full px-5 py-2 w-16 block mx-auto"
                 >
-                  <Typography className="text-base">A</Typography>
+                  <Typography className="text-base w-6">A+</Typography>
                 </Skeleton>
               )) ||
               (backupGrades.state === 'done' && (
@@ -155,7 +155,7 @@ function Row({ course, grades, backupGrades, rmp, setPage }: RowProps) {
                     }
                   >
                     <Typography
-                      className="text-base text-black rounded-full px-5 py-2 inline"
+                      className="text-base text-black text-center rounded-full px-5 py-2 w-16 block mx-auto"
                       sx={{
                         backgroundColor: gpaToColor(backupGrades.data.gpa),
                       }}
@@ -168,9 +168,9 @@ function Row({ course, grades, backupGrades, rmp, setPage }: RowProps) {
             (grades.state === 'loading' && (
               <Skeleton
                 variant="rounded"
-                className="rounded-full px-5 py-2 ml-auto"
+                className="rounded-full px-5 py-2 w-16 block mx-auto"
               >
-                <Typography className="text-base">A</Typography>
+                <Typography className="text-base w-6">A+</Typography>
               </Skeleton>
             )) ||
             (grades.state === 'done' && (
@@ -179,7 +179,7 @@ function Row({ course, grades, backupGrades, rmp, setPage }: RowProps) {
                 placement="top"
               >
                 <Typography
-                  className="text-base text-black rounded-full px-5 py-2 inline"
+                  className="text-base text-black text-center rounded-full px-5 py-2 w-16 block mx-auto"
                   sx={{ backgroundColor: gpaToColor(grades.data.gpa) }}
                 >
                   {grades.data.letter_grade}
@@ -188,10 +188,10 @@ function Row({ course, grades, backupGrades, rmp, setPage }: RowProps) {
             )) ||
             null}
         </TableCell>
-        <TableCell align="right" className="border-b-0">
+        <TableCell align="center" className="border-b-0">
           {((typeof rmp === 'undefined' || rmp.state === 'error') && <></>) ||
             (rmp.state === 'loading' && (
-              <Skeleton variant="rounded" className="rounded-full ml-auto">
+              <Skeleton variant="rounded" className="rounded-full">
                 <Rating sx={{ fontSize: 25 }} readOnly />
               </Skeleton>
             )) ||
diff --git a/src/components/SingleProfInfo.tsx b/src/components/SingleProfInfo.tsx
index b6eef84..414a9cb 100644
--- a/src/components/SingleProfInfo.tsx
+++ b/src/components/SingleProfInfo.tsx
@@ -16,29 +16,34 @@ function SingleProfInfo({ rmp }: Props) {
     return (
       <Grid container spacing={2} className="p-4">
         <Grid item xs={6}>
-          <p className="text-xl font-bold">
-            <Skeleton variant="rounded" width="10%" height={25} />
-          </p>
+          <Skeleton variant="rounded">
+            <p className="text-xl font-bold">5.0</p>
+          </Skeleton>
           <p>Professor rating</p>
         </Grid>
         <Grid item xs={6}>
-          <p className="text-xl font-bold">
-            <Skeleton variant="rounded" width="10%" height={25} />
-          </p>
+          <Skeleton variant="rounded">
+            <p className="text-xl font-bold">5.0</p>
+          </Skeleton>
           <p>Difficulty</p>
         </Grid>
         <Grid item xs={6}>
-          <p className="text-xl font-bold">
-            <Skeleton variant="rounded" width="10%" height={25} />
-          </p>
+          <Skeleton variant="rounded">
+            <p className="text-xl font-bold">1,000</p>
+          </Skeleton>
           <p>Ratings given</p>
         </Grid>
         <Grid item xs={6}>
-          <p className="text-xl font-bold">
-            <Skeleton variant="rounded" width="10%" height={25} />
-          </p>
+          <Skeleton variant="rounded">
+            <p className="text-xl font-bold">99%</p>
+          </Skeleton>
           <p>Would take again</p>
         </Grid>
+        <Grid item xs={12}>
+          <Skeleton variant="rounded">
+            <p>Visit Rate My Professors</p>
+          </Skeleton>
+        </Grid>
       </Grid>
     );
   }

From d268e8781de72719b41aa70ffa17a671931b0698 Mon Sep 17 00:00:00 2001
From: Tyler Hill <gotyhill@gmail.com>
Date: Tue, 3 Dec 2024 12:16:42 -0600
Subject: [PATCH 3/4] Format

---
 src/components/CourseOverview.tsx | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/src/components/CourseOverview.tsx b/src/components/CourseOverview.tsx
index b06f149..73050d3 100644
--- a/src/components/CourseOverview.tsx
+++ b/src/components/CourseOverview.tsx
@@ -13,9 +13,7 @@ type CourseOverviewProps = {
 const CourseOverview = ({ course, grades }: CourseOverviewProps) => {
   return (
     <div className="flex flex-col items-center gap-2">
-      <p className="text-2xl font-bold">
-        {searchQueryLabel(course)}
-      </p>
+      <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>

From 9f2ad55cdec3e5eca993334e087e65d3955abe88 Mon Sep 17 00:00:00 2001
From: Tyler Hill <gotyhill@gmail.com>
Date: Tue, 3 Dec 2024 12:28:44 -0600
Subject: [PATCH 4/4] Display RMP tags

---
 src/components/SearchResultsTable.tsx | 30 ++++++++++++---
 src/components/SingleProfInfo.tsx     | 55 ++++++++++++++++++++++++++-
 2 files changed, 77 insertions(+), 8 deletions(-)

diff --git a/src/components/SearchResultsTable.tsx b/src/components/SearchResultsTable.tsx
index 1b40772..a77a3f7 100644
--- a/src/components/SearchResultsTable.tsx
+++ b/src/components/SearchResultsTable.tsx
@@ -72,14 +72,32 @@ function Row({ course, grades, backupGrades, rmp, setPage }: RowProps) {
         className="cursor-pointer"
       >
         <TableCell className="border-b-0 pb-0" colSpan={6}>
-          <Typography
-            onClick={
-              (e) => e.stopPropagation() // prevents opening/closing the card when clicking on the text
+          <Tooltip
+            title={
+              typeof course.profFirst !== 'undefined' &&
+              typeof course.profLast !== 'undefined' &&
+              (rmp !== undefined &&
+              rmp.state === 'done' &&
+              rmp.data.teacherRatingTags.length > 0
+                ? 'Tags: ' +
+                  rmp.data.teacherRatingTags
+                    .sort((a, b) => b.tagCount - a.tagCount)
+                    .slice(0, 3)
+                    .map((tag) => tag.tagName)
+                    .join(', ')
+                : 'No Tags Available')
             }
-            className="leading-tight text-lg text-gray-600 dark:text-gray-200"
+            placement="top"
           >
-            {searchQueryLabel(convertToProfOnly(course))}
-          </Typography>
+            <Typography
+              onClick={
+                (e) => e.stopPropagation() // prevents opening/closing the card when clicking on the text
+              }
+              className="leading-tight text-lg text-gray-600 dark:text-gray-200 cursor-text w-fit"
+            >
+              {searchQueryLabel(convertToProfOnly(course))}
+            </Typography>
+          </Tooltip>
         </TableCell>
       </TableRow>
       <TableRow
diff --git a/src/components/SingleProfInfo.tsx b/src/components/SingleProfInfo.tsx
index b6eef84..9d7e536 100644
--- a/src/components/SingleProfInfo.tsx
+++ b/src/components/SingleProfInfo.tsx
@@ -1,5 +1,6 @@
-import { Grid, Skeleton } from '@mui/material';
-import React from 'react';
+import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
+import { Chip, Collapse, Grid, IconButton, Skeleton } from '@mui/material';
+import React, { useState } from 'react';
 
 import type { RMPInterface } from '~data/fetchFromRmp';
 import type { GenericFetchedData } from '~pages';
@@ -9,9 +10,12 @@ type Props = {
 };
 
 function SingleProfInfo({ rmp }: Props) {
+  const [showMore, setShowMore] = useState(false);
+
   if (typeof rmp === 'undefined' || rmp.state === 'error') {
     return null;
   }
+
   if (rmp.state === 'loading') {
     return (
       <Grid container spacing={2} className="p-4">
@@ -42,6 +46,13 @@ function SingleProfInfo({ rmp }: Props) {
       </Grid>
     );
   }
+
+  const topTags = rmp.data.teacherRatingTags.sort(
+    (a, b) => b.tagCount - a.tagCount,
+  );
+  const first5 = topTags.slice(0, 5);
+  const next5 = topTags.slice(5, 10);
+
   return (
     <Grid container spacing={2} className="p-4">
       <Grid item xs={6}>
@@ -64,6 +75,46 @@ function SingleProfInfo({ rmp }: Props) {
         </p>
         <p>Would take again</p>
       </Grid>
+
+      {first5.length > 0 && (
+        <Grid item xs={12}>
+          <div className="flex gap-y-1 flex-wrap">
+            {first5.map((tag, index) => (
+              <Chip
+                key={index}
+                label={`${tag.tagName} (${tag.tagCount})`}
+                variant="outlined"
+                className="mr-1"
+              />
+            ))}
+            {next5.length > 0 && (
+              <>
+                {next5.map((tag, index) => (
+                  <Collapse key={index} in={showMore} orientation="horizontal">
+                    <Chip
+                      label={`${tag.tagName} (${tag.tagCount})`}
+                      variant="outlined"
+                      className="mr-1"
+                    />
+                  </Collapse>
+                ))}
+                <IconButton
+                  size="small"
+                  aria-label="show more"
+                  onClick={() => setShowMore(!showMore)}
+                >
+                  <ExpandMoreIcon
+                    className={
+                      'transition ' + (showMore ? 'rotate-90' : '-rotate-90')
+                    }
+                  />
+                </IconButton>
+              </>
+            )}
+          </div>
+        </Grid>
+      )}
+
       <Grid item xs={12}>
         <a
           href={