@salla.sa/twilight-components 2.14.447 → 2.14.449

package/dist/collection/components/salla-breadcrumb/salla-breadcrumb.js

@@ -173,19 +173,56 @@ export class SallaBreadcrumb {
             salla.log('salla-breadcrumb:: There is no breadcrumbs!');
             return null;
         }
-        return (h("ol", { class: {
-                "s-breadcrumb-wrapper": true,
-                "s-breadcrumb-dark": salla.url.is_page('loyalty'),
-                "s-breadcrumb-primary-reverse": salla.config.get('page.slug').includes('customer')
-            } }, this.breadcrumbs.map(item => {
-            const isProductSingle = salla.config.get('page.slug') === "product.single";
-            const title = (isProductSingle && item.is_last) ? item.title : this.sanitizeBreadcrumbTitle(item.title);
-            const itemHTML = this.itemSlot.replace(/\{url\}/g, item.url).replace(/\{title\}/g, title);
-            return [
-                h("div", { class: "s-breadcrumb-slot", innerHTML: itemHTML }),
-                this.getArrowDomForItem(item)
-            ];
-        })));
+        const isProductSingle = salla.config.get('page.slug') === "product.single";
+        return [
+            h("ol", { class: {
+                    "s-breadcrumb-wrapper": true,
+                    "s-breadcrumb-dark": salla.url.is_page('loyalty'),
+                    "s-breadcrumb-primary-reverse": salla.config.get('page.slug').includes('customer')
+                } }, this.breadcrumbs.map(item => {
+                const title = (isProductSingle && item.is_last) ? item.title : this.sanitizeBreadcrumbTitle(item.title);
+                const itemHTML = this.itemSlot.replace(/\{url\}/g, item.url).replace(/\{title\}/g, title);
+                return [
+                    h("div", { class: "s-breadcrumb-slot", innerHTML: itemHTML }),
+                    this.getArrowDomForItem(item)
+                ];
+            })),
+            h("script", { type: "application/ld+json", innerHTML: this.getJsonLd(isProductSingle) })
+        ];
+    }
+    /**
+     * Builds schema.org BreadcrumbList JSON-LD for the current breadcrumb trail
+     * so search engines can render it as a rich result.
+     */
+    getJsonLd(isProductSingle) {
+        const itemListElement = this.breadcrumbs.map((item, index) => {
+            const name = (isProductSingle && item.is_last) ? item.title : this.sanitizeBreadcrumbTitle(item.title);
+            const entry = {
+                "@type": "ListItem",
+                "position": index + 1,
+                "name": name,
+            };
+            // Omit `item` for the current (last) page per Google's BreadcrumbList guidance.
+            if (!item.is_last && item.url) {
+                entry.item = this.toAbsoluteUrl(item.url);
+            }
+            return entry;
+        });
+        const json = JSON.stringify({
+            "@context": "https://schema.org",
+            "@type": "BreadcrumbList",
+            "itemListElement": itemListElement,
+        });
+        // Escape `<` so a title containing `</script>` cannot break out of the JSON-LD tag.
+        return json.replace(/</g, '\\u003c');
+    }
+    toAbsoluteUrl(url) {
+        try {
+            return new URL(url, window.location.origin).href;
+        }
+        catch {
+            return url;
+        }
     }
     getArrowDomForItem(item) {
         if (item.is_last) {

package/dist/collection/components/salla-tiered-offer/salla-tiered-offer.js

@@ -54,6 +54,15 @@ export class SallaTieredOffer {
         // If coupon is applied but offer doesn't support coupons, widget should be hidden
         return !(cartCoupon && !offerData.details?.applied_with_coupon);
     }
+    shouldHideForGuest() {
+        return salla.config.isGuest();
+    }
+    shouldHideUntilThreshold(details, tierIndex) {
+        return !!(details?.hide_until_threshold && tierIndex === 0);
+    }
+    resolveTierName(tiers, index) {
+        return TierUtils.getTierNameByIndex(tiers, index) || '';
+    }
     async fetchTieredOfferData() {
         try {
             const { data } = await salla.api.cart.offers();
@@ -80,14 +89,20 @@ export class SallaTieredOffer {
         // Find current tier index based on current_value from API
         const currentValue = this.apiOfferData.details?.current_value || 0;
         const currentTierIndex = this.findCurrentTierIndex(currentValue);
-        // Only render if user has reached at least the first tier
-        if (currentTierIndex === 0) {
+        // Hide entire widget for unauthenticated users
+        if (this.shouldHideForGuest()) {
+            this.canRender = false;
+            return;
+        }
+        // Only hide until threshold for merchants with the flag enabled (e.g. Arabian Oud)
+        if (this.shouldHideUntilThreshold(this.apiOfferData.details, currentTierIndex)) {
             this.canRender = false;
             return;
         }
         this.currentTierIndex = currentTierIndex;
-        this.currentTier = TierUtils.getTierNameByIndex(this.tieredOfferData.tiers, currentTierIndex);
-        this.activeTabTier = this.currentTier;
+        this.currentTier = this.resolveTierName(this.tieredOfferData.tiers, currentTierIndex);
+        // Default to first tab so tabs always have visible content
+        this.activeTabTier = this.currentTier || this.tieredOfferData.tiers[0]?.tier_name;
         this.canRender = true;
     }
     componentDidLoad() {
@@ -122,44 +137,46 @@ export class SallaTieredOffer {
         if (!freshOfferData || !this.tieredOfferData) {
             return;
         }
+        if (!freshOfferData.details?.discounts?.length) {
+            this.canRender = false;
+            return;
+        }
         // Check coupon compatibility
         if (!this.validateCouponCompatibility(freshOfferData, updatedCart.coupon)) {
             this.canRender = false;
             return;
         }
-        // If no coupon conflict, show widget
-        this.canRender = true;
-        // Check if this offer should update with cart changes
-        if (freshOfferData.details?.with_current_cart === false) {
+        // Hide entire widget for unauthenticated users
+        if (this.shouldHideForGuest()) {
+            this.canRender = false;
             return;
         }
-        // Update current_value in API offer data
-        //  const currentValue = updatedCart.sub_total;
-        //  console.log('currentValue #####3', currentValue);
-        //  this.apiOfferData = {
-        //    ...this.apiOfferData,
-        //    details: {
-        //      ...this.apiOfferData.details,
-        //      current_value: currentValue
-        //    }
-        //  };
-        // Use current_value from fresh API data instead of cart sub_total
+        // Build fresh tier map so index computation uses up-to-date thresholds
+        const freshTieredData = this.mapApiDataToTiers(freshOfferData);
         const currentValue = freshOfferData.details?.current_value || 0;
-        this.apiOfferData = freshOfferData;
-        // Update current tier based on new value
-        const newTierIndex = this.findCurrentTierIndex(currentValue);
-        // Check if user qualifies for any tier
-        if (newTierIndex === 0) {
+        const newTierIndex = this.findCurrentTierIndex(currentValue, freshTieredData.tiers);
+        // Only hide until threshold for merchants with the flag enabled (e.g. Arabian Oud)
+        if (this.shouldHideUntilThreshold(freshOfferData.details, newTierIndex)) {
             this.canRender = false;
             return;
         }
-        // user qualifies show widget
+        // Offer progress is based on historical purchases only — skip state update on cart changes
+        // Use strict === false to avoid treating an omitted flag as false
+        if (freshOfferData.details?.with_current_cart === false) {
+            this.canRender = true;
+            return;
+        }
+        // All guards passed — update state atomically
+        this.apiOfferData = freshOfferData;
+        this.tieredOfferData = freshTieredData;
         this.canRender = true;
         this.currentTierIndex = newTierIndex;
-        this.currentTier = TierUtils.getTierNameByIndex(this.tieredOfferData.tiers, newTierIndex);
-        // Update active tab if needed
-        if (this.activeTabTier !== this.currentTier) {
-            this.activeTabTier = this.currentTier;
+        // Tiers are 1-based; fall back to first tier when no tier has been reached yet
+        this.currentTier = this.resolveTierName(freshTieredData.tiers, newTierIndex);
+        // Update active tab if needed; default to first tab when no tier reached
+        const resolvedTab = this.currentTier || freshTieredData.tiers[0]?.tier_name;
+        if (this.activeTabTier !== resolvedTab) {
+            this.activeTabTier = resolvedTab;
         }
     }
     getLoadingSkeletonView() {
@@ -257,7 +274,7 @@ export class SallaTieredOffer {
             return null;
         }
         const currentTierData = this.getCurrentTierData();
-        return (h(Host, null, h("div", { class: "s-tiered-offer-container" }, h("div", { class: "s-tiered-offer-header" }, h("div", { class: "s-tiered-offer-header-content" }, h("p", { class: "s-tiered-offer-program-title" }, this.loyaltyProgramText), h("div", { class: "s-tiered-offer-current-tier-name-wrapper" }, h("h2", { class: "s-tiered-offer-current-tier" }, this.currentTierText, " ", h("span", { class: "s-tiered-offer-tier-name" }, currentTierData.name)), h("span", { innerHTML: currentTierData.icon })))), this.renderProgressBar(), this.renderTabs())));
+        return (h(Host, null, h("div", { class: "s-tiered-offer-container" }, h("div", { class: "s-tiered-offer-header" }, h("div", { class: "s-tiered-offer-header-content" }, h("p", { class: "s-tiered-offer-program-title" }, this.loyaltyProgramText), this.currentTier && (h("div", { class: "s-tiered-offer-current-tier-name-wrapper" }, h("h2", { class: "s-tiered-offer-current-tier" }, this.currentTierText, " ", h("span", { class: "s-tiered-offer-tier-name" }, currentTierData.name)), h("span", { innerHTML: currentTierData.icon }))))), this.renderProgressBar(), this.renderTabs())));
     }
     static get is() { return "salla-tiered-offer"; }
     static get originalStyleUrls() {