diff --git a/libs/remix-ui/workspace/src/lib/components/file-explorer.tsx b/libs/remix-ui/workspace/src/lib/components/file-explorer.tsx index 7f01af90c2..69a760b8ef 100644 --- a/libs/remix-ui/workspace/src/lib/components/file-explorer.tsx +++ b/libs/remix-ui/workspace/src/lib/components/file-explorer.tsx @@ -365,52 +365,46 @@ export const FileExplorer = (props: FileExplorerProps) => { display: 'flex', flexDirection: 'column' }} - className="h-100" + className="h-100 ml-0 pl-1" > - -
  • -
    - -
    - -
    -
    -
    -
  • -
    -
    - -
    + +
    +
    + +
    + +
    +
    - +
    +
    ) diff --git a/libs/remix-ui/workspace/src/lib/components/flat-tree-drop.tsx b/libs/remix-ui/workspace/src/lib/components/flat-tree-drop.tsx index 0a7449c4fc..e1d7fc72c5 100644 --- a/libs/remix-ui/workspace/src/lib/components/flat-tree-drop.tsx +++ b/libs/remix-ui/workspace/src/lib/components/flat-tree-drop.tsx @@ -82,5 +82,6 @@ export const FlatTreeDrop = (props: FlatTreeDropProps) => { return (
    {props.children}
    ) } \ No newline at end of file diff --git a/libs/remix-ui/workspace/src/lib/components/flat-tree.tsx b/libs/remix-ui/workspace/src/lib/components/flat-tree.tsx index 5787a5e1b2..639e3f93d4 100644 --- a/libs/remix-ui/workspace/src/lib/components/flat-tree.tsx +++ b/libs/remix-ui/workspace/src/lib/components/flat-tree.tsx @@ -38,7 +38,6 @@ interface FlatTreeProps { handleContextMenu: (pageX: number, pageY: number, path: string, content: string, type: string) => void handleTreeClick: (e: SyntheticEvent) => void handleClickFolder: (path: string, type: string) => void - treeRef: React.MutableRefObject moveFile: (dest: string, src: string) => void moveFolder: (dest: string, src: string) => void fileState: fileDecoration[] @@ -68,8 +67,9 @@ export const FlatTree = (props: FlatTreeProps) => { const [isDragging, setIsDragging] = useState(false) const ref = useRef(null) const [size, setSize] = useState(0) + const containerRef = useRef(null) - const isOnScreen = useOnScreen(props.treeRef) + const isOnScreen = useOnScreen(containerRef) useEffect(() => { if (isOnScreen) { @@ -176,8 +176,8 @@ export const FlatTree = (props: FlatTreeProps) => { const setViewPortHeight = () => { - const boundingRect = props.treeRef.current.getBoundingClientRect() - setSize(boundingRect.height - 100) + const boundingRect = containerRef.current.getBoundingClientRect() + setSize(boundingRect.height-40) } @@ -190,13 +190,13 @@ export const FlatTree = (props: FlatTreeProps) => { useEffect(() => { setViewPortHeight() - }, [props.treeRef.current]) + }, [containerRef.current]) const Row = (index: number) => { const node = Object.keys(flatTree)[index] const file = flatTree[node] - return (
  • setHover(file.path)} onMouseOut={() => setHover(file.path)} @@ -207,7 +207,7 @@ export const FlatTree = (props: FlatTreeProps) => {
    {getIndentLevelDiv(file.path)} -
    +
    {focusEdit && file.path && focusEdit.element === file.path ? {
    } -
  • ) + ) } return (<> +
    { handleClickFolder={handleClickFolder} expandPath={expandPath} > -
    +
    {showMouseOverTarget && mouseOverTarget && !isDragging && { } Row(index)} />
    +
    ) } \ No newline at end of file