From 0bd742d7f0e0a78dd2b9aa9e5fdfd75b91a1e8d5 Mon Sep 17 00:00:00 2001 From: rebeccahongsf Date: Wed, 8 May 2024 14:35:22 -0700 Subject: [PATCH] [wip] pass favorites into user favorites --- .../course-filtering-form.tsx | 7 +- .../user-favorite-paragraph.tsx | 65 ++----------------- .../patterns/algolia-course-list.tsx | 8 ++- src/lib/hooks/useFavorites.tsx | 46 ++++++------- 4 files changed, 38 insertions(+), 88 deletions(-) diff --git a/src/components/paragraphs/sum-course-filter/course-filtering-form.tsx b/src/components/paragraphs/sum-course-filter/course-filtering-form.tsx index 55f183f0..8d86e161 100644 --- a/src/components/paragraphs/sum-course-filter/course-filtering-form.tsx +++ b/src/components/paragraphs/sum-course-filter/course-filtering-form.tsx @@ -13,7 +13,8 @@ import {IndexUiState} from "instantsearch.js/es/types/ui-state"; import useAccordion from "@lib/hooks/useAccordion"; import {RefinementListItem} from "instantsearch.js/es/connectors/refinement-list/connectRefinementList"; import {clsx} from "clsx"; -import DefaultResult, {AlgoliaHit} from "@components/algolia-results/default"; +import {AlgoliaHit} from "@components/algolia-results/default"; +import SummerCourse from "@components/algolia-results/summer-course/summer-course"; type Props = { appId: string @@ -262,8 +263,8 @@ const HitList = () => { diff --git a/src/components/paragraphs/summer-user-favorite/user-favorite-paragraph.tsx b/src/components/paragraphs/summer-user-favorite/user-favorite-paragraph.tsx index 69e52d63..17945858 100644 --- a/src/components/paragraphs/summer-user-favorite/user-favorite-paragraph.tsx +++ b/src/components/paragraphs/summer-user-favorite/user-favorite-paragraph.tsx @@ -5,69 +5,14 @@ import { ParagraphSumUserFavorite } from "@lib/gql/__generated__/drupal.d"; import AlgoliaCourseList from "@components/patterns/algolia-course-list"; - - -const favoriteCourseList = [ - { - "url": "https://example.com/g76H32uJqR", - "title": "Race Against the Stars", - "summary": undefined, - "photo": "http://summer.lagunita.loc/sites/summer/files/media/image/temp-img_1.jpg", - "updated": 0, - "html": "This class introduces the core concepts and methods of Cultural and Social Anthropology. Through the ethnographic study of human societies, anthropology has emerged as a dynamic discipline that inquiries into the complexity of humanity. It has produced new kinds of inquiry into race, class, gender, history, power, language, economy, culture, and local, transnational, and global phenomena. This course will introduce students to anthropology’s unique approach to studying human culture and society and teach them core anthropological concepts. It will also present students with cross-cultural case studies on contemporary issues, including environmental problems and climate change, capitalism, gender and sexuality, race, immigration, and colonialism.", - "type": "", - "sum_course_availability": "Available", - "sum_course_catalog_number": "ASTRO-101", - "sum_course_class_number": "492", - "sum_course_course_cost": 7800, - "sum_course_cross_listing": "ASTRO-100", - "sum_course_description": "In turpis. Phasellus volutpat, metus eget egestas mollis, lacus lacus blandit dui, id egestas quam mauris ut lacus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas egestas arcu quis ligula mattis placerat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.", - "sum_course_end_date": "2024-05-17T11:09:28.440Z", - "sum_course_format": "Hybrid", - "sum_course_interest": ["Mathematics"], - "sum_course_length": "Short", - "sum_course_notes": "Vivamus consectetuer hendrerit lacus. Proin faucibus arcu quis ante. Nunc nonummy metus. Sed hendrerit. Maecenas vestibulum mollis diam.", - "sum_course_population": ["Graduate", "Part-time"], - "sum_course_prerequisites": "ASTRO-001", - "sum_course_schedule": "9:00 - 11:30am Monday, Wednesday, Friday", - "sum_course_start_date": "2023-08-14T04:33:14.440Z", - "sum_course_units": 3, - "sum_students_also_studied": 72 - }, - { - "url": "https://example.com/f94Z29cVqS", - "title": "Microbiology: Human Health & Society", - "summary": undefined, - "photo": "http://summer.lagunita.loc/sites/summer/files/media/image/temp-img_1.jpg", - "updated": 0, - "html": "This class introduces the core concepts and methods of Cultural and Social Anthropology. Through the ethnographic study of human societies, anthropology has emerged as a dynamic discipline that inquiries into the complexity of humanity. It has produced new kinds of inquiry into race, class, gender, history, power, language, economy, culture, and local, transnational, and global phenomena. This course will introduce students to anthropology’s unique approach to studying human culture and society and teach them core anthropological concepts. It will also present students with cross-cultural case studies on contemporary issues, including environmental problems and climate change, capitalism, gender and sexuality, race, immigration, and colonialism.", - "type": "", - "sum_course_availability": "Not Available", - "sum_course_catalog_number": "ASTRO-123", - "sum_course_class_number": "815", - "sum_course_course_cost": 4750, - "sum_course_cross_listing": "ASTRO-101", - "sum_course_description": "Quisque rutrum. Etiam iaculis nunc ac metus. Etiam sollicitudin, ipsum eu pulvinar rutrum, tellus ipsum laoreet sapien, quis venenatis ante odio sit amet eros. Quisque libero metus, condimentum nec, tempor a, commodo mollis, magna. Phasellus consectetuer vestibulum elit.", - "sum_course_end_date": "2023-11-30T05:07:42.015Z", - "sum_course_format": "Online", - "sum_course_interest": ["Science"], - "sum_course_length": "Long", - "sum_course_notes": "Etiam feugiat lorem non metus. Nulla neque dolor, sagittis eget, iaculis quis, molestie non, velit. Sed in libero ut nibh placerat accumsan. Phasellus volutpat, metus eget egestas mollis, lacus lacus blandit dui, id egestas quam mauris ut lacus. Donec orci lectus, aliquam ut, faucibus non, euismod id, nulla.", - "sum_course_population": ["Undergraduate", "Full-time"], - "sum_course_prerequisites": "ASTRO-001", - "sum_course_schedule": "9:00 - 11:30am Monday, Wednesday, Friday", - "sum_course_start_date": "2023-03-12T17:38:42.015Z", - "sum_course_units": 8, - "sum_students_also_studied": 58 - } -] - +import useFavorites from "@lib/hooks/useFavorites"; type Props = HtmlHTMLAttributes & { paragraph: ParagraphSumUserFavorite } -const UserFavoriteParagraph = async ({paragraph, ...props}: Props) => { +const UserFavoriteParagraph = async ({ paragraph, ...props }: Props) => { + const { favs } = useFavorites(); const siteSettingsConfig = await getConfigPage("StanfordBasicSiteSetting") if (!siteSettingsConfig?.suSiteAlgoliaId || !siteSettingsConfig.suSiteAlgoliaSearch || !siteSettingsConfig.suSiteAlgoliaIndex) { @@ -79,12 +24,12 @@ const UserFavoriteParagraph = async ({paragraph, ...props}: Props) => {
{/* Favorites List */}
- {/* {favoriteCourseList.map((course, i) => )} */} ) diff --git a/src/components/patterns/algolia-course-list.tsx b/src/components/patterns/algolia-course-list.tsx index b66056f6..74ec56ee 100644 --- a/src/components/patterns/algolia-course-list.tsx +++ b/src/components/patterns/algolia-course-list.tsx @@ -33,7 +33,7 @@ const AlgoliaCourseList = ({appId, searchIndex, searchApiKey, itemUuids}: Props) } const HitList = () => { - const {hits} = useHits({}); + const { hits } = useHits({}); const {currentRefinement: currentPage, pages, nbPages, refine: goToPage} = usePagination({padding: 2}) if (hits.length === 0) { @@ -45,7 +45,11 @@ const HitList = () => { return (
    - {hits.map((hit, i) => )} + {hits.map(hit => +
  • + +
    • + )}
{pages.length > 1 && diff --git a/src/lib/hooks/useFavorites.tsx b/src/lib/hooks/useFavorites.tsx index 86b928ef..50085e48 100644 --- a/src/lib/hooks/useFavorites.tsx +++ b/src/lib/hooks/useFavorites.tsx @@ -1,32 +1,32 @@ "use client"; -import {useCallback} from "react"; -import {useLocalStorage} from "usehooks-ts"; - -type Favorite = { - uuid: string - title: string -} +import { useCallback } from "react"; +import { useLocalStorage, useIsClient } from "usehooks-ts"; const useFavorites = (): { - favs: Favorite[], - addFav: (_uuid: string, _title: string) => void, - removeFav: (_uuid: string) => void + favs: string[]; + addFav: (_uuid: string) => void; + removeFav: (_uuid: string) => void; } => { - const [favs, setFavs] = useLocalStorage("favorites", [], {initializeWithValue: false}) + const isClient = useIsClient(); + const [favs, setFavs] = useLocalStorage("favorites", [], { initializeWithValue: false }); - const addFav = useCallback((uuid: string, title: string) => { - setFavs([...favs, {uuid, title}]) - }, [favs, setFavs]) + const addFav = useCallback( + (uuid: string) => { + setFavs([...favs, uuid ]); + }, + [favs, setFavs] + ); - const removeFav = useCallback((uuid: string) => { - const itemIndex = favs.findIndex(fav => fav.uuid === uuid); - const oldFavs = [...favs]; - oldFavs.splice(itemIndex, 1); - setFavs(oldFavs); - }, [favs, setFavs]) + const removeFav = useCallback( + (uuid: string) => { + const updatedFavs = favs.filter((fav) => fav !== uuid); + setFavs(updatedFavs); + }, + [favs, setFavs] + ); - return {favs, addFav, removeFav} -} + return { favs: isClient ? favs : [], addFav, removeFav }; +}; -export default useFavorites; \ No newline at end of file +export default useFavorites;