Fix graphical bugs when dragging

pull/1338/head
Chris Walsh 2022-07-28 17:16:03 -07:00
parent 934d569bb2
commit 88d1c19454
No known key found for this signature in database
GPG Key ID: 28EE0CCA6032019E
1 changed files with 28 additions and 25 deletions

View File

@ -62,33 +62,36 @@ export default function WebsiteList({ websites, showCharts, limit }) {
{changeOrderMode ? ( {changeOrderMode ? (
<DragDropContext onDragEnd={handleWebsiteDrag}> <DragDropContext onDragEnd={handleWebsiteDrag}>
<Droppable droppableId={dragId}> <Droppable droppableId={dragId}>
{provided => ( {(provided, snapshot) => (
<div {...provided.droppableProps} ref={provided.innerRef}> <div
{...provided.droppableProps}
ref={provided.innerRef}
style={{ marginBottom: snapshot.isDraggingOver ? 260 : null }}
>
{ordered.map(({ website_id, name, domain }, index) => {ordered.map(({ website_id, name, domain }, index) =>
index < limit ? ( index < limit ? (
<div key={website_id} className={styles.website}> <Draggable
<Draggable key={website_id}
key={website_id} draggableId={`${dragId}-${website_id}`}
draggableId={`${dragId}-${website_id}`} index={index}
index={index} >
> {provided => (
{provided => ( <div
<div ref={provided.innerRef}
ref={provided.innerRef} {...provided.draggableProps}
{...provided.draggableProps} {...provided.dragHandleProps}
{...provided.dragHandleProps} className={styles.website}
> >
<WebsiteChart <WebsiteChart
websiteId={website_id} websiteId={website_id}
title={name} title={name}
domain={domain} domain={domain}
showChart={showCharts} showChart={changeOrderMode ? false : showCharts}
showLink showLink
/> />
</div> </div>
)} )}
</Draggable> </Draggable>
</div>
) : null, ) : null,
)} )}
</div> </div>