Where are react-dnd connectors used

I'm reading react-dnd docs. I cannot understand what is this connectDropTarget used for (https://react-dnd.github.io/react-dnd/docs/overview#connectors):

Is this an obsolete way of connecting React elements to the DND system, that has been replaced with second item of useDrag and useDrop hooks (the one that gets attached to ref, check example below), or where is this used?

Example:

const [collectedProps, drop] = useDrop(() => ({
    accept
}));

return <div ref={drop}>Drop Target</div>;