From a1950fd6f69bbf3355b47b8fe1e31a56873175de Mon Sep 17 00:00:00 2001 From: Evan Simkowitz Date: Fri, 21 Feb 2025 16:57:29 -0800 Subject: [PATCH] Fix row pinning effect so it always runs (#2022) The old effect wasn't running on every data change, since it depended on table, which is a ref. Now, it will always run on any data change and as a Layout Effect so it will run before paint. --- frontend/app/view/preview/directorypreview.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/frontend/app/view/preview/directorypreview.tsx b/frontend/app/view/preview/directorypreview.tsx index 44a155dd2..36c299730 100644 --- a/frontend/app/view/preview/directorypreview.tsx +++ b/frontend/app/view/preview/directorypreview.tsx @@ -29,7 +29,7 @@ import clsx from "clsx"; import dayjs from "dayjs"; import { PrimitiveAtom, atom, useAtom, useAtomValue, useSetAtom } from "jotai"; import { OverlayScrollbarsComponent, OverlayScrollbarsComponentRef } from "overlayscrollbars-react"; -import React, { Fragment, memo, useCallback, useEffect, useMemo, useRef, useState } from "react"; +import React, { Fragment, memo, useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react"; import { useDrag, useDrop } from "react-dnd"; import { quote as shellQuote } from "shell-quote"; import { debounce } from "throttle-debounce"; @@ -383,7 +383,7 @@ function DirectoryTable({ setSelectedPath((allRows[focusIndex]?.getValue("path") as string) ?? null); }, [table, focusIndex, data]); - useEffect(() => { + useLayoutEffect(() => { const rows = table.getRowModel()?.flatRows; for (const row of rows) { if (row.getValue("name") == "..") { @@ -391,7 +391,7 @@ function DirectoryTable({ return; } } - }, [table]); + }, [table, data]); const columnSizeVars = useMemo(() => { const headers = table.getFlatHeaders(); const colSizes: { [key: string]: number } = {};