Add collapse all button

edan-bainglass · Jan 3, 2025 · bbc6781 · bbc6781
1 parent dba1dfd
commit bbc6781
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 9 deletions.
diff --git a/src/aiidalab_qe/app/result/components/status/status.py b/src/aiidalab_qe/app/result/components/status/status.py
@@ -231,6 +231,10 @@ def __init__(
         self.branches.add_class("tree-node-branches")
         self.children += (self.branches,)
 
+    @property
+    def collapsed(self):
+        return self.toggle.icon == "plus"
+
     def update(self, node=None):
         node = node or orm.load_node(self.uuid)
         super().update(node)
@@ -240,6 +244,13 @@ def update(self, node=None):
         for branch in self.branches.children:
             branch.update()
 
+    def collapse(self):
+        if not self.collapsed:
+            self.toggle.click()
+        for branch in self.branches.children:
+            if isinstance(branch, WorkChainTreeNode):
+                branch.collapse()
+
     def _build_header(self, node, level):
         super()._build_header(node, level)
         self.toggle = ipw.Button(icon="plus")
@@ -299,7 +310,7 @@ def _get_tally(self, node):
         return f"{finished}/{total} job{'s' if total > 1 else ''}"
 
     def _toggle_branches(self, _):
-        if self.toggle.icon == "plus":
+        if self.collapsed:
             self.branches.add_class("open")
             self.toggle.icon = "minus"
         else:
@@ -359,11 +370,25 @@ def __init__(self, model: SimplifiedProcessTreeModel, **kwargs):
     def render(self):
         if self.rendered:
             return
+        self.collapse_button = ipw.Button(
+            description="Collapse all",
+            button_style="warning",
+            icon="minus",
+            tooltip="Collapse all branches",
+            layout=ipw.Layout(
+                width="fit-content",
+                margin="0 0 10px 0",
+            ),
+        )
+        self.collapse_button.on_click(self._collapse_all)
         root = self._model.fetch_process_node()
         self.trunk = WorkChainTreeNode(node=root, on_inspect=self._on_inspect)
         self.rendered = True
         self._update()
-        self.children = [self.trunk]
+        self.children = [
+            self.collapse_button,
+            self.trunk,
+        ]
 
     def _on_process_change(self, _):
         self._update()
@@ -378,3 +403,6 @@ def _on_inspect(self, uuid):
     def _update(self):
         if self.rendered:
             self.trunk.update()
+
+    def _collapse_all(self, _):
+        self.trunk.collapse()
diff --git a/src/aiidalab_qe/app/static/styles/custom.css b/src/aiidalab_qe/app/static/styles/custom.css
@@ -119,7 +119,6 @@ footer {
 
 .simplified-process-tree .widget-button {
   height: fit-content;
-  line-height: 1.5;
 }
 
 .simplified-process-tree .tree-node-toggle:focus:enabled,
@@ -140,11 +139,16 @@ footer {
   -o-transition: color 0.15s ease-in-out;
 }
 
-.simplified-process-tree .tree-node-toggle {
+.simplified-process-tree .tree-node-toggle,
+.simplified-process-tree .calculation-link {
   width: fit-content;
+  line-height: 1.5;
   padding: 0;
+  background: white;
+}
+
+.simplified-process-tree .tree-node-toggle {
   margin-right: 6px;
-  background-color: white;
 }
 
 .simplified-process-tree .tree-node-toggle:hover:enabled,
@@ -158,10 +162,6 @@ footer {
 }
 
 .simplified-process-tree .calculation-link {
-  text-align: left;
-  padding: 0;
-  width: fit-content;
-  background: white;
   color: var(--color-info);
 }