import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core';
import { Datepicker } from '../datepicker';
import { DateAdapter } from '@isa-ui/core/date';
import { map } from 'rxjs/operators';

@Component({
  selector: 'app-ui-datepicker-header',
  templateUrl: 'header.component.html',
  styleUrls: ['header.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class UiDatepickerHeaderComponent<TDate> implements OnInit {
  monthName$ = this.datepicker.displayed$.pipe(map((date) => this.dateAdapter.getMonthName(date)));

  yearName$ = this.datepicker.displayed$.pipe(map((date) => this.dateAdapter.getYearName(date)));

  constructor(private datepicker: Datepicker<TDate>, private dateAdapter: DateAdapter<TDate>) {}

  ngOnInit() {}

  next() {
    this.datepicker.nextMonth();
  }

  previous() {
    this.datepicker.previousMonth();
  }
}
