import { Controller } from '@hotwired/stimulus'

// Static, client-only interactivity for the checkout page's address form — no
// fetch, no cart mutation, just show/hide. Nothing here talks to the server;
// CheckoutController::saveAddress() is what actually persists anything.
export default class extends Controller {
    static targets = [
        'guestTab', 'loginTab', 'guestPanel', 'loginPanel',
        'sameAsBilling', 'shippingFields',
    ]

    connect() {
        // Reflect whatever the server rendered (old input on a validation
        // redisplay, or the default) before any click happens.
        if (this.hasSameAsBillingTarget) this.syncShippingFields()
    }

    showGuest() {
        this.guestPanelTarget.hidden = false
        this.loginPanelTarget.hidden = true
        this.guestTabTarget.setAttribute('aria-selected', 'true')
        this.loginTabTarget.setAttribute('aria-selected', 'false')
    }

    showLogin() {
        this.guestPanelTarget.hidden = true
        this.loginPanelTarget.hidden = false
        this.guestTabTarget.setAttribute('aria-selected', 'false')
        this.loginTabTarget.setAttribute('aria-selected', 'true')
    }

    toggleSameAsBilling() {
        this.syncShippingFields()
    }

    // Disabled fields are simply never submitted by the browser — the server
    // never sees stale shipping values while "same as billing" is checked.
    syncShippingFields() {
        const sameAsBilling = this.sameAsBillingTarget.checked

        this.shippingFieldsTarget.hidden = sameAsBilling
        this.shippingFieldsTarget.querySelectorAll('input, select, textarea').forEach((field) => {
            field.disabled = sameAsBilling
        })
    }
}