@thefittingroom/shop-ui 5.0.9 → 5.0.11

package/dist/index.js

@@ -19034,7 +19034,7 @@ const en$1 = {
   "get-app": { "create_avatar": "Create your avatar" },
   "sign-in": { "email": "Email", "password": "Password", "forgot_password": "Forgot password?", "sign_in": "Sign in", "no_account": "Don’t have an account?", "download_app": "Download the app.", "invalid_email": "Please enter a valid email address.", "missing_password": "Please enter your password.", "login_failed": "Incorrect email or password." },
   "forgot-password": { "title": "Forgot password", "description": "We’ll send you an email with a link to reset your password.", "send_link": "Send link", "link_sent": "Link sent! Please check your email.", "need_help": "Need help?", "contact_us": "Contact us." },
-  "vto-single": { "avatar_loading": "Finding your perfect fit...", "slide_to_rotate": "Slide to rotate", "sign_out": "Sign out", "color_label": "Color:", "add_to_cart": "Add to cart", "view_product_details": "View product details", "hide_product_details": "Hide product details" },
+  "vto-single": { "avatar_loading": "Finding your perfect fit...", "slide_to_rotate": "Slide to rotate", "sign_out": "Sign out", "color_label": "Color:", "add_to_cart": "Add to cart", "view_product_details": "View product details", "hide_product_details": "Hide product details", "no_recommendation": "There are currently no well fitting sizes available for this item." },
   "size-rec": { "recommended_size": "Recommended Size: {{size}}", "item_fit": "This item is {{fit}}", "select_size": "Select a size to see how it fits", "fitClassification": { "form_fitting": "Form Fitting", "slim_fit": "Slim Fit", "regular_fit": "Regular Fit", "relaxed_fit": "Relaxed Fit", "oversized_fit": "Oversized Fit" }, "measurementLocation": { "neck_base": "Neck", "across_shoulder": "Shoulders", "cb_neck_to_wrist": "Neck to Wrist", "sleeve_length_from_shoulder_point": "Sleeve", "bust": "Bust", "waist": "Waist", "low_waist": "Low Waist", "high_hip": "High Hip", "low_hip": "Low Hip", "thigh": "Thigh", "inseam": "Inseam", "hsp_to_low_hip": "HSP to Low Hip", "hsp_to_crotch": "HSP to Crotch", "low_hip_bottoms": "Low Hip (Bottoms)", "high_hip_bottoms": "High Hip (Bottoms)" }, "fit": { "too_tight": "Too Tight", "tight": "Tight", "slightly_tight": "Slightly Tight", "perfect_fit": "Perfect Fit", "slightly_loose": "Slightly Loose", "loose": "Loose", "oversized": "Oversized", "too_short": "Too Short", "short": "Short", "slightly_short": "Slightly Short", "slightly_long": "Slightly Long", "long": "Long", "too_long": "Too Long" } },
   "fit-chart": { "fit_scale": "Fit Scale", "fit": { "poor_fit": "Poor Fit", "acceptable_fit": "Acceptable Fit", "too_tight": "Too Tight", "tight": "Tight or More Fitted", "slightly_tight": "Slightly Tight or Fitted", "perfect_fit": "Perfect Fit", "slightly_loose": "Slightly Loose or Less Fitted", "loose": "Loose or Not Fitted", "oversized": "Oversized" }, "measurement_points": "Measurement Points", "point": { "bust": "Chest/Bust", "waist": "Natural Waist", "pant_waist": "Pant Waist", "high_hip": "High Hip", "low_hip": "Low Hip", "thigh": "Thigh" } }
 };
@@ -19050,7 +19050,7 @@ const fr = {
   "get-app": { "create_avatar": "Créez votre avatar" },
   "sign-in": { "email": "Email", "password": "Mot de passe", "forgot_password": "Mot de passe oublié ?", "sign_in": "Se connecter", "no_account": "Vous n'avez pas de compte ?", "download_app": "Téléchargez l'application.", "invalid_email": "Veuillez entrer une adresse e-mail valide.", "missing_password": "Veuillez entrer votre mot de passe.", "login_failed": "Email ou mot de passe incorrect." },
   "forgot-password": { "title": "Mot de passe oublié", "description": "Nous vous enverrons un e-mail avec un lien pour réinitialiser votre mot de passe.", "send_link": "Envoyer le lien", "link_sent": "Lien envoyé ! Veuillez vérifier votre e-mail.", "need_help": "Besoin d'aide ?", "contact_us": "Contactez-nous." },
-  "vto-single": { "avatar_loading": "Trouver votre ajustement parfait...", "slide_to_rotate": "Faites glisser pour faire pivoter", "sign_out": "Se déconnecter", "color_label": "Couleur :", "add_to_cart": "Ajouter au panier", "view_product_details": "Voir les détails du produit", "hide_product_details": "Masquer les détails du produit" },
+  "vto-single": { "avatar_loading": "Trouver votre ajustement parfait...", "slide_to_rotate": "Faites glisser pour faire pivoter", "sign_out": "Se déconnecter", "color_label": "Couleur :", "add_to_cart": "Ajouter au panier", "view_product_details": "Voir les détails du produit", "hide_product_details": "Masquer les détails du produit", "no_recommendation": "Il n'y a actuellement pas de tailles bien ajustées disponibles pour cet article." },
   "size-rec": { "recommended_size": "Taille recommandée : {{size}}", "item_fit": "Cet article est {{fit}}", "select_size": "Sélectionnez une taille pour voir comment elle s'adapte", "fitClassification": { "form_fitting": "Ajusté", "slim_fit": "Coupe slim", "regular_fit": "Coupe régulière", "relaxed_fit": "Coupe décontractée", "oversized_fit": "Coupe oversize" }, "measurementLocation": { "neck_base": "Cou", "across_shoulder": "Épaules", "cb_neck_to_wrist": "Cou jusqu'au poignet", "sleeve_length_from_shoulder_point": "Manche", "bust": "Buste", "waist": "Taille", "low_waist": "Bas de la taille", "high_hip": "Haut des hanches", "low_hip": "Bas des hanches", "thigh": "Cuisse", "inseam": "Entrejambe", "hsp_to_low_hip": "HSP au bas des hanches", "hsp_to_crotch": "HSP à l'entrejambe", "low_hip_bottoms": "Bas des hanches (bas)", "high_hip_bottoms": "Haut des hanches (bas)" }, "fit": { "too_tight": "Trop serré", "tight": "Serré", "slightly_tight": "Légèrement serré", "perfect_fit": "Parfait", "slightly_loose": "Légèrement ample", "loose": "Ample", "oversized": "Oversize", "too_short": "Trop court", "short": "Court", "slightly_short": "Légèrement court", "slightly_long": "Légèrement long", "long": "Long", "too_long": "Trop long" } },
   "fit-chart": { "fit_scale": "Échelle d'ajustement", "fit": { "poor_fit": "Mauvais ajustement", "acceptable_fit": "Ajustement acceptable", "too_tight": "Trop serré", "tight": "Serré ou plus ajusté", "slightly_tight": "Légèrement serré ou ajusté", "perfect_fit": "Parfait", "slightly_loose": "Légèrement ample ou moins ajusté", "loose": "Ample ou non ajusté", "oversized": "Oversize" }, "measurement_points": "Points de mesure", "point": { "bust": "Poitrine/Buste", "waist": "Taille naturelle", "pant_waist": "Taille du pantalon", "high_hip": "Haut des hanches", "low_hip": "Bas des hanches", "thigh": "Cuisse" } }
 };
@@ -41951,8 +41951,7 @@ function VtoSingleOverlay() {
         logger$2.timerStart("fetchInitialData_2_getStyleData");
         const styleRec = await getStyleByExternalId(brandId, currentProduct.externalId);
         if (!styleRec) {
-          logger$2.logError(`Style not found for externalId: ${currentProduct.externalId}`);
-          return;
+          throw new Error(`Style not found for externalId: ${currentProduct.externalId}`);
         }
         const styleGarmentCategoryRec = await getStyleGarmentCategoryById(styleRec.style_garment_category_id);
         const styleCategoryLabel = styleGarmentCategoryRec?.style_category_label ?? null;
@@ -41961,66 +41960,88 @@ function VtoSingleOverlay() {
         const sizeRecommendationRecord = await getSizeRecommendation(styleRec.id);
         logger$2.timerEnd("fetchInitialData_3_getSizeRecommendation");
         logger$2.timerStart("fetchInitialData_4_assembleLoadedData");
-        let productData;
-        const recommendedSizeLabel = getSizeLabelFromSize(sizeRecommendationRecord.recommended_size) ?? "(unknown)";
         {
-          const fitClassification = sizeRecommendationRecord.fit_classification;
-          const recommendedSizeId = sizeRecommendationRecord.recommended_size.id;
-          const sizes = [];
-          for (const sizeRec of sizeRecommendationRecord.available_sizes) {
-            const sizeId = sizeRec.id;
-            const sizeLabel = getSizeLabelFromSize(sizeRec) ?? "(unknown)";
-            const isRecommended = sizeRec.id === recommendedSizeId;
-            const fit = sizeRecommendationRecord.fits.find((f) => f.size_id === sizeRec.id);
-            if (!fit) {
-              continue;
-            }
-            const colors = [];
-            for (const csaRec of sizeRec.colorway_size_assets) {
-              const colorwaySizeAssetId = csaRec.id;
-              const sku = csaRec.sku;
-              const variant = variants.find((v) => v.sku === sku);
-              if (!variant) {
+          const recommendedSizeId = sizeRecommendationRecord.recommended_size.id || null;
+          const recommendedSizeLabel = getSizeLabelFromSize(sizeRecommendationRecord.recommended_size);
+          if (recommendedSizeId == null || recommendedSizeLabel == null) {
+            throw new Error(`No recommended size found for externalId: ${currentProduct.externalId}`);
+          }
+          let productData;
+          {
+            const fitClassification = sizeRecommendationRecord.fit_classification;
+            const sizes = [];
+            for (const sizeRec of sizeRecommendationRecord.available_sizes) {
+              const sizeId = sizeRec.id;
+              const sizeLabel = getSizeLabelFromSize(sizeRec) || null;
+              if (!sizeLabel) {
+                continue;
+              }
+              const isRecommended = sizeRec.id === recommendedSizeId;
+              const fit = sizeRecommendationRecord.fits.find((f) => f.size_id === sizeRec.id);
+              if (!fit) {
                 continue;
               }
-              const colorLabel = variant.color;
-              const priceFormatted = variant.priceFormatted;
-              colors.push({
-                colorwaySizeAssetId,
-                colorLabel,
-                sku,
-                priceFormatted
+              const colors = [];
+              for (const csaRec of sizeRec.colorway_size_assets) {
+                const colorwaySizeAssetId = csaRec.id;
+                const sku = csaRec.sku;
+                const variant = variants.find((v) => v.sku === sku);
+                if (!variant) {
+                  logger$2.logWarn(`Variant not found for externalId: ${currentProduct.externalId} sizeId: ${sizeId} sku: ${sku}`);
+                  continue;
+                }
+                const colorLabel = variant.color || null;
+                const priceFormatted = variant.priceFormatted;
+                colors.push({
+                  colorwaySizeAssetId,
+                  colorLabel,
+                  sku,
+                  priceFormatted
+                });
+              }
+              if (!colors.length) {
+                logger$2.logWarn(`No valid colorways found for externalId: ${currentProduct.externalId} sizeId: ${sizeId}`);
+                continue;
+              }
+              sizes.push({
+                sizeId,
+                sizeLabel,
+                isRecommended,
+                fit,
+                colors
               });
             }
-            sizes.push({
-              sizeId,
-              sizeLabel,
-              isRecommended,
-              fit,
-              colors
-            });
+            if (!sizes.length) {
+              throw new Error(`No valid sizes found for externalId: ${currentProduct.externalId}`);
+            }
+            productData = {
+              productName,
+              productDescriptionHtml,
+              fitClassification,
+              recommendedSizeId,
+              recommendedSizeLabel,
+              sizes,
+              styleCategoryLabel
+            };
           }
-          productData = {
-            productName,
-            productDescriptionHtml,
-            fitClassification,
-            recommendedSizeId,
-            recommendedSizeLabel,
-            sizes,
-            styleCategoryLabel
-          };
+          let recommendedColorLabel = null;
+          {
+            const recommendedSizeRecord = productData.sizes.find((s) => s.isRecommended);
+            if (!recommendedSizeRecord) {
+              throw new Error("Recommended size record not found");
+            }
+            if (!recommendedSizeRecord.colors.length) {
+              throw new Error("No colorways found for recommended size record");
+            }
+            const recommendedSizeColorRecord = recommendedSizeRecord.colors.find((c) => {
+              return c.colorLabel === selectedColor;
+            }) || recommendedSizeRecord.colors[0];
+            recommendedColorLabel = recommendedSizeColorRecord?.colorLabel ?? null;
+          }
+          setLoadedProductData(productData);
+          setSelectedSizeLabel(recommendedSizeLabel);
+          setSelectedColorLabel(recommendedColorLabel);
         }
-        let recommendedColorLabel;
-        {
-          const recommendedSizeRecord = productData.sizes.find((s) => s.isRecommended);
-          const recommendedSizeColorRecord = recommendedSizeRecord.colors.find((c) => {
-            return c.colorLabel === selectedColor;
-          }) || recommendedSizeRecord.colors[0];
-          recommendedColorLabel = recommendedSizeColorRecord.colorLabel;
-        }
-        setLoadedProductData(productData);
-        setSelectedSizeLabel(recommendedSizeLabel);
-        setSelectedColorLabel(recommendedColorLabel);
         for (const sku in userProfile?.vto?.[brandId] ?? {}) {
           fetchedVtoSkus.current.add(sku);
           readyVtoSkus.current.add(sku);
@@ -42032,12 +42053,15 @@ function VtoSingleOverlay() {
         logger$2.logError("Error fetching initial data:", {
           error
         });
+        setLoadedProductData(false);
+        setSelectedSizeLabel(null);
+        setSelectedColorLabel(null);
       }
     }
-    if (userIsLoggedIn && userHasAvatar && !loadedProductData) {
+    if (userIsLoggedIn && userHasAvatar && userProfile && loadedProductData == null) {
       fetchInitialData();
     }
-  }, [userIsLoggedIn, userHasAvatar, loadedProductData, userProfile]);
+  }, [userIsLoggedIn, userHasAvatar, userProfile, loadedProductData]);
   const {
     sizeColorRecord: selectedColorSizeRecord,
     availableColorLabels
@@ -42049,14 +42073,14 @@ function VtoSingleOverlay() {
       };
     }
     const sizeRecord = loadedProductData.sizes.find((s) => s.sizeLabel === selectedSizeLabel);
-    if (!sizeRecord) {
+    if (!sizeRecord || !sizeRecord.colors.length) {
       return {
         sizeColorRecord: null,
         availableColorLabels: []
       };
     }
     const sizeColorRecord = sizeRecord.colors.find((c) => c.colorLabel === selectedColorLabel) ?? sizeRecord.colors[0];
-    const availableColorLabels2 = sizeRecord.colors.map((c) => c.colorLabel);
+    const availableColorLabels2 = sizeRecord.colors.map((c) => c.colorLabel).filter((label) => !!label);
     return {
       sizeColorRecord,
       availableColorLabels: availableColorLabels2
@@ -42089,7 +42113,9 @@ function VtoSingleOverlay() {
     }
     for (const sizeRecord of loadedProductData.sizes) {
       const sizeColorRecord = sizeRecord.colors.find((c) => c.colorLabel === selectedColorLabel) ?? sizeRecord.colors[0];
-      requestVto(sizeColorRecord);
+      if (sizeColorRecord) {
+        requestVto(sizeColorRecord);
+      }
     }
   }, [requestVto, loadedProductData, selectedColorLabel]);
   const vtoData = reactExports.useMemo(() => {
@@ -42150,7 +42176,10 @@ function VtoSingleOverlay() {
       });
     }
   }, [selectedColorLabel, selectedSizeLabel]);
-  if (!userIsLoggedIn || !userHasAvatar || !loadedProductData || !selectedColorSizeRecord) {
+  if (loadedProductData === false) {
+    return /* @__PURE__ */ jsx$1(SidecarModalFrame, { onRequestClose: closeOverlay, children: /* @__PURE__ */ jsx$1(NoFitLayout, { onClose: closeOverlay, onSignOut: handleSignOutClick }) });
+  }
+  if (!userIsLoggedIn || !userHasAvatar || loadedProductData == null || !selectedColorSizeRecord) {
     return /* @__PURE__ */ jsx$1(SidecarModalFrame, { onRequestClose: closeOverlay, children: /* @__PURE__ */ jsx$1(Loading, {}) });
   }
   let Layout;
@@ -42161,6 +42190,44 @@ function VtoSingleOverlay() {
   }
   return /* @__PURE__ */ jsx$1(SidecarModalFrame, { onRequestClose: closeOverlay, contentStyle: modalStyle, children: /* @__PURE__ */ jsx$1(Layout, { loadedProductData, selectedColorSizeRecord, availableColorLabels, selectedColorLabel, selectedSizeLabel, frameUrls, setModalStyle, onClose: closeOverlay, onChangeColor: setSelectedColorLabel, onChangeSize: setSelectedSizeLabel, onAddToCart: handleAddToCartClick, onSignOut: handleSignOutClick }) });
 }
+function NoFitLayout({
+  onClose,
+  onSignOut
+}) {
+  const {
+    t
+  } = useTranslation();
+  const css2 = useCss((_theme) => ({
+    mainContainer: {
+      width: "100%",
+      height: "100%",
+      padding: "16px"
+    },
+    titlebarContainer: {},
+    contentContainer: {
+      height: "100%",
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center",
+      justifyContent: "center"
+    },
+    messageContainer: {
+      marginTop: "32px",
+      textAlign: "center"
+    },
+    footerContainer: {
+      marginTop: "32px"
+    }
+  }));
+  return /* @__PURE__ */ jsxs("div", { css: css2.mainContainer, children: [
+    /* @__PURE__ */ jsx$1("div", { css: css2.titlebarContainer, children: /* @__PURE__ */ jsx$1(ModalTitlebar, { title: t("try_it_on"), onCloseClick: onClose }) }),
+    /* @__PURE__ */ jsxs("div", { css: css2.contentContainer, children: [
+      /* @__PURE__ */ jsx$1("div", { children: " " }),
+      /* @__PURE__ */ jsx$1("div", { css: css2.messageContainer, children: /* @__PURE__ */ jsx$1(TextT, { variant: "base", t: "vto-single.no_recommendation" }) }),
+      /* @__PURE__ */ jsx$1("div", { css: css2.footerContainer, children: /* @__PURE__ */ jsx$1(Footer, { onSignOutClick: onSignOut }) })
+    ] })
+  ] });
+}
 function MobileLayout({
   loadedProductData,
   selectedColorSizeRecord,
@@ -43379,9 +43446,9 @@ const SHARED_CONFIG = {
     appGooglePlayUrl: "https://play.google.com/store/apps/details?id=com.thefittingroom.marketplace"
   },
   build: {
-    version: `${"5.0.9"}`,
-    commitHash: `${"c1adffa"}`,
-    date: `${"2026-02-01T12:11:06.704Z"}`
+    version: `${"5.0.11"}`,
+    commitHash: `${"77ac921"}`,
+    date: `${"2026-02-02T01:20:02.888Z"}`
   }
 };
 const CONFIGS = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thefittingroom/shop-ui",
-  "version": "5.0.9",
+  "version": "5.0.11",
   "description": "the fitting room UI library",
   "type": "module",
   "main": "./dist/index.js",