<?xml version="1.0"?>
<t name="Categories Filmstrip" t-name="website_sale.filmstrip_categories">
        <t t-if="category.id">
            <t t-set="entries" t-value="not search and category.child_id or category.child_id.filtered(lambda c: category.id in search_categories_ids)"/>

            <t t-if="not entries">
                <t t-set="parent" t-value="category.parent_id"/>
                <t t-set="entries" t-value="not search and parent.child_id or parent.child_id.filtered(lambda c: parent.id in search_categories_ids)"/>
            </t>
        </t>
        <t t-else="">
            <t t-set="entries" t-value="categories"/>
        </t>
        <t t-set="entries" t-value="request.env.user._is_internal() and entries or entries.filtered('has_published_products')"/>

        <div t-if="entries" id="o_wsale_categories_filmstrip" class="o_wsale_filmstrip_container o_wsale_filmstrip_default d-flex align-items-stretch w-100 overflow-hidden" role="navigation">
            <div class="o_wsale_filmstrip_wrapper w-100 overflow-auto">
                <ul class="o_wsale_filmstrip d-flex align-items-stretch mb-0 w-100 list-unstyled overflow-visible" role="menu" aria-label="Categories">
                    <li t-foreach="entries" t-as="c" t-att-data-publish="c.has_published_products and 'on' or 'off'" role="presentation">
                        <a t-att-href="keep('%s/category/%s' % (shop_path, slug(c)))" class="o_wsale_filmstrip_link d-block w-100 h-100 text-decoration-none" draggable="false" role="menuitem" t-att-aria-label="c.name">
                            <input type="radio" t-attf-name="wsale_categories_top_radios_{{parentCategoryId}}" class="btn-check pe-none" t-att-id="c.id" t-att-value="c.id" t-att-checked="'true' if c.id == category.id else None" tabindex="-1"/>
                            <div t-att-class="'o_wsale_filmstrip_item position-relative d-flex w-100 h-100'                                     + (c.id == category.id and ' active' or '')">
                                <div t-if="c.image_128" name="o_wsale_filmstrip_image" class="o_wsale_filmstrip_image oe_img_bg o_bg_img_center rounded" t-attf-style="background-image:url('data:image/png;base64, #{c.image_128}')" t-att-alt="c.name" role="img" aria-label="Category image"/>
                                <div t-else="" name="o_wsale_filmstrip_placeholder" class="o_wsale_filmstrip_image o_wsale_filmstrip_placeholder oe_img_bg o_bg_img_center rounded" role="img" aria-label="Category image"/>
                                <span class="lh-1" t-field="c.name"/>
                            </div>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </t>

    