react-dnd/lib/hooks/internal/useCollector.js

Drag and Drop for React

import shallowEqual from 'shallowequal';
import { useState, useCallback, useLayoutEffect } from 'react';
/**
 *
 * @param monitor The monitor to collect state from
 * @param collect The collecting function
 * @param onUpdate A method to invoke when updates occur
 */
export function useCollector(monitor, collect, onUpdate) {
    const [collected, setCollected] = useState(() => collect(monitor));
    const updateCollected = useCallback(() => {
        const nextValue = collect(monitor);
        if (!shallowEqual(collected, nextValue)) {
            setCollected(nextValue);
            if (onUpdate) {
                onUpdate();
            }
        }
    }, [collected, monitor, onUpdate]);
    // update the collected properties after the first render
    // and the components are attached to dnd-core
    useLayoutEffect(updateCollected, []);
    return [collected, updateCollected];
}