@usereactify/search 3.12.0-beta.2 → 3.12.0-beta.5

package/dist/filter/FilterStack.js

@@ -14,7 +14,7 @@ const FilterStack = (props) => {
         return null;
     if (render)
         return render(filters);
-    return (react_1.default.createElement(react_1.default.Fragment, null, filters.map((filter) => (react_1.default.createElement(FilterWithState, Object.assign({ key: filter.handle, filter: filter }, props))))));
+    return (react_1.default.createElement(react_1.default.Fragment, null, filters.map((filter) => (react_1.default.createElement(FilterWithState, Object.assign({ key: filter.id, filter: filter }, props))))));
 };
 exports.FilterStack = FilterStack;
 const FilterWithState = ({ filter, renderFilter, }) => {

package/dist/hooks/useSort.d.ts

@@ -1,5 +1,5 @@
 export declare const useSort: () => {
     sortOption: import("..").ConfigSort | undefined;
     sortOptions: import("..").ConfigSort[];
-    setSortOption: (sortOptionId: string) => void;
+    setSortOption: (sortOptionHandle: string) => void;
 };

package/dist/hooks/useSort.js

@@ -10,12 +10,12 @@ const hooks_1 = require("../hooks");
 const useSort = () => {
     const { track } = (0, hooks_1.useAnalytics)();
     const { sortOption, sortOptions, setSortOption } = (0, provider_1.useContext)();
-    const handleSortChange = react_1.default.useCallback((sortOptionId) => {
-        setSortOption(sortOptionId);
+    const handleSortChange = react_1.default.useCallback((sortOptionHandle) => {
+        setSortOption(sortOptionHandle);
         track({
             eventName: "sortChange",
             payload: {
-                type: sortOptionId,
+                type: sortOptionHandle,
             },
         });
     }, [track, setSortOption]);

package/dist/provider.d.ts

@@ -14,7 +14,7 @@ declare type Context = {
     onRedirect?: (type: "redirect" | "search", url: string) => void;
     submitSearch: (localSearchQuery?: string) => void;
     setSearchQuery: (searchQuery: string) => void;
-    setSortOption: (sortOptionId: string) => void;
+    setSortOption: (sortOptionHandle: string) => void;
     showInstantSearchResults: boolean;
     setShowInstantSearchResults: (showInstantSearchResults: boolean) => void;
     theme?: Theme;

package/dist/provider.js

@@ -77,13 +77,13 @@ const ConfiguredProvider = (props) => {
             setSearchQuery(searchQueryFromURL);
     }, [searchQueryFromURL]);
     react_1.default.useEffect(() => {
-        if (searchSortFromURL && (sortOption === null || sortOption === void 0 ? void 0 : sortOption.id) !== searchSortFromURL) {
+        if (searchSortFromURL && (sortOption === null || sortOption === void 0 ? void 0 : sortOption.handle) !== searchSortFromURL) {
             setSortOption(searchSortFromURL, true);
         }
     }, [searchSortFromURL]);
     react_1.default.useEffect(() => {
-        if (window.location.search === "" && (sortOption === null || sortOption === void 0 ? void 0 : sortOption.id)) {
-            setSortOption(sortOption.id, true);
+        if (window.location.search === "" && (sortOption === null || sortOption === void 0 ? void 0 : sortOption.handle)) {
+            setSortOption(sortOption.handle, true);
         }
     }, [window.location.href]);
     const [showInstantSearchResults, setShowInstantSearchResults] = react_1.default.useState(false);
@@ -167,15 +167,16 @@ const useSortState = (config, collection) => {
             .sort((a, b) => `${a.position}`.localeCompare(`${b.position}`))
             .filter(({ visibility }) => ["all", type].includes(visibility));
     }, [config, collection]);
-    const [sortOptionState, setSortOptionState] = react_1.default.useState((_a = sortOptions[0]) === null || _a === void 0 ? void 0 : _a.id);
-    const sortOption = react_1.default.useMemo(() => sortOptions.find(({ id }) => id === sortOptionState) || sortOptions[0], [sortOptions, sortOptionState]);
-    const setSortOption = react_1.default.useCallback((sortOptionId, ignoreHistoryState = false) => {
-        setSortOptionState(sortOptionId);
+    const [sortOptionState, setSortOptionState] = react_1.default.useState((_a = sortOptions[0]) === null || _a === void 0 ? void 0 : _a.handle);
+    const sortOption = react_1.default.useMemo(() => sortOptions.find(({ handle }) => handle === sortOptionState) ||
+        sortOptions[0], [sortOptions, sortOptionState]);
+    const setSortOption = react_1.default.useCallback((sortOptionHandle, ignoreHistoryState = false) => {
+        setSortOptionState(sortOptionHandle);
         if (!ignoreHistoryState) {
             const url = new URL(window.location.href);
             url.searchParams.has("sort")
-                ? url.searchParams.set("sort", sortOptionId)
-                : url.searchParams.append("sort", sortOptionId);
+                ? url.searchParams.set("sort", sortOptionHandle)
+                : url.searchParams.append("sort", sortOptionHandle);
             window.history.pushState({}, "", url.toString());
         }
     }, [window.location.href]);
@@ -189,29 +190,35 @@ const useSortState = (config, collection) => {
 // value within it is a "Filter Option"
 const useFilterStack = (config, collection, filterStackHandle) => react_1.default.useMemo(() => {
     const type = !!collection ? "collection" : "search";
-    // exclude filters by type
-    const filterStacks = config.filters.filter((filter) => filter.type === type);
+    // select filters by type
+    const matchingFilterStacks = config.filters.filter((filter) => filter.type === type);
     // select filter stack by handle if provided
     if (filterStackHandle) {
-        const matchingFilterStack = filterStacks.find((filterStack) => filterStackHandle === filterStack.handle);
+        const matchingFilterStack = matchingFilterStacks.find((filterStack) => filterStackHandle === filterStack.handle);
         if (matchingFilterStack) {
             return matchingFilterStack;
         }
     }
     // select filter stack by collection if provided
     if (collection === null || collection === void 0 ? void 0 : collection.handle) {
-        const matchingFilterStack = filterStacks.find((filterStack) => { var _a; return (_a = filterStack.collections) === null || _a === void 0 ? void 0 : _a.includes(collection.handle); });
+        const matchingFilterStack = matchingFilterStacks.find((filterStack) => { var _a; return (_a = filterStack.collections) === null || _a === void 0 ? void 0 : _a.includes(collection.handle); });
         if (matchingFilterStack) {
             return matchingFilterStack;
         }
     }
     // select filter with "default" handle
-    const matchingFilterStack = filterStacks.find((filterStack) => filterStack.handle === "default");
+    let matchingFilterStack = matchingFilterStacks.find((filterStack) => filterStack.handle === "default");
+    if (matchingFilterStack) {
+        return matchingFilterStack;
+    }
+    // select any filter with "default" handle
+    matchingFilterStack = config.filters.find((filterStack) => filterStack.handle === "default");
     if (matchingFilterStack) {
         return matchingFilterStack;
     }
     // select any available filter as a last resort
-    return config.filters[0];
+    matchingFilterStack = config.filters[0];
+    return matchingFilterStack;
 }, [config, collection]);
 const useCuration = (config, collection, searchQuery) => react_1.default.useMemo(() => {
     debug("resolveCuration.start", { config, collection, searchQuery });

package/dist/types/firestore.d.ts

@@ -107,6 +107,7 @@ export interface DefinedField {
 export interface Sort {
     id: string;
     name: string;
+    handle: string;
     field: string;
     position: number;
     enabled: boolean;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@usereactify/search",
   "description": "React UI library for Reactify Search",
-  "version": "3.12.0-beta.2",
+  "version": "3.12.0-beta.5",
   "license": "MIT",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",