How to get an element via ref in React-dnd?

Question

React

Let's say we have a component:

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]} />
    )
}

When using react-dnd, I add the ref I get from the useDrop hook to the element to link them.
How can I call the element's getBoundingClientRect() method if I can't use 2 refs, so I can't use useRef() separately for getBoundingClientRect , how can I do it differently?