fix(react-grid): consider fixed columns when columns are virtualized (#…

…2014)
DevExpress · May 15, 2019 · f13c525 · f13c525
1 parent 01c4331
commit f13c525
Show file tree

Hide file tree

Showing 3 changed files with 48 additions and 12 deletions.
diff --git a/packages/dx-grid-core/src/index.ts b/packages/dx-grid-core/src/index.ts
@@ -188,7 +188,7 @@ export { getGroupCellTargetIndex } from './utils/group-panel';
 export {
   getCollapsedGrid,
   getCollapsedGrids,
-  getColumnsVisibleBoundary,
+  getColumnBoundaries,
   getRowsVisibleBoundary,
   getColumnsRenderBoundary,
   getRowsRenderBoundary,

diff --git a/packages/dx-grid-core/src/utils/virtual-table.test.ts b/packages/dx-grid-core/src/utils/virtual-table.test.ts
@@ -11,6 +11,7 @@ import {
   TABLE_STUB_TYPE,
   getColumnWidthGetter,
   getRenderBoundary,
+  getColumnBoundaries,
 } from './virtual-table';
 
 describe('VirtualTableLayout utils', () => {
@@ -57,6 +58,43 @@ describe('VirtualTableLayout utils', () => {
     });
   });
 
+  describe('#getColumnBoundaries', () => {
+    it('should return correct boundaries in simple case', () => {
+      const columns =  [
+        { size: 40 },
+        { size: 40 },
+        { size: 40 },
+        { size: 40 },
+        { size: 40 },
+        { size: 40 },
+        { size: 40 },
+      ];
+
+      expect(getColumnBoundaries(columns, 90, 100, col => col.size))
+        .toEqual([[1, 5]]);
+    });
+
+    it('should take fixed columns into account', () => {
+      const columns =  [
+        { size: 40, fixed: 'left' },
+        { size: 40 },
+        { size: 40 },
+        { size: 40 },
+        { size: 40 },
+        { size: 40 },
+        { size: 40 },
+        { size: 40, fixed: 'right' },
+      ];
+
+      expect(getColumnBoundaries(columns, 120, 80, col => col.size))
+        .toEqual([
+          [2, 5],
+          [0, 0],
+          [7, 7],
+        ]);
+    });
+  });
+
   describe('#getRenderBoundary', () => {
     it('should correctly add overscan in simple case', () => {
       expect(getRenderBoundary(20, [5, 10], 3)).toEqual([2, 13]);

diff --git a/packages/dx-grid-core/src/utils/virtual-table.ts b/packages/dx-grid-core/src/utils/virtual-table.ts
@@ -78,11 +78,14 @@ export const getRenderBoundary: GetRenderBoundaryFn = (itemsCount, visibleBounda
   return [start, end];
 };
 
-export const getColumnsVisibleBoundary: PureComputed<
+export const getColumnBoundaries: PureComputed<
   [TableColumn[], number, number, GetColumnWidthFn], VisibleBoundary[]
 > = (columns, left, width, getColumnWidth) => (
   getVisibleBoundaryWithFixed(
-    getVisibleBoundary(columns, left, width, getColumnWidth, 0),
+    getColumnsRenderBoundary(
+      columns.length,
+      getVisibleBoundary(columns, left, width, getColumnWidth, 0),
+    ),
     columns,
   )
 );
@@ -354,14 +357,9 @@ export const getCollapsedGrids: GetCollapsedGridsFn = ({
     tableRow: any, tableColumn: any,
   ) => getCellColSpan!({ tableRow, tableColumn, tableColumns: columns });
 
-  const visibleColumnBoundaries = [
-    getColumnsRenderBoundary(
-      columns.length,
-      getColumnsVisibleBoundary(
-        columns, viewportLeft, containerWidth, getColumnWidth,
-      )[0],
-    ),
-  ];
+  const columnBoundaries = getColumnBoundaries(
+    columns, viewportLeft, containerWidth, getColumnWidth,
+  );
   const getCollapsedGridBlock: PureComputed<
     [any[], any[]?, number?, number?], CollapsedGrid
   > = (
@@ -370,7 +368,7 @@ export const getCollapsedGrids: GetCollapsedGridsFn = ({
     rows,
     columns,
     rowsVisibleBoundary,
-    columnsVisibleBoundary: visibleColumnBoundaries,
+    columnsVisibleBoundary: columnBoundaries,
     getColumnWidth,
     getRowHeight,
     getColSpan,