ConceptProd/ConceptPortal-public
1
0
Fork 0
mirror of https://github.com/IRBorisov/ConceptPortal.git synced 2025-06-26 13:00:39 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

R: Improve conditional hook performance

Browse Source
This commit is contained in:
Ivan 2024-10-30 21:41:52 +03:00
parent 678079192a
commit 06f59e3ed3
3 changed files with 8 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
rsconcept/frontend/src/hooks/useClickedOutside.ts
View File

@ -4,10 +4,13 @@ import { useEffect } from 'react';
import { assertIsNode } from '@/utils/utils';
function useClickedOutside({ ref, callback }: { ref: React.RefObject<HTMLElement>; callback?: () => void }) {
function useClickedOutside(enabled: boolean, ref: React.RefObject<HTMLElement>, callback?: () => void) {
useEffect(() => {
if (!enabled) {
return;
}
function handleClickOutside(event: MouseEvent) {
console.log(1);
assertIsNode(event.target);
if (ref.current && !ref.current.contains(event.target)) {
if (callback) callback();
@ -17,7 +20,7 @@ function useClickedOutside({ ref, callback }: { ref: React.RefObject<HTMLElement
return () => {
document.removeEventListener('mouseup', handleClickOutside);
};
}, [ref, callback]);
}, [ref, callback, enabled]);
}
export default useClickedOutside;

2
rsconcept/frontend/src/hooks/useDropdown.ts
View File

@ -8,7 +8,7 @@ function useDropdown() {
const [isOpen, setIsOpen] = useState(false);
const ref = useRef(null);
useClickedOutside({ ref, callback: () => setIsOpen(false) });
useClickedOutside(isOpen, ref, () => setIsOpen(false));
return {
ref,

2
rsconcept/frontend/src/pages/OssPage/EditorOssGraph/NodeContextMenu.tsx
View File

@ -77,7 +77,7 @@ function NodeContextMenu({
onHide();
}, [onHide]);
useClickedOutside({ ref, callback: handleHide });
useClickedOutside(isOpen, ref, handleHide);
useEffect(() => setIsOpen(true), []);