       </CourseDuration>
 
     <BS.Grid className={calendarClassName} fluid>
-      <CourseAdd
-        hasPeriods={hasPeriods}
-        ref='addOnDay'/>
+
+      <CourseAdd ref='addOnDay' hasPeriods={hasPeriods} />
+
       <CourseCalendarHeader
         duration='month'
         date={date}
         courseId={@props.courseId}
         setDate={@setDate}
         hasPeriods={hasPeriods}
-        ref='calendarHeader'/>
+        ref='calendarHeader'
+      />
 
       <BS.Row className='calendar-body'>
         <BS.Col xs={12} data-duration-name={@getFullMonthName()}>
 
-          <Month date={date} monthNames={false} weekdayFormat='ddd'>
-            {days}
-          </Month>
+          <Month date={date} monthNames={false} weekdayFormat='ddd' mods={[{
+            component: [ 'day' ],
+            events:
+              onClick: @handleClick
+          }]} />
 
           {plans}
 

    calendarWeeks = calendarDuration.split(1, 'week')
    {calendarDuration, calendarWeeks}

  handleClick: (componentName, dayMoment, mouseEvent) ->
    @refs.addOnDay.updateState(dayMoment, mouseEvent.pageX, mouseEvent.pageY)
    @setState({
      activeAddDate: dayMoment

  getFullMonthName: ->
    @props.date?.format?('MMMM')

  onTaskDrop: (planId, ev) ->
    plan = TeacherTaskPlanStore.get(planId)
    day = ev.target.textContent


  render: ->
    {plansList, courseId, className, date, hasPeriods} = @props
    {calendarDuration, calendarWeeks} = @getDurationInfo(date)

    calendarClassName = classnames 'calendar-container', className

