diff --git a/package.json b/package.json index baf6cda0..0ea80114 100644 --- a/package.json +++ b/package.json @@ -47,7 +47,6 @@ "react": "^18.0.0", "react-beautiful-dnd": "^13.1.0", "react-color-palette": "^6.2.0", - "react-data-grid": "7.0.0-beta.5", "react-detect-offline": "^2.4.5", "react-div-100vh": "^0.7.0", "react-dnd": "^16.0.1", diff --git a/src/components/SideDrawer/SideDrawer.tsx b/src/components/SideDrawer/SideDrawer.tsx index 04f896bd..ef676bd1 100644 --- a/src/components/SideDrawer/SideDrawer.tsx +++ b/src/components/SideDrawer/SideDrawer.tsx @@ -1,10 +1,8 @@ import { useEffect } from "react"; -import useMemoValue from "use-memo-value"; import clsx from "clsx"; import { useAtom } from "jotai"; -import { find, findIndex, isEqual } from "lodash-es"; +import { find, findIndex } from "lodash-es"; import { ErrorBoundary } from "react-error-boundary"; -import { DataGridHandle } from "react-data-grid"; import { TransitionGroup } from "react-transition-group"; import { Fab, Fade } from "@mui/material"; @@ -16,34 +14,20 @@ import ErrorFallback from "@src/components/ErrorFallback"; import StyledDrawer from "./StyledDrawer"; import SideDrawerFields from "./SideDrawerFields"; -import { projectScope, userSettingsAtom } from "@src/atoms/projectScope"; import { tableScope, - tableIdAtom, - tableColumnsOrderedAtom, tableRowsAtom, sideDrawerOpenAtom, selectedCellAtom, } from "@src/atoms/tableScope"; import { analytics, logEvent } from "@src/analytics"; -import { formatSubTableName } from "@src/utils/table"; export const DRAWER_WIDTH = 512; export const DRAWER_COLLAPSED_WIDTH = 36; -export default function SideDrawer({ - dataGridRef, -}: { - dataGridRef?: React.MutableRefObject; -}) { - const [userSettings] = useAtom(userSettingsAtom, projectScope); - const [tableId] = useAtom(tableIdAtom, tableScope); - const [tableColumnsOrdered] = useAtom(tableColumnsOrderedAtom, tableScope); +export default function SideDrawer() { const [tableRows] = useAtom(tableRowsAtom, tableScope); - const userDocHiddenFields = - userSettings.tables?.[formatSubTableName(tableId)]?.hiddenFields ?? []; - const [cell, setCell] = useAtom(selectedCellAtom, tableScope); const [open, setOpen] = useAtom(sideDrawerOpenAtom, tableScope); const selectedRow = find(tableRows, ["_rowy_ref.path", cell?.path]); @@ -51,26 +35,6 @@ export default function SideDrawer({ "_rowy_ref.path", cell?.path, ]); - // Memo a list of visible column keys for useEffect dependencies - const visibleColumnKeys = useMemoValue( - tableColumnsOrdered - .filter((col) => !userDocHiddenFields.includes(col.key)) - .map((col) => col.key), - isEqual - ); - - // When side drawer is opened, select the cell in the table - // in case we’ve scrolled and selected cell was reset - useEffect(() => { - if (open) { - const columnIndex = visibleColumnKeys.indexOf(cell?.columnKey || ""); - if (columnIndex === -1 || selectedCellRowIndex === -1) return; - dataGridRef?.current?.selectCell( - { rowIdx: selectedCellRowIndex, idx: columnIndex }, - false - ); - } - }, [open, visibleColumnKeys, selectedCellRowIndex, cell, dataGridRef]); const handleNavigate = (direction: "up" | "down") => () => { if (!tableRows || !cell) return; @@ -84,12 +48,6 @@ export default function SideDrawer({ path: newPath, focusInside: false, })); - - const columnIndex = visibleColumnKeys.indexOf(cell!.columnKey || ""); - dataGridRef?.current?.selectCell( - { rowIdx: rowIndex, idx: columnIndex }, - false - ); }; // const [urlDocState, dispatchUrlDoc] = useDoc({}); diff --git a/src/pages/Table/TablePage.tsx b/src/pages/Table/TablePage.tsx index da455666..5959376e 100644 --- a/src/pages/Table/TablePage.tsx +++ b/src/pages/Table/TablePage.tsx @@ -1,6 +1,5 @@ -import { useRef, Suspense, lazy } from "react"; +import { Suspense, lazy } from "react"; import { useAtom } from "jotai"; -import { DataGridHandle } from "react-data-grid"; import { ErrorBoundary } from "react-error-boundary"; import { isEmpty, intersection } from "lodash-es"; @@ -81,9 +80,6 @@ export default function TablePage({ useBeforeUnload(columnModalAtom, tableScope); useBeforeUnload(tableModalAtom, tableScope); - // A ref to the data grid. Contains data grid functions - const dataGridRef = useRef(null); - if (!(tableSchema as any)._rowy_ref) return ( <> @@ -161,7 +157,7 @@ export default function TablePage({ - {!disableSideDrawer && } + {!disableSideDrawer && } diff --git a/yarn.lock b/yarn.lock index aa25b7ed..8f82ba40 100644 --- a/yarn.lock +++ b/yarn.lock @@ -9970,13 +9970,6 @@ react-color-palette@^6.2.0: resolved "https://registry.yarnpkg.com/react-color-palette/-/react-color-palette-6.2.0.tgz#aa3be88f6953d57502c00f4433692129ffbad3e7" integrity sha512-9rIboaRJNoeF8aCI2f3J8wgMyhl74SnGmZLDjor3bKf0iDBhP2EBv0/jGmm0hrj6OackGCqtWl5ZvM89XUc3sg== -react-data-grid@7.0.0-beta.5: - version "7.0.0-beta.5" - resolved "https://registry.yarnpkg.com/react-data-grid/-/react-data-grid-7.0.0-beta.5.tgz#bc39ce45b7a7f42ebfb66840e0ec1c8619d60f10" - integrity sha512-rtN4wnePrQ80UN6lYF/zUQqVVJMT3HW5bTLx9nR5XOKQiG72cGzX2d2+b+e82vUh23zTFBicEnuWSlN9Fa/83Q== - dependencies: - clsx "^1.1.1" - react-detect-offline@^2.4.5: version "2.4.5" resolved "https://registry.yarnpkg.com/react-detect-offline/-/react-detect-offline-2.4.5.tgz#3c242516c37b6789cf89102881031f87e70b80e6"