Search page cleanup

frontends/api/src/clients.ts

@@ -2,6 +2,7 @@ import {
   LearningResourcesApi,
   LearningpathsApi,
   UserlistsApi,
+  OfferorsApi,
   TopicsApi,
   ArticlesApi,
   ProgramLettersApi,
@@ -33,6 +34,8 @@ const learningpathsApi = new LearningpathsApi(
 
 const userListsApi = new UserlistsApi(undefined, BASE_PATH, axiosInstance)
 
+const offerorsApi = new OfferorsApi(undefined, BASE_PATH, axiosInstance)
+
 const topicsApi = new TopicsApi(undefined, BASE_PATH, axiosInstance)
 
 const articlesApi = new ArticlesApi(undefined, BASE_PATH, axiosInstance)
@@ -52,6 +55,7 @@ export {
   userListsApi,
   topicsApi,
   articlesApi,
+  offerorsApi,
   programLettersApi,
   learningResourcesSearchApi,
   fieldsApi,

frontends/api/src/hooks/learningResources/index.ts

@@ -20,6 +20,7 @@ import type {
   LearningResourcesSearchApiLearningResourcesSearchRetrieveRequest as LRSearchRequest,
   UserlistsApiUserlistsListRequest as ULListRequest,
   UserlistsApiUserlistsItemsListRequest as ULItemsListRequest,
+  OfferorsApiOfferorsListRequest,
 } from "../../generated/v1"
 import learningResources, { invalidateResourceQueries } from "./keyFactory"
 
@@ -229,6 +230,16 @@ const useInfiniteUserListItems = (
   })
 }
 
+const useOfferorsList = (
+  params: OfferorsApiOfferorsListRequest = {},
+  opts: Pick<UseQueryOptions, "enabled"> = {},
+) => {
+  return useQuery({
+    ...learningResources.offerors(params),
+    ...opts,
+  })
+}
+
 export {
   useLearningResourcesList,
   useLearningResourcesDetail,
@@ -245,4 +256,5 @@ export {
   useLearningResourcesSearch,
   useUserListList,
   useInfiniteUserListItems,
+  useOfferorsList,
 }

frontends/api/src/hooks/learningResources/keyFactory.ts

@@ -5,6 +5,7 @@ import {
   learningResourcesSearchApi,
   topicsApi,
   userListsApi,
+  offerorsApi,
 } from "../../clients"
 import axiosInstance from "../../axios"
 import type {
@@ -20,6 +21,7 @@ import type {
   UserlistsApiUserlistsListRequest as ULListRequest,
   PaginatedUserListRelationshipList,
   UserList,
+  OfferorsApiOfferorsListRequest,
 } from "../../generated/v1"
 import { createQueryKeys } from "@lukemorales/query-key-factory"
 
@@ -113,6 +115,12 @@ const learningResources = createQueryKeys("learningResources", {
       }),
     },
   },
+  offerors: (params: OfferorsApiOfferorsListRequest) => {
+    return {
+      queryKey: [params],
+      queryFn: () => offerorsApi.offerorsList(params).then((res) => res.data),
+    }
+  },
 })
 
 const learningPathHasResource =

frontends/api/src/test-utils/factories/learningResources.ts

@@ -92,6 +92,7 @@ const learningResourceOfferor: Factory<LearningResourceOfferor> = (
     ...overrides,
   }
 }
+const learningResourceOfferors = makePaginatedFactory(learningResourceOfferor)
 
 const learningResourceRun: Factory<LearningResourceRun> = (overrides = {}) => {
   const start = overrides.start_date
@@ -404,6 +405,7 @@ export {
   learningResourceImage as image,
   learningResourceDepartment as department,
   learningResourceTopics as topics,
+  learningResourceOfferors as offerors,
   learningPath,
   learningPaths,
   microRelationship,

frontends/api/src/test-utils/urls.ts

@@ -11,6 +11,7 @@ import type {
   LearningpathsApi,
   ArticlesApi,
   UserlistsApi,
+  OfferorsApi,
 } from "../generated/v1"
 import type { BaseAPI } from "../generated/v1/base"
 
@@ -36,6 +37,11 @@ const learningResources = {
     `/api/v1/learning_resources/${params.id}/`,
 }
 
+const offerors = {
+  list: (params?: Params<OfferorsApi, "offerorsList">) =>
+    `/api/v1/offerors/${query(params)}`,
+}
+
 const topics = {
   list: (params?: Params<TopicsApi, "topicsList">) =>
     `/api/v1/topics/${query(params)}`,
@@ -107,4 +113,5 @@ export {
   programLetters,
   fields,
   widgetLists,
+  offerors,
 }

frontends/mit-open/package.json

@@ -37,7 +37,7 @@
   },
   "dependencies": {
     "@ebay/nice-modal-react": "^1.2.13",
-    "@mitodl/course-search-utils": "^3.0.3",
+    "@mitodl/course-search-utils": "https://github.com/mitodl/course-search-utils.git#baafa5995878c4c889799d86ec490674b522c405",
     "@mui/icons-material": "^5.14.19",
     "@sentry/react": "^7.57.0",
     "@tanstack/react-query": "^4.36.1",

frontends/mit-open/src/components/CardRowList/CardRowList.tsx

@@ -2,10 +2,11 @@ import { styled } from "ol-components"
 
 const SPACER = "1.5em"
 
-const CardRowList = styled.ul<{ disabled?: boolean }>`
+const CardRowList = styled.ul<{ disabled?: boolean; marginTop?: boolean }>`
   padding-left: 0;
   margin-left: 0;
   margin-right: 0;
+  ${({ marginTop }) => (marginTop ? "" : "margin-top: 0;")}
 
   > li {
     list-style: none;

frontends/mit-open/src/pages/SearchPage/ResourceTypeTabs.tsx

@@ -1,7 +1,6 @@
 import React from "react"
 import { Tab, TabContext, TabList, TabPanel } from "ol-components"
 import type { ResourceTypeEnum, LearningResourceSearchResponse } from "api"
-import type { UseSearchQueryParamsResult } from "@mitodl/course-search-utils"
 
 type TabConfig = {
   resource_type: ResourceTypeEnum
@@ -42,15 +41,17 @@ const ResourceTypesTabContext: React.FC<{
 type ResourceTypeTabsProps = {
   aggregations?: Aggregations
   tabs: TabConfig[]
-  setFacetActive: UseSearchQueryParamsResult["setFacetActive"]
-  clearFacet: UseSearchQueryParamsResult["clearFacet"]
+  patchParams: ({
+    resource_type,
+  }: {
+    resource_type: ResourceTypeEnum[]
+  }) => void
   onTabChange?: (tab: ResourceTypeEnum | "all") => void
 }
 const ResourceTypeTabList: React.FC<ResourceTypeTabsProps> = ({
   tabs,
   aggregations,
-  setFacetActive,
-  clearFacet,
+  patchParams,
   onTabChange,
 }) => {
   const counts = resourceTypeCounts(aggregations)
@@ -60,10 +61,7 @@ const ResourceTypeTabList: React.FC<ResourceTypeTabsProps> = ({
   return (
     <TabList
       onChange={(_e, value) => {
-        clearFacet("resource_type")
-        if (value !== "all") {
-          setFacetActive("resource_type", value, true)
-        }
+        patchParams({ resource_type: value === "all" ? [] : [value] })
         onTabChange?.(value)
       }}
     >