ChatGPT-Next-Web/app/hooks/useRows.ts

35 lines
777 B
TypeScript

import { useState } from "react";
import { useDebouncedCallback } from "use-debounce";
import { autoGrowTextArea } from "../utils";
import useMobileScreen from "./useMobileScreen";
export default function useRows({
inputRef,
}: {
inputRef: React.RefObject<HTMLTextAreaElement>;
}) {
const [inputRows, setInputRows] = useState(2);
const isMobileScreen = useMobileScreen();
const measure = useDebouncedCallback(
() => {
const rows = inputRef.current ? autoGrowTextArea(inputRef.current) : 1;
const inputRows = Math.min(
20,
Math.max(2 + (isMobileScreen ? -1 : 1), rows),
);
setInputRows(inputRows);
},
100,
{
leading: true,
trailing: true,
},
);
return {
inputRows,
measure,
};
}