fix: merge course labels across pages (#541)

* fix: merge course labels across pages

* fix: merge same course

* fix: all checks pass

* fix: updated addrows function

* fix: prettier check

* fix: all checks

* fix: all checks pass

* fix: moved query tbody outside

* fix: uses row element

* fix: checks pass now

---------

Co-authored-by: Samuel Gunter <29130894+Samathingamajig@users.noreply.github.com>
This commit is contained in:
ishita778
2025-03-05 15:08:33 -06:00
committed by GitHub
parent 28ebb69612
commit 6c3139bf0f

View File

@@ -13,7 +13,7 @@ import { CourseCatalogScraper } from '@views/lib/CourseCatalogScraper';
import getCourseTableRows from '@views/lib/getCourseTableRows';
import type { SiteSupportType } from '@views/lib/getSiteSupport';
import { populateSearchInputs } from '@views/lib/populateSearchInputs';
import React, { useEffect, useState } from 'react';
import React, { useEffect, useRef, useState } from 'react';
interface Props {
support: Extract<SiteSupportType, 'COURSE_CATALOG_DETAILS' | 'COURSE_CATALOG_LIST'>;
@@ -27,6 +27,8 @@ export default function CourseCatalogMain({ support }: Props): JSX.Element | nul
const [selectedCourse, setSelectedCourse] = useState<Course | null>(null);
const [showPopup, setShowPopup] = useState(false);
const [enableScrollToLoad, setEnableScrollToLoad] = useState<boolean>(false);
const prevCourseTitleRef = useRef<string | null>(null);
const tbody = document.querySelector('table tbody')!;
useEffect(() => {
populateSearchInputs();
@@ -43,6 +45,9 @@ export default function CourseCatalogMain({ support }: Props): JSX.Element | nul
const ccs = new CourseCatalogScraper(support);
const scrapedRows = ccs.scrape(tableRows, true);
setRows(scrapedRows);
prevCourseTitleRef.current =
scrapedRows.findLast(row => row.course === null)?.element.querySelector('.course_header')?.textContent ??
null;
}, [support]);
useEffect(() => {
@@ -51,8 +56,17 @@ export default function CourseCatalogMain({ support }: Props): JSX.Element | nul
const addRows = (newRows: ScrapedRow[]) => {
newRows.forEach(row => {
document.querySelector('table tbody')!.appendChild(row.element);
const courseTitle = row.element.querySelector('.course_header')?.textContent ?? null;
if (row.course === null) {
if (courseTitle !== prevCourseTitleRef.current) {
tbody.appendChild(row.element);
prevCourseTitleRef.current = courseTitle;
}
} else {
tbody.appendChild(row.element);
}
});
setRows([...rows, ...newRows]);
};