/** @odoo-module
 *
 * LaundrySettleBanner — prominent visual indicator that POS is currently
 * locked into settle-due mode. Provides the explicit "Exit" affordance
 * and toggles a document.body class so global CSS can dim/disable
 * irrelevant POS chrome (non-active order tabs, "+" button) for the
 * duration of settle mode.
 *
 * Reactive source: order.uiState.is_laundry_settle_due (seeded in
 * pos_order_patch.js initState so OWL tracks future writes).
 */
import { Component, useEffect } from "@odoo/owl";
import { usePos } from "@point_of_sale/app/hooks/pos_hook";

const BODY_CLASS = "pos-laundry-settle-active";

export class LaundrySettleBanner extends Component {
    static template = "laundry_management.LaundrySettleBanner";
    static props = {};

    setup() {
        this.pos = usePos();
        useEffect(
            (active) => {
                if (active) {
                    document.body.classList.add(BODY_CLASS);
                    return () => document.body.classList.remove(BODY_CLASS);
                }
                document.body.classList.remove(BODY_CLASS);
                return () => {};
            },
            () => [this.isActive]
        );
    }

    get order() {
        return this.pos.getOrder();
    }

    get isActive() {
        return this.pos.isSettleDueOrder(this.order);
    }

    get partnerName() {
        return this.order?.getPartner()?.name || "";
    }

    get amountLabel() {
        const order = this.order;
        if (!order) return "";
        const total = order.priceIncl ?? 0;
        return this.pos.env.utils.formatCurrency(total);
    }

    onClickExit() {
        this.pos.exitSettleDueMode();
    }
}