mirror of
https://github.com/mountain-loop/yaak.git
synced 2026-04-25 10:18:31 +02:00
Improve handling of drag-and-drop for collapsed and empty folders in tree component
This commit is contained in:
@@ -265,17 +265,13 @@ function TreeInner<T extends { id: string }>(
|
|||||||
let hoveredChildIndex = selectableItem.index + (side === 'above' ? 0 : 1);
|
let hoveredChildIndex = selectableItem.index + (side === 'above' ? 0 : 1);
|
||||||
|
|
||||||
const collapsedMap = jotaiStore.get(collapsedFamily(treeId));
|
const collapsedMap = jotaiStore.get(collapsedFamily(treeId));
|
||||||
const isHoveredItemCollapsed = hovered != null ? collapsedMap[hovered.item.id] : false;
|
const isHoveredItemCollapsed =
|
||||||
|
hovered != null ? hovered.children?.length === 0 || collapsedMap[hovered.item.id] : false;
|
||||||
|
|
||||||
if (hovered?.children != null && side === 'below') {
|
if (hovered?.children != null && side === 'below' && isHoveredItemCollapsed) {
|
||||||
// Move into the folder if it's open and we're moving below it
|
// Move into the folder if it's open and we're moving below it
|
||||||
if (isHoveredItemCollapsed) {
|
hoveredParent = hovered;
|
||||||
hoveredParent = hovered;
|
hoveredChildIndex = 0;
|
||||||
hoveredChildIndex = 0;
|
|
||||||
} else {
|
|
||||||
hoveredParent = hovered;
|
|
||||||
hoveredChildIndex = 0;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const parentId = hoveredParent?.item.id ?? null;
|
const parentId = hoveredParent?.item.id ?? null;
|
||||||
|
|||||||
@@ -24,8 +24,8 @@ export const TreeDropMarker = memo(function TreeDropMarker<T extends { id: strin
|
|||||||
// Only show if we're hovering over this index
|
// Only show if we're hovering over this index
|
||||||
if (!isHovered) return null;
|
if (!isHovered) return null;
|
||||||
|
|
||||||
// Don't show if we're right under a collapsed folder, or empty folder. We have a separate delayed expansion
|
// Don't show if we're right under a collapsed folder, or empty folder. We have a separate
|
||||||
// animation for that.
|
// delayed expansion animation for that.
|
||||||
if (collapsed || node?.children?.length === 0) return null;
|
if (collapsed || node?.children?.length === 0) return null;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|||||||
Reference in New Issue
Block a user