Remove unused old datepicker code

frontend/src/app/core/setup/globals/global-listeners.ts

@@ -37,7 +37,6 @@ import { dangerZoneValidation } from 'core-app/core/setup/globals/global-listene
 import { setupServerResponse } from 'core-app/core/setup/globals/global-listeners/setup-server-response';
 import { listenToSettingChanges } from 'core-app/core/setup/globals/global-listeners/settings';
 import { detectOnboardingTour } from 'core-app/core/setup/globals/onboarding/onboarding_tour_trigger';
-import { augmentedDatePicker } from './global-listeners/augmented-date-picker';
 import { performAnchorHijacking } from './global-listeners/link-hijacking';
 
 /**
@@ -48,9 +47,6 @@ export function initializeGlobalListeners():void {
     .on('click', (evt:any) => {
       const target = jQuery(evt.target) as JQuery;
 
-      // Create datepickers dynamically for Rails-based views
-      augmentedDatePicker(evt, target);
-
       // Prevent angular handling clicks on href="#..." links from other libraries
       // (especially jquery-ui and its datepicker) from routing to <base url>/#
       performAnchorHijacking(evt, target);

frontend/src/app/core/setup/globals/global-listeners/augmented-date-picker.ts

@@ -1,31 +0,0 @@
-import { DatePicker } from 'core-app/shared/components/datepicker/datepicker';
-
-/**
- * Our application is still a hybrid one, meaning most routes are still
- * handled by Rails. As such, we disable the default link-hijacking that
- * Angular's HTML5-mode with <base href="/"> results in
- * @param evt
- * @param target
- */
-export function augmentedDatePicker(evt:JQuery.TriggeredEvent, target:JQuery) {
-  if (target.hasClass('-augmented-datepicker')) {
-    target
-      .attr('autocomplete', 'off'); // Disable autocomplete for those fields
-
-    window.OpenProject.getPluginContext()
-      .then((context) => {
-        const datePicker = new DatePicker(
-          context.injector,
-          '.-augmented-datepicker',
-          target.val() as string,
-          {
-            weekNumbers: true,
-            allowInput: true,
-          },
-          target[0],
-        );
-        datePicker.show();
-      })
-      .catch(() => {});
-  }
-}

frontend/src/app/shared/components/datepicker/datepicker.ts

@@ -40,12 +40,8 @@ import DateOption = flatpickr.Options.DateOption;
 export class DatePicker {
   private datepickerFormat = 'Y-m-d';
 
-  private datepickerCont:HTMLElement = document.querySelector(this.datepickerElemIdentifier) as HTMLElement;
-
   public datepickerInstance:Instance;
 
-  private reshowTimeout:ReturnType<typeof setTimeout>;
-
   @InjectField() configurationService:ConfigurationService;
 
   @InjectField() weekdaysService:WeekdayService;
@@ -85,8 +81,6 @@ export class DatePicker {
     }
 
     this.datepickerInstance = Array.isArray(datePickerInstances) ? datePickerInstances[0] : datePickerInstances;
-
-    document.addEventListener('scroll', this.hideDuringScroll, true);
   }
 
   public clear():void {
@@ -102,13 +96,10 @@ export class DatePicker {
     if (this.isOpen) {
       this.datepickerInstance.close();
     }
-
-    document.removeEventListener('scroll', this.hideDuringScroll, true);
   }
 
   public show():void {
     this.datepickerInstance.open();
-    document.addEventListener('scroll', this.hideDuringScroll, true);
   }
 
   public setDates(dates:DateOption|DateOption[]):void {
@@ -119,50 +110,6 @@ export class DatePicker {
     return this.datepickerInstance.isOpen;
   }
 
-  private hideDuringScroll = (event:Event) => {
-    // Prevent Firefox quirk: flatPicker emits
-    // multiple scrolls event when it is open
-    const target = event.target as HTMLInputElement;
-
-    if (target?.classList?.contains('flatpickr-monthDropdown-months') || target?.classList?.contains('flatpickr-input')) {
-      return;
-    }
-
-    this.datepickerInstance.close();
-
-    if (this.reshowTimeout) {
-      clearTimeout(this.reshowTimeout);
-    }
-
-    this.reshowTimeout = setTimeout(() => {
-      if (this.visibleAndActive()) {
-        this.datepickerInstance.open();
-      }
-    }, 50);
-  };
-
-  private visibleAndActive() {
-    try {
-      return this.isInViewport(this.datepickerCont)
-        && document.activeElement === this.datepickerCont;
-    } catch (e) {
-      // eslint-disable-next-line @typescript-eslint/restrict-template-expressions
-      console.error(`Failed to test visibleAndActive ${e}`);
-      return false;
-    }
-  }
-
-  private isInViewport(element:HTMLElement):boolean {
-    const rect = element.getBoundingClientRect();
-
-    return (
-      rect.top >= 0
-      && rect.left >= 0
-      && rect.bottom <= (window.innerHeight || document.documentElement.clientHeight)
-      && rect.right <= (window.innerWidth || document.documentElement.clientWidth)
-    );
-  }
-
   private get defaultOptions() {
     const firstDayOfWeek = this.configurationService.startOfWeek();
 

frontend/src/app/shared/components/datepicker/multi-date-picker/multi-date-picker.component.ts

@@ -55,7 +55,7 @@ import { TimezoneService } from 'core-app/core/datetime/timezone.service';
 import { DatePicker } from '../datepicker';
 import flatpickr from 'flatpickr';
 import { DayElement } from 'flatpickr/dist/types/instance';
-import { ActiveDateChange, DateFields, DateKeys, FieldUpdates } from '../wp-multi-date-form/wp-multi-date-form.component';
+import { ActiveDateChange, DateFields, DateKeys } from '../wp-multi-date-form/wp-multi-date-form.component';
 import { fromEvent, merge, Observable, Subject } from 'rxjs';
 import { UntilDestroyedMixin } from 'core-app/shared/helpers/angular/until-destroyed.mixin';
 import { debounceTime, filter, map } from 'rxjs/operators';