<?xml version="1.0" encoding="UTF-8"?>
<templates xml:space="preserve">

    <t t-name="web.KanbanRenderer">
        <div class="o_kanban_renderer o_renderer d-flex user-select-none"
            t-attf-class="{{ props.list.isGrouped ? 'o_kanban_grouped align-content-stretch' : 'o_kanban_ungrouped align-content-start flex-wrap justify-content-start' }}"
            t-ref="root"
        >
            <t t-foreach="getGroupsOrRecords()" t-as="groupOrRecord" t-key="groupOrRecord.key">
                <t t-if="groupOrRecord.group">
                    <t t-set="group" t-value="groupOrRecord.group" />
                    <t t-set="isGroupProcessing" t-value="isProcessing(group.id)" />
                    <div class="o_kanban_group"
                        t-att-class="getGroupClasses(group, isGroupProcessing)"
                        t-attf-class="{{ !env.isSmall and group.isFolded ? 'opacity-trigger-hover' : '' }}"
                        t-att-data-id="group.id"
                        t-on-click="(ev) => this.onGroupClick(group, ev)"
                    >
                        <KanbanHeader
                            activeActions="props.archInfo.activeActions"
                            canQuickCreate="props.canQuickCreate"
                            deleteGroup="(group) => this.deleteGroup(group)"
                            dialogClose="dialogClose"
                            group="group"
                            list="props.list"
                            quickCreateState="props.quickCreateState"
                            scrollTop="props.scrollTop"
                            tooltipInfo="props.archInfo.tooltipInfo"
                            progressBarState="props.progressBarState"
                        />
                        <t t-if="!group.isFolded">
                            <t t-if="group.id === props.quickCreateState.groupId">
                                <KanbanRecordQuickCreate
                                    group="group"
                                    onCancel="force => this.cancelQuickCreate(force)"
                                    onValidate="(record, mode) => this.validateQuickCreate(record, mode, group)"
                                    quickCreateView="props.quickCreateState.view"
                                />
                            </t>
                            <t t-foreach="group.list.records" t-as="record" t-key="record.id">
                                <KanbanRecord
                                    archInfo="props.archInfo"
                                    Compiler="props.Compiler"
                                    canResequence="!isGroupProcessing and !isProcessing(record.id) and canResequenceRecords"
                                    forceGlobalClick="props.forceGlobalClick"
                                    group="group"
                                    groupByField="props.list.groupByField"
                                    getSelection.bind="getSelection"
                                    toggleSelection.bind="toggleSelection"
                                    deleteRecord="props.deleteRecord"
                                    archiveRecord.bind="archiveRecord"
                                    openRecord="props.openRecord"
                                    readonly="props.readonly"
                                    record="record"
                                    progressBarState="props.progressBarState"
                                    selectionAvailable="state.selectionAvailable"
                                />
                            </t>
                            <t t-set="unloadedCount" t-value="getGroupUnloadedCount(group)" />
                            <div t-if="unloadedCount > 0" class="o_kanban_load_more" t-key="unloadedCount">
                                <button class="btn btn-outline-primary w-100 mt-4" t-on-click="() => this.loadMore(group)">Load more... (<t t-out="unloadedCount"/> remaining)</button>
                            </div>
                        </t>
                        <t t-elif="env.isSmall">
                            <t t-set="unloadedCount" t-value="getGroupUnloadedCount(group)" />
                            <div t-if="unloadedCount > 0" class="o_kanban_load_more">
                                <button class="btn btn-outline-primary w-100 mt-4" t-on-click="() => this.toggleGroup(group)">Load more... (<t t-out="unloadedCount"/> remaining)</button>
                            </div>
                        </t>
                    </div>
                </t>
                <t t-else="">
                    <KanbanRecord
                        archInfo="props.archInfo"
                        Compiler="props.Compiler"
                        canResequence="!isProcessing(groupOrRecord.record.id) and canResequenceRecords"
                        forceGlobalClick="props.forceGlobalClick"
                        groupByField="props.list.groupByField"
                        getSelection.bind="getSelection"
                        toggleSelection.bind="toggleSelection"
                        deleteRecord="props.deleteRecord"
                        archiveRecord="(record, active) => this.archiveRecord(record, active)"
                        openRecord="props.openRecord"
                        readonly="props.readonly"
                        record="groupOrRecord.record"
                        selectionAvailable="state.selectionAvailable"
                    />
                </t>
            </t>
            <t t-if="props.list.isGrouped">
                <t t-if="canCreateGroup()">
                    <KanbanColumnQuickCreate
                        folded="state.columnQuickCreateIsFolded"
                        onFoldChange="folded => state.columnQuickCreateIsFolded = folded"
                        onValidate="props.list.createGroup.bind(props.list)"
                        groupByField="props.list.groupByField"
                    />
                    <div t-if="props.list.groups.length === 0" class="o_view_nocontent o_kanban_stages_nocontent">
                        <div class="o_nocontent_help">
                            <p class="o_view_nocontent_smiling_face">
                                No stages yet, let's create some!
                            </p>
                            <p t-if="canShowExamples">
                                Lack of inspiration? <button type="button" class="btn btn-link o_kanban_examples p-0" t-on-click="showExamples">See examples</button>
                            </p>
                        </div>
                    </div>
                </t>
            </t>
            <t t-else="">
                <div t-if="props.addLabel" class="o_kanban_record o-kanban-button-new btn btn-link d-print-none py-4" accesskey="shift+c" t-on-click.stop.prevent="() => props.onAdd()">
                    <t t-out="props.addLabel" />
                </div>
                <!-- kanban ghost cards are used to properly space last elements. -->
                <div t-foreach="[,,,,,,]" t-as="i" t-key="i_index" class="o_kanban_record o_kanban_ghost flex-grow-1 flex-md-shrink-1 flex-shrink-0 my-0" />
            </t>
	    <t t-if="showNoContentHelper">
			<ActionHelper noContentHelp="props.noContentHelp" showRibbon="props.list.model.useSampleModel"/>
	    </t>
        </div>
    </t>

    <t t-name="web.KanbanDropdownMenuWrapper">
        <div t-on-click="onClick" style="display:contents" t-ref="rootRef">
            <t t-slot="default"/>
        </div>
    </t>

</templates>
