@databiosphere/findable-ui 2.0.1 → 2.2.0

package/lib/components/Filter/components/FilterLabel/filterLabel.styles.js

@@ -8,7 +8,7 @@ const styled_1 = __importDefault(require("@emotion/styled"));
 const material_1 = require("@mui/material");
 const breakpoints_1 = require("../../../../styles/common/mixins/breakpoints");
 exports.FilterLabel = (0, styled_1.default)(material_1.Button) `
-  color: ${({ theme }) => theme.palette.ink.main};
+  font-weight: inherit;
   gap: 0;
   justify-content: space-between;
   padding: 10px 16px;
@@ -20,7 +20,6 @@ exports.FilterLabel = (0, styled_1.default)(material_1.Button) `
   }
 
   &.Mui-disabled {
-    color: ${({ theme }) => theme.palette.ink.main};
     opacity: 0.3;
   }
 

package/lib/components/Filter/components/Filters/filters.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { TrackFilterOpenedFunction } from "config/entities";
 import { SelectCategoryView } from "../../../../common/entities";
+import { TrackFilterOpenedFunction } from "../../../../config/entities";
 import { OnFilterFn } from "../../../../hooks/useCategoryFilter";
 export interface CategoryFilter {
     categoryViews: SelectCategoryView[];

package/lib/components/Filter/components/Filters/filters.js

@@ -65,11 +65,13 @@ const Filters = ({ categoryFilters, closeAncestor, disabled = false, onFilter, t
     const { height: windowHeight } = (0, useWindowResize_1.useWindowResize)();
     const filterListRef = (0, react_1.useRef)(null);
     const [height, setHeight] = (0, react_1.useState)(0);
+    const isLabeled = (0, react_1.useMemo)(() => isCategoryViewsLabeled(categoryFilters), [categoryFilters]);
     (0, react_1.useEffect)(() => {
         setHeight(calculateListHeight(windowHeight, filterListRef.current));
     }, [windowHeight]);
-    return (react_1.default.createElement(filters_styles_1.Filters, { disabled: disabled, height: height, ref: filterListRef }, categoryFilters.map(({ categoryViews, label }, i) => (react_1.default.createElement(react_1.Fragment, { key: i },
+    return (react_1.default.createElement(filters_styles_1.Filters, { disabled: disabled, height: height, isBaseStyle: !isLabeled, ref: filterListRef }, categoryFilters.map(({ categoryViews, label }, i) => (react_1.default.createElement(react_1.Fragment, { key: i },
         i !== 0 && react_1.default.createElement(material_1.Divider, null),
+        label && react_1.default.createElement(filters_styles_1.CategoryViewsLabel, null, label),
         categoryViews.map((categoryView) => (react_1.default.createElement(filter_1.Filter, { key: categoryView.key, categorySection: label, categoryView: categoryView, closeAncestor: closeAncestor, isFilterDrawer: isFilterDrawer, onFilter: onFilter, trackFilterOpened: trackFilterOpened, tags: renderFilterTags(categoryView, onFilter) }))))))));
 };
 exports.Filters = Filters;
@@ -83,3 +85,11 @@ function calculateListHeight(windowHeight, filterListEl) {
     var _a, _b;
     return windowHeight - ((_b = (_a = filterListEl === null || filterListEl === void 0 ? void 0 : filterListEl.getBoundingClientRect()) === null || _a === void 0 ? void 0 : _a.top) !== null && _b !== void 0 ? _b : 0);
 }
+/**
+ * Returns true if any category views are labelled.
+ * @param categoryFilters - Category filters.
+ * @returns true if any category views are labelled.
+ */
+function isCategoryViewsLabeled(categoryFilters) {
+    return categoryFilters.some(({ label }) => label);
+}

package/lib/components/Filter/components/Filters/filters.styles.d.ts

@@ -2,9 +2,14 @@
 interface Props {
     disabled: boolean;
     height: number;
+    isBaseStyle: boolean;
 }
 export declare const Filters: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 } & Props, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const CategoryViewsLabel: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export {};

package/lib/components/Filter/components/Filters/filters.styles.js

@@ -3,13 +3,17 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Filters = void 0;
+exports.CategoryViewsLabel = exports.Filters = void 0;
 const react_1 = require("@emotion/react");
 const styled_1 = __importDefault(require("@emotion/styled"));
 const breakpoints_1 = require("../../../../styles/common/mixins/breakpoints");
+const colors_1 = require("../../../../styles/common/mixins/colors");
+const fonts_1 = require("../../../../styles/common/mixins/fonts");
 exports.Filters = (0, styled_1.default)("div", {
-    shouldForwardProp: (prop) => prop !== "height",
+    shouldForwardProp: (prop) => prop !== "height" && prop !== "isBaseStyle",
 }) `
+  ${(props) => (props.isBaseStyle ? (0, fonts_1.textBody500)(props) : (0, fonts_1.textBody400)(props))};
+  color: ${(props) => (props.isBaseStyle ? (0, colors_1.inkMain)(props) : (0, colors_1.inkLight)(props))};
   height: ${({ height }) => height}px;
   margin: 8px 0;
   overflow: auto;
@@ -31,3 +35,12 @@ exports.Filters = (0, styled_1.default)("div", {
     padding: 0 12px 0 16px;
   }
 `;
+exports.CategoryViewsLabel = (0, styled_1.default)("div") `
+  ${fonts_1.textBody500};
+  color: ${colors_1.inkMain};
+  padding: 8px 16px;
+
+  ${breakpoints_1.mediaDesktopSmallUp} {
+    padding: 8px 0;
+  }
+`;

package/lib/components/Filter/components/VariableSizeListItem/variableSizeListItem.js

@@ -25,6 +25,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 const material_1 = require("@mui/material");
 const react_1 = __importStar(require("react"));
+const constants_1 = require("../../../../providers/exploreState/constants");
 const typography_1 = require("../../../../theme/common/typography");
 const checkedIcon_1 = require("../../../common/CustomIcon/components/CheckedIcon/checkedIcon");
 const uncheckedIcon_1 = require("../../../common/CustomIcon/components/UncheckedIcon/uncheckedIcon");
@@ -43,6 +44,6 @@ function VariableSizeListItem({ categoryKey, categorySection, matchedItem, onFil
     };
     return (react_1.default.createElement(material_1.ListItemButton, { ref: listItemRef, onClick: handleItemClicked, selected: selected, style: style },
         react_1.default.createElement(material_1.Checkbox, { checked: selected, checkedIcon: react_1.default.createElement(checkedIcon_1.CheckedIcon, null), icon: react_1.default.createElement(uncheckedIcon_1.UncheckedIcon, null) }),
-        react_1.default.createElement(material_1.ListItemText, { disableTypography: true, primary: react_1.default.createElement(highlightedLabel_1.HighlightedLabel, { label: label, ranges: labelRanges }), secondary: react_1.default.createElement(material_1.Typography, { color: "ink.light", variant: typography_1.TEXT_BODY_SMALL_400 }, count) })));
+        react_1.default.createElement(material_1.ListItemText, { disableTypography: true, primary: react_1.default.createElement(highlightedLabel_1.HighlightedLabel, { label: label, ranges: labelRanges }), secondary: categoryKey !== constants_1.SELECT_CATEGORY_KEY.SAVED_FILTERS && (react_1.default.createElement(material_1.Typography, { color: "ink.light", variant: typography_1.TEXT_BODY_SMALL_400 }, count)) })));
 }
 exports.default = VariableSizeListItem;

package/lib/config/entities.d.ts

@@ -1,7 +1,7 @@
 import { TabProps as MTabProps, Theme, ThemeOptions } from "@mui/material";
 import { ColumnSort } from "@tanstack/react-table";
 import { JSXElementConstructor, ReactNode } from "react";
-import { CategoryKey, SelectedFilterValue } from "../common/entities";
+import { CategoryKey, SelectedFilter, SelectedFilterValue } from "../common/entities";
 import { HeroTitle } from "../components/common/Title/title";
 import { FooterProps } from "../components/Layout/components/Footer/footer";
 import { HeaderProps } from "../components/Layout/components/Header/header";
@@ -51,6 +51,7 @@ export interface BackPageTabConfig extends TabConfig {
 export interface CategoryGroupConfig {
     categoryGroups: CategoryGroup[];
     key: string;
+    savedFilters?: SavedFilter[];
 }
 /**
  * Model of grouped configured categories in site config.
@@ -244,6 +245,11 @@ export interface Override {
  * Related search function.
  */
 declare type RelatedSearchFunction = (searchKey: CategoryKey | undefined, resultKey: CategoryKey | undefined, selectedCategoryValues: SelectedFilterValue | undefined) => Promise<RelatedSearchResult | undefined>;
+export interface SavedFilter {
+    filters: SelectedFilter[];
+    sort?: ColumnSort;
+    title: string;
+}
 /**
  * Filter applied tracking payload
  */

package/lib/providers/exploreState/constants.d.ts

@@ -1,3 +1,3 @@
-import { ExploreState, PaginationState } from "../exploreState";
-export declare const DEFAULT_PAGINATION_STATE: PaginationState;
-export declare const INITIAL_STATE: ExploreState;
+export declare const SELECT_CATEGORY_KEY: {
+    SAVED_FILTERS: string;
+};

package/lib/providers/exploreState/constants.js

@@ -1,29 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.INITIAL_STATE = exports.DEFAULT_PAGINATION_STATE = void 0;
-// Template constants
-exports.DEFAULT_PAGINATION_STATE = {
-    currentPage: 1,
-    index: null,
-    nextIndex: null,
-    pageSize: 25,
-    pages: 1,
-    previousIndex: null,
-    rows: 0,
-};
-// Initial state
-exports.INITIAL_STATE = {
-    catalogState: undefined,
-    categoryViews: [],
-    entityPageState: {},
-    featureFlagState: undefined,
-    filterCount: 0,
-    filterState: [],
-    isRelatedView: false,
-    listItems: [],
-    listView: undefined,
-    loading: true,
-    paginationState: exports.DEFAULT_PAGINATION_STATE,
-    relatedListItems: undefined,
-    tabValue: "",
+exports.SELECT_CATEGORY_KEY = void 0;
+exports.SELECT_CATEGORY_KEY = {
+    SAVED_FILTERS: "savedFilters",
 };

package/lib/providers/exploreState/entities.d.ts

@@ -1,6 +1,6 @@
 import { ColumnSort } from "@tanstack/react-table";
-import { SelectCategory, SelectedFilter } from "../../common/entities";
-import { CategoryConfig, CategoryGroup, CategoryGroupConfig, EntityPath } from "../../config/entities";
+import { CategoryValueKey, SelectCategory, SelectCategoryView, SelectedFilter } from "../../common/entities";
+import { CategoryConfig, CategoryGroup, CategoryGroupConfig, EntityPath, SavedFilter } from "../../config/entities";
 export interface EntityPageState {
     categoryGroupConfigKey: CategoryGroupConfigKey;
     columnsVisibility: Record<string, boolean>;
@@ -12,8 +12,15 @@ export interface EntityPageStateMapper {
 export interface EntityState {
     categoryConfigs?: CategoryConfig[];
     categoryGroups?: CategoryGroup[];
-    categoryViews: SelectCategory[];
+    categoryViews: SelectCategoryView[];
     filterState: SelectedFilter[];
+    savedFilterByCategoryValueKey?: SavedFilterByCategoryValueKey;
+    savedFilterState: SelectedFilter[];
+    savedSelectCategories: SelectCategory[];
 }
 export declare type EntityStateByCategoryGroupConfigKey = Map<CategoryGroupConfigKey, EntityState>;
 export declare type CategoryGroupConfigKey = CategoryGroupConfig["key"];
+export interface EntityStateSavedFilter extends Omit<SavedFilter, "sort"> {
+    sorting?: ColumnSort[];
+}
+export declare type SavedFilterByCategoryValueKey = Map<CategoryValueKey, EntityStateSavedFilter>;

package/lib/providers/exploreState/initializer/constants.js

@@ -4,6 +4,8 @@ exports.INITIAL_STATE = exports.DEFAULT_PAGINATION_STATE = exports.DEFAULT_ENTIT
 exports.DEFAULT_ENTITY_STATE = {
     categoryViews: [],
     filterState: [],
+    savedFilterState: [],
+    savedSelectCategories: [],
 };
 exports.DEFAULT_PAGINATION_STATE = {
     currentPage: 1,

package/lib/providers/exploreState/initializer/utils.js

@@ -3,8 +3,63 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.initReducerArguments = void 0;
 const utils_1 = require("../../../components/Table/common/utils");
 const utils_2 = require("../../../config/utils");
+const constants_1 = require("../constants");
 const utils_3 = require("../utils");
-const constants_1 = require("./constants");
+const constants_2 = require("./constants");
+/**
+ * Builds category groups from the given category group config (adds the saved filters category to the category groups).
+ * @param categoryGroupConfig - Category group config.
+ * @returns category groups with saved filters category.
+ */
+function buildCategoryGroups(categoryGroupConfig) {
+    const { categoryGroups, savedFilters } = categoryGroupConfig;
+    if (!savedFilters)
+        return categoryGroups;
+    const clonedCategoryGroups = [...categoryGroups];
+    const savedFiltersCategoryGroup = {
+        categoryConfigs: [
+            { key: constants_1.SELECT_CATEGORY_KEY.SAVED_FILTERS, label: "Saved Filters" },
+        ],
+    };
+    clonedCategoryGroups.unshift(savedFiltersCategoryGroup);
+    return clonedCategoryGroups;
+}
+/**
+ * Returns the saved filters as select categories.
+ * @param savedFilters - Saved filters.
+ * @returns select categories.
+ */
+function buildSavedSelectCategories(savedFilters) {
+    if (!savedFilters)
+        return [];
+    return [
+        {
+            key: constants_1.SELECT_CATEGORY_KEY.SAVED_FILTERS,
+            label: "",
+            values: savedFilters.map(({ title }) => ({
+                count: 1,
+                key: title,
+                label: title,
+                selected: false, // Selected state updated in filter hook.
+            })),
+        },
+    ];
+}
+/**
+ * Builds saved filter by category value key.
+ * @param savedFilters - Saved filters.
+ * @returns saved filter by category value key.
+ */
+function buildSavedFilterByCategoryValueKey(savedFilters) {
+    if (!savedFilters)
+        return;
+    const savedFilterByCategoryValueKey = new Map();
+    for (const { filters, sort, title } of savedFilters) {
+        const sorting = sort ? [sort] : undefined;
+        savedFilterByCategoryValueKey.set(title, { filters, sorting, title });
+    }
+    return savedFilterByCategoryValueKey;
+}
 /**
  * Returns entity related configured category group config where entity config takes precedence over site config.
  * @param siteConfig - Site config.
@@ -71,10 +126,14 @@ function initEntityStateByCategoryGroupConfigKey(config, categoryGroupConfigKey,
         const categoryGroupConfig = getEntityCategoryGroupConfig(config, entity);
         if (!categoryGroupConfig)
             continue;
-        const { categoryGroups, key } = categoryGroupConfig;
+        const { key, savedFilters } = categoryGroupConfig;
         if (entityStateByCategoryGroupConfigKey.has(key))
             continue;
-        entityStateByCategoryGroupConfigKey.set(key, Object.assign(Object.assign({}, constants_1.DEFAULT_ENTITY_STATE), { categoryConfigs: flattenCategoryGroups(categoryGroups), categoryGroups, filterState: key === categoryGroupConfigKey ? filterState : [] }));
+        const categoryGroups = buildCategoryGroups(categoryGroupConfig);
+        const savedSelectCategories = buildSavedSelectCategories(savedFilters);
+        const savedFilterByCategoryValueKey = buildSavedFilterByCategoryValueKey(savedFilters);
+        entityStateByCategoryGroupConfigKey.set(key, Object.assign(Object.assign({}, constants_2.DEFAULT_ENTITY_STATE), { categoryConfigs: flattenCategoryGroups(categoryGroups), categoryGroups, filterState: key === categoryGroupConfigKey ? filterState : [], savedFilterByCategoryValueKey,
+            savedSelectCategories }));
     }
     return entityStateByCategoryGroupConfigKey;
 }
@@ -109,7 +168,7 @@ function initReducerArguments(config, entityListType, decodedFilterParam, decode
     const categoryGroupConfigKey = (0, utils_3.getEntityCategoryGroupConfigKey)(entityListType, entityPageState);
     const entityStateByCategoryGroupConfigKey = initEntityStateByCategoryGroupConfigKey(config, categoryGroupConfigKey, filterState);
     const categoryGroups = initCategoryGroups(entityStateByCategoryGroupConfigKey, categoryGroupConfigKey);
-    return Object.assign(Object.assign({}, constants_1.INITIAL_STATE), { catalogState: decodedCatalogParam, categoryGroups,
+    return Object.assign(Object.assign({}, constants_2.INITIAL_STATE), { catalogState: decodedCatalogParam, categoryGroups,
         entityPageState,
         entityStateByCategoryGroupConfigKey, featureFlagState: decodedFeatureFlagParam, filterCount: (0, utils_3.getFilterCount)(filterState), filterState, tabValue: entityListType });
 }

package/lib/providers/exploreState/payloads/entities.d.ts

@@ -1,6 +1,14 @@
 import { ColumnSort } from "@tanstack/react-table";
 import { CategoryKey, CategoryValueKey, PaginationDirectionType, SelectCategory } from "../../../common/entities";
 import { ENTITY_VIEW, ListItems, PaginationResponse, RelatedListItems } from "../../exploreState";
+/**
+ * Apply saved filter payload.
+ */
+export interface ApplySavedFilterPayload {
+    categoryKey: CategoryKey;
+    selected: boolean;
+    selectedValue: CategoryValueKey;
+}
 /**
  * Process explore response payload.
  */

package/lib/providers/exploreState/utils.d.ts

@@ -1,7 +1,23 @@
-import { SelectedFilter } from "../../common/entities";
-import { CategoryConfig } from "../../config/entities";
+import { ColumnSort } from "@tanstack/react-table";
+import { CategoryKey, CategoryValueKey, SelectedFilter } from "../../common/entities";
 import { ExploreState, PaginationState } from "../exploreState";
-import { CategoryGroupConfigKey, EntityPageState, EntityPageStateMapper, EntityState } from "./entities";
+import { CategoryGroupConfigKey, EntityPageState, EntityPageStateMapper, EntityState, EntityStateSavedFilter } from "./entities";
+/**
+ * Returns the entity state saved filter state for the given category key.
+ * @param categoryKey - Category key.
+ * @param selectedValue - Key of category value that has been de/selected.
+ * @param selected - True if value is selected, false if de-selected.
+ * @returns entity state saved filter state.
+ */
+export declare function buildEntityStateSavedFilterState(categoryKey: CategoryKey, selectedValue: CategoryValueKey, selected: boolean): SelectedFilter[];
+/**
+ * Build new set of selected filters on de/select of a "saved filter" filter.
+ * @param state - Explore state.
+ * @param selectedValue - Key of category value that has been de/selected.
+ * @param selected - True if value is selected, false if de-selected.
+ * @returns new selected filters.
+ */
+export declare function buildNextSavedFilterState(state: ExploreState, selectedValue: CategoryValueKey, selected: boolean): SelectedFilter[];
 /**
  * Returns the category group config key for the current entity.
  * @param entityPath - Entity path.
@@ -10,18 +26,27 @@ import { CategoryGroupConfigKey, EntityPageState, EntityPageStateMapper, EntityS
  */
 export declare function getEntityCategoryGroupConfigKey(entityPath: string, entityPageState: EntityPageStateMapper): CategoryGroupConfigKey;
 /**
- * Returns the category configs for the current entity.
+ * Returns the entity state for the current entity.
  * @param state - Explore state.
- * @returns category configs.
+ * @param categoryGroupConfigKey - Category group config key.
+ * @returns entity state.
  */
-export declare function getEntityCategoryConfigs(state: ExploreState): CategoryConfig[] | undefined;
+export declare function getEntityState(state: ExploreState, categoryGroupConfigKey?: string): EntityState;
 /**
- * Returns the entity state for the given category group config key.
- * @param categoryGroupConfigKey - Category group config key.
+ * Returns the saved filter/sorting for the given category key.
  * @param state - Explore state.
- * @returns entity state.
+ * @param categoryValueKey - Category key.
+ * @returns saved filter/sorting for the category key.
+ */
+export declare function getEntityStateSavedFilter(state: ExploreState, categoryValueKey: CategoryValueKey): EntityStateSavedFilter | undefined;
+/**
+ * Returns entity state "saved filter" sorting for the given category value key.
+ * @param state - Explore state.
+ * @param selectedValue - Key of category value that has been de/selected.
+ * @param selected - True if value is selected, false if de-selected.
+ * @returns sorting.
  */
-export declare function getEntityState(categoryGroupConfigKey: CategoryGroupConfigKey, state: ExploreState): EntityState;
+export declare function getEntityStateSavedSorting(state: ExploreState, selectedValue: CategoryValueKey, selected: boolean): ColumnSort[] | undefined;
 /**
  * Returns the filter count.
  * @param filterState - Filter state.
@@ -43,6 +68,13 @@ export declare function resetPage(paginationState: PaginationState): PaginationS
  */
 export declare function updateEntityPageState(entityPath: string, // entityListType.
 entityPageState: EntityPageStateMapper, nextEntityPageState: Partial<EntityPageState>): EntityPageStateMapper;
+/**
+ * Updates entity page state sorting for all entities with the same category group config key.
+ * @param state - Explore state.
+ * @param sorting - Sorting.
+ * @returns entity page state.
+ */
+export declare function updateEntityPageStateSorting(state: ExploreState, sorting?: EntityPageState["sorting"]): EntityPageStateMapper;
 /**
  * Updates entity state by category group config key.
  * @param state - Explore state.

package/lib/providers/exploreState/utils.js

@@ -1,7 +1,34 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.updateEntityStateByCategoryGroupConfigKey = exports.updateEntityPageState = exports.resetPage = exports.getFilterCount = exports.getEntityState = exports.getEntityCategoryConfigs = exports.getEntityCategoryGroupConfigKey = void 0;
+exports.updateEntityStateByCategoryGroupConfigKey = exports.updateEntityPageStateSorting = exports.updateEntityPageState = exports.resetPage = exports.getFilterCount = exports.getEntityStateSavedSorting = exports.getEntityStateSavedFilter = exports.getEntityState = exports.getEntityCategoryGroupConfigKey = exports.buildNextSavedFilterState = exports.buildEntityStateSavedFilterState = void 0;
 const constants_1 = require("./initializer/constants");
+/**
+ * Returns the entity state saved filter state for the given category key.
+ * @param categoryKey - Category key.
+ * @param selectedValue - Key of category value that has been de/selected.
+ * @param selected - True if value is selected, false if de-selected.
+ * @returns entity state saved filter state.
+ */
+function buildEntityStateSavedFilterState(categoryKey, selectedValue, selected) {
+    if (!selected)
+        return [];
+    return [{ categoryKey, value: [selectedValue] }];
+}
+exports.buildEntityStateSavedFilterState = buildEntityStateSavedFilterState;
+/**
+ * Build new set of selected filters on de/select of a "saved filter" filter.
+ * @param state - Explore state.
+ * @param selectedValue - Key of category value that has been de/selected.
+ * @param selected - True if value is selected, false if de-selected.
+ * @returns new selected filters.
+ */
+function buildNextSavedFilterState(state, selectedValue, selected) {
+    if (!selected)
+        return []; // Clears all filters on de-select of saved filter.
+    const savedFilter = getEntityStateSavedFilter(state, selectedValue);
+    return (savedFilter === null || savedFilter === void 0 ? void 0 : savedFilter.filters) || [];
+}
+exports.buildNextSavedFilterState = buildNextSavedFilterState;
 /**
  * Returns the category group config key for the current entity.
  * @param entityPath - Entity path.
@@ -13,25 +40,42 @@ function getEntityCategoryGroupConfigKey(entityPath, entityPageState) {
 }
 exports.getEntityCategoryGroupConfigKey = getEntityCategoryGroupConfigKey;
 /**
- * Returns the category configs for the current entity.
+ * Returns the entity state for the current entity.
  * @param state - Explore state.
- * @returns category configs.
- */
-function getEntityCategoryConfigs(state) {
-    return getEntityState(getEntityCategoryGroupConfigKey(state.tabValue, state.entityPageState), state).categoryConfigs;
-}
-exports.getEntityCategoryConfigs = getEntityCategoryConfigs;
-/**
- * Returns the entity state for the given category group config key.
  * @param categoryGroupConfigKey - Category group config key.
- * @param state - Explore state.
  * @returns entity state.
  */
-function getEntityState(categoryGroupConfigKey, state) {
+function getEntityState(state, categoryGroupConfigKey = getEntityCategoryGroupConfigKey(state.tabValue, state.entityPageState)) {
     return (state.entityStateByCategoryGroupConfigKey.get(categoryGroupConfigKey) ||
         constants_1.DEFAULT_ENTITY_STATE);
 }
 exports.getEntityState = getEntityState;
+/**
+ * Returns the saved filter/sorting for the given category key.
+ * @param state - Explore state.
+ * @param categoryValueKey - Category key.
+ * @returns saved filter/sorting for the category key.
+ */
+function getEntityStateSavedFilter(state, categoryValueKey) {
+    var _a;
+    const entityState = getEntityState(state);
+    return (_a = entityState.savedFilterByCategoryValueKey) === null || _a === void 0 ? void 0 : _a.get(categoryValueKey);
+}
+exports.getEntityStateSavedFilter = getEntityStateSavedFilter;
+/**
+ * Returns entity state "saved filter" sorting for the given category value key.
+ * @param state - Explore state.
+ * @param selectedValue - Key of category value that has been de/selected.
+ * @param selected - True if value is selected, false if de-selected.
+ * @returns sorting.
+ */
+function getEntityStateSavedSorting(state, selectedValue, selected) {
+    if (!selected)
+        return;
+    const savedFilter = getEntityStateSavedFilter(state, selectedValue);
+    return savedFilter === null || savedFilter === void 0 ? void 0 : savedFilter.sorting;
+}
+exports.getEntityStateSavedSorting = getEntityStateSavedSorting;
 /**
  * Returns the filter count.
  * @param filterState - Filter state.
@@ -74,6 +118,24 @@ entityPageState, nextEntityPageState) {
     return Object.assign(Object.assign({}, entityPageState), { [entityPath]: Object.assign(Object.assign({}, entityPageState[entityPath]), nextEntityPageState) });
 }
 exports.updateEntityPageState = updateEntityPageState;
+/**
+ * Updates entity page state sorting for all entities with the same category group config key.
+ * @param state - Explore state.
+ * @param sorting - Sorting.
+ * @returns entity page state.
+ */
+function updateEntityPageStateSorting(state, sorting) {
+    if (!sorting)
+        return state.entityPageState;
+    const categoryGroupConfigKey = getEntityCategoryGroupConfigKey(state.tabValue, state.entityPageState);
+    return Object.entries(state.entityPageState).reduce((acc, [entityPath, entityPageState]) => {
+        if (entityPageState.categoryGroupConfigKey === categoryGroupConfigKey) {
+            return Object.assign(Object.assign({}, acc), { [entityPath]: Object.assign(Object.assign({}, entityPageState), { sorting }) });
+        }
+        return Object.assign(Object.assign({}, acc), { [entityPath]: entityPageState });
+    }, {});
+}
+exports.updateEntityPageStateSorting = updateEntityPageStateSorting;
 /**
  * Updates entity state by category group config key.
  * @param state - Explore state.
@@ -82,7 +144,7 @@ exports.updateEntityPageState = updateEntityPageState;
  */
 function updateEntityStateByCategoryGroupConfigKey(state, nextEntityState) {
     const categoryGroupConfigKey = getEntityCategoryGroupConfigKey(state.tabValue, state.entityPageState);
-    const entityState = getEntityState(categoryGroupConfigKey, state);
+    const entityState = getEntityState(state, categoryGroupConfigKey);
     if (entityState) {
         setEntityStateByCategoryGroupConfigKey(categoryGroupConfigKey, state, Object.assign(Object.assign({}, entityState), nextEntityState));
     }

package/lib/providers/exploreState.d.ts

@@ -1,9 +1,9 @@
 import React, { Dispatch, ReactNode } from "react";
 import { AzulSearchIndex } from "../apis/azul/common/entities";
-import { SelectCategory, SelectedFilter } from "../common/entities";
+import { SelectCategoryView, SelectedFilter } from "../common/entities";
 import { CategoryGroup, SiteConfig } from "../config/entities";
 import { EntityPageStateMapper, EntityStateByCategoryGroupConfigKey } from "./exploreState/entities";
-import { PaginateTablePayload, ProcessExploreResponsePayload, ProcessRelatedResponsePayload, ResetExploreResponsePayload, ToggleEntityViewPayload, UpdateColumnVisibilityPayload, UpdateFilterPayload, UpdateSortingPayload } from "./exploreState/payloads/entities";
+import { ApplySavedFilterPayload, PaginateTablePayload, ProcessExploreResponsePayload, ProcessRelatedResponsePayload, ResetExploreResponsePayload, ToggleEntityViewPayload, UpdateColumnVisibilityPayload, UpdateFilterPayload, UpdateSortingPayload } from "./exploreState/payloads/entities";
 export declare type CatalogState = string | undefined;
 /**
  * Entity view.
@@ -25,7 +25,7 @@ export interface ExploreContext {
 export declare type ExploreState = {
     catalogState: CatalogState;
     categoryGroups?: CategoryGroup[];
-    categoryViews: SelectCategory[];
+    categoryViews: SelectCategoryView[];
     entityPageState: EntityPageStateMapper;
     entityStateByCategoryGroupConfigKey: EntityStateByCategoryGroupConfigKey;
     featureFlagState: FeatureFlagState;
@@ -103,6 +103,7 @@ export declare function ExploreStateProvider({ children, entityListType, }: {
  * Explore action kind.
  */
 export declare enum ExploreActionKind {
+    ApplySavedFilter = "APPLY_SAVED_FILTER",
     ClearFilters = "CLEAR_FILTERS",
     PaginateTable = "PAGINATE_TABLE",
     ProcessExploreResponse = "PROCESS_EXPLORE_RESPONSE",
@@ -118,7 +119,14 @@ export declare enum ExploreActionKind {
 /**
  * Explore action.
  */
-export declare type ExploreAction = ClearFiltersAction | PaginateTableAction | ProcessExploreResponseAction | ProcessRelatedResponseAction | ResetExploreResponseAction | ResetStateAction | SelectEntityTypeAction | ToggleEntityViewAction | UpdateColumnVisibilityAction | UpdateFilterAction | UpdateSortingAction;
+export declare type ExploreAction = ApplySavedFilterAction | ClearFiltersAction | PaginateTableAction | ProcessExploreResponseAction | ProcessRelatedResponseAction | ResetExploreResponseAction | ResetStateAction | SelectEntityTypeAction | ToggleEntityViewAction | UpdateColumnVisibilityAction | UpdateFilterAction | UpdateSortingAction;
+/**
+ * Apply saved filter action.
+ */
+declare type ApplySavedFilterAction = {
+    payload: ApplySavedFilterPayload;
+    type: ExploreActionKind.ApplySavedFilter;
+};
 /**
  * Clear filters action.
  */