File size: 2,084 Bytes
f0743f4 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 | import { useState, useCallback } from 'react';
import type { TPlugin } from 'librechat-data-provider';
function usePluginDialogHelpers() {
const [maxPage, setMaxPage] = useState(1);
const [currentPage, setCurrentPage] = useState(1);
const [itemsPerPage, setItemsPerPage] = useState(1);
const [searchChanged, setSearchChanged] = useState(false);
const [searchValue, setSearchValue] = useState('');
const [error, setError] = useState<boolean>(false);
const [errorMessage, setErrorMessage] = useState<string>('');
const [showPluginAuthForm, setShowPluginAuthForm] = useState<boolean>(false);
const [selectedPlugin, setSelectedPlugin] = useState<TPlugin | undefined>(undefined);
const calculateColumns = (node: HTMLElement) => {
const width = node.offsetWidth;
let columns: number;
if (width < 501) {
setItemsPerPage(8);
return;
} else if (width < 640) {
columns = 2;
} else if (width < 1024) {
columns = 3;
} else {
columns = 4;
}
setItemsPerPage(columns * 2); // 2 rows
};
const gridRef: (instance: HTMLDivElement | null) => void = useCallback(
(node) => {
if (node !== null) {
if (itemsPerPage === 1) {
calculateColumns(node);
}
const resizeObserver = new ResizeObserver(() => calculateColumns(node));
resizeObserver.observe(node);
}
},
[itemsPerPage],
);
const handleSearch = (e: React.ChangeEvent<HTMLInputElement>) => {
setSearchValue(e.target.value);
setSearchChanged(true);
};
const handleChangePage = (page: number) => {
setCurrentPage(page);
};
return {
maxPage,
setMaxPage,
currentPage,
setCurrentPage,
itemsPerPage,
setItemsPerPage,
searchChanged,
setSearchChanged,
searchValue,
setSearchValue,
gridRef,
handleSearch,
handleChangePage,
error,
setError,
errorMessage,
setErrorMessage,
showPluginAuthForm,
setShowPluginAuthForm,
selectedPlugin,
setSelectedPlugin,
};
}
export default usePluginDialogHelpers;
|