19302: fixed duplicated expand Arvados-DCO-1.1-Signed-off-by: Lisa Knox <lisa.knox...
authorLisa Knox <lisaknox83@gmail.com>
Thu, 2 Nov 2023 13:38:41 +0000 (09:38 -0400)
committerLisa Knox <lisaknox83@gmail.com>
Thu, 2 Nov 2023 13:38:41 +0000 (09:38 -0400)
src/components/tree/tree.tsx
src/store/side-panel-tree/side-panel-tree-actions.ts

index 9a2c0b484406f5d675a53d920017372c799253c9..d275cc0bed3282562750f868715ba7eebd5e169d 100644 (file)
@@ -14,6 +14,7 @@ import { ArvadosTheme } from 'common/custom-theme';
 import { SidePanelRightArrowIcon } from '../icon/icon';
 import { ResourceKind } from 'models/resource';
 import { GroupClass } from 'models/group';
+import { SidePanelTreeCategory } from 'store/side-panel-tree/side-panel-tree-actions';
 
 type CssRules = 'list'
     | 'listItem'
@@ -100,6 +101,7 @@ export enum TreeItemStatus {
 
 export interface TreeItem<T> {
     data: T;
+    depth?: number;
     id: string;
     open: boolean;
     active: boolean;
@@ -156,6 +158,10 @@ const getActionAndId = (event: any, initAction: string | undefined = undefined)
     return [action, id];
 };
 
+const isInFavoritesTree = (item: TreeItem<any>): boolean => {
+    return item.id === SidePanelTreeCategory.FAVORITES || item.id === SidePanelTreeCategory.PUBLIC_FAVORITES;
+}
+
 interface FlatTreeProps {
     it: TreeItem<any>;
     levelIndentation: number;
@@ -241,11 +247,11 @@ const FlatTree = (props: FlatTreeProps) =>
                 .map((item: any) => <div key={item.id} data-id={item.id}
                     className={classnames(props.classes.childItem, { [props.classes.active]: item.active })}
                     style={{ paddingLeft: `${item.depth * props.levelIndentation}px` }}>
-                    <i data-action={FLAT_TREE_ACTIONS.toggleOpen} className={props.classes.toggableIconContainer}>
+                    {!isInFavoritesTree(props.it) && <i data-action={FLAT_TREE_ACTIONS.toggleOpen} className={props.classes.toggableIconContainer}>
                         <ListItemIcon className={props.getToggableIconClassNames(item.open, item.active)}>
                             {props.getProperArrowAnimation(item.status, item.items!)}
                         </ListItemIcon>
-                    </i>
+                    </i>}
                     {props.showSelection(item) && !props.useRadioButtons &&
                         <Checkbox
                             checked={item.selected}
@@ -327,6 +333,9 @@ export const Tree = withStyles(styles)(
         const { levelIndentation = 20, itemRightPadding = 20 } = props;
         return <List className={list}>
             {items && items.map((it: TreeItem<T>, idx: number) => {
+                if (isInFavoritesTree(it) && it.open === true && it.items && it.items.length) {
+                    it = { ...it, items: it.items.filter(item => item.depth && item.depth < 3) }
+                }
                 return <div key={`item/${level}/${it.id}`}>
                     <ListItem button className={listItem}
                         style={{
index a76878f27f6b7dc8dadfe424b1d6342a6cf2325f..579b95505e87685bb0ebc47fd56ad69b86a6ef23 100644 (file)
@@ -115,7 +115,9 @@ const loadProject = (projectUuid: string) =>
                 .addAsc('name')
                 .getOrder()
         };
+
         const { items } = await services.projectService.list(params);
+        
         dispatch(treePickerActions.LOAD_TREE_PICKER_NODE_SUCCESS({
             id: projectUuid,
             pickerId: SIDE_PANEL_TREE,
@@ -228,7 +230,7 @@ export const toggleSidePanelTreeItemCollapse = (id: string) =>
         if (node && node.status === TreeNodeStatus.INITIAL) {
             await dispatch<any>(loadSidePanelTreeProjects(node.id));
         }
-        dispatch(treePickerActions.TOGGLE_TREE_PICKER_NODE_COLLAPSE({ id, pickerId: SIDE_PANEL_TREE }));
+            dispatch(treePickerActions.TOGGLE_TREE_PICKER_NODE_COLLAPSE({ id, pickerId: SIDE_PANEL_TREE }));
     };
 
 export const expandSidePanelTreeItem = (id: string) =>