Elgato_dark/waveterm
1
0
Fork 0
mirror of https://github.com/wavetermdev/waveterm synced 2026-05-23 08:48:28 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

fix directory scroll into view (#1901)

Browse source
This commit is contained in:
Mike Sawka 2025-02-04 17:49:27 -08:00 committed by GitHub
parent affd846388
commit 3c5ff51cd0
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 22 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

31
frontend/app/view/preview/directorypreview.tsx
View file

@ -31,6 +31,8 @@ import { quote as shellQuote } from "shell-quote";
import { debounce } from "throttle-debounce";
import "./directorypreview.scss";
const PageJumpSize = 20;
declare module "@tanstack/react-table" {
interface TableMeta<TData extends RowData> {
updateName: (path: string) => void;
@ -493,18 +495,21 @@ function TableBody({
const viewportHeight = viewport.offsetHeight;
const rowElement = rowRefs.current[focusIndex];
const rowRect = rowElement.getBoundingClientRect();
const parentRect = bodyRef.current.getBoundingClientRect();
const parentRect = viewport.getBoundingClientRect();
const viewportScrollTop = viewport.scrollTop;
const rowTopRelativeToViewport = rowRect.top - parentRect.top;
const rowBottomRelativeToViewport = rowRect.bottom - parentRect.top;
if (rowTopRelativeToViewport < viewportScrollTop) {
const rowTopRelativeToViewport = rowRect.top - parentRect.top + viewport.scrollTop;
const rowBottomRelativeToViewport = rowRect.bottom - parentRect.top + viewport.scrollTop;
if (rowTopRelativeToViewport - 30 < viewportScrollTop) {
// Row is above the visible area
viewport.scrollTo({ top: rowTopRelativeToViewport });
} else if (rowBottomRelativeToViewport > viewportScrollTop + viewportHeight) {
let topVal = rowTopRelativeToViewport - 30;
if (topVal < 0) {
topVal = 0;
}
viewport.scrollTo({ top: topVal });
} else if (rowBottomRelativeToViewport + 5 > viewportScrollTop + viewportHeight) {
// Row is below the visible area
viewport.scrollTo({ top: rowBottomRelativeToViewport - viewportHeight });
const topVal = rowBottomRelativeToViewport - viewportHeight + 5;
viewport.scrollTo({ top: topVal });
}
}
// setIndexChangedFromClick(false);
@ -772,6 +777,14 @@ function DirectoryPreview({ model }: DirectoryPreviewProps) {
setFocusIndex((idx) => Math.min(idx + 1, filteredData.length - 1));
return true;
}
if (checkKeyPressed(waveEvent, "PageUp")) {
setFocusIndex((idx) => Math.max(idx - PageJumpSize, 0));
return true;
}
if (checkKeyPressed(waveEvent, "PageDown")) {
setFocusIndex((idx) => Math.min(idx + PageJumpSize, filteredData.length - 1));
return true;
}
if (checkKeyPressed(waveEvent, "Enter")) {
if (filteredData.length == 0) {
return;