import { ComboBox } from './ComboBox.jsx'
import { MODE_COURSE, MODE_SCHEDULE, MODE_WORKWEEK, MODE_WORKWEEK_GRID } from './EventsView.jsx'
import { Help } from './Help.jsx'
import { Icon } from './Icon.jsx'

export const HamburgerMenu = ({ onClose, mode, setMode, source, setSource, theme, setTheme }) => {
    return (
        <div class="menu">
            <div class="header">
                <div class="option-group">
                    <button class="flat icon" onClick={onClose}>
                        <Icon name="close" />
                    </button>
                    <button
                        class="icon"
                        onClick={() => setTheme(theme === 'dark' ? 'light' : 'dark')}
                    >
                        <Icon name={theme === 'dark' ? 'dark_mode' : 'light_mode'} />
                    </button>
                </div>
                <div class="item logo">
                    <img src="logo-circuit-board.svg" alt="logo" /> / <span>Orario</span>
                </div>
            </div>
            <div class="help">
                <h2>
                    <Icon name="info" />
                    Guida
                </h2>
                <Help />
            </div>
        </div>
    )
}
