Update eslint deps #3615

amanmahajan7 · 2024-10-08T20:30:39Z

New plugin

eslint-plugin-react-hooks-extra. https://eslint-react.xyz/
react-compiler/react-compiler. https://react.dev/learn/react-compiler#installing-eslint-plugin-react-compiler

codecov · 2024-10-08T20:35:48Z

Codecov Report

Attention: Patch coverage is 94.11765% with 2 lines in your changes missing coverage. Please review.

Project coverage is 91.10%. Comparing base (9c57299) to head (222e2c9).
Report is 2 commits behind head on main.

Files with missing lines	Patch %	Lines
src/DataGrid.tsx	93.10%	2 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #3615      +/-   ##
==========================================
+ Coverage   89.88%   91.10%   +1.22%     
==========================================
  Files          48       48              
  Lines        3440     3440              
  Branches      654      679      +25     
==========================================
+ Hits         3092     3134      +42     
+ Misses        348      306      -42

Files with missing lines	Coverage Δ
src/ScrollToCell.tsx	`100.00% <100.00%> (ø)`
src/hooks/useViewportColumns.ts	`55.95% <ø> (+4.76%)`	⬆️
src/utils/index.ts	`93.75% <100.00%> (+6.25%)`	⬆️
src/DataGrid.tsx	`89.08% <93.10%> (+5.45%)`	⬆️

... and 6 files with indirect coverage changes

amanmahajan7 · 2024-10-24T19:37:21Z

package.json

    "@faker-js/faker": "^9.0.0",
    "@ianvs/prettier-plugin-sort-imports": "^4.0.2",
    "@linaria/core": "^6.0.0",
    "@microsoft/api-extractor": "^7.23.0",
    "@rollup/plugin-babel": "^6.0.3",
    "@rollup/plugin-node-resolve": "^15.1.0",
-    "@tanstack/react-router": "^1.57.13",
-    "@tanstack/router-plugin": "^1.57.13",
+    "@tanstack/react-router": "^1.70.0",


I removed the eslint-plugin. Not sure why is it failing

Looks like the plugin needs to export Plugin, manually tweaking the declaration files fixes it.
Composite projects require declaration files to be emitted, and TS can't emit a declaration file without access to the Plugin type from the @tanstack/eslint-plugin-router.
Should open an issue.

amanmahajan7 · 2024-10-24T19:38:33Z

src/DataGrid.tsx

@@ -1245,7 +1248,7 @@ function DataGrid<R, SR, K extends Key>(
        <ScrollToCell
          scrollToPosition={scrollToPosition}
          setScrollToCellPosition={setScrollToPosition}
-          gridElement={gridRef.current!}
+          gridRef={gridRef}


eslint-plugin did not catch this. Maybe because it is conditional 🤔

amanmahajan7 · 2024-10-24T19:39:22Z

src/hooks/useViewportColumns.ts

@@ -36,6 +36,7 @@ export function useViewportColumns<R, SR>({

    const updateStartIdx = (colIdx: number, colSpan: number | undefined) => {
      if (colSpan !== undefined && colIdx + colSpan > colOverscanStartIdx) {
+        // eslint-disable-next-line react-compiler/react-compiler


Not sure what the issue is

Should open an issue

amanmahajan7 · 2024-10-24T20:22:35Z

src/DataGrid.tsx

@@ -1061,7 +1065,6 @@ function DataGrid<R, SR, K extends Key>(
  // Reset the positions if the current values are no longer valid. This can happen if a column or row is removed
  if (selectedPosition.idx > maxColIdx || selectedPosition.rowIdx > maxRowIdx) {
    setSelectedPosition({ idx: -1, rowIdx: minRowIdx - 1, mode: 'SELECT' });
-    setDraggedOverRowIdx(undefined);


Is this needed? We do set it to undefined after the drag operation
https://github.com/adazzle/react-data-grid/blob/main/src/DragHandle.tsx#L103

Is it possible that the rows update while we're dragging?

Probably. I added it back for now. I will look into alternatives

nstepien · 2024-10-25T12:22:31Z

src/DataGrid.tsx

+  }
+
+  function closeEditor(shouldFocusCell: boolean) {
+    shouldFocusCellRef.current = shouldFocusCell;


Should we just use a state instead of dancing around the limitations?

I think we can completely remove the ref and use flushSync. It works but it seems like the checkbox checked state is incorrect when cell is clicked. Maybe a bug in React

facebook/react#31358

Using a state now

nstepien · 2024-10-25T12:23:46Z

src/DataGrid.tsx

@@ -1061,7 +1065,6 @@ function DataGrid<R, SR, K extends Key>(
  // Reset the positions if the current values are no longer valid. This can happen if a column or row is removed
  if (selectedPosition.idx > maxColIdx || selectedPosition.rowIdx > maxRowIdx) {
    setSelectedPosition({ idx: -1, rowIdx: minRowIdx - 1, mode: 'SELECT' });
-    setDraggedOverRowIdx(undefined);


Is it possible that the rows update while we're dragging?

nstepien · 2024-10-25T12:25:48Z

src/hooks/useViewportColumns.ts

@@ -36,6 +36,7 @@ export function useViewportColumns<R, SR>({

    const updateStartIdx = (colIdx: number, colSpan: number | undefined) => {
      if (colSpan !== undefined && colIdx + colSpan > colOverscanStartIdx) {
+        // eslint-disable-next-line react-compiler/react-compiler


Should open an issue

nstepien · 2024-10-25T13:03:53Z

package.json

    "@faker-js/faker": "^9.0.0",
    "@ianvs/prettier-plugin-sort-imports": "^4.0.2",
    "@linaria/core": "^6.0.0",
    "@microsoft/api-extractor": "^7.23.0",
    "@rollup/plugin-babel": "^6.0.3",
    "@rollup/plugin-node-resolve": "^15.1.0",
-    "@tanstack/react-router": "^1.57.13",
-    "@tanstack/router-plugin": "^1.57.13",
+    "@tanstack/react-router": "^1.70.0",


Looks like the plugin needs to export Plugin, manually tweaking the declaration files fixes it.
Composite projects require declaration files to be emitted, and TS can't emit a declaration file without access to the Plugin type from the @tanstack/eslint-plugin-router.
Should open an issue.

amanmahajan7 · 2024-11-11T16:29:45Z

src/DataGrid.tsx

@@ -1061,7 +1065,6 @@ function DataGrid<R, SR, K extends Key>(
  // Reset the positions if the current values are no longer valid. This can happen if a column or row is removed
  if (selectedPosition.idx > maxColIdx || selectedPosition.rowIdx > maxRowIdx) {
    setSelectedPosition({ idx: -1, rowIdx: minRowIdx - 1, mode: 'SELECT' });
-    setDraggedOverRowIdx(undefined);


Probably. I added it back for now. I will look into alternatives

amanmahajan7 · 2024-11-11T16:30:04Z

src/DataGrid.tsx

@@ -1182,6 +1183,7 @@ function DataGrid<R, SR, K extends Key>(
              );
            })}
            <RowSelectionChangeProvider value={selectRowLatest}>
+              {/* eslint-disable-next-line react-compiler/react-compiler */}


Don't know which line it is complaining about

Probably the setDraggedOverRowIdx call?

I tried removing it and it was still showing the same warning

amanmahajan7 · 2024-11-11T16:30:27Z

src/DataGrid.tsx

-  const prevSelectedPosition = useRef(selectedPosition);
  const latestDraggedOverRowIdx = useRef(draggedOverRowIdx);
-  const lastSelectedRowIdx = useRef(-1);
  const focusSinkRef = useRef<HTMLDivElement>(null);
-  const shouldFocusCellRef = useRef(false);


Removed a few refs

nstepien · 2024-11-11T17:58:27Z

src/DataGrid.tsx

@@ -1061,6 +1061,7 @@ function DataGrid<R, SR, K extends Key>(
  // Reset the positions if the current values are no longer valid. This can happen if a column or row is removed
  if (selectedPosition.idx > maxColIdx || selectedPosition.rowIdx > maxRowIdx) {
    setSelectedPosition({ idx: -1, rowIdx: minRowIdx - 1, mode: 'SELECT' });
+    // eslint-disable-next-line react-compiler/react-compiler
    setDraggedOverRowIdx(undefined);


Mmh, setting ref during render?

Yeah, need a workaround. We need ref to access the latest value. I will investigate

nstepien · 2024-11-11T17:59:33Z

src/DataGrid.tsx

@@ -1182,6 +1183,7 @@ function DataGrid<R, SR, K extends Key>(
              );
            })}
            <RowSelectionChangeProvider value={selectRowLatest}>
+              {/* eslint-disable-next-line react-compiler/react-compiler */}


Probably the setDraggedOverRowIdx call?

Update deps

1ae3d7f

amanmahajan7 self-assigned this Oct 8, 2024

Add new rule

902d96d

amanmahajan7 and others added 10 commits October 8, 2024 15:42

Add @tanstack/eslint-plugin-router

2141ff4

Merge branch 'main' into am-eslint

5878ec9

Merge branch 'main' into am-eslint

6fcc3fc

Update router deps

3245e76

update deps

0680367

Add '@typescript-eslint/no-unnecessary-type-parameters': 1,

ca70f3b

Merge branch 'main' into am-eslint

61a661e

Remove @tanstack/eslint-plugin-router

d6eb0dd

Add eslint-plugin-react-hooks-extra

c5b8f74

1 more

706019a

amanmahajan7 marked this pull request as ready for review October 24, 2024 19:08

amanmahajan7 requested a review from nstepien as a code owner October 24, 2024 19:08

amanmahajan7 added 2 commits October 24, 2024 14:35

Add eslint-plugin-react-compiler

8438db8

-1 array

a3d1f21

amanmahajan7 commented Oct 24, 2024

View reviewed changes

amanmahajan7 and others added 2 commits October 24, 2024 16:05

Do we need these rules

9ca5f15

disable 1 skipLibCheck, add back newline

5ce5789

nstepien reviewed Oct 25, 2024

View reviewed changes

amanmahajan7 marked this pull request as draft November 11, 2024 14:33

amanmahajan7 added 4 commits November 11, 2024 08:36

update deps

6c45583

Use state to focus cell

aad8f92

Remove a few refs

6fd1524

Disable warning

222e2c9

amanmahajan7 commented Nov 11, 2024

View reviewed changes

amanmahajan7 marked this pull request as ready for review November 11, 2024 16:31

amanmahajan7 requested a review from nstepien November 11, 2024 16:31

nstepien approved these changes Nov 11, 2024

View reviewed changes

amanmahajan7 merged commit 0604403 into main Nov 11, 2024
3 checks passed

amanmahajan7 deleted the am-eslint branch November 11, 2024 18:02

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Update eslint deps #3615

Update eslint deps #3615

amanmahajan7 commented Oct 8, 2024 •

edited

Loading

codecov bot commented Oct 8, 2024 •

edited

Loading

amanmahajan7 Oct 24, 2024

nstepien Oct 25, 2024

amanmahajan7 Oct 24, 2024 •

edited

Loading

amanmahajan7 Oct 24, 2024

nstepien Oct 25, 2024

amanmahajan7 Oct 24, 2024

nstepien Oct 25, 2024

amanmahajan7 Nov 11, 2024

nstepien Oct 25, 2024

amanmahajan7 Oct 25, 2024

amanmahajan7 Oct 25, 2024

amanmahajan7 Nov 11, 2024

nstepien Oct 25, 2024

nstepien Oct 25, 2024

nstepien Oct 25, 2024

amanmahajan7 Nov 11, 2024

amanmahajan7 Nov 11, 2024

nstepien Nov 11, 2024

amanmahajan7 Nov 11, 2024

amanmahajan7 Nov 11, 2024

nstepien Nov 11, 2024

amanmahajan7 Nov 11, 2024

nstepien Nov 11, 2024

Update eslint deps #3615

Update eslint deps #3615

Conversation

amanmahajan7 commented Oct 8, 2024 • edited Loading

codecov bot commented Oct 8, 2024 • edited Loading

Codecov Report

Choose a reason for hiding this comment

Choose a reason for hiding this comment

amanmahajan7 Oct 24, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

amanmahajan7 commented Oct 8, 2024 •

edited

Loading

codecov bot commented Oct 8, 2024 •

edited

Loading

amanmahajan7 Oct 24, 2024 •

edited

Loading