connect.dragLayer is not a function

[jamesdbrock]

I'm trying to use DragDrop.dragLayer :: DragLayerProps item -> JSX so that I can render a drag ghost with opacity:0.2. Every way I try it, I get the exception:

TypeError: connect.dragLayer is not a function

thrown from here:

https://github.com/lumihq/purescript-react-dnd-basic/blob/e3a5a49654e843dea6ab363511ca7ae8ac3dfa49/src/React/Basic/ReactDND.js#L161

And in fact there is no dragLayer function in connect:

* connect: DragDropMonitor
  * store: {dispatch: ƒ, subscribe: ƒ, getState: ƒ, replaceReducer: ƒ, Symbol(observable): ƒ}
  * registry: HandlerRegistry {store: {…}, types: {…}, handlers: {…}, pinnedSourceId: null, pinnedSource: null}
  * __proto__:
    * constructor: ƒ DragDropMonitor(store)
    * subscribeToStateChange: ƒ subscribeToStateChange(listener)
    * subscribeToOffsetChange: ƒ subscribeToOffsetChange(listener)
    * canDragSource: ƒ canDragSource(sourceId)
    * canDropOnTarget: ƒ canDropOnTarget(targetId)
    * isDragging: ƒ isDragging()
    * isDraggingSource: ƒ isDraggingSource(sourceId)
    * isOverTarget: ƒ isOverTarget(targetId)
    * getItemType: ƒ getItemType()
    * getItem: ƒ getItem()
    * getSourceId: ƒ getSourceId()
    * getTargetIds: ƒ getTargetIds()
    * getDropResult: ƒ getDropResult()
    * didDrop: ƒ didDrop()
    * isSourcePublic: ƒ isSourcePublic()
    * getInitialClientOffset: ƒ getInitialClientOffset()
    * getInitialSourceClientOffset: ƒ getInitialSourceClientOffset()
    * getClientOffset: ƒ getClientOffset()
    * getSourceClientOffset: ƒ getSourceClientOffset()
    * getDifferenceFromInitialOffset: ƒ getDifferenceFromInitialOffset()
    * __proto__: Object

I'm depending on purescript-react-dnd-basic v6.1.4 with react-dnd v2.6.0.

It's not obvious to me how to use DragDrop.dragLayer. Should it be a parent or child of DragDrop.dragSource? Is this feature known to work in purescript-react-dnd-basic? Is there an example somewhere of how to use it?

[jamesdbrock]

https://github.com/react-dnd/react-dnd/blob/v2.6.0/packages/dnd-core/src/DragDropMonitor.js

[maddie927]

I'm not sure tbh, sorry. We aren't using this much at the moment, and are currently leaning towards replacing the one place it's used rather than updating it. If you end up figuring it out and make a PR I'll merge it, but it might be better to build something new off of the latest react-dnd or use the browser drag and drop api directly (hooks and refs might help with this).

[jamesdbrock]

Okay thank you @spicydonuts

[maddie927]

I don't mind leaving this open though, since there does seem to be an issue

[maddie927]

#12 probably obsoletes this issue