feat(month-view): call beforeViewRender with the view period

Closes #418

Author: Matt Lewis

src/modules/month/calendar-month-view.component.ts

@@ -15,7 +15,8 @@ import {
   CalendarEvent,
   WeekDay,
   MonthView,
-  MonthViewDay
+  MonthViewDay,
+  ViewPeriod
 } from 'calendar-utils';
 import { Subject } from 'rxjs/Subject';
 import { Subscription } from 'rxjs/Subscription';
@@ -32,6 +33,12 @@ import { CalendarEventTimesChangedEvent } from '../common/calendar-event-times-c
 import { CalendarUtils } from '../common/calendar-utils.provider';
 import { validateEvents } from '../common/util';
 
+export interface MonthViewBeforeRenderEvent {
+  header: WeekDay[];
+  body: MonthViewDay[];
+  period: ViewPeriod;
+}
+
 /**
  * Shows all events on a given month. Example usage:
  *
@@ -170,10 +177,9 @@ export class CalendarMonthViewComponent
    * If you add the `cssClass` property to a day in the body it will add that class to the cell element in the template
    */
   @Output()
-  beforeViewRender: EventEmitter<{
-    header: WeekDay[];
-    body: MonthViewDay[];
-  }> = new EventEmitter();
+  beforeViewRender: EventEmitter<
+    MonthViewBeforeRenderEvent
+  > = new EventEmitter();
 
   /**
    * Called when the day cell is clicked
@@ -377,7 +383,8 @@ export class CalendarMonthViewComponent
     if (this.columnHeaders && this.view) {
       this.beforeViewRender.emit({
         header: this.columnHeaders,
-        body: this.view.days
+        body: this.view.days,
+        period: this.view.period
       });
     }
   }

src/modules/month/calendar-month.module.ts

@@ -7,7 +7,10 @@ import { CalendarMonthCellComponent } from './calendar-month-cell.component';
 import { CalendarOpenDayEventsComponent } from './calendar-open-day-events.component';
 import { CalendarCommonModule } from '../common/calendar-common.module';
 
-export { CalendarMonthViewComponent } from './calendar-month-view.component';
+export {
+  CalendarMonthViewComponent,
+  MonthViewBeforeRenderEvent
+} from './calendar-month-view.component';
 export { MonthViewDay as CalendarMonthViewDay } from 'calendar-utils';
 
 @NgModule({

test/calendar-month-view.component.spec.ts

@@ -24,6 +24,7 @@ import {
 } from './../src';
 import { Subject } from 'rxjs/Subject';
 import { triggerDomEvent } from './util';
+import { take } from 'rxjs/operators';
 
 describe('calendarMonthView component', () => {
   beforeEach(() => {
@@ -733,12 +734,14 @@ describe('calendarMonthView component', () => {
     fixture.componentInstance.viewDate = new Date('2016-06-27');
     fixture.componentInstance.ngOnChanges({ viewDate: {} });
     const beforeViewRenderCalled = sinon.spy();
-    const subscription = fixture.componentInstance.beforeViewRender.subscribe(
-      beforeViewRenderCalled
-    );
+    fixture.componentInstance.beforeViewRender
+      .pipe(take(1))
+      .subscribe(beforeViewRenderCalled);
     fixture.componentInstance.refresh.next(true);
     expect(beforeViewRenderCalled).to.have.callCount(1);
-    subscription.unsubscribe();
+    expect(typeof beforeViewRenderCalled.getCall(0).args[0].period).to.equal(
+      'object'
+    );
     fixture.destroy();
   });