Northern_Lights/cherry-studio
1
0
Fork 0
mirror of https://github.com/CherryHQ/cherry-studio.git synced 2026-01-08 22:39:36 +08:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

fix: Improve DragableList component styling and placeholder handling

Browse Source
This commit is contained in:
ousugo 2025-02-18 14:27:47 +08:00 committed by 亢奋猫
parent b2c6662192
commit de76d3fedc
1 changed files with 9 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/renderer/src/components/DragableList/index.tsx
View File

@ -46,23 +46,28 @@ const DragableList: FC<Props<any>> = ({
<DragDropContext onDragStart={onDragStart} onDragEnd={_onDragEnd}> <DragDropContext onDragStart={onDragStart} onDragEnd={_onDragEnd}>
<Droppable droppableId="droppable" {...droppableProps}> <Droppable droppableId="droppable" {...droppableProps}>
{(provided) => ( {(provided) => (
<div {...provided.droppableProps} ref={provided.innerRef} style={{ ...style }}> <div {...provided.droppableProps} ref={provided.innerRef} style={style}>
{list.map((item, index) => { {list.map((item, index) => {
const id = item.id || item const id = item.id || item
return ( return (
<Draggable key={`draggable_${id}_${index}`} draggableId={id} index={index} {...droppableProps}> <Draggable key={`draggable_${id}_${index}`} draggableId={id} index={index}>
{(provided) => ( {(provided, snapshot) => (
<div <div
ref={provided.innerRef} ref={provided.innerRef}
{...provided.draggableProps} {...provided.draggableProps}
{...provided.dragHandleProps} {...provided.dragHandleProps}
style={{ ...provided.draggableProps.style, marginBottom: 8, ...listStyle }}> style={{
...listStyle,
...provided.draggableProps.style,
marginBottom: index === list.length - 1 && !snapshot.isDragging ? 0 : 8
}}>
{children(item, index)} {children(item, index)}
</div> </div>
)} )}
</Draggable> </Draggable>
) )
})} })}
{provided.placeholder}
</div> </div>
)} )}
</Droppable> </Droppable>