Calendar for displaying shifts

This is the calendar used by InstantJob for displaying information about shifts.

Installation

npm install --save instantjob-calendar

Example

import React from 'react'
import Calendar from 'instantjob-calendar'

export default ({missions}) => (
  <Calendar
    missions={missions}
    get_mission_elements={({title, color, icon, informations, onClick}) => {
      return {title, color, icon, informations, onClick}
    }}
  />
)

Props API

missions

missions is a list of objects with an events key, itself a list of objects with a start and end keys (datetime values that moment understands)

missions = [{
  events: [{
    start: "2017-11-27T11:00:00.000+01:00",
    end: "2017-11-27T15:00:00.000+01:00",
  }],
}]

render_shift

render_shift is a function that takes as parameter the mission object from the missions props and an event for which the mission needs to be rendered and returns a rendered react element.

render_shift = (mission, {start, end}) => (
  <Shift
    {...mission}
    start={start}
    end={end}
  />
)

className, style

Style your component the way you want.

License

MIT