Fix drop marker indent

This commit is contained in:
Gregory Schier
2023-11-04 11:16:41 -07:00
parent 7755d06bba
commit ad470a3fd2
2 changed files with 4 additions and 7 deletions

View File

@@ -3,16 +3,14 @@ import React, { memo } from 'react';
interface Props {
className?: string;
depth: number;
}
export const DropMarker = memo(
function DropMarker({ className, depth }: Props) {
function DropMarker({ className }: Props) {
return (
<div
className={classNames(
className,
depth > 0 ? 'ml-5' : 'ml-0',
'relative w-full h-0 overflow-visible pointer-events-none',
)}
>

View File

@@ -403,9 +403,8 @@ function SidebarItems({
>
{tree.children.map((child, i) => (
<Fragment key={child.item.id}>
{hoveredIndex === i && hoveredTree?.item.id === tree.item.id && (
<DropMarker depth={tree.depth} />
)}
{hoveredIndex === i && hoveredTree?.item.id === tree.item.id && <DropMarker />}
{hoveredIndex === i && hoveredTree?.item.id === tree.item.id && <DropMarker />}
<DraggableSidebarItem
selected={selectedId === child.item.id}
itemId={child.item.id}
@@ -441,7 +440,7 @@ function SidebarItems({
</Fragment>
))}
{hoveredIndex === tree.children.length && hoveredTree?.item.id === tree.item.id && (
<DropMarker depth={tree.depth} />
<DropMarker />
)}
</VStack>
);