From 4f61496fff898996e92bd8928d83d5536382aa90 Mon Sep 17 00:00:00 2001
From: Arvind Muthuraman <arv457@gmail.com>
Date: Mon, 27 Jan 2020 16:26:03 +0530
Subject: [PATCH] fix(datepicker): update minDate and maxDate dynamically
 (#3507)

Propagate minDate and maxDate changes dynamically from the input datepicker to the datepicker

Fixes: #3506
---
 src/datepicker/datepicker-input.spec.ts | 58 +++++++++++++++++++++++++
 src/datepicker/datepicker-input.ts      | 10 +++++
 2 files changed, 68 insertions(+)

diff --git a/src/datepicker/datepicker-input.spec.ts b/src/datepicker/datepicker-input.spec.ts
index 0349dac15e..385959d49f 100644
--- a/src/datepicker/datepicker-input.spec.ts
+++ b/src/datepicker/datepicker-input.spec.ts
@@ -639,6 +639,62 @@ describe('NgbInputDatepicker', () => {
       expect(dp.maxDate).toEqual({year: 2016, month: 9, day: 13});
     });
 
+    it('should dynamically propagate the "minDate" option', () => {
+      const fixture = createTestCmpt(`<input ngbDatepicker [minDate]="minDate">`);
+      const dpInput = fixture.debugElement.query(By.directive(NgbInputDatepicker)).injector.get(NgbInputDatepicker);
+      fixture.componentRef.instance.minDate = {year: 2018, month: 12, day: 31};
+
+      dpInput.open();
+      fixture.detectChanges();
+
+      const dp = fixture.debugElement.query(By.css('ngb-datepicker')).injector.get(NgbDatepicker);
+      expect(dp.minDate).toEqual({year: 2018, month: 12, day: 31});
+
+      fixture.componentRef.instance.minDate = {year: 2019, month: 11, day: 14};
+      fixture.detectChanges();
+      expect(dp.minDate).toEqual({year: 2019, month: 11, day: 14});
+
+    });
+
+    it('should dynamically propagate the "maxDate" option', () => {
+      const fixture = createTestCmpt(`<input ngbDatepicker [maxDate]="maxDate">`);
+      const dpInput = fixture.debugElement.query(By.directive(NgbInputDatepicker)).injector.get(NgbInputDatepicker);
+      fixture.componentRef.instance.maxDate = {year: 2019, month: 12, day: 31};
+
+      dpInput.open();
+      fixture.detectChanges();
+
+      const dp = fixture.debugElement.query(By.css('ngb-datepicker')).injector.get(NgbDatepicker);
+      expect(dp.maxDate).toEqual({year: 2019, month: 12, day: 31});
+
+      fixture.componentRef.instance.maxDate = {year: 2019, month: 12, day: 14};
+      fixture.detectChanges();
+      expect(dp.maxDate).toEqual({year: 2019, month: 12, day: 14});
+
+    });
+
+    it('should dynamically propagate the "maxDate" and "minDate" option', () => {
+      const fixture = createTestCmpt(`<input ngbDatepicker [minDate]="minDate" [maxDate]="maxDate">`);
+      const dpInput = fixture.debugElement.query(By.directive(NgbInputDatepicker)).injector.get(NgbInputDatepicker);
+      fixture.componentRef.instance.minDate = {year: 2019, month: 11, day: 14};
+      fixture.componentRef.instance.maxDate = {year: 2019, month: 12, day: 31};
+
+      dpInput.open();
+      fixture.detectChanges();
+
+      const dp = fixture.debugElement.query(By.css('ngb-datepicker')).injector.get(NgbDatepicker);
+      expect(dp.minDate).toEqual({year: 2019, month: 11, day: 14});
+      expect(dp.maxDate).toEqual({year: 2019, month: 12, day: 31});
+
+      fixture.componentRef.instance.minDate = {year: 2019, month: 10, day: 14};
+      fixture.componentRef.instance.maxDate = {year: 2019, month: 12, day: 14};
+      fixture.detectChanges();
+
+      expect(dp.minDate).toEqual({year: 2019, month: 10, day: 14});
+      expect(dp.maxDate).toEqual({year: 2019, month: 12, day: 14});
+
+    });
+
     it('should propagate the "outsideDays" option', () => {
       const fixture = createTestCmpt(`<input ngbDatepicker outsideDays="collapsed">`);
       const dpInput = fixture.debugElement.query(By.directive(NgbInputDatepicker)).injector.get(NgbInputDatepicker);
@@ -1079,6 +1135,8 @@ class TestNativeComponent {
 class TestComponent {
   container;
   date: NgbDateStruct;
+  minDate: NgbDateStruct;
+  maxDate: NgbDateStruct;
   isDisabled;
 
   onNavigate() {}
diff --git a/src/datepicker/datepicker-input.ts b/src/datepicker/datepicker-input.ts
index ca625b8236..108d77ebed 100644
--- a/src/datepicker/datepicker-input.ts
+++ b/src/datepicker/datepicker-input.ts
@@ -432,6 +432,16 @@ export class NgbInputDatepicker implements OnChanges,
   ngOnChanges(changes: SimpleChanges) {
     if (changes['minDate'] || changes['maxDate']) {
       this._validatorChange();
+
+      if (this.isOpen()) {
+        if (changes['minDate']) {
+          this._cRef.instance.minDate = this._dateAdapter.toModel(changes.minDate.currentValue);
+        }
+        if (changes['maxDate']) {
+          this._cRef.instance.maxDate = this._dateAdapter.toModel(changes.maxDate.currentValue);
+        }
+        this._cRef.instance.ngOnChanges(changes);
+      }
     }
   }