temporary solution for tree bug

This commit is contained in:
Sina Blattmann 2023-03-17 10:19:05 +01:00
parent 1326ee7aee
commit 19b399806c
2 changed files with 15 additions and 7 deletions

View File

@ -1,7 +1,7 @@
import { useEffect, useState, useContext, useRef } from "react"; import { useEffect, useState, useContext } from "react";
import axiosConfig from "../../../config/axiosConfig"; import axiosConfig from "../../../config/axiosConfig";
import { I_Folder, I_Installation } from "../../../util/types"; import { I_Folder, I_Installation } from "../../../util/types";
import { Alert, Button, CircularProgress, Grid } from "@mui/material"; import { Alert, CircularProgress, Grid } from "@mui/material";
import { DndProvider } from "react-dnd"; import { DndProvider } from "react-dnd";
import { import {
MultiBackend, MultiBackend,
@ -67,7 +67,7 @@ const GroupTree = () => {
<ScrollingComponent className={styles.treeContainer}> <ScrollingComponent className={styles.treeContainer}>
<Tree<I_Installation | I_Folder> <Tree<I_Installation | I_Folder>
tree={tree} tree={tree}
rootId={-1} rootId={0}
dragPreviewRender={(monitorProps) => ( dragPreviewRender={(monitorProps) => (
<DragPreview monitorProps={monitorProps} /> <DragPreview monitorProps={monitorProps} />
)} )}
@ -94,10 +94,10 @@ const GroupTree = () => {
tree: NodeModel<I_Folder | I_Installation>[], tree: NodeModel<I_Folder | I_Installation>[],
options: DropOptions<I_Folder | I_Installation> options: DropOptions<I_Folder | I_Installation>
) => handleDrop(tree, options)} ) => handleDrop(tree, options)}
onChangeOpen={(nodes) => { onChangeOpen={(nodeIds: (number | string)[]) =>
console.log(nodes); setOpenNodes(nodeIds)
setOpenNodes(nodes); }
}} initialOpen={openNodes}
/> />
</ScrollingComponent> </ScrollingComponent>
<InnovenergySnackbar <InnovenergySnackbar

View File

@ -34,6 +34,13 @@ const TreeNode = (props: TreeNodeProps) => {
const isSelected = routeMatch?.params.id === node.data?.id.toString(); const isSelected = routeMatch?.params.id === node.data?.id.toString();
const handleToggle = (e: React.MouseEvent) => { const handleToggle = (e: React.MouseEvent) => {
setTimeout(
() =>
document
.getElementById(node.id.toString())
?.scrollIntoView({ block: "center" }),
0
);
e.stopPropagation(); e.stopPropagation();
onToggle(node.id); onToggle(node.id);
}; };
@ -46,6 +53,7 @@ const TreeNode = (props: TreeNodeProps) => {
return ( return (
<div <div
id={node.id.toString()}
className={`tree-node ${styles.root} ${ className={`tree-node ${styles.root} ${
isSelected ? styles.selected : "" isSelected ? styles.selected : ""
}`} }`}