feat: add eslint-plugin-tsdoc (#430)

* feat: add eslint-plugin-tsdoc

* feat(doc): update current jsdoc to tsdoc specification

* chore: update deps

* feat: update warn to error for jsdoc and tsdoc

* chore(doc): lint

src/views/components/injected/CourseCatalogInjectedPopup/CourseCatalogInjectedPopup.tsx

@@ -11,19 +11,17 @@ import HeadingAndActions from './HeadingAndActions';
 /**
  * Props for the CourseCatalogInjectedPopup component.
  */
-export type CourseCatalogInjectedPopupProps = DialogProps & {
+export interface CourseCatalogInjectedPopupProps extends DialogProps {
     course: Course;
-};
+}
 
 /**
  * CourseCatalogInjectedPopup component displays a popup with course details.
  *
- * @component
- * @param {CourseCatalogInjectedPopupProps} props - The component props.
- * @param {Course} props.course - The course object containing course details.
- * @param {Schedule} props.activeSchedule - The active schedule object.
- * @param {Function} props.onClose - The function to close the popup.
- * @returns {JSX.Element} The CourseCatalogInjectedPopup component.
+ * @param course - The course object containing course details.
+ * @param activeSchedule - The active schedule object.
+ * @param onClose - The function to close the popup.
+ * @returns The CourseCatalogInjectedPopup component.
  */
 function CourseCatalogInjectedPopup({ course, ...rest }: CourseCatalogInjectedPopupProps): JSX.Element {
     const emptyRef = React.useRef<HTMLDivElement>(null);

src/views/components/injected/CourseCatalogInjectedPopup/Description.tsx

@@ -32,10 +32,8 @@ const fetchDescription = async (course: Course): Promise<string[]> => {
 /**
  * Renders the description component.
  *
- * @component
- * @param {DescriptionProps} props - The component props.
- * @param {Course} props.course - The course for which to display the description.
- * @returns {JSX.Element} The rendered description component.
+ * @param course - The course for which to display the description.
+ * @returns The rendered description component.
  */
 export default function Description({ course }: DescriptionProps): JSX.Element {
     const [description, setDescription] = React.useState<string[]>([]);

src/views/components/injected/CourseCatalogInjectedPopup/GradeDistribution.tsx

@@ -48,10 +48,8 @@ const GRADE_COLORS = {
 /**
  * Renders the grade distribution chart for a specific course.
  *
- * @component
- * @param {GradeDistributionProps} props - The component props.
- * @param {Course} props.course - The course for which to display the grade distribution.
- * @returns {JSX.Element} The grade distribution chart component.
+ * @param course - The course for which to display the grade distribution.
+ * @returns The grade distribution chart component.
  */
 export default function GradeDistribution({ course }: GradeDistributionProps): JSX.Element {
     const [semester, setSemester] = useState('Aggregate');

src/views/components/injected/CourseCatalogInjectedPopup/HeadingAndActions.tsx

@@ -22,6 +22,14 @@ import Reviews from '~icons/material-symbols/reviews';
 
 const { openNewTab, addCourse, removeCourse, openCESPage } = background;
 
+/**
+ * Capitalizes the first letter of a string and converts the rest of the letters to lowercase.
+ *
+ * @param str - The string to be capitalized.
+ * @returns The capitalized string.
+ */
+const capitalizeString = (str: string) => str.charAt(0).toUpperCase() + str.slice(1).toLowerCase();
+
 interface HeadingAndActionProps {
     /* The course to display */
     course: Course;
@@ -31,22 +39,13 @@ interface HeadingAndActionProps {
     onClose: () => void;
 }
 
-/**
- * Capitalizes the first letter of a string and converts the rest of the letters to lowercase.
- *
- * @param str - The string to be capitalized.
- * @returns The capitalized string.
- */
-const capitalizeString = (str: string) => str.charAt(0).toUpperCase() + str.slice(1).toLowerCase();
-
 /**
  * Renders the heading component for the CoursePopup component.
  *
- * @param {HeadingAndActionProps} props - The component props.
- * @param {Course} props.course - The course object containing course details.
- * @param {Schedule} props.activeSchedule - The active schedule object.
- * @param {Function} props.onClose - The function to close the popup.
- * @returns {JSX.Element} The rendered component.
+ * @param course - The course object containing course details.
+ * @param activeSchedule - The active schedule object.
+ * @param onClose - The function to close the popup.
+ * @returns The rendered component.
  */
 export default function HeadingAndActions({ course, activeSchedule, onClose }: HeadingAndActionProps): JSX.Element {
     const { courseName, department, number: courseNumber, uniqueId, instructors, flags, schedule, core } = course;

src/views/components/injected/RecruitmentBanner/RecruitmentBanner.tsx

@@ -12,6 +12,7 @@ const RECRUIT_FROM_DEPARTMENTS = ['C S', 'ECE', 'MIS', 'CSE', 'EE', 'ITD', 'DES'
 
 /**
  * This adds a new column to the course catalog table header.
+ *
  * @returns a react portal to the new column or null if the column has not been created yet.
  */
 export default function RecruitmentBanner(): JSX.Element | null {
@@ -53,7 +54,8 @@ export default function RecruitmentBanner(): JSX.Element | null {
 
 /**
  * Determines if recruitment can be done from the current department.
- * @returns {boolean} True if recruitment can be done from the current department, false otherwise.
+ *
+ * @returns True if recruitment can be done from the current department, false otherwise.
  */
 export const canRecruitFrom = (): boolean => {
     const params = ['fos_fl', 'fos_cn'];