optimize dnd drag code (#3768)

This commit is contained in:
heheer
2025-02-12 15:25:31 +08:00
committed by GitHub
parent 06a8a5e23d
commit 132cf69372
6 changed files with 17 additions and 15 deletions

View File

@@ -223,8 +223,9 @@ const VariableEdit = ({
variables={variables}
/>
)}
zoom={zoom}
>
{({ provided, snapshot, draggingItemHeight }) => (
{({ provided }) => (
<Tbody {...provided.droppableProps} ref={provided.innerRef}>
{formatVariables.map((item, index) => (
<Draggable key={item.id} draggableId={item.id} index={index}>
@@ -241,7 +242,6 @@ const VariableEdit = ({
)}
</Draggable>
))}
{snapshot.isDraggingOver && <Box height={`${draggingItemHeight / zoom}px`} />}
</Tbody>
)}
</DndDrag>

View File

@@ -209,8 +209,9 @@ const NodeFormInput = ({ data, selected }: NodeProps<FlowNodeItemType>) => {
/>
);
}}
zoom={zoom}
>
{({ provided, snapshot, draggingItemHeight }) => (
{({ provided }) => (
<Tbody {...provided.droppableProps} ref={provided.innerRef}>
{inputs.map((item, index) => {
const icon = FlowNodeInputMap[item.type as FlowNodeInputTypeEnum]?.icon;
@@ -230,7 +231,6 @@ const NodeFormInput = ({ data, selected }: NodeProps<FlowNodeItemType>) => {
</Draggable>
);
})}
{snapshot.isDraggingOver && <Box height={`${draggingItemHeight / zoom}px`} />}
</Tbody>
)}
</DndDrag>

View File

@@ -65,7 +65,7 @@ const NodeIfElse = ({ data, selected }: NodeProps<FlowNodeItemType>) => {
/>
)}
>
{({ provided, snapshot, draggingItemHeight }) => (
{({ provided }) => (
<Box {...provided.droppableProps} ref={provided.innerRef}>
{ifElseList.map((conditionItem, conditionIndex) => (
<Draggable
@@ -86,7 +86,6 @@ const NodeIfElse = ({ data, selected }: NodeProps<FlowNodeItemType>) => {
)}
</Draggable>
))}
{snapshot.isDraggingOver && <Box height={`${draggingItemHeight / zoom}px`} />}
</Box>
)}
</DndDrag>

View File

@@ -417,7 +417,7 @@ const InputTypeConfig = ({
);
}}
>
{({ provided, snapshot, draggingItemHeight }) => (
{({ provided }) => (
<Box
{...provided.droppableProps}
ref={provided.innerRef}
@@ -487,7 +487,6 @@ const InputTypeConfig = ({
)}
</Draggable>
))}
{snapshot.isDraggingOver && <Box height={`${draggingItemHeight}px`} />}
</Box>
)}
</DndDrag>

View File

@@ -62,8 +62,9 @@ const NodeUserSelect = ({ data, selected }: NodeProps<FlowNodeItemType>) => {
index={rubric.source.index}
/>
)}
zoom={zoom}
>
{({ provided, snapshot, draggingItemHeight }) => (
{({ provided }) => (
<Box ref={provided.innerRef} {...provided.droppableProps}>
{options.map((item, i) => (
<Draggable key={item.key} index={i} draggableId={item.key}>
@@ -80,7 +81,6 @@ const NodeUserSelect = ({ data, selected }: NodeProps<FlowNodeItemType>) => {
)}
</Draggable>
))}
{snapshot.isDraggingOver && <Box height={`${draggingItemHeight}px`} />}
</Box>
)}
</DndDrag>