@envive-ai/react-hooks 0.2.5 → 0.2.6-alpha-2

package/src/atoms/search/productFilters.ts

@@ -1,8 +1,7 @@
-import { ProductResponseAttributes } from 'src/application/models';
-import { FilterAttribute } from 'src/contexts/types';
-import { SelectedFilterOption } from 'src/atoms/search/searchAPI';
-import { ChatSearchFilter, ChatSearchFilterItem } from './types';
-import { formatFilterDisplayName } from './utils';
+import { ChatSearchFilter, ChatSearchFilterItem } from "@envive-ai/types";
+import { FilterAttribute, ProductResponseAttributes } from "src/types";
+import { SelectedFilterOption } from "src/atoms/search/searchAPI";
+import { formatFilterDisplayName } from "./utils";
 
 const getPriceBucket = (price: number, bucketSize: number) => {
   const bucket = Math.floor(price / bucketSize);
@@ -13,27 +12,30 @@ const isStringArray = (value: unknown): value is string[] => {
   if (!Array.isArray(value)) {
     return false;
   }
-  return value.every((item) => typeof item === 'string');
+  return value.every((item) => typeof item === "string");
 };
 
-type FilterSortFunction = (a: ChatSearchFilterItem, b: ChatSearchFilterItem) => number;
+type FilterSortFunction = (
+  a: ChatSearchFilterItem,
+  b: ChatSearchFilterItem
+) => number;
 
 const sortFilter = (filterConfig: FilterAttribute): FilterSortFunction => {
-  if (filterConfig.type === 'price') {
+  if (filterConfig.type === "price") {
     return (a, b) => Number(a.filterItemId) - Number(b.filterItemId);
   }
-  if (filterConfig.type === 'dynamic') {
-    if (filterConfig.sorting.type === 'alphabetic') {
+  if (filterConfig.type === "dynamic") {
+    if (filterConfig.sorting.type === "alphabetic") {
       return (a, b) => a.displayName.localeCompare(b.displayName);
     }
     // Sort by the number of products, if they match, sort by alphabetical
-    if (filterConfig.sorting.type === 'productCount') {
+    if (filterConfig.sorting.type === "productCount") {
       return (a, b) =>
         a.productCount === b.productCount
           ? a.displayName.localeCompare(b.displayName)
           : b.productCount - a.productCount;
     }
-    if (filterConfig.sorting.type === 'custom') {
+    if (filterConfig.sorting.type === "custom") {
       const sortedKeys = filterConfig.sorting.map;
       return (a, b) => {
         if (sortedKeys[a.displayName] && sortedKeys[b.displayName]) {
@@ -53,14 +55,14 @@ const sortFilter = (filterConfig: FilterAttribute): FilterSortFunction => {
       };
     }
   }
-  throw new Error('Invaalid search filter configuration');
+  throw new Error("Invaalid search filter configuration");
 };
 
 export class ProductFilters {
   static getFiltersForProducts(
-    products: ProductResponseAttributes['attributes'][],
+    products: ProductResponseAttributes["attributes"][],
     filterConfigs: FilterAttribute[],
-    selectedFilterOptions: SelectedFilterOption[],
+    selectedFilterOptions: SelectedFilterOption[]
   ): ChatSearchFilter[] {
     if (!products || products.length === 0) {
       return [];
@@ -70,23 +72,29 @@ export class ProductFilters {
       products.reduce(
         (acc, product) => {
           // Price has special handling for the filters
-          if (filterConfig.type === 'price') {
+          if (filterConfig.type === "price") {
             const priceBucket = getPriceBucket(
               product.salePrice ?? product.originalPrice ?? 0,
-              filterConfig.bucketSize,
+              filterConfig.bucketSize
             );
             const current = acc.map[priceBucket] ?? {
               filterItemId: priceBucket,
-              displayName: `$${priceBucket}-$${priceBucket + filterConfig.bucketSize}`,
+              displayName: `$${priceBucket}-$${
+                priceBucket + filterConfig.bucketSize
+              }`,
               productCount: 0,
             };
-            acc.map[priceBucket] = { ...current, productCount: current.productCount + 1 };
+            acc.map[priceBucket] = {
+              ...current,
+              productCount: current.productCount + 1,
+            };
             return acc;
           }
 
           // Assume that the "attribute" is an array of values
           const attributeValues =
-            (product.filters && product.filters?.[filterConfig.attribute]) ?? [];
+            (product.filters && product.filters?.[filterConfig.attribute]) ??
+            [];
           if (isStringArray(attributeValues)) {
             attributeValues.forEach((val) => {
               const normalizedVal = val.toLowerCase();
@@ -95,7 +103,10 @@ export class ProductFilters {
                 displayName: formatFilterDisplayName(val), // Keep original case for display
                 productCount: 0,
               };
-              acc.map[normalizedVal] = { ...current, productCount: current.productCount + 1 };
+              acc.map[normalizedVal] = {
+                ...current,
+                productCount: current.productCount + 1,
+              };
             });
           }
 
@@ -104,40 +115,44 @@ export class ProductFilters {
         {
           filterConfig,
           map: {} as Record<string, ChatSearchFilterItem>,
-        },
-      ),
+        }
+      )
     );
 
-    const transformedFilters: ChatSearchFilter[] = filters.map(({ filterConfig, map }) => ({
-      filterId: filterConfig.filterId,
-      displayName: filterConfig.displayName,
-      items: Object.values(map)
-        .map((filter) => ({
-          filterItemId: filter.filterItemId,
-          displayName: filter.displayName,
-          productCount: filter.productCount,
-          isSelected:
-            selectedFilterOptions.some(
-              (option) => option.id === `${filterConfig.filterId}:${filter.filterItemId}`,
-            ) ?? false,
-        }))
-        .sort(sortFilter(filterConfig)),
-    }));
+    const transformedFilters: ChatSearchFilter[] = filters.map(
+      ({ filterConfig, map }) => ({
+        filterId: filterConfig.filterId,
+        displayName: filterConfig.displayName,
+        items: Object.values(map)
+          .map((filter) => ({
+            filterItemId: filter.filterItemId,
+            displayName: filter.displayName,
+            productCount: filter.productCount,
+            isSelected:
+              selectedFilterOptions.some(
+                (option) =>
+                  option.id ===
+                  `${filterConfig.filterId}:${filter.filterItemId}`
+              ) ?? false,
+          }))
+          .sort(sortFilter(filterConfig)),
+      })
+    );
 
     return [...transformedFilters];
   }
 
   static filterProducts(
-    products: ProductResponseAttributes['attributes'][],
+    products: ProductResponseAttributes["attributes"][],
     filterConfigs: FilterAttribute[],
     selectedFilterOptions: SelectedFilterOption[],
-    additiveDynamicFilters = false, // Set this to true to restore the original behavior where stacking filters has OR logic.
+    additiveDynamicFilters = false // Set this to true to restore the original behavior where stacking filters has OR logic.
   ) {
     const selectedFilters = filterConfigs
       .map((filterConfig) => ({
         filterConfig,
         hasSelectedOptions: selectedFilterOptions.some(
-          (option) => option.filterId === filterConfig.filterId,
+          (option) => option.filterId === filterConfig.filterId
         ),
       }))
       .filter(({ hasSelectedOptions }) => hasSelectedOptions);
@@ -150,20 +165,20 @@ export class ProductFilters {
               return acc;
             }
             // Price is special
-            if (selectedFilter.filterConfig.type === 'price') {
+            if (selectedFilter.filterConfig.type === "price") {
               const priceBucket = getPriceBucket(
                 product.salePrice ?? product.originalPrice ?? 0,
-                selectedFilter.filterConfig.bucketSize,
+                selectedFilter.filterConfig.bucketSize
               );
               const matchesPriceFilter = selectedFilterOptions.some(
-                (option) => option.id === `price:${priceBucket}`,
+                (option) => option.id === `price:${priceBucket}`
               );
               if (!matchesPriceFilter) {
                 return false;
               }
             }
 
-            if (selectedFilter.filterConfig.type === 'dynamic') {
+            if (selectedFilter.filterConfig.type === "dynamic") {
               // dynamic is misleading here. Its not just dynamic filters, but static filters because the config counts static filters as type: dynamic.
               const { filterId, attribute } = selectedFilter.filterConfig;
               const attributeValues = product.filters?.[attribute];
@@ -172,8 +187,10 @@ export class ProductFilters {
                 return false;
               }
 
-              const isDynamicFilter = selectedFilter.filterConfig.attribute === 'dynamic'; // True dynamic filters (the ones that appear beneath the search input)
-              const isSubtractiveLogic = isDynamicFilter && !additiveDynamicFilters;
+              const isDynamicFilter =
+                selectedFilter.filterConfig.attribute === "dynamic"; // True dynamic filters (the ones that appear beneath the search input)
+              const isSubtractiveLogic =
+                isDynamicFilter && !additiveDynamicFilters;
 
               if (isSubtractiveLogic) {
                 // AND logic for subtractive dynamic filters and between static filter categories
@@ -181,8 +198,11 @@ export class ProductFilters {
                   .filter((option) => option.filterId === filterId)
                   .map((option) => option.filterItemId.toLowerCase());
 
-                const hasAllSelectedValues = selectedOptionsForThisFilter.every((selectedValue) =>
-                  attributeValues.some((val) => val.toLowerCase() === selectedValue),
+                const hasAllSelectedValues = selectedOptionsForThisFilter.every(
+                  (selectedValue) =>
+                    attributeValues.some(
+                      (val) => val.toLowerCase() === selectedValue
+                    )
                 );
 
                 if (!hasAllSelectedValues) {
@@ -192,8 +212,8 @@ export class ProductFilters {
                 // OR logic for static filters in the sidebar within a category.
                 const matches = attributeValues.some((val) =>
                   selectedFilterOptions.some(
-                    (option) => option.id === `${filterId}:${val.toLowerCase()}`,
-                  ),
+                    (option) => option.id === `${filterId}:${val.toLowerCase()}`
+                  )
                 );
                 if (!matches) {
                   return false;
@@ -201,7 +221,7 @@ export class ProductFilters {
               }
             }
             return true;
-          }, true),
+          }, true)
         );
   }
 }

package/src/atoms/search/productRetrievalAPI.ts

@@ -0,0 +1,72 @@
+import {
+  ProductRetrievalParams,
+  ProductRetrievalResult,
+} from "@envive-ai/types";
+import { atom } from "jotai";
+import { getProductRetrievalFunction } from "./productRetrievalAdapter";
+
+interface ProductRetrievalState {
+  data: ProductRetrievalResult | null;
+  loading: boolean;
+  error: string | null;
+  lastProductIds: string[] | null;
+}
+
+export const productRetrievalAtom = atom<ProductRetrievalState>({
+  data: null,
+  loading: false,
+  error: null,
+  lastProductIds: null,
+});
+
+export const performProductRetrievalAtom = atom(
+  null,
+  async (get, set, params: ProductRetrievalParams) => {
+    const currentState = get(productRetrievalAtom);
+
+    if (currentState.loading) {
+      return; // Prevent concurrent retrievals
+    }
+
+    set(productRetrievalAtom, {
+      data: null,
+      loading: true,
+      error: null,
+      lastProductIds: params.productIds,
+    });
+
+    try {
+      const retrieveProducts = getProductRetrievalFunction();
+      const result = await retrieveProducts(params);
+      set(productRetrievalAtom, {
+        data: result,
+        loading: false,
+        error: null,
+        lastProductIds: params.productIds,
+      });
+    } catch (error: unknown) {
+      const errorMessage =
+        error instanceof Error ? error.message : "An unknown error occurred";
+      set(productRetrievalAtom, {
+        data: null,
+        loading: false,
+        error: errorMessage,
+        lastProductIds: params.productIds,
+      });
+    }
+  }
+);
+
+// Get just the products array (already normalized by service)
+export const retrievedProductsAtom = atom((get) => {
+  const retrievalData = get(productRetrievalAtom).data;
+  return retrievalData?.products || [];
+});
+
+export const productRetrievalLoadingAtom = atom((get) => {
+  return get(productRetrievalAtom).loading;
+});
+
+export const productRetrievalErrorAtom = atom((get) => {
+  return get(productRetrievalAtom).error;
+});

package/src/atoms/search/productRetrievalAdapter.ts

@@ -0,0 +1,28 @@
+import {
+  ProductRetrievalParams,
+  ProductRetrievalResult,
+} from "@envive-ai/types";
+
+// This will be set by the ProductRetrievalProvider when it initializes
+let productRetrievalFunction:
+  | ((params: ProductRetrievalParams) => Promise<ProductRetrievalResult>)
+  | null = null;
+
+export const setProductRetrievalFunction = (
+  fn: (params: ProductRetrievalParams) => Promise<ProductRetrievalResult>
+) => {
+  productRetrievalFunction = fn;
+};
+
+export const getProductRetrievalFunction = () => {
+  if (!productRetrievalFunction) {
+    throw new Error(
+      "Product retrieval function not initialized. Make sure ProductRetrievalProvider is mounted."
+    );
+  }
+  return productRetrievalFunction;
+};
+
+export const clearProductRetrievalFunction = () => {
+  productRetrievalFunction = null;
+};

package/src/atoms/search/productSorter.ts

@@ -1,5 +1,5 @@
-import { ProductResponseAttributes } from 'src/application/models';
-import { ProductSorting } from './types';
+import { ProductResponseAttributes } from '@envive-ai/types';
+import { ProductSorting } from '@envive-ai/types';
 
 export class ProductSorter {
   static sort(products: ProductResponseAttributes['attributes'][], sorting: ProductSorting) {

package/src/atoms/search/searchAPI.ts

@@ -1,10 +1,10 @@
-import { atom } from "jotai";
-import { SearchResult, SearchParams } from "src/application/models/api/search";
-import { ProductSorting } from "./types";
-import { ProductFilters } from "./productFilters";
-import { ProductSorter } from "./productSorter";
-import { newOrgConfigAtom } from "../org";
-import { getSearchServiceFunction } from "./searchServiceAdapter";
+import { atom } from 'jotai';
+import { ProductSorting } from '@envive-ai/types';
+import { ProductFilters } from './productFilters';
+import { ProductSorter } from './productSorter';
+import { newOrgConfigAtom } from '../org';
+import { getSearchServiceFunction } from './searchServiceAdapter';
+import { SearchParams, SearchResult } from '@envive-ai/types';
 
 export type SelectedFilterOption = {
   id: string; // "filterId:filterItemId" - maintains backward compatibility for comparisons
@@ -27,15 +27,13 @@ export const searchAtom = atom<SearchState>({
   lastQuery: null,
 });
 
-export const searchProductSortingAtom = atom<ProductSorting>(
-  ProductSorting.FEATURED
-);
+export const searchProductSortingAtom = atom<ProductSorting>(ProductSorting.FEATURED);
 export const searchSelectedFiltersAtom = atom<SelectedFilterOption[]>([]);
 
 export const createFilterOption = (
   filterId: string,
   filterItemId: string,
-  displayName: string
+  displayName: string,
 ): SelectedFilterOption => ({
   id: `${filterId}:${filterItemId}`,
   displayName,
@@ -55,7 +53,7 @@ export const searchParamsAtom = atom(
   (get) => get(internalSearchParamsAtom),
   (_, set, value: { id: string | null; query: string | null }) => {
     set(internalSearchParamsAtom, value);
-  }
+  },
 );
 export const internalSearchSystemStateAtom = atom<boolean>(false);
 
@@ -67,9 +65,9 @@ export const searchSystemAtom = atom(
     }
     const stateChangeHandler = () => {
       const params = new URLSearchParams(window.location.search);
-      if (params.get("es") === "true") {
-        const id = params.get("esi");
-        const query = params.get("esq");
+      if (params.get('es') === 'true') {
+        const id = params.get('esi');
+        const query = params.get('esq');
         set(searchParamsAtom, { id, query });
       } else {
         set(searchParamsAtom, { id: null, query: null });
@@ -77,14 +75,14 @@ export const searchSystemAtom = atom(
     };
     if (value) {
       set(internalSearchSystemStateAtom, true);
-      window.addEventListener("popstate", stateChangeHandler);
+      window.addEventListener('popstate', stateChangeHandler);
       // Also trigger the hash change handler to set the initial state
       stateChangeHandler();
     } else {
       set(internalSearchSystemStateAtom, false);
-      window.removeEventListener("popstate", stateChangeHandler);
+      window.removeEventListener('popstate', stateChangeHandler);
     }
-  }
+  },
 );
 
 export const filteredSearchProductsAtom = atom((get) => {
@@ -93,17 +91,13 @@ export const filteredSearchProductsAtom = atom((get) => {
   const selectedFilters = get(searchSelectedFiltersAtom);
   const newOrgConfig = get(newOrgConfigAtom);
 
-  if (
-    !searchData?.products ||
-    !newOrgConfig?.frontendConfig?.uiConfigs?.searchConfig
-  )
-    return [];
+  if (!searchData?.products || !newOrgConfig?.frontendConfig?.uiConfigs?.searchConfig) return [];
 
   const filteredProducts = ProductFilters.filterProducts(
     searchData.products,
     newOrgConfig.frontendConfig.uiConfigs.searchConfig.searchFilterConfig,
     selectedFilters,
-    newOrgConfig.frontendConfig.uiConfigs.searchConfig.additiveDynamicFilters
+    newOrgConfig.frontendConfig.uiConfigs.searchConfig.additiveDynamicFilters,
   );
 
   return ProductSorter.sort(filteredProducts, sorting);
@@ -114,39 +108,29 @@ export const searchFiltersAtom = atom((get) => {
   const selectedFilters = get(searchSelectedFiltersAtom);
   const newOrgConfig = get(newOrgConfigAtom);
 
-  if (
-    !searchData?.products ||
-    !newOrgConfig?.frontendConfig?.uiConfigs?.searchConfig
-  )
-    return [];
+  if (!searchData?.products || !newOrgConfig?.frontendConfig?.uiConfigs?.searchConfig) return [];
 
   return ProductFilters.getFiltersForProducts(
     searchData.products,
     newOrgConfig.frontendConfig.uiConfigs.searchConfig.searchFilterConfig,
-    selectedFilters
+    selectedFilters,
   );
 });
 
-export const addSearchFilterAtom = atom(
-  null,
-  (get, set, filter: SelectedFilterOption) => {
-    const current = get(searchSelectedFiltersAtom);
-    if (!current.some((f) => f.id === filter.id)) {
-      set(searchSelectedFiltersAtom, [...current, filter]);
-    }
+export const addSearchFilterAtom = atom(null, (get, set, filter: SelectedFilterOption) => {
+  const current = get(searchSelectedFiltersAtom);
+  if (!current.some((f) => f.id === filter.id)) {
+    set(searchSelectedFiltersAtom, [...current, filter]);
   }
-);
+});
 
-export const removeSearchFilterAtom = atom(
-  null,
-  (get, set, filterId: string) => {
-    const current = get(searchSelectedFiltersAtom);
-    set(
-      searchSelectedFiltersAtom,
-      current.filter((f) => f.id !== filterId)
-    );
-  }
-);
+export const removeSearchFilterAtom = atom(null, (get, set, filterId: string) => {
+  const current = get(searchSelectedFiltersAtom);
+  set(
+    searchSelectedFiltersAtom,
+    current.filter((f) => f.id !== filterId),
+  );
+});
 
 export const clearSearchFiltersAtom = atom(null, (_, set) => {
   set(searchSelectedFiltersAtom, []);
@@ -158,29 +142,28 @@ export const performSearchAtom = atom(
     const currentState = get(searchAtom);
     const newOrgConfig = get(newOrgConfigAtom);
     const redirectSearchResultsUrl =
-      newOrgConfig?.frontendConfig?.uiConfigs?.searchConfig
-        ?.redirectSearchResultsUrl;
+      newOrgConfig?.frontendConfig?.uiConfigs?.searchConfig?.redirectSearchResultsUrl;
 
     if (allowRedirect && redirectSearchResultsUrl) {
       const redirectUrl = new URL(redirectSearchResultsUrl);
-      redirectUrl.searchParams.set("es", "true");
-      redirectUrl.searchParams.set("esq", params.query);
+      redirectUrl.searchParams.set('es', 'true');
+      redirectUrl.searchParams.set('esq', params.query);
       window.location.href = redirectUrl.toString();
     } else {
       // Update URL and manually trigger state change (since pushState doesn't trigger popstate)
       const url = new URL(window.location.href);
-      url.searchParams.set("es", "true");
-      url.searchParams.set("esq", params.query);
-      window.history.pushState({}, "", url);
+      url.searchParams.set('es', 'true');
+      url.searchParams.set('esq', params.query);
+      window.history.pushState({}, '', url);
 
       // Manually trigger page variant re-evaluation by dispatching a popstate event
       // This ensures the page variant system detects the URL change and mounts search results
-      window.dispatchEvent(new PopStateEvent("popstate", { state: {} }));
+      window.dispatchEvent(new PopStateEvent('popstate', { state: {} }));
     }
 
     // Manually trigger page variant re-evaluation by dispatching a popstate event
     // This ensures the page variant system detects the URL change and mounts search results
-    window.dispatchEvent(new PopStateEvent("popstate", { state: {} }));
+    window.dispatchEvent(new PopStateEvent('popstate', { state: {} }));
     if (currentState.loading) {
       return; // Prevent concurrent searches
     }
@@ -201,8 +184,7 @@ export const performSearchAtom = atom(
         lastQuery: params.query,
       });
     } catch (error: unknown) {
-      const errorMessage =
-        error instanceof Error ? error.message : "An unknown error occurred";
+      const errorMessage = error instanceof Error ? error.message : 'An unknown error occurred';
       set(searchAtom, {
         data: null,
         loading: false,
@@ -210,5 +192,5 @@ export const performSearchAtom = atom(
         lastQuery: params.query,
       });
     }
-  }
+  },
 );

package/src/atoms/search/searchServiceAdapter.ts

@@ -1,4 +1,4 @@
-import { SearchResult, SearchParams } from "src/application/models/api/search";
+import { SearchResult, SearchParams } from "@envive-ai/types";
 
 // This will be set by the SearchProvider when it initializes
 let searchServiceFunction: