@wix/headless-stores 0.0.10 → 0.0.12

package/dist/services/selected-variant-service.js

@@ -1,11 +1,46 @@
-import { defineService, implementService, } from "@wix/services-definitions";
-import { SignalsServiceDefinition } from "@wix/services-definitions/core-services/signals";
-import { productsV3 } from "@wix/stores";
-export const SelectedVariantServiceDefinition = defineService("selectedVariant");
-export const SelectedVariantService = implementService.withConfig()(SelectedVariantServiceDefinition, ({ getService, config }) => {
+import { defineService, implementService } from '@wix/services-definitions';
+import { SignalsServiceDefinition } from '@wix/services-definitions/core-services/signals';
+import { ModifierRenderType, InventoryAvailabilityStatus, } from '@wix/auto_sdk_stores_products-v-3';
+import { queryInventoryItems } from '@wix/auto_sdk_stores_inventory-items-v-3';
+// import { CurrentCartServiceDefinition } from '../../ecom/services/current-cart-service';
+import { ProductServiceDefinition } from './product-service';
+export const SelectedVariantServiceDefinition = defineService('selectedVariant');
+export const SelectedVariantService = implementService.withConfig()(SelectedVariantServiceDefinition, ({ getService }) => {
     const signalsService = getService(SignalsServiceDefinition);
     // const cartService = getService(CurrentCartServiceDefinition);
-    const configProduct = config.product;
+    const productService = getService(ProductServiceDefinition);
+    // const mediaService = getService(MediaGalleryServiceDefinition);
+    const selectedChoices = signalsService.signal({});
+    const preOrderMessage = signalsService.signal(null);
+    const initialProduct = productService.product.get();
+    signalsService.effect(() => {
+        const product = productService.product.get();
+        const selectedChoicesValue = selectedChoices.get() || {};
+        let mediaToDisplay = [];
+        const productItemsImages = product?.media?.itemsInfo?.items?.map(item => item).filter(Boolean) ??
+            [];
+        if (productItemsImages.length) {
+            mediaToDisplay = productItemsImages;
+        }
+        else if (product?.media?.main) {
+            mediaToDisplay = [product.media.main];
+        }
+        // Get images based on selected choices if available
+        let selectedChoicesImages = [];
+        Object.keys(selectedChoicesValue).forEach(choiceKey => {
+            const productOption = product?.options
+                ?.find((option) => option.name === choiceKey)
+                ?.choicesSettings?.choices?.find((choice) => choice.name === selectedChoicesValue[choiceKey]);
+            if (productOption) {
+                selectedChoicesImages.push(...(productOption.linkedMedia ?? []));
+            }
+        });
+        if (selectedChoicesImages?.length) {
+            mediaToDisplay = selectedChoicesImages;
+        }
+        console.log({ mediaToDisplay });
+        // mediaService.setMediaToDisplay(mediaToDisplay ?? []);
+    });
     const parsePrice = (amount) => {
         if (!amount)
             return 0;
@@ -26,28 +61,67 @@ export const SelectedVariantService = implementService.withConfig()(SelectedVari
         return choices;
     };
     const findVariantByChoices = (variants, selectedChoices) => {
-        return (variants.find((variant) => {
+        return (variants.find(variant => {
             const variantChoices = processVariantChoices(variant);
             const choiceKeys = Object.keys(selectedChoices);
-            return choiceKeys.every((key) => variantChoices[key] === selectedChoices[key]);
+            return choiceKeys.every(key => variantChoices[key] === selectedChoices[key]);
         }) || null);
     };
-    // const getDefaultVariant = (): productsV3.Variant | null => {
-    //   const variantsList = variants.get();
-    //   return variantsList[0] || null;
-    // };
-    const updateQuantityFromVariant = (variant) => {
+    const findVariantWithMinPrice = () => {
+        const variantsList = variants.get();
+        const variantPrices = variantsList.map(x => Number(x.price?.actualPrice?.formattedAmount) ||
+            Number(x.price?.actualPrice?.amount));
+        const minPrice = String(Math.min(...variantPrices));
+        return variantsList.find(x => x.price?.actualPrice?.formattedAmount === minPrice ||
+            x.price?.actualPrice?.amount === minPrice);
+    };
+    const updateInventoryItemData = async (variantId, inStock, preOrderEnabled) => {
+        if (!variantId) {
+            preOrderMessage.set(null);
+            return;
+        }
+        try {
+            // Use the correct Wix inventoryItemsV3.queryInventoryItems() API
+            const queryResult = await queryInventoryItems()
+                .eq('variantId', variantId)
+                .find();
+            const inventoryItem = queryResult.items?.[0];
+            const isTrackingQuantity = inventoryItem?.trackQuantity ?? false;
+            trackQuantity.set(isTrackingQuantity);
+            preOrderMessage.set(inventoryItem?.preorderInfo?.message || null);
+            if (!inventoryItem || !isTrackingQuantity) {
+                quantityAvailable.set(null);
+                return;
+            }
+            if (inStock && inventoryItem?.quantity) {
+                quantityAvailable.set(inventoryItem.quantity);
+            }
+            else if (preOrderEnabled && inventoryItem.preorderInfo?.limit) {
+                quantityAvailable.set(inventoryItem.preorderInfo.limit);
+            }
+            else {
+                quantityAvailable.set(null);
+            }
+        }
+        catch (error) {
+            console.error('Failed to fetch inventory quantity:', error);
+            // Fallback on error
+            quantityAvailable.set(null);
+            trackQuantity.set(false);
+        }
+    };
+    const updateDataFromVariant = (variant) => {
         if (variant) {
             const inStock = variant.inventoryStatus?.inStock ?? true;
             const preOrderEnabled = variant.inventoryStatus?.preorderEnabled ?? false;
-            // If in stock, allow 999. If out of stock but pre-order enabled, allow 999. Otherwise 0.
-            quantityAvailable.set(inStock || preOrderEnabled ? 999 : 0);
+            // update the quantity available, tracking indication and pre-order message from the inventory API
+            updateInventoryItemData(variant._id, inStock, preOrderEnabled);
         }
         else {
             quantityAvailable.set(0);
+            trackQuantity.set(false);
         }
     };
-    const selectedChoices = signalsService.signal({});
     const isLoading = signalsService.signal(false);
     const error = signalsService.signal(null);
     const variants = signalsService.signal([]);
@@ -55,60 +129,70 @@ export const SelectedVariantService = implementService.withConfig()(SelectedVari
     const basePrice = signalsService.signal(0);
     const discountPrice = signalsService.signal(null);
     const isOnSale = signalsService.signal(null);
-    const quantityAvailable = signalsService.signal(0);
-    const productId = signalsService.signal("");
-    const sku = signalsService.signal("");
+    const quantityAvailable = signalsService.signal(null);
+    const trackQuantity = signalsService.signal(false);
+    const selectedQuantity = signalsService.signal(1);
+    const productId = signalsService.signal('');
     const ribbonLabel = signalsService.signal(null);
-    const v3Product = signalsService.signal(configProduct);
-    if (configProduct) {
-        productId.set(configProduct._id || "");
-        ribbonLabel.set(configProduct.ribbon?.name || null);
-        const actualPrice = configProduct.actualPriceRange?.minValue?.amount;
-        const compareAtPrice = configProduct.compareAtPriceRange?.minValue?.amount;
-        basePrice.set(parsePrice(actualPrice));
-        discountPrice.set(compareAtPrice ? parsePrice(compareAtPrice) : null);
-        isOnSale.set(!!compareAtPrice && parsePrice(compareAtPrice) > parsePrice(actualPrice));
-        if (configProduct.options) {
-            const optionsMap = {};
-            configProduct.options.forEach((option) => {
-                if (option.name && option.choicesSettings?.choices) {
-                    optionsMap[option.name] = option.choicesSettings.choices.map((choice) => choice.name || "");
+    const v3Product = signalsService.signal(initialProduct);
+    const init = (currentProduct) => {
+        if (currentProduct) {
+            v3Product.set(currentProduct);
+            productId.set(currentProduct._id || '');
+            ribbonLabel.set(currentProduct.ribbon?.name || null);
+            const actualPrice = currentProduct.actualPriceRange?.minValue?.amount;
+            const compareAtPrice = currentProduct.compareAtPriceRange?.minValue?.amount;
+            basePrice.set(parsePrice(actualPrice));
+            discountPrice.set(compareAtPrice ? parsePrice(compareAtPrice) : null);
+            isOnSale.set(!!compareAtPrice &&
+                parsePrice(compareAtPrice) > parsePrice(actualPrice));
+            if (currentProduct.options) {
+                const optionsMap = {};
+                currentProduct.options.forEach((option) => {
+                    if (option.name && option.choicesSettings?.choices) {
+                        optionsMap[option.name] = option.choicesSettings.choices.map((choice) => choice.name || '');
+                    }
+                });
+                options.set(optionsMap);
+            }
+            if (currentProduct.variantSummary.variantCount > 1) {
+                variants.set(currentProduct.variantsInfo?.variants || []);
+                if (currentProduct.variantsInfo?.variants?.length) {
+                    // updateDataFromVariant(currentProduct.variantsInfo?.variants[0]);
                 }
-            });
-            options.set(optionsMap);
-        }
-        if (configProduct.variantsInfo?.variants) {
-            variants.set(configProduct.variantsInfo.variants);
-            if (configProduct.variantsInfo.variants.length > 0) {
-                updateQuantityFromVariant(configProduct.variantsInfo.variants[0] || null);
+            }
+            else {
+                const singleVariant = {
+                    _id: 'default',
+                    visible: true,
+                    choices: [],
+                    price: {
+                        actualPrice: currentProduct.actualPriceRange?.minValue,
+                        compareAtPrice: currentProduct.compareAtPriceRange?.minValue,
+                    },
+                    inventoryStatus: {
+                        inStock: currentProduct.inventory?.availabilityStatus ===
+                            InventoryAvailabilityStatus.IN_STOCK ||
+                            currentProduct.inventory?.availabilityStatus ===
+                                InventoryAvailabilityStatus.PARTIALLY_OUT_OF_STOCK,
+                        preorderEnabled: currentProduct.inventory?.preorderStatus === 'ENABLED',
+                    },
+                };
+                variants.set([singleVariant]);
+                updateDataFromVariant(singleVariant);
             }
         }
-        else {
-            const singleVariant = {
-                _id: "default",
-                visible: true,
-                choices: [],
-                price: {
-                    actualPrice: configProduct.actualPriceRange?.minValue,
-                    compareAtPrice: configProduct.compareAtPriceRange?.minValue,
-                },
-                inventoryStatus: {
-                    inStock: configProduct.inventory?.availabilityStatus === "IN_STOCK" ||
-                        configProduct.inventory?.availabilityStatus ===
-                            "PARTIALLY_OUT_OF_STOCK",
-                    preorderEnabled: configProduct.inventory?.preorderStatus === "ENABLED",
-                },
-            };
-            variants.set([singleVariant]);
-            updateQuantityFromVariant(singleVariant);
-        }
-    }
+    };
+    signalsService.effect(() => {
+        const currentProduct = productService.product.get();
+        init(currentProduct);
+    });
     const currentVariant = signalsService.computed((() => {
-        const prod = v3Product.get();
         const choices = selectedChoices.get();
-        if (!prod?.variantsInfo?.variants)
+        const variantsList = variants.get();
+        if (!variantsList || variantsList.length === 0)
             return null;
-        return (prod.variantsInfo.variants.find((variant) => {
+        return (variantsList.find((variant) => {
             const variantChoices = processVariantChoices(variant);
             if (Object.keys(choices).length !== Object.keys(variantChoices).length)
                 return false;
@@ -121,8 +205,19 @@ export const SelectedVariantService = implementService.withConfig()(SelectedVari
         const variant = currentVariant.get();
         return variant?._id || null;
     });
+    const variantWithMinPrice = findVariantWithMinPrice();
     const currentPrice = signalsService.computed(() => {
         const variant = currentVariant.get();
+        if (!variant && variantWithMinPrice) {
+            const formattedAmount = variantWithMinPrice?.price?.actualPrice?.formattedAmount;
+            if (formattedAmount) {
+                return formattedAmount;
+            }
+            const amount = variantWithMinPrice?.price?.actualPrice?.amount;
+            if (amount) {
+                return `$${amount}`;
+            }
+        }
         const prod = v3Product.get();
         // Try to get formatted amount first (if fields worked)
         if (variant?.price?.actualPrice?.formattedAmount) {
@@ -139,11 +234,21 @@ export const SelectedVariantService = implementService.withConfig()(SelectedVari
         else if (prod?.actualPriceRange?.minValue?.amount) {
             rawAmount = prod.actualPriceRange.minValue.amount;
         }
-        return rawAmount ? `$${rawAmount}` : "";
+        return rawAmount ? `$${rawAmount}` : '';
     });
     const currentCompareAtPrice = signalsService.computed(() => {
         const variant = currentVariant.get();
         const prod = v3Product.get();
+        if (!variant && variantWithMinPrice) {
+            const formattedAmount = variantWithMinPrice?.price?.compareAtPrice?.formattedAmount;
+            if (formattedAmount) {
+                return formattedAmount;
+            }
+            const amount = variantWithMinPrice?.price?.compareAtPrice?.amount;
+            if (amount) {
+                return `$${amount}`;
+            }
+        }
         // Try to get formatted compare-at price first
         if (variant?.price?.compareAtPrice?.formattedAmount) {
             return variant.price.compareAtPrice.formattedAmount;
@@ -181,41 +286,48 @@ export const SelectedVariantService = implementService.withConfig()(SelectedVari
     });
     const currency = signalsService.computed(() => {
         const prod = v3Product.get();
-        return prod?.currency || "USD";
+        return prod?.currency || 'USD';
     });
     const selectedVariant = () => {
         const variantId = selectedVariantId.get();
         const variantsList = variants.get();
-        return variantsList.find((v) => v._id === variantId) || null;
+        return variantsList.find(v => v._id === variantId) || null;
     };
     const finalPrice = () => {
         const discount = discountPrice.get();
         const base = basePrice.get();
         return discount !== null ? discount : base;
     };
-    // @ts-ignore
-    const isLowStock = (threshold = 5) => {
+    const isLowStock = () => {
+        // Note: Currently always returns false as inventory quantity tracking
+        // is handled separately by the inventory service
         return false;
     };
     const setSelectedChoices = (choices) => {
         selectedChoices.set(choices);
+        selectedQuantity.set(1); // Reset quantity when choices change
         const matchingVariant = findVariantByChoices(variants.get(), choices);
-        updateQuantityFromVariant(matchingVariant);
+        updateDataFromVariant(matchingVariant);
     };
-    const addToCart = async (quantity = 1, modifiers) => {
+    const addToCart = async (_quantity = 1, modifiers) => {
         try {
             isLoading.set(true);
             error.set(null);
             const prod = v3Product.get();
             const variant = currentVariant.get();
             if (!prod?._id) {
-                throw new Error("Product not found");
+                throw new Error('Product not found');
             }
             // Build catalog reference with modifiers if provided
             const catalogReference = {
                 catalogItemId: prod._id,
-                appId: "215238eb-22a5-4c36-9e7b-e7c08025e04e",
-                options: variant?._id ? { variantId: variant._id, preOrderRequested: !!variant?.inventoryStatus?.preorderEnabled } : undefined,
+                appId: '215238eb-22a5-4c36-9e7b-e7c08025e04e',
+                options: variant?._id && variant._id !== 'default'
+                    ? {
+                        variantId: variant._id,
+                        preOrderRequested: !!variant?.inventoryStatus?.preorderEnabled,
+                    }
+                    : undefined,
             };
             // Transform and add modifiers to catalog reference if they exist
             if (modifiers && Object.keys(modifiers).length > 0) {
@@ -225,19 +337,19 @@ export const SelectedVariantService = implementService.withConfig()(SelectedVari
                 const productModifiers = prod.modifiers || [];
                 Object.values(modifiers).forEach((modifierValue) => {
                     const modifierName = modifierValue.modifierName;
-                    const productModifier = productModifiers.find((m) => m.name === modifierName);
+                    const productModifier = productModifiers.find(m => m.name === modifierName);
                     if (!productModifier)
                         return;
                     const renderType = productModifier.modifierRenderType;
-                    if (renderType === "TEXT_CHOICES" ||
-                        renderType === "SWATCH_CHOICES") {
+                    if (renderType === ModifierRenderType.TEXT_CHOICES ||
+                        renderType === ModifierRenderType.SWATCH_CHOICES) {
                         // For choice modifiers, use the modifier key and choice value
                         const modifierKey = productModifier.key || modifierName;
                         if (modifierValue.choiceValue) {
                             options[modifierKey] = modifierValue.choiceValue;
                         }
                     }
-                    else if (renderType === "FREE_TEXT") {
+                    else if (renderType === ModifierRenderType.FREE_TEXT) {
                         // For free text modifiers, use the freeTextSettings key
                         const freeTextKey = productModifier.freeTextSettings?.key || modifierName;
                         if (modifierValue.freeTextValue) {
@@ -259,17 +371,16 @@ export const SelectedVariantService = implementService.withConfig()(SelectedVari
                     };
                 }
             }
-            // @ts-ignore
-            const lineItems = [
-                {
-                    catalogReference,
-                    quantity,
-                },
-            ];
+            // const lineItems = [
+            //   {
+            //     catalogReference,
+            //     quantity,
+            //   },
+            // ];
             // await cartService.addToCart(lineItems);
         }
         catch (err) {
-            error.set(err instanceof Error ? err.message : "Failed to add to cart");
+            error.set(err instanceof Error ? err.message : 'Failed to add to cart');
         }
         finally {
             isLoading.set(false);
@@ -282,21 +393,33 @@ export const SelectedVariantService = implementService.withConfig()(SelectedVari
     };
     const selectVariantById = (id) => {
         const variantsList = variants.get();
-        const variant = variantsList.find((v) => v._id === id);
+        const variant = variantsList.find(v => v._id === id);
         if (variant) {
             const variantChoices = processVariantChoices(variant);
             selectedChoices.set(variantChoices);
-            updateQuantityFromVariant(variant);
-        }
-    };
-    const loadProductVariants = (data) => {
-        variants.set(data);
-        if (data.length > 0) {
-            updateQuantityFromVariant(data[0] || null);
+            updateDataFromVariant(variant);
         }
     };
     const resetSelections = () => {
         selectedChoices.set({});
+        selectedQuantity.set(1); // Reset quantity when resetting selections
+    };
+    // Quantity management methods
+    const setSelectedQuantity = (quantity) => {
+        const maxQuantity = quantityAvailable.get();
+        const validQuantity = Math.max(1, Math.min(quantity, maxQuantity || 999));
+        selectedQuantity.set(validQuantity);
+    };
+    const incrementQuantity = () => {
+        const current = selectedQuantity.get();
+        const maxQuantity = quantityAvailable.get();
+        const newQuantity = Math.min(current + 1, maxQuantity || 999);
+        selectedQuantity.set(newQuantity);
+    };
+    const decrementQuantity = () => {
+        const current = selectedQuantity.get();
+        const newQuantity = Math.max(1, current - 1);
+        selectedQuantity.set(newQuantity);
     };
     // New methods for smart variant selection
     const getAvailableChoicesForOption = (optionName) => {
@@ -304,7 +427,7 @@ export const SelectedVariantService = implementService.withConfig()(SelectedVari
         const variantsList = variants.get();
         // Get all possible choices for this option that result in valid variants
         const availableChoices = new Set();
-        variantsList.forEach((variant) => {
+        variantsList.forEach(variant => {
             const variantChoices = processVariantChoices(variant);
             // Check if this variant matches all currently selected choices (except for the option we're checking)
             const matchesOtherChoices = Object.entries(currentChoices)
@@ -316,14 +439,57 @@ export const SelectedVariantService = implementService.withConfig()(SelectedVari
         });
         return Array.from(availableChoices);
     };
+    // Core method that provides both availability and stock info efficiently
+    const getChoiceInfo = (optionName, choiceValue) => {
+        // Create hypothetical choices with this choice selected
+        const currentChoices = selectedChoices.get();
+        const hypotheticalChoices = {
+            ...currentChoices,
+            [optionName]: choiceValue,
+        };
+        // Get all variants and find one that matches these choices
+        const variantsList = variants.get();
+        const matchingVariants = variantsList.filter(variant => {
+            if (!variant.choices)
+                return false;
+            const variantChoices = {};
+            for (const choice of variant.choices) {
+                if (choice.optionChoiceNames?.optionName &&
+                    choice.optionChoiceNames?.choiceName) {
+                    variantChoices[choice.optionChoiceNames.optionName] =
+                        choice.optionChoiceNames.choiceName;
+                }
+            }
+            // Check if this variant matches our hypothetical choices
+            return Object.entries(hypotheticalChoices).every(([key, value]) => variantChoices[key] === value);
+        });
+        const isAvailable = matchingVariants.length > 0;
+        // Check if ANY of the matching variants are in stock
+        const isInStock = matchingVariants.some(variant => variant.inventoryStatus?.inStock === true);
+        // Check if ANY of the matching variants have pre-order enabled
+        const isPreOrderEnabled = matchingVariants.some(variant => variant.inventoryStatus?.preorderEnabled === true);
+        return { isAvailable, isInStock, isPreOrderEnabled };
+    };
+    // Simplified methods using the core getChoiceInfo
     const isChoiceAvailable = (optionName, choiceValue) => {
-        const availableChoices = getAvailableChoicesForOption(optionName);
-        return availableChoices.includes(choiceValue);
+        return getChoiceInfo(optionName, choiceValue).isAvailable;
+    };
+    const isChoiceInStock = (optionName, choiceValue) => {
+        return getChoiceInfo(optionName, choiceValue).isInStock;
+    };
+    const isChoicePreOrderEnabled = (optionName, choiceValue) => {
+        return getChoiceInfo(optionName, choiceValue).isPreOrderEnabled;
     };
     const hasAnySelections = () => {
         const currentChoices = selectedChoices.get();
         return Object.keys(currentChoices).length > 0;
     };
+    const IsAllVariantsAreOutOfStock = () => {
+        const variantsList = variants.get();
+        // All variants must be out of stock AND none should have preorder enabled
+        return (variantsList?.every(variant => !variant.inventoryStatus?.inStock &&
+            !variant.inventoryStatus?.preorderEnabled) ?? true);
+    };
     return {
         selectedChoices,
         selectedVariantId,
@@ -332,6 +498,7 @@ export const SelectedVariantService = implementService.withConfig()(SelectedVari
         currentCompareAtPrice,
         isInStock,
         isPreOrderEnabled,
+        preOrderMessage,
         isLoading,
         error,
         variants,
@@ -340,53 +507,32 @@ export const SelectedVariantService = implementService.withConfig()(SelectedVari
         discountPrice,
         isOnSale,
         quantityAvailable,
+        trackQuantity,
+        selectedQuantity,
         productId,
-        sku,
         ribbonLabel,
         setSelectedChoices,
         addToCart,
         setOption,
         selectVariantById,
-        loadProductVariants,
         resetSelections,
         // New methods for smart variant selection
         getAvailableChoicesForOption,
+        getChoiceInfo,
         isChoiceAvailable,
+        isChoiceInStock,
+        isChoicePreOrderEnabled,
         hasAnySelections,
+        // Quantity management methods
+        setSelectedQuantity,
+        incrementQuantity,
+        decrementQuantity,
         selectedVariant,
         finalPrice,
         isLowStock,
         product,
         productOptions,
         currency,
+        IsAllVariantsAreOutOfStock,
     };
 });
-export async function loadSelectedVariantServiceConfig(productSlug) {
-    try {
-        // Use getProductBySlug directly - single API call with comprehensive fields
-        const productResponse = await productsV3.getProductBySlug(productSlug, {
-            fields: [
-                "DESCRIPTION",
-                "DIRECT_CATEGORIES_INFO",
-                "BREADCRUMBS_INFO",
-                "INFO_SECTION",
-                "MEDIA_ITEMS_INFO",
-                "PLAIN_DESCRIPTION",
-                "THUMBNAIL",
-                "URL",
-                "VARIANT_OPTION_CHOICE_NAMES",
-                "WEIGHT_MEASUREMENT_UNIT_INFO",
-            ],
-        });
-        if (!productResponse.product) {
-            throw new Error("Product not found");
-        }
-        return {
-            product: productResponse.product,
-        };
-    }
-    catch (error) {
-        console.error(`Failed to load product for slug "${productSlug}":`, error);
-        throw error;
-    }
-}

package/dist/services/social-sharing-service.d.ts

@@ -1,5 +1,5 @@
-import { type ServiceFactoryConfig } from "@wix/services-definitions";
-import type { Signal } from "./Signal";
+import { type ServiceFactoryConfig } from '@wix/services-definitions';
+import type { Signal } from '../../Signal';
 export interface SharingPlatform {
     name: string;
     icon: string;