Хочу сделать dnd в upload itemRender

Не могу найти примеры реализации драг ен дропа в itemRender использую ant design Пример на ant design есть но он с react-dnd и немного отличается от beautiful помогите кто сталкивался с таким

return (
    <DragDropContext
        onDragEnd={handleOnDragEnd}>
        <Form.Item
            name={fieldName}
            valuePropName="fileList"
            getValueFromEvent={getValueFromEvent}
            noStyle
        >
            <Droppable
                direction="horizontal"
                droppableId="dnd">
                {(provided, snapshot) => (
                    <div {...provided.droppableProps}
                         style={getListStyle(snapshot.isDraggingOver)}
                         ref={provided.innerRef}>
                        <Upload
                            name={fileFieldName}
                            action={UPLOAD_URL}
                            headers={getAuthHeaders()}
                            listType="picture-card"
                            data={(file: any) => {
                                return {
                                    filename: file.name,
                                    field: fileFieldName,
                                    model: model
                                }
                            }}
                            maxCount={maxCount}
                            itemRender={(first, item, arr) => (
                                <Draggable key={arr.indexOf(item)}
                                           draggableId={`${arr.indexOf(item)}`}
                                           index={arr.indexOf(item)}>
                                    {(provided, snapshot) => (
                                        <div key={arr.indexOf(item)}
                                             ref={provided.innerRef}
                                             {...provided.draggableProps}
                                             {...provided.dragHandleProps}
                                             style={getItemStyle(
                                                 snapshot.isDragging,
                                                 provided.draggableProps.style
                                             )}>{first}</div>
                                    )}
                                </Draggable>
                            )}
                        >
                            <UploadButton />
                        </Upload>
                        {provided.placeholder}
                    </div>
                )}
            </Droppable>
        </Form.Item>
    </DragDropContext>
);

Ответы (0 шт):