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