Scheduler - Extract Scale facade from Workspace for Appointments

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

@@ -776,20 +776,22 @@ class SchedulerAppointments extends CollectionWidget<any> {
     const $element = $(e.element);
     const timeZoneCalculator = this.option('timeZoneCalculator');
 
+    const scale = this.option('scale');
+
     return getAppointmentDateRange({
       handles: e.handles,
       appointmentSettings: $element.data(APPOINTMENT_SETTINGS_KEY) as any,
-      isVerticalGroupedWorkSpace: this.option('isVerticalGroupedWorkSpace')(),
+      isVerticalGroupedWorkSpace: scale.isVerticalGroupedWorkSpace(),
       appointmentRect: getBoundingRect($element[0]),
       parentAppointmentRect: getBoundingRect($element.parent()[0]),
-      viewDataProvider: this.option('getViewDataProvider')(),
-      isDateAndTimeView: this.option('isDateAndTimeView')(),
+      getCellDateInfo: scale.getCellDateInfo.bind(scale),
+      getCellGeometry: scale.getCellGeometry.bind(scale),
+      isDateAndTimeView: scale.isDateAndTimeView(),
       startDayHour: this.invoke('getStartDayHour'),
       endDayHour: this.invoke('getEndDayHour'),
       timeZoneCalculator,
       dataAccessors: this.dataAccessors,
       rtlEnabled: this.option('rtlEnabled'),
-      DOMMetaData: this.option('getDOMElementsMetaData')(),
       viewOffset: this.invoke('getViewOffsetMs'),
     });
   }

packages/devextreme/js/__internal/scheduler/appointments/resizing/m_core.ts

@@ -1,7 +1,7 @@
 import { dateUtilsTs } from '@ts/core/utils/date';
 import { dateUtils } from '@ts/core/utils/m_date';
 
-import type { ViewCellData } from '../../types';
+import type { CellDateInfo } from '../../entieties/scale';
 import type {
   CellsInfo,
   DateRange,
@@ -12,33 +12,29 @@ import type {
 
 const toMs = dateUtils.dateToMilliseconds;
 
-// NOTE: View data generator shifts all day cell dates by offset
-// and return equal start and end dates.
 const getCellData = (
-  { viewDataProvider }: GetAppointmentDateRangeOptionsExtended,
+  { getCellDateInfo }: GetAppointmentDateRangeOptionsExtended,
   cellRowIndex: number,
   cellColumnIndex: number,
   isOccupiedAllDay: boolean,
   isAllDay = false,
   rtlEnabled = false,
-): ViewCellData => {
-  const cellData = viewDataProvider.getCellData(
+): CellDateInfo => {
+  const cellData = getCellDateInfo(
     cellRowIndex,
     cellColumnIndex,
     isOccupiedAllDay,
     rtlEnabled,
-  );
-  // NOTE: All day appointments occupy day if they start at the beginning of the day,
-  // but long appointments are not. So for all day appointments endDate === startDate,
-  // for long appointments endDate = startDate + 1 day.
+  )!;
+
   if (!isAllDay) {
     cellData.endDate = dateUtilsTs.addOffsets(cellData.startDate, toMs('day'));
   }
 
   return cellData;
 };
 
-const getAppointmentLeftCell = (options: GetAppointmentDateRangeOptionsExtended): ViewCellData => {
+const getAppointmentLeftCell = (options: GetAppointmentDateRangeOptionsExtended): CellDateInfo => {
   const {
     cellHeight,
     cellWidth,
@@ -165,25 +161,16 @@ const getRelativeAppointmentRect = (appointmentRect: Rect, parentAppointmentRect
 const getAppointmentCellsInfo = (options: GetAppointmentDateRangeOptions): CellsInfo => {
   const {
     appointmentSettings,
-    isVerticalGroupedWorkSpace,
-    DOMMetaData,
+    getCellGeometry,
   } = options;
 
-  const DOMMetaTable = appointmentSettings.allDay && !isVerticalGroupedWorkSpace
-    ? [DOMMetaData.allDayPanelCellsMeta]
-    : DOMMetaData.dateTableCellsMeta;
-
-  const {
-    height: cellHeight,
-    width: cellWidth,
-  } = DOMMetaTable[appointmentSettings.rowIndex][appointmentSettings.columnIndex];
-  const cellCountInRow = DOMMetaTable[appointmentSettings.rowIndex].length;
+  const geometry = getCellGeometry(
+    appointmentSettings.rowIndex,
+    appointmentSettings.columnIndex,
+    Boolean(appointmentSettings.allDay),
+  );
 
-  return {
-    cellWidth,
-    cellHeight,
-    cellCountInRow,
-  };
+  return geometry ?? { cellWidth: 0, cellHeight: 0, cellCountInRow: 0 };
 };
 
 export const getAppointmentDateRange = (options: GetAppointmentDateRangeOptions): DateRange => {

packages/devextreme/js/__internal/scheduler/appointments/resizing/types.ts

@@ -1,5 +1,5 @@
+import type { CellDateInfo } from '../../entieties/scale';
 import type { TimeZoneCalculator } from '../../r1/timezone_calculator';
-import type { ViewDataProviderType } from '../../types';
 import type { AppointmentDataAccessor } from '../../utils/data_accessor/appointment_data_accessor';
 import type { AppointmentItemViewModel } from '../../view_model/types';
 
@@ -14,17 +14,23 @@ export interface GetAppointmentDateRangeOptions {
   isVerticalGroupedWorkSpace: boolean;
   appointmentRect: Rect;
   parentAppointmentRect: Rect;
-  viewDataProvider: ViewDataProviderType;
+  getCellDateInfo: (
+    rowIndex: number,
+    columnIndex: number,
+    isAllDay: boolean,
+    rtlEnabled: boolean,
+  ) => CellDateInfo | undefined;
+  getCellGeometry: (
+    rowIndex: number,
+    columnIndex: number,
+    isAllDay: boolean,
+  ) => CellsInfo | undefined;
   isDateAndTimeView: boolean;
   startDayHour: number;
   endDayHour: number;
   timeZoneCalculator: TimeZoneCalculator;
   dataAccessors: AppointmentDataAccessor;
   rtlEnabled?: boolean;
-  DOMMetaData: {
-    allDayPanelCellsMeta: Rect[];
-    dateTableCellsMeta: Rect[][];
-  };
   viewOffset: number;
 }