@nuskin/react-search-sdk 1.0.1-code-cleanup.1 → 1.0.1-code-cleanup.2

package/dist/index.mjs

@@ -1,11 +1,11 @@
 import { useState, useEffect, useRef, useMemo, useCallback, Component } from 'react';
 import configurationSdk from '@nuskin/configuration-sdk';
 import { SearchPanel } from '@nuskin/react-search-components';
+import { jsx } from 'react/jsx-runtime';
 import { SalesAIChatWidget } from '@nuskin/react-nui-chat-sdk';
 import '@nuskin/react-nui-chat-sdk/styles.css';
 import { createProductClient, ProductProvider, useProductById, ProductCard } from '@nuskin/react-product-sdk';
 import styled from '@emotion/styled';
-import { jsx } from 'react/jsx-runtime';
 
 // src/components/CommerceSearch/CommerceSearch.tsx
 var { getConfiguration, getEnvironmentCode } = configurationSdk;
@@ -173,25 +173,38 @@ function useSearchPanelCopy({
 }
 
 // src/services/localeParts.ts
-function normalizeLocaleParts({
+var TWO_LETTERS = /^[A-Za-z]{2}$/;
+function marketProblem(country, language) {
+  const countryText = String(country ?? "").trim();
+  const languageText = String(language ?? "").trim();
+  if (TWO_LETTERS.test(countryText) && TWO_LETTERS.test(languageText)) {
+    return void 0;
+  }
+  return `the market is not valid (country ${JSON.stringify(countryText)}, language ${JSON.stringify(languageText)}): each must be two letters, for example US and en`;
+}
+function isValidMarket(country, language) {
+  return marketProblem(country, language) === void 0;
+}
+function createLocaleParts({
   country,
-  language,
-  locale
+  language
 }) {
-  const normalizedCountry = String(country ?? "").trim().toUpperCase();
-  const normalizedLanguage = String(language ?? "").trim().toLowerCase();
-  const normalizedLocale = String(locale ?? "").trim() || "UNKNOWN";
+  const problem = marketProblem(country, language);
+  if (problem) throw new Error(problem);
+  const normalizedCountry = country.trim().toUpperCase();
+  const normalizedLanguage = language.trim().toLowerCase();
   return {
-    country: normalizedCountry || "UNKNOWN",
-    language: normalizedLanguage || "unknown",
-    locale: normalizedLocale
+    country: normalizedCountry,
+    language: normalizedLanguage,
+    locale: `${normalizedCountry}-${normalizedLanguage}`
   };
 }
-function toCatalogLocale(localeParts) {
-  const language = String(localeParts.language ?? "en").toLowerCase();
-  const country = String(localeParts.country ?? "US").toUpperCase();
+function toCatalogLocale({ country, language }) {
   return `${language}_${country}`;
 }
+function toPathPrefix({ country, language }) {
+  return `/${country.toLowerCase()}/${language}`;
+}
 
 // src/services/catalogRequest.ts
 function resolveApiGatewayPath(apiGatewayPath, apiName = STOREFRONT_SHOPPING_CONTEXT) {
@@ -234,12 +247,21 @@ async function resolveCatalogRequestConfig({
   getMarketConfig
 }) {
   const marketConfig = getMarketConfig ? await getMarketConfig({ locationLike, country }) ?? null : null;
-  return {
-    suggestionsUrl: buildCatalogSuggestionsUrl(
-      resolveCatalogApiBaseUrl(marketConfig)
-    ),
-    storeId: resolveCatalogStoreId(marketConfig)
-  };
+  const suggestionsUrl = buildCatalogSuggestionsUrl(
+    resolveCatalogApiBaseUrl(marketConfig)
+  );
+  if (!suggestionsUrl) {
+    throw new Error(
+      `no suggestions API for market ${country}: the market configuration has no gateway`
+    );
+  }
+  const storeId = resolveCatalogStoreId(marketConfig);
+  if (!storeId) {
+    throw new Error(
+      `no suggestions API for market ${country}: the market configuration has no store`
+    );
+  }
+  return { suggestionsUrl, storeId };
 }
 function resolveCustomerTypeHeaders(getCustomerType) {
   const customerType = getCustomerType?.()?.trim();
@@ -284,7 +306,7 @@ function getSessionStorage(providedStorage) {
   return null;
 }
 function getRecentHeaderSearchesStorageKey(localeParts) {
-  const { country, language, locale } = normalizeLocaleParts(localeParts);
+  const { country, language, locale } = localeParts;
   return `${RECENT_SEARCHES_PREFIX}:${locale}:${country}:${language}`;
 }
 function getRecentHeaderSearches(localeParts, storage) {
@@ -347,13 +369,14 @@ function buildSearchResultsPath(query, localeParts) {
     /%2D/gi,
     "-"
   );
-  const country = localeParts.country.toLowerCase();
-  const language = localeParts.language.toLowerCase();
-  return `/${country}/${language}${DEFAULT_SEARCH_PATH}/${encodedQuery}`;
+  return `${toPathPrefix(localeParts)}${DEFAULT_SEARCH_PATH}/${encodedQuery}`;
 }
+var SCHEME = /^[a-z][a-z0-9+.-]*:/i;
 function normalizeOptionUrl(rawValue) {
   if (typeof rawValue !== "string") return "";
-  return rawValue.trim();
+  const value = rawValue.trim();
+  if (!value || value.startsWith("/") || SCHEME.test(value)) return value;
+  return `/${value}`;
 }
 function safeDecodeURIComponent(value) {
   try {
@@ -383,16 +406,14 @@ function slugifyPathSegment(value) {
 function buildProductSlugPath(slugValue, localeParts) {
   const slug = slugifyPathSegment(slugValue);
   if (!slug) return "";
-  const country = String(localeParts.country ?? "US").toLowerCase();
-  const language = String(localeParts.language ?? "en").toLowerCase();
-  return `/${country}/${language}/product/${slug}`;
+  return `${toPathPrefix(localeParts)}/product/${slug}`;
 }
 function isNavigableUrl(value) {
   if (!value) return false;
   return value.startsWith("/") || /^https?:\/\//i.test(value);
 }
 function stripLocalePrefix(path, localeParts) {
-  const prefix = `/${localeParts.country.toLowerCase()}/${localeParts.language.toLowerCase()}`;
+  const prefix = toPathPrefix(localeParts);
   return path.startsWith(prefix) ? path.slice(prefix.length) || "/" : path;
 }
 function resolveOptionHref(option, localeParts) {
@@ -446,26 +467,20 @@ function getBrowserLocation(providedLocation) {
     return window.location;
   return null;
 }
-function resolveFetch(fetchImplOption) {
-  if (fetchImplOption !== void 0) return fetchImplOption;
-  return typeof fetch === "function" ? fetch.bind(globalThis) : null;
-}
-function createSearchService(options = {}) {
+function createSearchService(options) {
   const {
     fetchImpl: fetchImplOption,
     location: providedLocation,
     storage: providedStorage,
     country,
     language,
-    locale,
     getMarketConfig,
     getCustomerType,
     minimumSearchLength = MINIMUM_SEARCH_CHAR_LENGTH
   } = options;
-  const fetchImpl = resolveFetch(fetchImplOption);
   const locationLike = getBrowserLocation(providedLocation);
   const storage = getSessionStorage(providedStorage);
-  const localeParts = normalizeLocaleParts({ country, language, locale });
+  const localeParts = createLocaleParts({ country, language });
   let catalogRequestConfigPromise = null;
   function loadCatalogRequestConfig() {
     if (!catalogRequestConfigPromise) {
@@ -487,13 +502,12 @@ function createSearchService(options = {}) {
   const service = {
     async fetchSuggestions(searchTerm) {
       const trimmedSearchTerm = String(searchTerm ?? "").trim();
-      if (!trimmedSearchTerm || trimmedSearchTerm.length < minimumSearchLength || !fetchImpl) {
+      if (!trimmedSearchTerm || trimmedSearchTerm.length < minimumSearchLength) {
         return emptySuggestions();
       }
       const { suggestionsUrl, storeId } = await loadCatalogRequestConfig();
-      if (!suggestionsUrl || !storeId) return emptySuggestions();
       const responsePayload = await fetchJson(
-        fetchImpl,
+        fetchImplOption ?? fetch.bind(globalThis),
         buildSuggestionsRequestUrl({
           suggestionsUrl,
           searchTerm: trimmedSearchTerm,
@@ -547,7 +561,7 @@ function createSearchService(options = {}) {
 
 // src/services/marketConfig.ts
 var fetchMarketConfig = async ({ country }) => {
-  const countryCode = String(country ?? "").trim().toUpperCase() || "US";
+  const countryCode = country.trim().toUpperCase();
   const configuration = await getConfiguration([EQUINOX_MARKETS_MAP], {
     country: countryCode,
     ...getEnvironmentCode() ? { environment: getEnvironmentCode() } : {},
@@ -570,14 +584,25 @@ var SEARCH_GTM_USER_STATUS = {
 var GTM_FALLBACK_NA = "NA";
 
 // src/utils/navigationTarget.ts
+var EXTERNAL_URL = /^https?:\/\//i;
+var INTERNAL_PATH = /^\/(?![/\\])[^\t\n\r]*$/;
 function toNavigationTarget(path) {
-  return /^https?:\/\//i.test(path) ? { type: "external", url: path } : { type: "internal", path };
+  if (EXTERNAL_URL.test(path)) return { type: "external", url: path };
+  if (INTERNAL_PATH.test(path)) return { type: "internal", path };
+  return void 0;
 }
 
 // src/utils/productEnvironment.ts
-var PRODUCT_ENVIRONMENTS = ["dev", "test", "prod"];
+var PRODUCT_ENVIRONMENTS = {
+  dev: true,
+  test: true,
+  prod: true
+};
+function isProductEnvironment(code) {
+  return Object.keys(PRODUCT_ENVIRONMENTS).includes(code);
+}
 function toProductEnvironment(environmentCode) {
-  return environmentCode && PRODUCT_ENVIRONMENTS.includes(environmentCode) ? environmentCode : void 0;
+  return environmentCode !== void 0 && isProductEnvironment(environmentCode) ? environmentCode : void 0;
 }
 function getProductEnvironment() {
   try {
@@ -586,6 +611,47 @@ function getProductEnvironment() {
     return void 0;
   }
 }
+var NOTHING = () => void 0;
+function CommerceSearchUnavailable({
+  isOpen,
+  onClose,
+  country,
+  language,
+  logo
+}) {
+  useEffect(() => {
+    console.error(
+      `[search] Search is unavailable: ${marketProblem(country, language)}`
+    );
+  }, [country, language]);
+  return /* @__PURE__ */ jsx(
+    SearchPanel,
+    {
+      isOpen,
+      onClose,
+      copy: SEARCH_PANEL_COPY_EN,
+      logo,
+      input: { value: "", onChange: NOTHING, onSubmit: NOTHING },
+      suggestions: {
+        items: [],
+        loading: false,
+        showNoResults: false,
+        showDidYouMean: false,
+        hasMore: false,
+        query: "",
+        onSelect: NOTHING,
+        onRunAction: NOTHING,
+        onSeeMore: NOTHING
+      },
+      recentSearches: {
+        items: [],
+        onSelect: NOTHING,
+        onClear: NOTHING
+      },
+      agentPanel: /* @__PURE__ */ jsx("p", { role: "alert", children: "Search is unavailable right now." })
+    }
+  );
+}
 
 // src/utils/nuiSearchGate.ts
 var NUI_SEARCH_FLAG = "enableNuiSearch";
@@ -1069,6 +1135,7 @@ function useSearchSuggestions({
     [enabled, service, resetSuggestionsState, settle]
   );
   useEffect(() => {
+    latestRequestId.current += 1;
     if (!enabled) {
       resetSuggestionsState();
       return void 0;
@@ -1076,7 +1143,6 @@ function useSearchSuggestions({
     if (fetchDebounced.current) {
       clearTimeout(fetchDebounced.current);
     }
-    latestRequestId.current += 1;
     fetchDebounced.current = setTimeout(() => {
       void runFetch(query);
     }, DEBOUNCE_MS);
@@ -1358,11 +1424,11 @@ function useHandoff({
     onUnavailableRef.current = onUnavailable;
   });
   useEffect(() => {
-    let cancelled = false;
+    let canceled = false;
     let timer;
     const startedAt = Date.now();
     const tryOpen = () => {
-      if (cancelled) return;
+      if (canceled) return;
       const handle = getSalesAIHandle();
       if (handle) {
         handle.open({
@@ -1382,7 +1448,7 @@ function useHandoff({
     };
     tryOpen();
     return () => {
-      cancelled = true;
+      canceled = true;
       if (timer !== void 0) clearTimeout(timer);
     };
   }, [query]);
@@ -1610,7 +1676,22 @@ function CommerceSearchView({
   );
 }
 var GUEST = "guest";
-function CommerceSearch({
+function CommerceSearch(props) {
+  if (!isValidMarket(props.country, props.language)) {
+    return /* @__PURE__ */ jsx(
+      CommerceSearchUnavailable,
+      {
+        isOpen: props.isOpen,
+        onClose: props.onClose,
+        country: props.country,
+        language: props.language,
+        logo: props.logo
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(ValidMarketSearch, { ...props });
+}
+function ValidMarketSearch({
   isOpen,
   onClose,
   navigate,
@@ -1638,7 +1719,6 @@ function CommerceSearch({
     () => createSearchService({
       country,
       language,
-      locale: `${country.toUpperCase()}-${language.toLowerCase()}`,
       getMarketConfig: fetchMarketConfig,
       minimumSearchLength,
       getCustomerType: () => customerTypeRef.current
@@ -1646,7 +1726,17 @@ function CommerceSearch({
     [country, language, minimumSearchLength]
   );
   const navigateToPath = useCallback(
-    (path) => navigate(toNavigationTarget(path)),
+    (path) => {
+      const target = toNavigationTarget(path);
+      if (target) {
+        navigate(target);
+      } else {
+        console.warn(
+          "[search] Not navigating to a path the SDK does not recognize:",
+          path
+        );
+      }
+    },
     [navigate]
   );
   const { isAuthenticated, accountType, userId } = customer;