fix: time interval simple input sync

Sync was broken in 587679a Fixes #377
spraakbanken · Jul 11, 2024 · c73c6cb · c73c6cb
1 parent 4b0137f
commit c73c6cb
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 10 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -26,6 +26,7 @@
 ### Fixed
 
 - News were sometimes not shown immediately after fetch
+- In Extended search, the time interval component was ignoring the simple input fields [#377](https://github.com/spraakbanken/korp-frontend/issues/377)
 
 ## [9.6.0] - 2024-05-27
 

diff --git a/app/scripts/components/datetime-picker.ts b/app/scripts/components/datetime-picker.ts
@@ -1,5 +1,5 @@
 /** @format */
-import angular, { type IComponentController, type IScope } from "angular"
+import angular, { type ui, type IComponentController, type IScope } from "angular"
 import { html } from "@/util"
 import moment, { type Moment } from "moment"
 
@@ -20,7 +20,7 @@ angular.module("korpApp").component("datetimePicker", {
                         uib-datepicker
                         class="well well-sm"
                         ng-model="date"
-                        datepicker-options="$ctrl.datepickerOptions"
+                        datepicker-options="datepickerOptions"
                     ></div>
 
                     <div class="flex items-center justify-center">
@@ -51,17 +51,18 @@ angular.module("korpApp").component("datetimePicker", {
         function ($scope: DatetimePickerScope) {
             const $ctrl = this as DatetimePickerController
 
-            $ctrl.$onInit = () => {
+            $scope.datepickerOptions = { startingDay: 1 }
+
+            $ctrl.$onChanges = (changes) => {
                 // Sync incoming values to internal model
-                $scope.date = $ctrl.dateModel
-                $scope.time = $ctrl.timeModel
+                if (changes.dateModel) $scope.date = changes.dateModel.currentValue
+                if (changes.timeModel) $scope.time = changes.timeModel.currentValue
 
-                $ctrl.datepickerOptions = {
-                    minDate: $ctrl.minDate,
-                    maxDate: $ctrl.maxDate,
-                    initDate: $ctrl.minDate,
-                    startingDay: 1,
+                if (changes.minDate) {
+                    $scope.datepickerOptions.minDate = changes.minDate.currentValue
+                    $scope.datepickerOptions.initDate = changes.minDate.currentValue
                 }
+                if (changes.maxDate) $scope.datepickerOptions.maxDate = changes.maxDate.currentValue
             }
 
             // Report changes from datepicker/timepicker upwards
@@ -100,5 +101,6 @@ type DatetimePickerScope = IScope & {
     date: Date
     time: Date
     combined: Moment
+    datepickerOptions: ui.bootstrap.IDatepickerConfig
     handleClick: (event: JQuery.ClickEvent) => void
 }