import { Controller } from "@hotwired/stimulus"

export default class extends Controller {
    static targets = ['active', 'tab', 'content'];

    activate(event) {
        this.deactivate();
        const activeId = event.currentTarget.id;

        event.currentTarget.classList.add('is-active');
        this.contentTargets.find(c => c.id === activeId.replace('for-', ''))
            .classList.remove('is-hidden');
    }

    reset() {
        this.deactivate();
        const activeId = this.activeTarget.id;

        this.activeTarget.classList.add('is-active');
        this.contentTargets.find(c => c.id === activeId.replace('for-', ''))
            .classList.remove('is-hidden');
    }

    deactivate() {
        this.tabTargets.forEach(tab => {
            tab.classList.remove('is-active');
        });

        this.contentTargets.forEach(content => {
            content.classList.add('is-hidden');
        });
    }
}