mirror of
https://github.com/IRBorisov/ConceptPortal.git
synced 2025-06-26 04:50:36 +03:00
R: Improve conditional hook performance
This commit is contained in:
parent
678079192a
commit
06f59e3ed3
|
@ -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;
|
||||
|
|
|
@ -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,
|
||||
|
|
|
@ -77,7 +77,7 @@ function NodeContextMenu({
|
|||
onHide();
|
||||
}, [onHide]);
|
||||
|
||||
useClickedOutside({ ref, callback: handleHide });
|
||||
useClickedOutside(isOpen, ref, handleHide);
|
||||
|
||||
useEffect(() => setIsOpen(true), []);
|
||||
|
||||
|
|
Loading…
Reference in New Issue
Block a user