Simplify handleTextareaScroll and remove unused memoized functions in App.tsx
This commit is contained in:
101
src/App.tsx
101
src/App.tsx
@@ -319,106 +319,7 @@ export default function App() {
|
||||
const sidebarExpandIconSrc =
|
||||
theme === "light" ? sidebarExpandIconBright : sidebarExpandIcon;
|
||||
|
||||
const lines = useMemo(() => body.split("\n"), [body]);
|
||||
const lineCount = lines.length;
|
||||
|
||||
const getLineTop = useCallback(
|
||||
(index: number) => {
|
||||
const tops = lineTopsRef.current;
|
||||
return tops[index] ?? 0;
|
||||
},
|
||||
[lineNumbersVersion]
|
||||
);
|
||||
|
||||
const getTotalHeight = useCallback(() => {
|
||||
const tops = lineTopsRef.current;
|
||||
return tops[lineCount] ?? 0;
|
||||
}, [lineCount, lineNumbersVersion]);
|
||||
|
||||
const findLineAtOffset = useCallback(
|
||||
(offset: number) => {
|
||||
if (lineCount === 0) return 0;
|
||||
const tops = lineTopsRef.current;
|
||||
if (tops.length === 0) return 0;
|
||||
let low = 0;
|
||||
let high = lineCount;
|
||||
while (low < high) {
|
||||
const mid = Math.floor((low + high) / 2);
|
||||
if ((tops[mid + 1] ?? 0) <= offset) {
|
||||
low = mid + 1;
|
||||
} else {
|
||||
high = mid;
|
||||
}
|
||||
}
|
||||
return Math.min(Math.max(0, low), Math.max(0, lineCount - 1));
|
||||
},
|
||||
[lineCount]
|
||||
);
|
||||
|
||||
const updateVisibleRange = useCallback(() => {
|
||||
if (!showLineNumbersActive) return;
|
||||
const textarea = textareaRef.current;
|
||||
if (!textarea) return;
|
||||
const scrollTop = textarea.scrollTop;
|
||||
const viewportHeight = textarea.clientHeight;
|
||||
if (lineTopsRef.current.length === 0) return;
|
||||
const start = findLineAtOffset(scrollTop);
|
||||
const end = findLineAtOffset(scrollTop + viewportHeight);
|
||||
const buffer = 8;
|
||||
const nextStart = Math.max(0, start - buffer);
|
||||
const nextEnd = Math.min(lineCount - 1, end + buffer);
|
||||
setVisibleRange((prev) =>
|
||||
prev.start === nextStart && prev.end === nextEnd
|
||||
? prev
|
||||
: { start: nextStart, end: nextEnd }
|
||||
);
|
||||
}, [defaultLineHeight, findLineAtOffset, lineCount, showLineNumbersActive]);
|
||||
|
||||
const totalLineNumberHeight = useMemo(
|
||||
() => (showLineNumbersActive ? getTotalHeight() : 0),
|
||||
[getTotalHeight, showLineNumbersActive]
|
||||
);
|
||||
|
||||
const visibleLineNumbers = useMemo(() => {
|
||||
if (!showLineNumbersActive || visibleRange.end < visibleRange.start) return [];
|
||||
const items: { line: number; top: number; height: number }[] = [];
|
||||
for (let i = visibleRange.start; i <= visibleRange.end; i += 1) {
|
||||
const height = lineHeightsRef.current[i] || defaultLineHeight || 0;
|
||||
items.push({
|
||||
line: i + 1,
|
||||
top: getLineTop(i),
|
||||
height
|
||||
});
|
||||
}
|
||||
return items;
|
||||
}, [
|
||||
defaultLineHeight,
|
||||
getLineTop,
|
||||
lineNumbersVersion,
|
||||
showLineNumbersActive,
|
||||
visibleRange.end,
|
||||
visibleRange.start
|
||||
]);
|
||||
|
||||
const scheduleUpdateVisibleRange = useCallback(() => {
|
||||
if (scrollRafRef.current) {
|
||||
cancelAnimationFrame(scrollRafRef.current);
|
||||
}
|
||||
scrollRafRef.current = requestAnimationFrame(() => {
|
||||
updateVisibleRange();
|
||||
});
|
||||
}, [updateVisibleRange]);
|
||||
|
||||
const handleTextareaScroll = useCallback(
|
||||
(event: React.UIEvent<HTMLTextAreaElement>) => {
|
||||
if (!showLineNumbersActive) return;
|
||||
if (lineNumbersRef.current) {
|
||||
lineNumbersRef.current.scrollTop = event.currentTarget.scrollTop;
|
||||
}
|
||||
scheduleUpdateVisibleRange();
|
||||
},
|
||||
[scheduleUpdateVisibleRange, showLineNumbersActive]
|
||||
);
|
||||
const handleTextareaScroll = useCallback(() => {}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (!showLineNumbersActive) return;
|
||||
|
||||
Reference in New Issue
Block a user