React-dnd: Usando DragSource e DropTarget nos mesmos componentes, mas sem resposta do DropTarget

Desculpe por possivelmente usar isso como mais um fórum de ajuda, mas apesar dos grandes esforços, não consigo obter nenhuma resposta do DropTarget neste caso de uso.

Estou querendo usar uma série de 'cartões de categoria' que podem registrar eventos de queda em si mesmos.

Estou fazendo alguma besteira gritante aqui?

Posso confirmar que as funções DragSource estão funcionando, mas nada que eu log das funções de especificação DropTarget está chegando ao console, é como se elas não fossem aplicadas totalmente.

import React, { Component } from 'react'
import { DropTarget, DragSource } from 'react-dnd'
import _ from 'lodash'

export const ItemTypes = {
    CATEGORY: 'category-item'
}

class CategoryTreeFork extends Component {

    componentWillReceiveProps = (nextProps) => {
        console.log("Next cat props", nextProps)
    }

    render(){
        var { thisCat, childCat, level, dropEvent } = this.props
        const { connectDragSource, connectDropTarget, isDragging, isOver } = this.props

        return connectDragSource(
            <div className="category-tree-fork">
                <div className={`category-list-item level-${level}`}
                    style={{
                        opacity: isDragging ? 0.5 : 1,
                        backgroundColor: isOver ? "red" : "silver"
                    }}>
                    {thisCat.name}
                </div>
            </div>
        )   
    }   
}

/* get dragged */
const sourceSpec = { 
    beginDrag(props){
        return { category_id: props.thisCat.category_id }
    }   
}

const sourceCollect  = (connect, monitor) => {
    return {
        connectDragSource: connect.dragSource(),
        isDragging: monitor.isDragging()
    }
}


/* get dragged onto */
const targetSpec  = {
    drop(props, monitor, component) {
        const item = monitor.getItem()
        console.log("me or my friend?", item)
    },
    hover(props, monitor, component){
        console.log("yo what you hoverin there for homie?")
    }
}

const targetCollect = (connect, monitor) => {
    return {
        connectDropTarget: connect.dropTarget(),
        isOver: monitor.isOver()
    }
}


export default _.flow([
    DragSource(ItemTypes.CATEGORY, sourceSpec, sourceCollect),
    DropTarget(ItemTypes.CATEGORY, targetSpec, targetCollect)
])(CategoryTreeFork)