From 3ff134df8f9e5d0914e2de98215b2d5192c80377 Mon Sep 17 00:00:00 2001 From: Matthew Runyon Date: Thu, 2 Nov 2023 13:12:59 -0500 Subject: [PATCH 1/2] Revert "fix: stuck to bottom on filter clear (#1579)" This reverts commit ef527498970fd0d994d90d9824bc3a55582f5b4c. --- packages/grid/src/Grid.tsx | 77 ++++--------------- .../src/key-handlers/SelectionKeyHandler.ts | 28 ++----- 2 files changed, 21 insertions(+), 84 deletions(-) diff --git a/packages/grid/src/Grid.tsx b/packages/grid/src/Grid.tsx index 9fb4eab2e7..d5dc36b3d3 100644 --- a/packages/grid/src/Grid.tsx +++ b/packages/grid/src/Grid.tsx @@ -68,11 +68,6 @@ type LegacyCanvasRenderingContext2D = CanvasRenderingContext2D & { backingStorePixelRatio?: number; }; -export type StickyOptions = { - shouldStickBottom?: boolean; - shouldStickRight?: boolean; -}; - export type GridProps = typeof Grid.defaultProps & { // Options to set on the canvas canvasOptions?: CanvasRenderingContext2DSettings; @@ -1186,13 +1181,11 @@ class Grid extends PureComponent { * @param deltaColumn Number of columns to move the cursor * @param deltaRow Number of rows to move the cursor * @param extendSelection True if the current selection should be extended, false to start a new selection - * @param stickyOptions Options for sticky behavior */ moveCursor( deltaColumn: number, deltaRow: number, - extendSelection: boolean, - stickyOptions?: StickyOptions + extendSelection: boolean ): void { const { cursorRow, cursorColumn, selectionEndColumn, selectionEndRow } = this.state; @@ -1200,28 +1193,14 @@ class Grid extends PureComponent { const row = extendSelection ? selectionEndRow : cursorRow; if (row === null || column === null) { const { left, top } = this.state; - this.moveCursorToPosition( - left, - top, - extendSelection, - true, - false, - stickyOptions - ); + this.moveCursorToPosition(left, top, extendSelection); } else { const { model } = this.props; const { columnCount, rowCount } = model; const left = clamp(column + deltaColumn, 0, columnCount - 1); const top = clamp(row + deltaRow, 0, rowCount - 1); - this.moveCursorToPosition( - left, - top, - extendSelection, - true, - false, - stickyOptions - ); + this.moveCursorToPosition(left, top, extendSelection); } } @@ -1281,15 +1260,13 @@ class Grid extends PureComponent { * @param extendSelection Whether to extend the current selection (eg. holding Shift) * @param keepCursorInView Whether to move the viewport so that the cursor is in view * @param maximizePreviousRange With this and `extendSelection` true, it will maximize/add to the previous range only, ignoring where the selection was started - * @param stickyOptions Options for sticky behavior */ moveCursorToPosition( column: GridRangeIndex, row: GridRangeIndex, extendSelection = false, keepCursorInView = true, - maximizePreviousRange = false, - stickyOptions?: StickyOptions + maximizePreviousRange = false ): void { if (!extendSelection) { this.beginSelection(column, row); @@ -1298,7 +1275,7 @@ class Grid extends PureComponent { this.moveSelection(column, row, extendSelection, maximizePreviousRange); if (keepCursorInView) { - this.moveViewToCell(column, row, stickyOptions); + this.moveViewToCell(column, row); } } @@ -1307,13 +1284,8 @@ class Grid extends PureComponent { * * @param column The column index to bring into view * @param row The row index to bring into view - * @param stickyOptions Options for sticky behavior */ - moveViewToCell( - column: GridRangeIndex, - row: GridRangeIndex, - stickyOptions?: StickyOptions - ): void { + moveViewToCell(column: GridRangeIndex, row: GridRangeIndex): void { if (!this.metrics) throw new Error('metrics not set'); const { metricCalculator } = this; @@ -1342,11 +1314,7 @@ class Grid extends PureComponent { } } - this.setViewState( - { top, left, topOffset, leftOffset }, - false, - stickyOptions - ); + this.setViewState({ top, left, topOffset, leftOffset }); } /** @@ -1354,29 +1322,18 @@ class Grid extends PureComponent { * Should be called when user interaction occurs * @param viewState New state properties to set. * @param forceUpdate Whether to force an update. - * @param stickyOptions Options for sticky behavior */ - - setViewState( - viewState: Partial, - forceUpdate = false, - stickyOptions?: StickyOptions - ): void { + setViewState(viewState: Partial, forceUpdate = false): void { if (!this.metrics) throw new Error('metrics not set'); const { isStickyBottom, isStickyRight } = this.props; const { top, left } = viewState; const { lastTop, lastLeft } = this.metrics; - - if (top != null && (stickyOptions?.shouldStickBottom ?? false)) { - this.setState({ - isStuckToBottom: isStickyBottom && top >= lastTop, - }); + if (top != null) { + this.setState({ isStuckToBottom: isStickyBottom && top >= lastTop }); } - if (left != null && (stickyOptions?.shouldStickRight ?? false)) { - this.setState({ - isStuckToRight: isStickyRight && left >= lastLeft, - }); + if (left != null) { + this.setState({ isStuckToRight: isStickyRight && left >= lastLeft }); } this.setState(viewState as GridState); @@ -2021,15 +1978,7 @@ class Grid extends PureComponent { } } - const stickyOptions: StickyOptions = { - shouldStickBottom: event.deltaY > 0, - shouldStickRight: event.deltaX > 0, - }; - this.setViewState( - { top, left, leftOffset, topOffset }, - false, - stickyOptions - ); + this.setViewState({ top, left, leftOffset, topOffset }); event.stopPropagation(); event.preventDefault(); diff --git a/packages/grid/src/key-handlers/SelectionKeyHandler.ts b/packages/grid/src/key-handlers/SelectionKeyHandler.ts index e1144fa619..20ae726f13 100644 --- a/packages/grid/src/key-handlers/SelectionKeyHandler.ts +++ b/packages/grid/src/key-handlers/SelectionKeyHandler.ts @@ -1,7 +1,7 @@ /* eslint class-methods-use-this: "off" */ import clamp from 'lodash.clamp'; import { EventHandlerResult } from '../EventHandlerResult'; -import Grid, { StickyOptions } from '../Grid'; +import Grid from '../Grid'; import GridRange from '../GridRange'; import GridUtils from '../GridUtils'; import KeyHandler, { GridKeyboardEvent } from '../KeyHandler'; @@ -144,11 +144,6 @@ class SelectionKeyHandler extends KeyHandler { grid.state; const column = isShiftKey ? selectionEndColumn : cursorColumn; const row = isShiftKey ? selectionEndRow : cursorRow; - const stickyOptions: StickyOptions = { - shouldStickBottom: deltaRow > 0, - shouldStickRight: deltaColumn > 0, - }; - if (isModifierKey) { const { model } = grid.props; const { columnCount, rowCount } = model; @@ -174,8 +169,7 @@ class SelectionKeyHandler extends KeyHandler { moveToRow, isShiftKey, true, - maximizePreviousRange, - stickyOptions + maximizePreviousRange ); } } else { @@ -183,7 +177,6 @@ class SelectionKeyHandler extends KeyHandler { const { theme } = grid.props; const { autoSelectRow = false, autoSelectColumn = false } = theme; - if (autoSelectRow && deltaColumn !== 0) { const { lastLeft } = grid.metrics; let { left } = grid.state; @@ -192,7 +185,7 @@ class SelectionKeyHandler extends KeyHandler { grid.moveCursorToPosition(left, cursorRow, isShiftKey, false); - grid.setViewState({ left }, false, stickyOptions); + grid.setViewState({ left }); } else if (autoSelectColumn && deltaRow !== 0) { const { lastTop } = grid.metrics; let { top } = grid.state; @@ -201,9 +194,9 @@ class SelectionKeyHandler extends KeyHandler { grid.moveCursorToPosition(top, cursorColumn, isShiftKey, false); - grid.setViewState({ top }, false, stickyOptions); + grid.setViewState({ top }); } else { - grid.moveCursor(deltaColumn, deltaRow, isShiftKey, stickyOptions); + grid.moveCursor(deltaColumn, deltaRow, isShiftKey); } } return true; @@ -249,8 +242,8 @@ class SelectionKeyHandler extends KeyHandler { return true; } - handlePageDown(event: GridKeyboardEvent, grid: Grid): boolean { - const isShiftKey = event.shiftKey; + handlePageDown(e: GridKeyboardEvent, grid: Grid): boolean { + const isShiftKey = e.shiftKey; if (isShiftKey) { grid.trimSelectedRanges(); @@ -286,12 +279,7 @@ class SelectionKeyHandler extends KeyHandler { isShiftKey, false ); - - const stickyOptions: StickyOptions = { - shouldStickBottom: true, - shouldStickRight: false, - }; - grid.setViewState({ top: viewportPosition }, false, stickyOptions); + grid.setViewState({ top: viewportPosition }); return true; } From 3c481ce3f0ba7590bf47620dfd1c3b4e5434f9f2 Mon Sep 17 00:00:00 2001 From: Matthew Runyon Date: Thu, 2 Nov 2023 14:01:52 -0500 Subject: [PATCH 2/2] Fix 1477 scroll issue --- packages/grid/src/Grid.tsx | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/packages/grid/src/Grid.tsx b/packages/grid/src/Grid.tsx index d5dc36b3d3..ca23bd7ec6 100644 --- a/packages/grid/src/Grid.tsx +++ b/packages/grid/src/Grid.tsx @@ -1328,11 +1328,12 @@ class Grid extends PureComponent { const { isStickyBottom, isStickyRight } = this.props; const { top, left } = viewState; - const { lastTop, lastLeft } = this.metrics; - if (top != null) { + const { lastTop, lastLeft, hasVerticalBar, hasHorizontalBar } = + this.metrics; + if (top != null && hasVerticalBar) { this.setState({ isStuckToBottom: isStickyBottom && top >= lastTop }); } - if (left != null) { + if (left != null && hasHorizontalBar) { this.setState({ isStuckToRight: isStickyRight && left >= lastLeft }); }