document.addEventListener("DOMContentLoaded", function(e) {
	console.log('working');
    // Tabs functionality for settings pages
    let tabs = document.querySelectorAll('.jvb-settings-tab');

    tabs.forEach(tab => {
        tab.addEventListener('click', (e) => {
            removeActiveTab(tabs);
            tab.classList.add('active');
            setActiveSection(tab);
        });
    });

    // Check for hash in URL and activate corresponding tab
    if (window.location.hash) {
        var hash = window.location.hash.substring(1);
        document.querySelector('.jvb-settings-tab[data-tab="' + hash + '"]')?.click();
    } else {
        // Activate first tab by default
        document.querySelector('.jvb-settings-tab')?.click();
    }

    let confirm = document.querySelector('.jvb-confirm-action');
    if (confirm) {
        confirm.addEventListener('click', (e) => {
            if (!window.confirm(confirm.dataset.confirm || 'Are you sure?')) {
                e.preventDefault();
                return false;
            }
        });
    }

    // Admin action buttons
    document.querySelectorAll('a[data-action]').forEach(action => {
        action.addEventListener('click', (e) => {
            e.preventDefault();
            let loader = action.querySelector('.loader');
            loader.classList.add('loading');

            let a = action.dataset.action;

            fetch(jvbSettings.api, {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                    'X-WP-Nonce': jvbSettings.nonce,
                    'action_nonce': jvbSettings.action
                },
                body: JSON.stringify({
                    action: a
                })
            })
                .then(response => {
                    if (!response.ok) {
                        throw new Error('Network response was not ok');
                    }
                    return response.json();
                })
                .then(data => {
                    if (data.success === true) {
                        loader.classList.remove('loading');
                        loader.classList.add('loaded');
                        setTimeout(() => {
                            loader.classList.remove('loaded');
                        }, 3000);
                    } else {
                        throw new Error(data.message || 'Action failed');
                    }
                })
                .catch(error => {
                    console.error('Error:', error);
                    loader.classList.remove('loading');
                    // You might want to add an error state class here
                });
        });
    });
});

function removeActiveTab(tabs) {
    let active = document.querySelectorAll('.active');
    active.forEach(tab => {
        tab.classList.remove('active');
        if (tab.dataset.tab) {
            setActiveSection(tab, false);
            window.location.hash = tab.dataset.tab;
        }
    });
}

function setActiveSection(tab, set = true) {
    let id = tab.dataset.tab;
    if (!id) return;

    let section = document.querySelector('#' + id);
    if (!section) return;

    if (set) {
        section.classList.add('active');
    } else {
        section.classList.remove('active');
    }
}