refactor data accessor (#29518)

Co-authored-by: Vladimir Bushmanov <[email protected]>

Author: Ambrozy

packages/devextreme/js/__internal/scheduler/__mock__/appointment_data_accessor.mock.ts

@@ -0,0 +1,17 @@
+import { AppointmentDataAccessor, type IFieldExpr } from '../utils';
+
+export const mockFieldExpressions: IFieldExpr = {
+  startDateExpr: 'startDate',
+  endDateExpr: 'endDate',
+  startDateTimeZoneExpr: 'startDateTimeZone',
+  endDateTimeZoneExpr: 'endDateTimeZone',
+  allDayExpr: 'allDay',
+  textExpr: 'text',
+  descriptionExpr: 'description',
+  recurrenceRuleExpr: 'recurrenceRule',
+  recurrenceExceptionExpr: 'recurrenceException',
+  disabledExpr: 'disabled',
+  visibleExpr: 'visible',
+};
+
+export const mockAppointmentDataAccessor = new AppointmentDataAccessor(mockFieldExpressions, true);

packages/devextreme/js/__internal/scheduler/appointment_popup/m_form.ts

@@ -14,7 +14,6 @@ import DataSource from '@js/data/data_source';
 import messageLocalization from '@js/localization/message';
 import Form from '@js/ui/form';
 import { current, isFluent } from '@js/ui/themes';
-import { ExpressionUtils } from '@ts/scheduler/m_expression_utils';
 
 import { createAppointmentAdapter } from '../m_appointment_adapter';
 import type { TimezoneLabel } from '../m_utils_time_zone';
@@ -102,7 +101,7 @@ export class AppointmentForm {
     const dataAccessors = this.scheduler.getDataAccessors();
     const { expr } = dataAccessors;
 
-    const isRecurrence = !!ExpressionUtils.getField(dataAccessors, 'recurrenceRule', formData);
+    const isRecurrence = Boolean(dataAccessors.get('recurrenceRule', formData));
     const colSpan = isRecurrence ? 1 : 2;
 
     const mainItems = [
@@ -490,12 +489,12 @@ export class AppointmentForm {
     const dataAccessors = this.scheduler.getDataAccessors();
     const { expr } = dataAccessors;
 
-    const rawStartDate = ExpressionUtils.getField(dataAccessors, 'startDate', formData);
-    const rawEndDate = ExpressionUtils.getField(dataAccessors, 'endDate', formData);
-    const startDateTimezone = ExpressionUtils.getField(dataAccessors, 'startDateTimeZone', formData) ?? null;
-    const endDateTimezone = ExpressionUtils.getField(dataAccessors, 'endDateTimeZone', formData) ?? null;
+    const rawStartDate = dataAccessors.get('startDate', formData);
+    const rawEndDate = dataAccessors.get('endDate', formData);
+    const startDateTimezone = dataAccessors.get('startDateTimeZone', formData) ?? null;
+    const endDateTimezone = dataAccessors.get('endDateTimeZone', formData) ?? null;
 
-    const allDay = ExpressionUtils.getField(dataAccessors, 'allDay', formData);
+    const allDay = dataAccessors.get('allDay', formData);
     const startDate = new Date(rawStartDate);
     const endDate = new Date(rawEndDate);
 

packages/devextreme/js/__internal/scheduler/appointment_popup/m_popup.ts

@@ -4,7 +4,6 @@ import dateUtils from '@js/core/utils/date';
 import { Deferred, when } from '@js/core/utils/deferred';
 import { triggerResizeEvent } from '@js/events/visibility_change';
 import Popup from '@js/ui/popup/ui.popup';
-import { ExpressionUtils } from '@ts/scheduler/m_expression_utils';
 import {
   getMaxWidth,
   getPopupToolbarItems,
@@ -226,7 +225,7 @@ export class AppointmentPopup {
     if (this.form.dxForm && this.visible) { // TODO
       const { formData } = this.form;
       const dataAccessors = this.scheduler.getDataAccessors();
-      const isRecurrence = ExpressionUtils.getField(dataAccessors, 'recurrenceRule', formData);
+      const isRecurrence = dataAccessors.get('recurrenceRule', formData);
 
       this.changeSize(isRecurrence);
     }
@@ -239,7 +238,7 @@ export class AppointmentPopup {
 
     isShowLoadPanel && this._showLoadPanel();
 
-    when(validation && validation.complete || validation).done((validation) => {
+    when(validation?.complete || validation).done((validation) => {
       if (validation && !validation.isValid) {
         hideLoading();
         deferred.resolve(false);

packages/devextreme/js/__internal/scheduler/appointments/data_provider/m_appointment_data_provider.ts

@@ -1,5 +1,6 @@
 import config from '@js/core/config';
 import { combineRemoteFilter } from '@ts/scheduler/r1/filterting/index';
+import type { AppointmentDataAccessor } from '@ts/scheduler/utils';
 
 import { AppointmentDataSource } from './m_appointment_data_source';
 import { AppointmentFilterBaseStrategy, AppointmentFilterVirtualStrategy } from './m_appointment_filter';
@@ -14,7 +15,7 @@ export class AppointmentDataProvider {
 
   dataSource: any;
 
-  dataAccessors: any;
+  dataAccessors: AppointmentDataAccessor;
 
   timeZoneCalculator: any;
 

packages/devextreme/js/__internal/scheduler/appointments/data_provider/m_appointment_filter.ts

@@ -9,6 +9,7 @@ import {
   getAppointmentTakesAllDay, getDatesWithoutTime, hasResourceValue, isDateAndTimeView,
   isTimelineView,
 } from '@ts/scheduler/r1/utils/index';
+import type { AppointmentDataAccessor } from '@ts/scheduler/utils';
 
 import { createAppointmentAdapter } from '../../m_appointment_adapter';
 import { getRecurrenceProcessor } from '../../m_recurrence';
@@ -35,7 +36,7 @@ const FilterStrategies = {
 export class AppointmentFilterBaseStrategy {
   options: any;
 
-  dataAccessors: any;
+  dataAccessors: AppointmentDataAccessor;
 
   constructor(options) {
     this.options = options;
@@ -160,7 +161,7 @@ export class AppointmentFilterBaseStrategy {
     } = filterOptions;
 
     const [trimMin, trimMax] = getDatesWithoutTime(min, max);
-    const useRecurrence = isDefined(this.dataAccessors.getter.recurrenceRule);
+    const useRecurrence = this.dataAccessors.has('recurrenceRule');
 
     return [[(appointment) => {
       const appointmentVisible = appointment.visible ?? true;
@@ -452,7 +453,6 @@ export class AppointmentFilterVirtualStrategy extends AppointmentFilterBaseStrat
       .toArray();
   }
 
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   hasAllDayAppointments(filteredItems, preparedItems) {
     return this.filterAllDayAppointments(preparedItems).length > 0;
   }

packages/devextreme/js/__internal/scheduler/appointments/data_provider/m_utils.test.ts

@@ -0,0 +1,43 @@
+import { mockAppointmentDataAccessor } from '@ts/scheduler/__mock__/appointment_data_accessor.mock';
+
+import { replaceWrongEndDate } from './m_utils';
+
+describe('replaceWrongEndDate', () => {
+  it('should process endDate correctly', () => {
+    [
+      {
+        data: {
+          startDate: new Date(2019, 4, 3, 12),
+          allDay: false,
+        },
+        expectedEndDate: new Date(2019, 4, 3, 12, 30),
+      },
+      {
+        data: {
+          startDate: new Date(2019, 4, 3, 12),
+          allDay: false,
+          endDate: new Date('string'),
+        },
+        expectedEndDate: new Date(2019, 4, 3, 12, 30),
+      },
+      {
+        data: {
+          startDate: new Date(2019, 4, 3, 12),
+          allDay: true,
+        },
+        expectedEndDate: new Date(2019, 4, 3, 23, 59),
+      },
+    ].forEach((item) => {
+      replaceWrongEndDate(
+        item.data,
+        new Date(2019, 4, 3, 12),
+        item.data.endDate,
+        30,
+        mockAppointmentDataAccessor,
+      );
+
+      expect((item.data.endDate as Date).getHours()).toBe(item.expectedEndDate.getHours());
+      expect((item.data.endDate as Date).getMinutes()).toBe(item.expectedEndDate.getMinutes());
+    });
+  });
+});

packages/devextreme/js/__internal/scheduler/appointments/data_provider/m_utils.ts

@@ -1,7 +1,7 @@
 import dateUtils from '@js/core/utils/date';
 import dateSerialization from '@js/core/utils/date_serialization';
+import type { AppointmentDataAccessor } from '@ts/scheduler/utils';
 
-import { ExpressionUtils } from '../../m_expression_utils';
 import timeZoneUtils from '../../m_utils_time_zone';
 
 const toMs = dateUtils.dateToMilliseconds;
@@ -124,7 +124,13 @@ export const _convertRecurrenceException = (exceptionString, startDate, timeZone
   return exceptionString;
 };
 
-export const replaceWrongEndDate = (rawAppointment, startDate, endDate, appointmentDuration, dataAccessors) => {
+export const replaceWrongEndDate = (
+  rawAppointment,
+  startDate,
+  endDate,
+  appointmentDuration,
+  dataAccessors: AppointmentDataAccessor,
+) => {
   const calculateAppointmentEndDate = (isAllDay, startDate) => {
     if (isAllDay) {
       return dateUtils.setToDayEnd(new Date(startDate));
@@ -134,17 +140,20 @@ export const replaceWrongEndDate = (rawAppointment, startDate, endDate, appointm
   };
 
   if (_isEndDateWrong(startDate, endDate)) {
-    const isAllDay = ExpressionUtils.getField(dataAccessors, 'allDay', rawAppointment);
+    const isAllDay = Boolean(dataAccessors.get('allDay', rawAppointment));
 
     const calculatedEndDate = calculateAppointmentEndDate(isAllDay, startDate);
-    dataAccessors.setter.endDate(rawAppointment, calculatedEndDate);
+    dataAccessors.set('endDate', rawAppointment, calculatedEndDate);
   }
 };
 
-export const sortAppointmentsByStartDate = (appointments, dataAccessors) => {
+export const sortAppointmentsByStartDate = (
+  appointments,
+  dataAccessors: AppointmentDataAccessor,
+) => {
   appointments.sort((a, b) => {
-    const firstDate = new Date(ExpressionUtils.getField(dataAccessors, 'startDate', a.settings || a));
-    const secondDate = new Date(ExpressionUtils.getField(dataAccessors, 'startDate', b.settings || b));
+    const firstDate = new Date(dataAccessors.get('startDate', a.settings || a));
+    const secondDate = new Date(dataAccessors.get('startDate', b.settings || b));
 
     return Math.sign(firstDate.getTime() - secondDate.getTime());
   });

packages/devextreme/js/__internal/scheduler/appointments/m_appointment.ts

@@ -25,8 +25,8 @@ import {
   REDUCED_APPOINTMENT_ICON,
   REDUCED_APPOINTMENT_PARTS_CLASSES,
 } from '../m_classes';
-import { ExpressionUtils } from '../m_expression_utils';
 import { getRecurrenceProcessor } from '../m_recurrence';
+import type { AppointmentDataAccessor } from '../utils';
 
 const DEFAULT_HORIZONTAL_HANDLES = 'left right';
 const DEFAULT_VERTICAL_HANDLES = 'top bottom';
@@ -39,10 +39,14 @@ export class Appointment extends DOMComponent {
     return this.$element();
   }
 
-  get rawAppointment() {
+  get rawAppointment(): any {
     return this.option('data');
   }
 
+  get dataAccessors(): AppointmentDataAccessor {
+    return this.option('dataAccessors') as AppointmentDataAccessor;
+  }
+
   _getDefaultOptions() {
     // @ts-expect-error
     return extend(super._getDefaultOptions(), {
@@ -148,7 +152,7 @@ export class Appointment extends DOMComponent {
 
     (this.$element() as any).data('dxAppointmentStartDate', this.option('startDate'));
 
-    const text = ExpressionUtils.getField(this.option('dataAccessors'), 'text', this.rawAppointment);
+    const text = this.dataAccessors.get('text', this.rawAppointment);
     (this.$element() as any).attr('title', text);
     (this.$element() as any).attr('role', 'button');
 
@@ -234,7 +238,7 @@ export class Appointment extends DOMComponent {
   }
 
   _getEndDate() {
-    const result = ExpressionUtils.getField(this.option('dataAccessors'), 'endDate', this.rawAppointment);
+    const result = this.dataAccessors.get('endDate', this.rawAppointment);
     if (result) {
       return new Date(result);
     }
@@ -250,7 +254,7 @@ export class Appointment extends DOMComponent {
   }
 
   _renderRecurrenceClass() {
-    const rule = ExpressionUtils.getField(this.option('dataAccessors'), 'recurrenceRule', this.rawAppointment);
+    const rule = this.dataAccessors.get('recurrenceRule', this.rawAppointment);
 
     if (getRecurrenceProcessor().isValidRecurrenceRule(rule)) {
       (this.$element() as any).addClass(RECURRENCE_APPOINTMENT_CLASS);