<?xml version="1.0"?>
<data inherit_id="website_event.index_topbar" active="False" name="Filter by Country">
    <xpath expr="//div[hasclass('o_wevent_search')]" position="before">
        <div class="dropdown d-none d-lg-block">
            <button type="button" class="btn btn-light dropdown-toggle" data-bs-toggle="dropdown" title="Filter by Country" aria-label="Filter by country" aria-expanded="false">
                <t t-if="searches['country'] == 'online'">
                    <t t-set="online_event_text">Online Events</t>
                    <t t-out="online_event_text"/>
                </t>
                <t t-elif="current_country" t-esc="current_country.name"/>
                <t t-else="">All countries</t>
            </button>
            <div class="dropdown-menu">
                <t t-foreach="countries" t-as="country">
                    <t t-if="country['country_id']">
                        <t t-set="is_active" t-value="searches.get('country') == str(country['country_id'] and country['country_id'][0])"/>
                        <a t-att-href="keep_event_url(country=country['country_id'][0])" t-attf-class="dropdown-item d-flex align-items-center justify-content-between #{is_active and 'active'}" t-att-title="country['country_id'][1]">
                            <t t-out="country['country_id'][1]"/>
                            <span t-out="country['country_id_count']" t-attf-class="badge pagination ms-3 text-bg-primary"/>
                        </a>
                    </t>
                    <t t-else="">
                        <t t-set="is_active" t-value="searches.get('country') == 'online'"/>
                        <a t-att-href="keep_event_url(country='online')" t-attf-class="dropdown-item d-flex align-items-center justify-content-between #{is_active and 'active'}" title="Online Events">
                            <span>Online Events</span>
                            <span t-out="country['country_id_count']" t-attf-class="badge pagination ms-3 text-bg-primary"/>
                        </a>
                    </t>
                </t>
            </div>
        </div>
    </xpath>
    <xpath expr="//div[hasclass('accordion-item')]" position="after">
        <div class="accordion-item">
            <h2 class="accordion-header">
                <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target=".o_wevent_offcanvas_country" aria-expanded="false" aria-controls="o_wevent_offcanvas_country">
                    Countries
                </button>
            </h2>
            <div id="o_wevent_offcanvas_country" class="o_wevent_offcanvas_country accordion-collapse collapse" aria-labelledby="offcanvas_country">
                <div class="accordion-body pt-0">
                    <ul class="list-group list-group-flush">
                        <li t-foreach="countries" t-as="country" class="list-group-item px-0 border-0">
                            <t t-if="country['country_id']">
                                <t t-set="is_active" t-value="searches.get('country') == str(country['country_id'] and country['country_id'][0])"/>
                                <a t-att-href="keep_event_url(country=country['country_id'][0])" class="d-flex align-items-center justify-content-between text-reset text-decoration-none" t-att-title="country['country_id'][1]">
                                    <div class="form-check flex-basis-100">
                                        <input class="form-check-input pe-none" type="radio" t-attf-name="#{country['country_id'][1]}" t-att-checked="is_active"/>
                                        <label class="form-check-label" t-attf-for="#{country['country_id'][1]}" t-out="country['country_id'][1]"/>
                                    </div>
                                    <span t-out="country['country_id_count']" class="badge pagination text-bg-primary ms-auto"/>
                                </a>
                            </t>
                            <t t-else="">
                                <t t-set="is_active" t-value="searches.get('country') == 'online'"/>
                                <a t-att-href="keep_event_url(country='online')" class="d-flex align-items-center justify-content-between text-reset text-decoration-none">
                                    <div class="form-check flex-basis-100">
                                        <input class="form-check-input pe-none" type="radio" name="Online Events" t-att-checked="is_active"/>
                                        <label class="form-check-label" for="Online Events">Online Events</label>
                                    </div>
                                    <span t-out="country['country_id_count']" class="badge pagination text-bg-primary ms-auto"/>
                                </a>
                            </t>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </xpath>
</data>

