Calendar.jsx 1.12 KB
Newer Older
1 2
import React from 'react';
import BigCalendar from 'react-big-calendar';
Zac Wood's avatar
Zac Wood committed
3
import Toolbar from 'src/Toolbar';
4 5
import moment from 'moment';
import '!style-loader!css-loader!react-big-calendar/lib/css/react-big-calendar.css';
Zac Wood's avatar
Zac Wood committed
6
import withSizes from 'react-sizes';
7 8 9 10

const localizer = BigCalendar.momentLocalizer(moment);

const Calendar = props => (
Zac Wood's avatar
Zac Wood committed
11
    <div className="full-width" style={{ backgroundColor: 'white', padding: '24px' }}>
12 13 14 15
        <BigCalendar
            localizer={localizer}
            events={props.events}
            title=""
Zac Wood's avatar
Zac Wood committed
16
            components={{ toolbar: Toolbar }}
17 18 19 20 21 22 23
            defaultView="week"
            views={['week', 'day']}
            startAccessor="start"
            endAccessor="end"
            defaultDate={moment('2019-01-14').toDate()}
            formats={{
                dayFormat: (date, culture, localizer) => localizer.format(date, 'ddd', culture),
Zac Wood's avatar
Zac Wood committed
24
                dayHeaderFormat: (date, culture, localizer) => localizer.format(date, 'ddd', culture),
25 26 27 28 29 30 31 32
                dayRangeHeaderFormat: () => '',
            }}
            style={{ height: '75vh' }}
        />
    </div>
);

export default Calendar;