<?xml version="1.0" encoding="UTF-8" ?>
<templates>
    <t t-name="fusion_accounting.AccountReportLine">
        <t t-call="{{ env.template('AccountReportLine') }}"/>
    </t>

    <t t-name="fusion_accounting.AccountReportLineCustomizable">
        <!-- Adds an empty row above line with level 0 to add some spacing (it is the easiest and cleanest way) -->
        <t t-if="props.line.level === 0">
            <tr class="empty">
                <td/>
                <t t-foreach="props.line.columns" t-as="cell" t-key="cell_index">
                    <td/>
                </t>
                <t t-if="controller.needsColumnPercentComparison">
                    <td/>
                </t>
                <t t-if="controller.hasDebugColumn">
                    <td/>
                </t>
            </tr>
        </t>

        <tr
            data-id="line"
            t-att-class="lineClasses"
        >
            <!-- Name column -->
            <t t-component="env.component('AccountReportLineName')" t-props="{ lineIndex: props.lineIndex, line: props.line }"/>

            <!-- Value columns -->
            <t t-foreach="props.line.columns" t-as="cell" t-key="cell_index">
                <!-- Condition for budget column only, should be changed in the future when we'll remove popover for editable cell -->
                <t t-if="cell.column_group_key?.includes('compute_budget')">
                    <AccountReportLineCellEditable t-props="{ line: props.line, cell: cell }"/>
                </t>
                <t t-else="">
                    <t t-component="env.component('AccountReportLineCell')" t-props="{ line: props.line, cell: cell }"/>
                </t>
            </t>

            <!-- Growth comparison column -->
            <t t-if="controller.needsColumnPercentComparison">
                <t t-if="controller.lineHasGrowthComparisonData(props.lineIndex)">
                    <td t-att-class="growthComparisonClasses">
                        <t t-out="props.line.column_percent_comparison_data.name"/>
                    </td>
                </t>
                <t t-else="">
                    <td/>
                </t>
            </t>

            <!-- Debug column -->
            <t t-if="controller.hasDebugColumn">
                <td class="text-center">
                    <t t-if="props.line.code">
                        <t t-out="props.line.code"/>
                    </t>

                    <t t-if="controller.lineHasDebugData(props.lineIndex)">
                        <button class="btn btn_debug" t-on-click="(ev) => this.showDebugPopover(ev)">
                            <i class="fa fa-info-circle"/>
                        </button>
                    </t>
                </td>
            </t>

            <t t-if="controller.options.show_horizontal_group_total">
                <td t-att-class="HorizontalGroupTotalClasses">
                    <t t-out="props.line.horizontal_group_total_data?.name"/>
                </td>
            </t>
        </tr>
    </t>
</templates>
