diff --git a/frontend/src/app/page.tsx b/frontend/src/app/page.tsx index 0e79f0843..f2966f093 100644 --- a/frontend/src/app/page.tsx +++ b/frontend/src/app/page.tsx @@ -42,7 +42,20 @@ export default async function Home() { ratingValue: course.reviewCount === 0 ? 0 : course.overallRating, bestRating: 5, }, - }, + offers: [{ + "@type": "Offer", + category: "Paid" + }], + hasCourseInstance: course.terms.map((term: number) => ({ + "@type": "CourseInstance", + courseMode: "Blended", + courseSchedule: { + "@type": "Schedule", + repeatCount: term === 0 ? 5 : 10, + repeatFrequency: "Weekly", + } + })) + } })), }; diff --git a/frontend/src/app/terms-and-conditions/page.tsx b/frontend/src/app/terms-and-conditions/page.tsx index 065947c30..d6381f6ca 100644 --- a/frontend/src/app/terms-and-conditions/page.tsx +++ b/frontend/src/app/terms-and-conditions/page.tsx @@ -7,7 +7,7 @@ export const metadata: Metadata = { export default function TermsAndConditions() { return ( -
diff --git a/frontend/src/components/CoursesList/CoursesList.tsx b/frontend/src/components/CoursesList/CoursesList.tsx index b0f4f4aac..2f45ba209 100644 --- a/frontend/src/components/CoursesList/CoursesList.tsx +++ b/frontend/src/components/CoursesList/CoursesList.tsx @@ -32,7 +32,7 @@ export default function CoursesList({ // default courses try { const { courses } = (await get( - `/courses?offset=${index}` + `/courses?offset=${index}`, )) as Courses; fetchedCourses = courses; } catch (err) { @@ -71,7 +71,7 @@ export default function CoursesList({ const getSearchResults = async () => { try { const { courses } = (await get( - `/course/search/${searchTerm}` + `/course/search/${searchTerm}`, )) as Courses; searchCoursesRef.current = courses; } catch (err) { @@ -84,6 +84,9 @@ export default function CoursesList({ const getInitialDisplayCourses = () => { if (searchTerm !== "") { getSearchResults(); + } else { + setDisplayCourses(initialCourses.slice(0, paginationOffset)); + setInitialLoading(false); } }; const loadOnScroll = () => { @@ -119,7 +122,7 @@ export default function CoursesList({ terms={c.terms} /> - ) + ), )} {!initialLoading ? (
No more courses
diff --git a/frontend/src/components/TruncatedDescription/TruncatedDescription.tsx b/frontend/src/components/TruncatedDescription/TruncatedDescription.tsx index 0e2ea920d..e08fa3074 100644 --- a/frontend/src/components/TruncatedDescription/TruncatedDescription.tsx +++ b/frontend/src/components/TruncatedDescription/TruncatedDescription.tsx @@ -1,6 +1,6 @@ "use client"; -import { useState } from "react"; +import { useEffect, useState } from "react"; export default function TruncatedDescription({ content, @@ -9,26 +9,63 @@ export default function TruncatedDescription({ content: string; maxCharacters: number; }) { + const [showFullContent, setShowFullContent] = useState(false); + const [exceed, setExceed] = useState(false); + const [shortenedContent, setShortenedContent] = useState(" "); - const shortenedContent = - content.length < maxCharacters - ? content - : `${content.slice(0, maxCharacters)}...`; + /** + * If the content exceeds the maxCharacters, find the next whitespace + * and make the cutoff point there so the break does not happen mid-word + * + * If the new cutoff point is the end of the entire content, make it so + * the See More/Less button does not appear + */ + useEffect(() => { + if (content.length > maxCharacters) { + // Description exceeds max characters + setShowFullContent(false); + let newMax = maxCharacters; + let index = newMax - 1; + while (true) { + if (content[index] === ' ' || index === content.length) { + newMax = index; + break; + } + newMax++; + index++; + } + if (index === content.length) { + setShortenedContent(content); + } else { + setExceed(true); + setShortenedContent(content.slice(0, newMax) + '...'); + } + } else { + // Description length is less than maxCharacters + setShowFullContent(true); + setExceed(false); + setShortenedContent(content); + } + }, [content]) return (- {showFullContent ? content : shortenedContent}{" "} +
+ {showFullContent ? content : shortenedContent}
- {content.length > maxCharacters && ( - - )} +