diff --git a/src-web/components/Sidebar.tsx b/src-web/components/Sidebar.tsx
index 168bde86..09de0115 100644
--- a/src-web/components/Sidebar.tsx
+++ b/src-web/components/Sidebar.tsx
@@ -8,7 +8,7 @@ import type {
import React, { forwardRef, Fragment, memo, useCallback, useMemo, useRef, useState } from 'react';
import type { XYCoord } from 'react-dnd';
import { DndProvider, useDrag, useDragLayer, useDrop } from 'react-dnd';
-import { HTML5Backend } from 'react-dnd-html5-backend';
+import { getEmptyImage, HTML5Backend } from 'react-dnd-html5-backend';
import { useActiveRequest } from '../hooks/useActiveRequest';
import { useCreateRequest } from '../hooks/useCreateRequest';
import { useDeleteRequest } from '../hooks/useDeleteRequest';
@@ -134,7 +134,7 @@ export function Container({ className }: Props) {
activeRequestId={activeRequest?.id}
requests={requests}
/>
- {/**/}
+
@@ -414,18 +414,15 @@ const DraggableSidebarItem = memo(function DraggableSidebarItem({
item: () => ({ id: requestId, requestName, workspaceId }),
collect: (m) => ({ isDragging: m.isDragging() }),
options: { dropEffect: 'move' },
- end: (item, monitor) => {
- if (monitor.didDrop()) {
- onEnd(requestId);
- } else {
- onCancel();
- }
+ end: () => {
+ // TODO: Call cancel if dropped outside of sidebar
+ onEnd(requestId);
},
}),
[onEnd],
);
- // preview(getEmptyImage(), { captureDraggingState: true });
+ preview(getEmptyImage(), { captureDraggingState: true });
connectDrag(ref);
connectDrop(ref);
@@ -433,7 +430,7 @@ const DraggableSidebarItem = memo(function DraggableSidebarItem({
return (
-
+
);
},