@envive-ai/react-hooks 0.1.2 → 0.1.4

package/src/atoms/org/org.ts

@@ -1,11 +1,11 @@
 /* eslint-disable @typescript-eslint/no-use-before-define */
+import Logger from "src/application/logging/logger";
 import { ContextSourceEnum } from "@spiffy-ai/commerce-api-client";
 import { atom } from "jotai";
 import { atomWithStorage, createJSONStorage } from "jotai/utils";
 import CommerceApiClient from "src/adapters/spiffy/commerce/api";
 import { GraphQLClient } from "src/adapters/spiffy/commerce/graphql";
 import { OrgConfig } from "src/application/models/api/orgConfigResults";
-import { EnvironmentService } from "src/application/service/environmentService";
 import { FeatureFlagService } from "src/application/service/featureFlagService";
 import { UserIdentityService } from "src/application/service/userIdentityService";
 import { AtomStore, getAtomStore } from "src/atoms/atomStore/atomStore";
@@ -13,13 +13,16 @@ import { PerfMetricsEvents, logPerfMetricAtom } from "src/atoms/chat";
 import { orgAnalyticsConfigAtom } from "src/atoms/org/orgAnalyticsConfig";
 import { colorsConfigAtom, frontendConfigAtom } from "./graphqlConfig";
 import { getOrgUIConfig } from "./orgUIConfig";
-import { useEnviveConfig } from "src/contexts/enviveConfigContext";
+import {
+  orgLevelApiKeyAtom,
+  orgShortNameAtom as enviveOrgShortNameAtom,
+  contextSourceAtom,
+  baseUrlAtom,
+} from "src/atoms/envive/enviveConfig";
 
 const internalApiKeyAtom = atom<string | undefined>(undefined);
 const internalEndpointURLAtom = atom<string | undefined>(undefined);
-const internalSourceAtom = atom<ContextSourceEnum>(
-  EnvironmentService.getContextSource()
-);
+const internalSourceAtom = atom<ContextSourceEnum | undefined>(undefined);
 
 export const getApiKeyEnvVar = (shortName: string): string =>
   `VITE_${shortName.replace(/-/g, "_").toUpperCase()}_API_KEY`;
@@ -32,7 +35,8 @@ export const apiKeyAtom = atom(
       return apiKey;
     }
 
-    const { orgLevelApiKey, orgShortName } = useEnviveConfig();
+    const orgLevelApiKey = get(orgLevelApiKeyAtom);
+    const orgShortName = get(enviveOrgShortNameAtom);
 
     if (orgLevelApiKey) {
       return orgLevelApiKey;
@@ -45,8 +49,14 @@ export const apiKeyAtom = atom(
       return window._spiffy.publicKey;
     }
 
+    // During initial render, orgShortName might not be set yet
+    // Return undefined instead of throwing to allow for lazy initialization
     if (!orgShortName) {
-      throw new Error("[spiffy-ai] orgShortName is required but is not set");
+      Logger.logWarn(
+        "[spiffy-ai] orgShortName not yet available, returning undefined for apiKey",
+        undefined
+      );
+      return undefined;
     }
 
     // The merchant probably forgot to set the apiKey
@@ -56,18 +66,6 @@ export const apiKeyAtom = atom(
     set(internalApiKeyAtom, newVal);
   }
 );
-export const endpointURLAtom = atom(
-  (get) => get(internalEndpointURLAtom) ?? EnvironmentService.getApiEndpoint(),
-  (_, set, newVal: string | undefined) => {
-    set(internalEndpointURLAtom, newVal);
-  }
-);
-export const sourceAtom = atom(
-  (get) => get(internalSourceAtom),
-  (_, set, newVal: ContextSourceEnum) => {
-    set(internalSourceAtom, newVal);
-  }
-);
 
 const orgConfigStorageUtil = createJSONStorage<
   Record<string, OrgConfig> | undefined
@@ -100,7 +98,7 @@ export const featureFlagServiceAtom = atom(
       return new FeatureFlagService(orgConfig.gates);
     }
 
-    throw new Error("FeatureFlagService is referenced before it is set");
+    return undefined; // Return undefined instead of throwing
   },
   (_, set, value: FeatureFlagService) => {
     set(internalFeatureFlagServiceAtom, value);
@@ -109,11 +107,7 @@ export const featureFlagServiceAtom = atom(
 export const orgConfigAtom = atom(
   (get) => {
     const orgConfig = get(internalOrgConfigAtom);
-    if (orgConfig) {
-      return orgConfig;
-    }
-
-    throw new Error("OrgConfig is referenced before it is set");
+    return orgConfig; // Return undefined if not set instead of throwing
   },
   (_, set, value: OrgConfig) => {
     set(internalOrgConfigAtom, value);
@@ -122,11 +116,7 @@ export const orgConfigAtom = atom(
 export const orgShortNameAtom = atom(
   (get) => {
     const orgShortName = get(internalOrgShortNameAtom);
-    if (orgShortName) {
-      return orgShortName;
-    }
-
-    throw new Error("Org short name is referenced before it is set");
+    return orgShortName; // Return undefined if not set instead of throwing
   },
   (_, set, value: string) => {
     set(internalOrgShortNameAtom, value);
@@ -135,11 +125,7 @@ export const orgShortNameAtom = atom(
 export const orgDomainAtom = atom(
   (get) => {
     const orgDomain = get(internalOrgDomainAtom);
-    if (orgDomain) {
-      return orgDomain;
-    }
-
-    throw new Error("Org domain is referenced before it is set");
+    return orgDomain; // Return undefined if not set instead of throwing
   },
   (_, set, value: string) => {
     set(internalOrgDomainAtom, value);
@@ -148,11 +134,7 @@ export const orgDomainAtom = atom(
 export const orgIdAtom = atom(
   (get) => {
     const orgId = get(internalOrgIdAtom);
-    if (orgId) {
-      return orgId;
-    }
-
-    throw new Error("Org id is referenced before it is set");
+    return orgId; // Return undefined if not set instead of throwing
   },
   (_, set, value: string) => {
     set(internalOrgIdAtom, value);
@@ -166,24 +148,41 @@ export const resetStoredOrgConfigAtom = () => {
 
 // eslint-disable-next-line
 const getGraphQLConfig = async (atomStore: AtomStore) => {
-  const { colorsConfig, frontendConfig } =
-    (await GraphQLClient.getColorsAndFrontendConfig()) ?? {};
-
-  const rawFrontendConfig = atomStore.get(frontendConfigAtom);
-
-  atomStore.set(colorsConfigAtom, colorsConfig);
-
-  atomStore.set(frontendConfigAtom, {
-    ...rawFrontendConfig,
-    pageVariants: frontendConfig?.pageVariants,
-    mountingConfigs: frontendConfig?.mountingConfigs,
-    widgetConfigs: frontendConfig?.widgetConfigs,
-  });
-
-  await getOrgUIConfig(
-    frontendConfig?.uiConfigs,
-    frontendConfig?.merchantOverrideCss
-  );
+  try {
+    Logger.logDebug("getGraphQLConfig: Starting GraphQL client fetch");
+    const { colorsConfig, frontendConfig } =
+      (await GraphQLClient.getColorsAndFrontendConfig()) ?? {};
+
+    Logger.logDebug("getGraphQLConfig: GraphQL fetch completed", {
+      hasColorsConfig: !!colorsConfig,
+      hasFrontendConfig: !!frontendConfig,
+      frontendConfigKeys: frontendConfig ? Object.keys(frontendConfig) : [],
+    });
+
+    const rawFrontendConfig = atomStore.get(frontendConfigAtom);
+
+    atomStore.set(colorsConfigAtom, colorsConfig);
+
+    atomStore.set(frontendConfigAtom, {
+      ...rawFrontendConfig,
+      pageVariants: frontendConfig?.pageVariants,
+      mountingConfigs: frontendConfig?.mountingConfigs,
+      widgetConfigs: frontendConfig?.widgetConfigs,
+    });
+
+    Logger.logDebug("getGraphQLConfig: Starting UI config fetch");
+    await getOrgUIConfig(
+      frontendConfig?.uiConfigs,
+      frontendConfig?.merchantOverrideCss
+    );
+    Logger.logDebug("getGraphQLConfig: UI config fetch completed");
+  } catch (error) {
+    Logger.logError(
+      "getGraphQLConfig: Error during GraphQL config fetch",
+      error
+    );
+    throw error; // Re-throw to be caught by the caller
+  }
 };
 
 /**
@@ -198,9 +197,16 @@ export const getAsyncOrgConfig = async (
 ): Promise<OrgConfig> => {
   const atomStore = getAtomStore();
   const apiKey = apiKeyOverride ?? atomStore.get(apiKeyAtom);
+
+  // If apiKey is still undefined, we need to wait or throw an error
+  if (!apiKey) {
+    throw new Error(
+      "[spiffy-ai] API key is required but not available. Ensure EnviveConfigProvider is properly set up with orgLevelApiKey or orgShortName."
+    );
+  }
+
   atomStore.set(apiKeyAtom, apiKey);
-  atomStore.set(endpointURLAtom, EnvironmentService.getApiEndpoint());
-  atomStore.set(sourceAtom, EnvironmentService.getContextSource());
+
   atomStore.set(logPerfMetricAtom, PerfMetricsEvents.OrgConfigLoadStarted);
   const maybeOrgConfigByApiKey = atomStore.get(storedOrgConfigAtom);
   let maybeOrgConfig = maybeOrgConfigByApiKey?.[apiKey];
@@ -214,7 +220,7 @@ export const getAsyncOrgConfig = async (
   }
 
   const latestConfig = maybeOrgConfig.configs?.find(
-    (config) => config.isLatest
+    (config: any) => config.isLatest
   );
 
   if (!latestConfig) {
@@ -248,7 +254,38 @@ export const getAsyncOrgConfig = async (
     new FeatureFlagService(orgConfig.gates)
   );
 
-  await getGraphQLConfig(atomStore);
-
-  return orgConfig;
+  try {
+    Logger.logDebug("getAsyncOrgConfig: Starting GraphQL config fetch");
+    await getGraphQLConfig(atomStore);
+    Logger.logDebug(
+      "getAsyncOrgConfig: GraphQL config fetch completed successfully"
+    );
+
+    // Get the GraphQL config data that was just fetched and stored in atoms
+    // Note: colorsConfigAtom is async, so we need to await it
+    const colorsConfig = await atomStore.get(colorsConfigAtom);
+    const frontendConfig = atomStore.get(frontendConfigAtom);
+
+    // Merge the GraphQL config data into the orgConfig
+    const enhancedOrgConfig = {
+      ...orgConfig,
+      colorsConfig,
+      frontendConfig,
+    };
+
+    Logger.logDebug("getAsyncOrgConfig: Enhanced orgConfig with GraphQL data", {
+      hasColorsConfig: !!colorsConfig,
+      hasFrontendConfig: !!frontendConfig,
+      frontendConfigKeys: frontendConfig ? Object.keys(frontendConfig) : [],
+    });
+
+    return enhancedOrgConfig;
+  } catch (graphqlError) {
+    Logger.logError(
+      "getAsyncOrgConfig: GraphQL config fetch failed",
+      graphqlError
+    );
+    // Don't throw here - the main org config is still valid even if GraphQL config fails
+    return orgConfig;
+  }
 };

package/src/atoms/org/orgPageConfig.ts

@@ -1,14 +1,17 @@
-import { atom } from 'jotai';
-import { getOrgInfo } from 'src/application/models';
-import { frontendConfigAtom } from 'src/atoms/org/graphqlConfig';
-import { orgConfigAtom } from 'src/atoms/org/org';
-import { PageVariantConfig } from 'src/contexts/types';
+import { atom } from "jotai";
+import { getOrgInfo } from "src/application/models";
+import { frontendConfigAtom } from "src/atoms/org/graphqlConfig";
+import { orgConfigAtom } from "src/atoms/org/org";
+import { PageVariantConfig } from "src/contexts/types";
 
 const internalInjectedPageVariantsAtom = atom<PageVariantConfig[]>([]);
 
 export const orgPageConfigAtom = atom(
   async (get) => {
     const orgConfig = get(orgConfigAtom);
+    if (!orgConfig) {
+      throw new Error("orgConfig is not available");
+    }
     const orgInfo = await getOrgInfo(orgConfig.org.org.shortName);
     const frontendConfig = get(frontendConfigAtom);
     const injectedPageVariants = get(internalInjectedPageVariantsAtom);
@@ -34,5 +37,5 @@ export const orgPageConfigAtom = atom(
   },
   (_, set, pageVariants: PageVariantConfig[]) => {
     set(internalInjectedPageVariantsAtom, pageVariants);
-  },
+  }
 );

package/src/atoms/org/orgUIConfig.ts

@@ -28,11 +28,7 @@ const internalOrgUIConfigAtom = atom<OrgUIConfig | undefined>(undefined);
 export const orgUIConfigAtom = atom(
   (get) => {
     const orgUIConfig = get(internalOrgUIConfigAtom);
-    if (orgUIConfig) {
-      return orgUIConfig;
-    }
-
-    throw new Error("OrgUIConfig is referenced before it is set");
+    return orgUIConfig; // Return undefined if not set instead of throwing
   },
   (_, set, value: OrgUIConfig) => {
     set(internalOrgUIConfigAtom, value);
@@ -45,9 +41,22 @@ export const getOrgUIConfig = async (
 ) => {
   const atomStore = getAtomStore();
   const orgShortName = atomStore.get(orgShortNameAtom);
+  if (!orgShortName) {
+    Logger.logWarn("orgShortName is undefined, cannot get org info", undefined);
+    return;
+  }
+
   const orgInfo = await getOrgInfo(orgShortName);
-  const localOrgUIConfig = orgInfo.orgUIConfig() ?? {};
+
   const featureFlagService = atomStore.get(featureFlagServiceAtom);
+  if (!featureFlagService) {
+    Logger.logWarn(
+      "featureFlagService is undefined, cannot get feature flags",
+      undefined
+    );
+    return;
+  }
+
   const isNewFeatureEnabled = featureFlagService.isFeatureGateEnabled(
     FeatureGates.IsNewFeatureEnabled
   );
@@ -65,6 +74,7 @@ export const getOrgUIConfig = async (
       FeatureGates.IsGraphQLComponentConfigsEnabled
     );
 
+  const localOrgUIConfig = orgInfo.orgUIConfig();
   let orgUIConfig: Partial<OrgUIConfig> = { ...localOrgUIConfig };
 
   if (isGraphQLUIConfigsEnabled && graphqlMerchantOverrideCss) {
@@ -120,10 +130,13 @@ export const getOrgUIConfig = async (
 };
 
 export const orgCustomerServiceConfig = atom(
-  (get) => get(orgUIConfigAtom).customerServiceIntegration
+  (get) => get(orgUIConfigAtom)?.customerServiceIntegration
 );
 
 export const orgCustomerServiceService = atom((get) => {
-  const { provider } = get(orgCustomerServiceConfig);
-  return findCustomerServiceImpl(provider);
+  const config = get(orgCustomerServiceConfig);
+  if (!config?.provider) {
+    return undefined;
+  }
+  return findCustomerServiceImpl(config.provider);
 });

package/src/atoms/search/chatSearch.ts

@@ -1,55 +1,63 @@
-import { UserEventCategory } from '@spiffy-ai/commerce-api-client';
-import { v4 as uuid } from 'uuid';
-import { atom } from 'jotai';
+import { UserEventCategory } from "@spiffy-ai/commerce-api-client";
+import { v4 as uuid } from "uuid";
+import { atom } from "jotai";
 import {
   Message,
   MessageRole,
   MessageType,
   ProductResponseAttributes,
-} from 'src/application/models';
+} from "src/application/models";
 import {
   messagesAtom,
   replyEventCategoryAtom,
   userHasRepliedAtom,
   userQueryAtom,
-} from 'src/atoms/chat';
-import { queueUserEventAtom } from '../chat/messageQueue';
-import { orgUIConfigAtom } from '../org';
-import { ProductFilters } from './productFilters';
-import { ProductSorter } from './productSorter';
-import { ChatSearchStateType, ProductSorting } from './types';
+} from "src/atoms/chat";
+import { queueUserEventAtom } from "../chat/messageQueue";
+import { orgUIConfigAtom } from "../org";
+import { ProductFilters } from "./productFilters";
+import { ProductSorter } from "./productSorter";
+import { ChatSearchStateType, ProductSorting } from "./types";
 
 // NOTE:
 // This is a legacy version of search that needs to be decoupled and removed.
 // the new search.ts file in this directory is likely what you're looking for.
 
-export const chatSearchStateAtom = atom<ChatSearchStateType>('entrypoint');
+export const chatSearchStateAtom = atom<ChatSearchStateType>("entrypoint");
 export const chatSearchHasProductsAtom = atom<boolean>(false);
-export const chatSearchProductSortingAtom = atom<ProductSorting>(ProductSorting.FEATURED);
+export const chatSearchProductSortingAtom = atom<ProductSorting>(
+  ProductSorting.FEATURED
+);
 
 const filterProductList = (message: Message) =>
   message.type === MessageType.Product && message.metadata.isForGrid === true;
-const filterFilterList = (message: Message) => message.type === MessageType.ProductSearchFilter;
+const filterFilterList = (message: Message) =>
+  message.type === MessageType.ProductSearchFilter;
 
 export type ChatSearchTurn = {
   id: string;
   generatedQuery?: string;
   productCount: number;
-  productList: ProductResponseAttributes['attributes'][];
+  productList: ProductResponseAttributes["attributes"][];
   filterList: string[];
   messages: Message[];
 };
 
 export const chatSearchIsLoadingAtom = atom(false);
 
-const buildChatSearchTurn = (messages: Message[]): [string, ChatSearchTurn] | null => {
-  const queryMessage = messages.find((message) => message.type === MessageType.ProductSearch);
+const buildChatSearchTurn = (
+  messages: Message[]
+): [string, ChatSearchTurn] | null => {
+  const queryMessage = messages.find(
+    (message) => message.type === MessageType.ProductSearch
+  );
   if (!queryMessage) {
     return null;
   }
   const { generatedQuery, productCount } = queryMessage.metadata ?? {};
-  // @ts-expect-error: product has metadata
-  const productList = messages.filter(filterProductList).map((message) => message.metadata);
+  const productList = messages
+    .filter(filterProductList)
+    .map((message) => (message as any).metadata);
   const filterList = messages
     .filter(filterFilterList)
     .map((message) => message.metadata.filterName);
@@ -67,13 +75,15 @@ const buildChatSearchTurn = (messages: Message[]): [string, ChatSearchTurn] | nu
 };
 
 const chatSearchFilterConfigAtom = atom((get) => {
-  const { searchConfig } = get(orgUIConfigAtom);
-  return searchConfig.searchFilterConfig;
+  const orgUIConfig = get(orgUIConfigAtom);
+  return orgUIConfig?.searchConfig?.searchFilterConfig || [];
 });
 
 const searchMapAtom = atom((get) => {
   const messages = get(messagesAtom);
-  return Object.fromEntries(messages.map(buildChatSearchTurn).filter((v) => v !== null));
+  return Object.fromEntries(
+    messages.map(buildChatSearchTurn).filter((v) => v !== null)
+  );
 });
 
 const internalChatSearchParamsAtom = atom<{
@@ -92,17 +102,19 @@ export type SelectedChatSearchFilterOption = {
   filterItemId: string; // Filter value
 };
 
-export const selectedFilterOptionsAtom = atom<SelectedChatSearchFilterOption[]>([]);
+export const selectedFilterOptionsAtom = atom<SelectedChatSearchFilterOption[]>(
+  []
+);
 
 export const additiveDynamicFiltersAtom = atom((get) => {
-  const { searchConfig } = get(orgUIConfigAtom);
-  return searchConfig.additiveDynamicFilters ?? false;
+  const orgUIConfig = get(orgUIConfigAtom);
+  return orgUIConfig?.searchConfig?.additiveDynamicFilters ?? false;
 });
 
 export const createChatSearchFilterOption = (
   filterId: string,
   filterItemId: string,
-  displayName: string,
+  displayName: string
 ): SelectedChatSearchFilterOption => ({
   id: `${filterId}:${filterItemId}`,
   displayName,
@@ -138,7 +150,7 @@ export const chatSearchParamsAtom = atom(
   (get) => get(internalChatSearchParamsAtom),
   (_, set, value: { id: string | null; query: string | null }) => {
     set(internalChatSearchParamsAtom, value);
-  },
+  }
 );
 
 export const chatSearchQueryAtom = atom(
@@ -146,7 +158,7 @@ export const chatSearchQueryAtom = atom(
   (get, set, value: string | null) => {
     const searchParams = get(chatSearchParamsAtom);
     set(chatSearchParamsAtom, { id: searchParams.id, query: value });
-  },
+  }
 );
 
 export const chatSearchIdAtom = atom(
@@ -154,7 +166,7 @@ export const chatSearchIdAtom = atom(
   (get, set, value: string | null) => {
     const searchParams = get(chatSearchParamsAtom);
     set(chatSearchParamsAtom, { id: value, query: searchParams.query });
-  },
+  }
 );
 
 export const ChatSearchTurnAtom = atom((get) => {
@@ -175,10 +187,13 @@ export const ChatSearchTurnAtom = atom((get) => {
     ChatSearchTurn.productList,
     searchFilterConfig,
     selectedFilterOptions,
-    additiveDynamicFilters,
+    additiveDynamicFilters
   );
 
-  const filteredAndSortedProducts = ProductSorter.sort(filteredProducts, productSorting);
+  const filteredAndSortedProducts = ProductSorter.sort(
+    filteredProducts,
+    productSorting
+  );
 
   return {
     ...searchMap[chatSearchId],
@@ -204,7 +219,7 @@ export const chatSearchFiltersAtom = atom((get) => {
     return ProductFilters.getFiltersForProducts(
       products,
       searchFilterConfig,
-      selectedFilterOptions,
+      selectedFilterOptions
     );
   }
   return [];
@@ -217,16 +232,16 @@ export const chatSearchFiltersAtom = atom((get) => {
 
 export const setSearchParams = (query: string) => {
   const url = new URL(window.location.href);
-  url.searchParams.set('es', 'true');
-  url.searchParams.set('esq', query);
-  window.history.pushState({}, '', url);
+  url.searchParams.set("es", "true");
+  url.searchParams.set("esq", query);
+  window.history.pushState({}, "", url);
 };
 
 export const getSearchParamsAtom = atom(() => {
   const params = new URLSearchParams(window.location.search);
   return {
-    es: params.get('es'),
-    esq: params.get('esq'),
+    es: params.get("es"),
+    esq: params.get("esq"),
   };
 });
 
@@ -234,13 +249,13 @@ export const initiateChatSearchAtom = atom(null, (_, set, query: string) => {
   set(chatSearchIsLoadingAtom, true);
   // 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', query);
-  window.history.pushState({}, '', url);
+  url.searchParams.set("es", "true");
+  url.searchParams.set("esq", 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: {} }));
 
   set(chatSearchParamsAtom, { id: null, query });
   set(handleSearchAtom, {
@@ -256,38 +271,41 @@ export const initiateChatSearchAtom = atom(null, (_, set, query: string) => {
   });
 });
 
-export const handleSearchResultsAtom = atom(null, (get, set, message: Message | undefined) => {
-  if (!message || message.type !== MessageType.ProductSearch) {
-    return;
-  }
+export const handleSearchResultsAtom = atom(
+  null,
+  (get, set, message: Message | undefined) => {
+    if (!message || message.type !== MessageType.ProductSearch) {
+      return;
+    }
 
-  const { productCount, generatedQuery } = message.metadata;
-  if (productCount !== 0) {
-    // Clear the filter options when we get new products
-    set(selectedFilterOptionsAtom, []);
-    // TODO: Should we still do any of these things?
-    set(chatSearchStateAtom, 'product-page');
-    const currentSearchParams = get(chatSearchParamsAtom);
-    const url = new URL(window.location.href);
-    url.searchParams.set('es', 'true');
-    url.searchParams.set('esq', generatedQuery);
-    url.searchParams.set('esi', message.id);
-    window.history.pushState({}, '', url);
-    if (currentSearchParams.id === null) {
-      // If the id is null, we need to replace the state
-      window.history.replaceState(null, '', url);
-    } else {
-      // If the query is different, we need to push a new state
-      window.history.pushState(null, '', url);
+    const { productCount, generatedQuery } = message.metadata;
+    if (productCount !== 0) {
+      // Clear the filter options when we get new products
+      set(selectedFilterOptionsAtom, []);
+      // TODO: Should we still do any of these things?
+      set(chatSearchStateAtom, "product-page");
+      const currentSearchParams = get(chatSearchParamsAtom);
+      const url = new URL(window.location.href);
+      url.searchParams.set("es", "true");
+      url.searchParams.set("esq", generatedQuery);
+      url.searchParams.set("esi", message.id);
+      window.history.pushState({}, "", url);
+      if (currentSearchParams.id === null) {
+        // If the id is null, we need to replace the state
+        window.history.replaceState(null, "", url);
+      } else {
+        // If the query is different, we need to push a new state
+        window.history.pushState(null, "", url);
+      }
+      set(chatSearchParamsAtom, { id: message.id, query: generatedQuery });
     }
-    set(chatSearchParamsAtom, { id: message.id, query: generatedQuery });
   }
-});
+);
 
 export const setChatSearchParamsAtom = atom(null, (_, set, query: string) => {
   const url = new URL(window.location.href);
-  url.searchParams.set('es', 'true');
-  url.searchParams.set('esq', query);
-  window.history.pushState({}, '', url);
+  url.searchParams.set("es", "true");
+  url.searchParams.set("esq", query);
+  window.history.pushState({}, "", url);
   set(chatSearchParamsAtom, { id: null, query });
 });

package/src/contexts/chatContext.tsx

@@ -421,6 +421,9 @@ const ChatContextProvider = ({ children }: { children: ReactNode }) => {
           `[spiffy-ai] initializeWidget is_currently_streaming=${responseStreaming} is_initialized=${widgetInitialized}`
         );
         // on mount, try to get the responses from an active session if one exists
+        if (!orgId) {
+          throw new Error("orgId is not available");
+        }
         const { messages: existingMessages, userEvents } =
           await CommerceApiClient.getResponses(orgId, chatId, userId);
         setMessages([...existingMessages]);
@@ -455,7 +458,7 @@ const ChatContextProvider = ({ children }: { children: ReactNode }) => {
 
   const onFocus = useCallback(async () => {
     try {
-      if (!responseStreaming && !suggestionsLoading) {
+      if (!responseStreaming && !suggestionsLoading && orgId) {
         const { messages: existingMessages } =
           await CommerceApiClient.getResponses(orgId, chatId, userId);