resource type for learning materials

frontends/mit-open/src/page-components/SearchDisplay/SearchDisplay.tsx

@@ -514,7 +514,9 @@ const SearchDisplay: React.FC<SearchDisplayProps> = ({
         ? [activeTab.resource_category]
         : undefined,
       ...requestParams,
-      aggregations: facetNames as LRSearchRequest["aggregations"],
+      aggregations: (facetNames || []).concat([
+        "resource_category",
+      ]) as LRSearchRequest["aggregations"],
       offset: (page - 1) * PAGE_SIZE,
     }
   }, [

frontends/mit-open/src/pages/ChannelPage/ChannelSearch.tsx

@@ -50,20 +50,23 @@ const StyledSearchInput = styled(SearchInput)`
 const FACETS_BY_CHANNEL_TYPE: Record<ChannelTypeEnum, string[]> = {
   [ChannelTypeEnum.Topic]: [
     "free",
+    "resource_type",
     "certification_type",
     "learning_format",
     "offered_by",
     "department",
   ],
   [ChannelTypeEnum.Department]: [
     "free",
+    "resource_type",
     "certification_type",
     "topic",
     "learning_format",
     "offered_by",
   ],
   [ChannelTypeEnum.Unit]: [
     "free",
+    "resource_type",
     "topic",
     "certification_type",
     "learning_format",
@@ -86,9 +89,10 @@ const getFacetManifestForChannelType = (
   channelType: ChannelTypeEnum,
   offerors: Record<string, LearningResourceOfferor>,
   constantSearchParams: Facets,
+  resourceCategory: string | null,
 ): FacetManifest => {
   const facets = FACETS_BY_CHANNEL_TYPE[channelType] || []
-  return getFacetManifest(offerors)
+  return getFacetManifest(offerors, resourceCategory)
     .filter(
       (facetSetting) =>
         !Object.keys(constantSearchParams).includes(facetSetting.name) &&
@@ -114,15 +118,17 @@ const ChannelSearch: React.FC<ChannelSearchProps> = ({
   }, [offerorsQuery.data?.results])
 
   const [searchParams, setSearchParams] = useSearchParams()
+  const resourceCategory = searchParams.get("resource_category")
 
   const facetManifest = useMemo(
     () =>
       getFacetManifestForChannelType(
         channelType,
         offerors,
         constantSearchParams,
+        resourceCategory,
       ),
-    [offerors, channelType, constantSearchParams],
+    [offerors, channelType, constantSearchParams, resourceCategory],
   )
 
   const setPage = useCallback(
@@ -154,7 +160,7 @@ const ChannelSearch: React.FC<ChannelSearchProps> = ({
         }
       }),
     ),
-  ).concat(["resource_category"]) as UseResourceSearchParamsProps["facets"]
+  ) as UseResourceSearchParamsProps["facets"]
 
   const {
     hasFacets,

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

@@ -121,6 +121,7 @@ describe("SearchPage", () => {
         "offered_by",
         "professional",
         "resource_category",
+        "resource_type",
         "topic",
       ])
       expect(Object.fromEntries(apiSearchParams.entries())).toEqual(
@@ -168,6 +169,37 @@ describe("SearchPage", () => {
     expect(location.current.search).toBe("?topic=Physics")
   })
 
+  test("Shows Learning Resource facet only if learning materials tab is selected", async () => {
+    setMockApiResponses({
+      search: {
+        count: 700,
+        metadata: {
+          aggregations: {
+            resource_category: [
+              { key: "course", doc_count: 100 },
+              { key: "learning_material", doc_count: 200 },
+            ],
+            resource_type: [
+              { key: "course", doc_count: 100 },
+              { key: "podcast", doc_count: 100 },
+              { key: "video", doc_count: 100 },
+            ],
+          },
+          suggestions: [],
+        },
+      },
+    })
+    renderWithProviders(<SearchPage />)
+
+    const facetsContainer = screen.getByTestId("facets-container")
+    expect(within(facetsContainer).queryByText("Resource Type")).toBeNull()
+    const tabLearningMaterial = screen.getByRole("tab", {
+      name: /Learning Material/,
+    })
+    await user.click(tabLearningMaterial)
+    await within(facetsContainer).findByText("Resource Type")
+  })
+
   test("Submitting text updates URL", async () => {
     setMockApiResponses({})
     const { location } = renderWithProviders(<SearchPage />, { url: "?q=meow" })

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

@@ -54,10 +54,13 @@ const SearchField = styled(SearchInput)`
   }
 `
 
+const LEARNING_MATERIAL = "learning_material"
+
 export const getFacetManifest = (
   offerors: Record<string, LearningResourceOfferor>,
+  resourceCategory: string | null,
 ) => {
-  return [
+  const mainfest = [
     {
       type: "group",
       name: "free",
@@ -69,6 +72,18 @@ export const getFacetManifest = (
         },
       ],
     },
+    {
+      name: "resource_type",
+      title: "Resource Type",
+      type: "static",
+      expandedOnLoad: true,
+      preserveItems: true,
+      labelFunction: (key: string) =>
+        key
+          .split("_")
+          .map((word) => capitalize(word))
+          .join(" "),
+    },
     {
       name: "certification_type",
       title: "Certificate",
@@ -113,10 +128,17 @@ export const getFacetManifest = (
       labelFunction: (key: string) => getDepartmentName(key) || key,
     },
   ]
+
+  //Only display the resource_type facet if the resource_category is learning_material
+  if (resourceCategory !== LEARNING_MATERIAL) {
+    mainfest.splice(1, 1)
+  }
+
+  return mainfest
 }
 
 const facetNames = [
-  "resource_category",
+  "resource_type",
   "certification_type",
   "learning_format",
   "department",
@@ -128,18 +150,21 @@ const facetNames = [
 
 const constantSearchParams = {}
 
-const useFacetManifest = () => {
+const useFacetManifest = (resourceCategory: string | null) => {
   const offerorsQuery = useOfferorsList()
   const offerors = useMemo(() => {
     return _.keyBy(offerorsQuery.data?.results ?? [], (o) => o.code)
   }, [offerorsQuery.data?.results])
-  const facetManifest = useMemo(() => getFacetManifest(offerors), [offerors])
+  const facetManifest = useMemo(
+    () => getFacetManifest(offerors, resourceCategory),
+    [offerors, resourceCategory],
+  )
   return facetManifest
 }
 
 const SearchPage: React.FC = () => {
-  const facetManifest = useFacetManifest()
   const [searchParams, setSearchParams] = useSearchParams()
+  const facetManifest = useFacetManifest(searchParams.get("resource_category"))
 
   const setPage = useCallback(
     (newPage: number) => {