import { Course } from './view/Course.jsx'
import { Schedule } from './view/Schedule.jsx'
import { WorkWeek } from './view/WorkWeek.jsx'
import { WorkWeekGrid } from './view/WorkWeekGrid.jsx'
import { WorkWeekTranspose } from './view/WorkWeekTranspose.jsx'

export const MODE_COURSE = 'course'
export const MODE_WORKWEEK = 'work-week'
export const MODE_SCHEDULE = 'schedule'
export const MODE_WORKWEEK_GRID = 'work-week-grid'
export const MODE_WORKWEEK_TRANSPOSE = 'work-week-transpose'

const viewModeMap = {
    [MODE_COURSE]: Course,
    [MODE_WORKWEEK]: WorkWeek,
    [MODE_WORKWEEK_GRID]: WorkWeekGrid,
    [MODE_WORKWEEK_TRANSPOSE]: WorkWeekTranspose,
    [MODE_SCHEDULE]: Schedule,
}

export const EventsView = ({ mode, ...viewProps }) => {
    const Mode = viewModeMap[mode]

    return (
        <div class="events-view">
            <Mode {...viewProps} />
        </div>
    )
}
