Unable to find any drag handles in the context "1"

[Android789515]

I have created a custom component that takes children and wraps them in the Draggable. I am cloning the children and passing the props to them from the provided object.

import React from 'react'
import { v4 as uuid } from 'uuid'
import { Draggable } from 'react-beautiful-dnd'

interface Props {
    index: number
}

const DraggableDnD: React.FC<Props> = (props) => {
    return (
        <Draggable draggableId={uuid()} index={props.index}>
            {({ innerRef, draggableProps, dragHandleProps }) => {
                if (React.isValidElement(props.children)) {
                    const propsToPass = {
                        innerRef: innerRef,
                        ...props.children.props,
                        ...draggableProps,
                        ...dragHandleProps
                    }

                    return React.cloneElement(props.children, propsToPass)
                }

                return <></>
            }}
        </Draggable>
    )
}

export default DraggableDnD

[Android789515]

Simplified my code a lot and no longer needed to clone anything, fixed my issue. I would still like to know why I was encountering the error though.

[zakim2307]

hey what did you do im getting the same error