let filterState = {};
$(document).ready(function () {
    const jenisMenuAwal = $("#tabJenisMenu .btn.active").data("filter") || 'makanan';
    filterState = {
        jenis_menu: jenisMenuAwal,
        search: '',
        per_page: 50,
    };

    fetchMenu(filterState);

    $('#tabJenisMenu .btn').on('click', function (e) {
        e.preventDefault();
        const jenis = $(this).data('filter');

        $('#tabJenisMenu .btn').removeClass('active');
        $(this).addClass('active');

        if (typeof datePicker !== 'undefined') {
            datePicker.clear();
        }
        $('#tanggalTerpilihLabel').addClass('d-none');
        $('#labelTanggalText').text('Menampilkan menu...');
        $('#resetTanggal').addClass('d-none');

        filterState.jenis_menu = jenis;
        fetchMenu(filterState);
    });

    $(".alert-link").on('click', function (e) {
        e.preventDefault();
        const konsultasiBtn = $('#tabJenisMenu .btn[data-filter="konsultasi"]');
        if (konsultasiBtn.length) {
            $('#tabJenisMenu .btn').removeClass('active');
            konsultasiBtn.addClass('active');
        }

        if (typeof datePicker !== 'undefined') {
            datePicker.clear();
        }

        filterState.jenis_menu = 'konsultasi';

        $('#tanggalTerpilihLabel').addClass('d-none');
        $('#labelTanggalText').text('Menampilkan menu...');
        $('#resetTanggal').addClass('d-none');

        fetchMenu(filterState);
    });

    let searchTimout;
    $('#searchMenu').on('input', function () {
        clearTimeout(searchTimout);
        const keyword = $(this).val();

        searchTimout = setTimeout(() => {
            filterState.search = keyword;
            fetchMenu(filterState);
        }, 300);
    });
});

function changePerPage(select) {
    const newPerPage = parseInt(select.value);
    filterState.per_page = newPerPage;
    fetchMenu(filterState);
}