add UIIN-2961

folio-org · Nov 12, 2024 · 8fc7f8b · 8fc7f8b
1 parent d8e8b00
commit 8fc7f8b
Show file tree

Hide file tree

Showing 2 changed files with 64 additions and 1 deletion.
diff --git a/src/components/InstanceFiltersBrowse/InstanceFiltersBrowse.js b/src/components/InstanceFiltersBrowse/InstanceFiltersBrowse.js
@@ -1,4 +1,5 @@
 import PropTypes from 'prop-types';
+import {useIntl} from "react-intl";
 
 import {
   checkIfUserInMemberTenant,
@@ -15,6 +16,8 @@ import {
   EffectiveLocationFacet,
   NameTypeFacet,
   isConsortiaEnv,
+  FACETS_TO_REQUEST,
+  MultiSelectionFacet,
 } from '@folio/stripes-inventory-components';
 
 const InstanceFiltersBrowse = props => {
@@ -24,6 +27,7 @@ const InstanceFiltersBrowse = props => {
     onChange,
   } = props;
 
+  const intl = useIntl();
   const stripes = useStripes();
   const qindex = query.qindex;
 
@@ -37,6 +41,8 @@ const InstanceFiltersBrowse = props => {
     [FACETS.SUBJECTS_HELD_BY]: false,
     [FACETS.EFFECTIVE_LOCATION]: false,
     [FACETS.NAME_TYPE]: false,
+    [FACETS.SUBJECT_SOURCE]: false,
+    [FACETS.SUBJECT_TYPE]: false,
   };
 
   const {
@@ -116,6 +122,29 @@ const InstanceFiltersBrowse = props => {
           {renderSharedFacet(FACETS.SUBJECTS_SHARED)}
           {/* Hide Held by facet for contributors and subjects browse until back-end requirements and implementation are done */}
           {/* {renderHeldByFacet(FACETS.SUBJECTS_HELD_BY)} */}
+          <MultiSelectionFacet
+            id={FACETS.SUBJECT_SOURCE}
+            label={intl.formatMessage({ id: `ui-inventory.${FACETS.SUBJECT_SOURCE}` })}
+            open={accordionsStatus[FACETS.SUBJECT_SOURCE]}
+            onToggle={onToggleAccordion}
+            name={FACETS.SUBJECT_SOURCE}
+            onChange={onChange}
+            options={facetOptions[FACETS_TO_REQUEST[FACETS.SUBJECT_SOURCE]]}
+            selectedValues={activeFilters[FACETS.SUBJECT_SOURCE]}
+            displayClearButton={!!activeFilters[FACETS.SUBJECT_SOURCE]?.length}
+            separator={checkIfUserInMemberTenant(stripes)}
+          />
+          <MultiSelectionFacet
+            id={FACETS.SUBJECT_TYPE}
+            label={intl.formatMessage({ id: `ui-inventory.${FACETS.SUBJECT_TYPE}` })}
+            open={accordionsStatus[FACETS.SUBJECT_TYPE]}
+            onToggle={onToggleAccordion}
+            name={FACETS.SUBJECT_TYPE}
+            onChange={onChange}
+            options={facetOptions[FACETS_TO_REQUEST[FACETS.SUBJECT_TYPE]]}
+            selectedValues={activeFilters[FACETS.SUBJECT_TYPE]}
+            displayClearButton={!!activeFilters[FACETS.SUBJECT_TYPE]?.length}
+          />
         </>
       )}
     </>

diff --git a/src/components/InstanceFiltersBrowse/instanceFiltersBrowse.test.js b/src/components/InstanceFiltersBrowse/instanceFiltersBrowse.test.js
@@ -41,6 +41,8 @@ const consortiaTenants = [
 ];
 
 const data = {
+  subjectSources: [{ id: 'sourceId', name: 'source' }],
+  subjectTypes: [{ id: 'typeId', name: 'type' }],
   locations: [],
   consortiaTenants,
   classificationBrowseConfig: [],
@@ -59,6 +61,8 @@ const query = {
   subjectsShared: ['true'],
   subjectsTenantId: ['consortium'],
   nameType: ['nameType1'],
+  subjectSource: ['sourceId'],
+  subjectType: ['typeId'],
 };
 
 const renderInstanceFilters = (props = {}) => {
@@ -73,7 +77,7 @@ const renderInstanceFilters = (props = {}) => {
         />
       </ModuleHierarchyProvider>
     </Router>,
-    translations
+    translations,
   );
 };
 
@@ -245,6 +249,36 @@ describe('InstanceFiltersBrowse', () => {
   });
 
   describe('When subjects browseType was selected', () => {
+    it('should display filter by subjectSource accordion', () => {
+      const { getByRole } = renderInstanceFilters({
+        data,
+        query: {
+          ...query,
+          qindex: browseModeOptions.SUBJECTS,
+        },
+      });
+
+      fireEvent.click(screen.getByLabelText('Clear selected Subject source filters'));
+
+      expect(getByRole('heading', { name: 'Subject source' })).toBeInTheDocument();
+      expect(mockOnChange).toHaveBeenCalled();
+    });
+
+    it('should display filter by subjectType accordion', () => {
+      const { getByRole } = renderInstanceFilters({
+        data,
+        query: {
+          ...query,
+          qindex: browseModeOptions.SUBJECTS,
+        },
+      });
+
+      fireEvent.click(screen.getByLabelText('Clear selected Subject type filters'));
+
+      expect(getByRole('heading', { name: 'Subject type' })).toBeInTheDocument();
+      expect(mockOnChange).toHaveBeenCalled();
+    });
+
     it('should display shared filter accordion', () => {
       const { getByRole } = renderInstanceFilters({
         data,