const elements = {
    closeBtn: document.getElementById('closeSidebarBtn'),
    openBtn: document.getElementById('openSidebarBtn'),
    wrapper: document.getElementById('sidebarWrapper'),
    texts: document.querySelectorAll('.sidebar-text')
};

const SIDEBAR_STATE_KEY = 'sidebar';

const saveState = (state) => {
    try {
        localStorage.setItem(SIDEBAR_STATE_KEY, state);
    } catch (e) {
        console.error(e);
    }
};

export const setSidebarState = (state) => {
    const isClosed = state === 'closed';
    try {

        elements.wrapper.classList.toggle('w-64', !isClosed);
        elements.wrapper.classList.toggle('w-20', isClosed);

        elements.closeBtn.classList.toggle('hidden', isClosed);
        elements.openBtn.classList.toggle('hidden', !isClosed);

        elements.texts.forEach(el => el.classList.toggle('opacity-0', isClosed));

        saveState(state);
    } catch (e) {
        console.error(e);
    }
};
if (elements.closeBtn && elements.openBtn) {
    try {
        elements.closeBtn.addEventListener('click', () => setSidebarState('closed'));
        elements.openBtn.addEventListener('click', () => setSidebarState('opened'));
    } catch (e) {
        console.error(e)
    }
}