fix: tsdoc and updated components/utils

src/views/components/map/CampusMap.tsx

@@ -20,9 +20,8 @@ type SelectedBuildings = {
 /**
  * DaySelector component allows users to select a day from a list of days.
  *
- * @param props - The component props.
- * @param props.selectedDay - The currently selected day.
- * @param props.onDaySelect - Callback function to handle day selection.
+ * @param selectedDay - The currently selected day.
+ * @param onDaySelect - Callback function to handle day selection.
  *
  * @returns The rendered DaySelector component.
  */
@@ -52,10 +51,9 @@ const DaySelector = ({
  * TimeWarningLabel component that renders a warning label on a map.
  * The label consists of a circle with a text inside it, indicating the number of minutes.
  *
- * @param props - The properties object.
- * @param props.x - The x-coordinate for the center of the circle.
- * @param props.y - The y-coordinate for the center of the circle.
- * @param props.minutes - The number of minutes to display inside the circle.
+ * @param x - The x-coordinate for the center of the circle.
+ * @param y - The y-coordinate for the center of the circle.
+ * @param minutes - The number of minutes to display inside the circle.
  * @returns A JSX element representing the warning label.
  */
 const TimeWarningLabel = ({ x, y, minutes }: { x: number; y: number; minutes: number }): JSX.Element => (
@@ -74,9 +72,7 @@ type CampusMapProps = {
 /**
  * Component representing the campus map with interactive features.
  *
- * @component
- * @param props - The properties for the CampusMap component.
- * @param props.processedCourses - Array of processed courses.
+ * @param processedCourses - Array of processed courses.
  * @returns The rendered CampusMap component.
  *
  * @remarks

src/views/components/map/DaySelector.tsx

@@ -13,9 +13,8 @@ type DaySelectorProps = {
 /**
  * DaySelector component allows users to select a day from a predefined set of days.
  *
- * @param props - The properties object.
- * @param props.selectedDay - The currently selected day.
- * @param props.onDaySelect - Callback function to handle day selection.
+ * @param selectedDay - The currently selected day.
+ * @param onDaySelect - Callback function to handle day selection.
  *
  * @returns The rendered DaySelector component.
  */

src/views/components/map/Map.tsx

@@ -33,19 +33,19 @@ const dayToNumber = {
 /**
  * Represents the details of an in-person meeting process.
  *
- * @property day - The day of the meeting.
- * @property dayIndex - The index of the day in the week.
- * @property fullName - The full name of the person.
- * @property uid - The unique identifier of the person.
- * @property time - The time of the meeting.
- * @property normalizedStartTime - The normalized start time of the meeting.
- * @property normalizedEndTime - The normalized end time of the meeting.
- * @property startIndex - The start index of the meeting.
- * @property endIndex - The end index of the meeting.
- * @property location - The location of the meeting.
- * @property status - The status of the meeting.
- * @property colors - The colors associated with the course.
- * @property course - The course details.
+ * day - The day of the meeting.
+ * dayIndex - The index of the day in the week.
+ * fullName - The full name of the person.
+ * uid - The unique identifier of the person.
+ * time - The time of the meeting.
+ * normalizedStartTime - The normalized start time of the meeting.
+ * normalizedEndTime - The normalized end time of the meeting.
+ * startIndex - The start index of the meeting.
+ * endIndex - The end index of the meeting.
+ * location - The location of the meeting.
+ * status - The status of the meeting.
+ * colors - The colors associated with the course.
+ * course - The course details.
  */
 export type ProcessInPersonMeetings = {
     day: DAY;
@@ -65,7 +65,7 @@ export type ProcessInPersonMeetings = {
 
 /**
  * Converts minutes to an index value.
- * @param minutes The number of minutes.
+ * @param minutes - The number of minutes.
  * @returns The index value.
  */
 const convertMinutesToIndex = (minutes: number): number => Math.floor((minutes - 420) / 30);
@@ -90,7 +90,7 @@ export default function Map(): JSX.Element {
 
         const mainInstructor = course.instructors[0];
         if (mainInstructor) {
-            courseDeptAndInstr += ` – ${mainInstructor.toString({ format: 'first_last', case: 'capitalize' })}`;
+            courseDeptAndInstr += ` – ${mainInstructor.toString({ format: 'first_last' })}`;
         }
 
         return { status, courseDeptAndInstr, meetings, course };
@@ -136,7 +136,7 @@ export default function Map(): JSX.Element {
         course: Course
     ) {
         const { days, location, startTime, endTime } = meeting;
-        const time = meeting.getTimeString({ separator: '-', capitalize: true });
+        const time = meeting.getTimeString({ separator: '-' });
         const timeAndLocation = `${time}${location ? ` - ${location.building} ${location.room}` : ''}`;
 
         const midnightIndex = 1440;
@@ -241,7 +241,7 @@ export default function Map(): JSX.Element {
                     UTRP Map
                 </Text>
                 <div className='hidden flex-row items-center justify-end gap-6 screenshot:hidden lg:flex'>
-                    <Button variant='single' color='theme-black' onClick={handleChangelogOnClick}>
+                    <Button variant='minimal' color='theme-black' onClick={handleChangelogOnClick}>
                         <IconoirGitFork className='h-6 w-6 text-ut-gray' />
                         <Text variant='small' className='text-ut-gray font-normal'>
                             v{manifest.version} - {process.env.NODE_ENV}

src/views/components/map/Path.tsx

@@ -14,12 +14,11 @@ type PathProps = {
 /**
  * Renders a path between two nodes in a graph.
  *
- * @param props - The properties object.
- * @param props.startId - The ID of the starting node.
- * @param props.endId - The ID of the ending node.
- * @param props.graph - The graph object containing nodes and edges.
- * @param props.color - The color of the path.
- * @param [props.className] - Additional CSS classes for the path.
+ * @param startId - The ID of the starting node.
+ * @param endId - The ID of the ending node.
+ * @param graph - The graph object containing nodes and edges.
+ * @param color - The color of the path.
+ * @param className - Additional CSS classes for the path.
  *
  * @returns The rendered path as a series of SVG lines, or null if an error occurs.
  */

src/views/components/map/PathStats.tsx

@@ -11,9 +11,8 @@ type PathStatsProps = {
 /**
  * Calculates the direct path statistics between two nodes.
  *
- * @param props - The properties object.
- * @param props.startId - The ID of the starting node.
- * @param props.endId - The ID of the ending node.
+ * @param startId - The ID of the starting node.
+ * @param endId - The ID of the ending node.
  *
  * @returns The distance in feet and walking time in minutes between the two nodes.
  */
@@ -41,9 +40,8 @@ export const calcDirectPathStats = ({ startId, endId }: PathStatsProps) => {
 /**
  * Component to display statistics about a path between two nodes on a map.
  *
- * @param props - The properties for the PathStats component.
- * @param props.startId - The ID of the starting node.
- * @param props.endId - The ID of the ending node.
+ * @param startId - The ID of the starting node.
+ * @param endId - The ID of the ending node.
  *
  * @returns A JSX element displaying the path statistics, or null if the nodes are invalid.
  */

src/views/components/map/types.ts

@@ -17,8 +17,8 @@ export type NodeType = 'building' | 'intersection' | 'walkway';
 /**
  * Represents the coordinates of a node on a map.
  *
- * @property x - The x-coordinate of the node.
- * @property y - The y-coordinate of the node.
+ * @typeparam x - The x-coordinate of the node.
+ * @typeparam y - The y-coordinate of the node.
  */
 export type NodeCoordinates = {
     x: number;
@@ -28,9 +28,7 @@ export type NodeCoordinates = {
 /**
  * Represents a map node with specific coordinates and a type.
  *
- * @extends NodeCoordinates
- *
- * @property type - The type of the node.
+ * @typeparam type - The type of the node.
  */
 export type MapNode = NodeCoordinates & {
     type: NodeType;
@@ -56,16 +54,16 @@ export type NodeId = string;
 /**
  * A map that associates a node identifier with a distance.
  *
- * @property NodeId - The unique identifier for a node.
- * @property Distance - The distance associated with the node.
+ * @typeparam NodeId - The unique identifier for a node.
+ * @typeparam Distance - The distance associated with the node.
  */
 export type DistanceMap = Record<NodeId, Distance>;
 
 /**
  * A type representing a mapping of node identifiers to their previous node identifiers.
  *
- * @property NodeId - The identifier of the current node.
- * @property NodeId - The identifier of the previous node, or null if there is no previous node.
+ * @typeparam NodeId - The identifier of the current node.
+ * @typeparam NodeId - The identifier of the previous node, or null if there is no previous node.
  */
 export type PreviousMap = Record<NodeId, NodeId | null>;
 
@@ -99,17 +97,14 @@ export type DayCode = 'M' | 'T' | 'W' | 'TTH' | 'F';
 
 /**
  * An array of strings representing the days of the week.
- *
  * The days are ordered starting from Monday to Sunday.
- *
- * @constant {readonly string[]}
  */
 export const DAYS = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'] as const;
 
 /**
  * Represents a day of the week.
- * @type {string}
  *
+ * @remarks
  * This type is derived from the `DAYS` array, representing one of its elements.
  * It is used to ensure that only valid days of the week are assigned to variables of this type.
  */
@@ -119,12 +114,6 @@ type DayMapping = Record<DayCode, DAY>;
 
 /**
  * A constant object that maps single-letter day abbreviations to their full names.
- *
- * @property M - Represents Monday.
- * @property T - Represents Tuesday.
- * @property W - Represents Wednesday.
- * @property TTH - Represents Thursday.
- * @property F - Represents Friday.
  */
 export const DAY_MAPPING = {
     M: 'Monday',