Как получить элемент через ref в React-dnd?

Question

[Denis_1334]

Допустим есть компонент:

import React, {useRef, useEffect} from 'react'
import {useDrop} from "react-dnd";

const CreateCeil = (props) => {
    let [extra, dropShip] = useDrop({
        accept:'ship',
        drop: (item, monitor) => console.log(item),
        collect: monitor => {
            if(monitor.isOver() === true) {
                props.insertShip(props.props.id, monitor.getItem())
            }
        }
    })

    const ref = useRef();
    useEffect(() => {
        const rect = ref.current.getBoundingClientRect()
        console.log(rect)
    })

    return (
        <div ref={[dropShip, ref]} />
    )
}

При использовании react-dnd я добавляю ref, который я получаю с хука useDrop, к элементу , чтобы их связать.
Как я при это могу вызвать метод getBoundingClientRect() элемента, если 2 ref'а я не могу использовать, поэтому я не могу отдельно для getBoundingClientRect использовать useRef(), как можно по-другому сделать ?