Handle page and arrow keys

This commit is contained in:
Nicolas Mowen 2024-05-29 11:18:05 -06:00
parent 0306391681
commit b5a6413ad3

View File

@ -20,6 +20,7 @@ import ActivityIndicator from "@/components/indicators/activity-indicator";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
import { MdVerticalAlignBottom } from "react-icons/md"; import { MdVerticalAlignBottom } from "react-icons/md";
import { parseLogLines } from "@/utils/logUtil"; import { parseLogLines } from "@/utils/logUtil";
import useKeyboardListener from "@/hooks/use-keyboard-listener";
type LogRange = { start: number; end: number }; type LogRange = { start: number; end: number };
@ -226,6 +227,40 @@ function Logs() {
const [selectedLog, setSelectedLog] = useState<LogLine>(); const [selectedLog, setSelectedLog] = useState<LogLine>();
// interaction
useKeyboardListener(
["PageDown", "PageUp", "ArrowDown", "ArrowUp"],
(key, down, _) => {
if (!down) {
return;
}
switch (key) {
case "PageDown":
contentRef.current?.scrollBy({
top: 480,
});
break;
case "PageUp":
contentRef.current?.scrollBy({
top: -480,
});
break;
case "ArrowDown":
contentRef.current?.scrollBy({
top: 48,
});
break;
case "ArrowUp":
contentRef.current?.scrollBy({
top: -48,
});
break;
}
},
);
return ( return (
<div className="flex size-full flex-col p-2"> <div className="flex size-full flex-col p-2">
<Toaster position="top-center" closeButton={true} /> <Toaster position="top-center" closeButton={true} />