BuddyBoss theme: fix WooCommerce product gallery thumbnails hidden by Slick init race condition

buddyboss-product-gallery-thumbs-fix.js

/**
 * BuddyBoss Theme - WooCommerce product gallery thumbnails fix
 *
 * Problem: BuddyBoss hides .flex-control-thumbs via CSS and only shows them
 * once its Slick carousel adds .slick-initialized. The theme runs that Slick
 * init a single time on document ready + setTimeout(0), which can fire BEFORE
 * WooCommerce's FlexSlider has created the thumbnail list on script-heavy
 * pages. Result: the thumbnail strip below the product image never appears.
 *
 * Fix: re-run the theme's own Slick init at the moment WooCommerce finishes
 * building the gallery, with a window-load safety net. The
 * .not('.slick-initialized') guard makes it a no-op when the theme's init won.
 *
 * Usage: add via "Simple Custom CSS and JS" (Add JS Code, footer) or enqueue
 * from the child theme.
 */
(function ($) {
    'use strict';

    function bbFixGalleryThumbs() {
        var $thumbs = $('.woocommerce-product-gallery .flex-control-thumbs').not('.slick-initialized');

        if (!$thumbs.length || !$.fn.slick) {
            return;
        }

        $thumbs.slick({
            infinite: false,
            slidesToShow: 3,
            slidesToScroll: 1,
            adaptiveHeight: true,
            arrows: true,
            prevArrow: '<span class="bb-slide-prev"><i class="bb-icon-angle-right"></i></span>',
            nextArrow: '<span class="bb-slide-next"><i class="bb-icon-angle-right"></i></span>'
        });
    }

    // Fires when WooCommerce finishes building the gallery (the reliable moment).
    $(document.body).on('wc-product-gallery-after-init', bbFixGalleryThumbs);

    // Safety net for galleries initialized before the listener attached.
    $(window).on('load', bbFixGalleryThumbs);
})(jQuery);