divitem

libs/remix-ui/workspace/src/lib/components/flat-tree.tsx

@@ -64,7 +64,7 @@ export const FlatTree = (props: FlatTreeProps) => {
 
   useEffect(() => {
     console.log('PROP flat tree changed', props.flatTree)
-  },[props.flatTree])
+  }, [props.flatTree])
 
   useEffect(() => {
   }, [expandPath, focusEdit, focusElement])
@@ -99,13 +99,13 @@ export const FlatTree = (props: FlatTreeProps) => {
 
   useEffect(() => {
     console.log('drag source', dragSource)
-    if(isDragging) {
+    if (isDragging) {
       mouseTimer = {
         path: null,
         timer: null
       }
     }
-  },[isDragging])
+  }, [isDragging])
 
   const onDragEnd = (event: SyntheticEvent) => {
     setIsDragging(false)
@@ -166,7 +166,7 @@ export const FlatTree = (props: FlatTreeProps) => {
     const boundingRect = props.treeRef.current.getBoundingClientRect()
     console.log('bounding rect', boundingRect)
     setSize(boundingRect.height - 100)
-  },[props.treeRef.current])
+  }, [props.treeRef.current])
 
 
   const Row = (index) => {
@@ -174,20 +174,22 @@ export const FlatTree = (props: FlatTreeProps) => {
     const file = flatTree[node]
     //console.log('node', node)
     return (<li
-      className={`d-flex flex-row align-items-center ${labelClass(file)}`}
+      className={`${labelClass(file)}`}
       onMouseOver={() => setHover(file.path)}
       onMouseOut={() => setHover(file.path)}
       data-type={file.isDirectory ? 'folder' : 'file'}
       data-path={`${file.path}`}
       data-id={`treeViewLitreeViewItem${file.path}`}
     >
+      <div data-id={`treeViewDivtreeViewItem${file.path}`} className={`d-flex flex-row align-items-center`}>
         {getIndentLevelDiv(file.path)}
 
         <div className={`pr-2 pl-2 ${file.isDirectory ? expandPath && expandPath.includes(file.path) ? 'fa fa-folder-open' : 'fa fa-folder' : getPathIcon(file.path)} caret caret_tv`}></div>
         {focusEdit && file.path && focusEdit.element === file.path ?
-        <FlatTreeItemInput editModeOff={editModeOff} file={file}/>:
+          <FlatTreeItemInput editModeOff={editModeOff} file={file} /> :
           <div draggable={true} onDragStart={onDragStart} onDragEnd={onDragEnd} className={`ml-1 pl-2 text-nowrap remixui_leaf ${getFileStateClasses(file)}`} data-label-type={file.isDirectory ? 'folder' : 'file'} data-label-path={`${file.path}`} key={index}>{file.name}
           </div>}
+      </div>
     </li>)
   }