From f375ba96ae919e5465b4f7fbff0e141c15e407e4 Mon Sep 17 00:00:00 2001
From: Matthias <matthias.mair@oewf.org>
Date: Tue, 7 Dec 2021 00:21:33 +0100
Subject: [PATCH] add sidetree toggler function

---
 .../part/templates/part/category_sidebar.html   |  3 +++
 InvenTree/part/templates/part/part_sidebar.html |  4 +++-
 InvenTree/templates/base.html                   |  2 +-
 InvenTree/templates/js/dynamic/nav.js           | 17 ++++++++++++++---
 4 files changed, 21 insertions(+), 5 deletions(-)

diff --git a/InvenTree/part/templates/part/category_sidebar.html b/InvenTree/part/templates/part/category_sidebar.html
index 3d945d0433..fe3f33b780 100644
--- a/InvenTree/part/templates/part/category_sidebar.html
+++ b/InvenTree/part/templates/part/category_sidebar.html
@@ -4,6 +4,9 @@
 
 {% settings_value 'PART_SHOW_IMPORT' as show_import %}
 
+{% include "sidebar_toggle.html" with target="sidetree" %}
+<a class="m-1"></a>
+
 {% trans "Subcategories" as text %}
 {% include "sidebar_item.html" with label="subcategories" text=text icon="fa-sitemap" %}
 {% trans "Parts" as text %}
diff --git a/InvenTree/part/templates/part/part_sidebar.html b/InvenTree/part/templates/part/part_sidebar.html
index 6299c6fedc..2a24623b0b 100644
--- a/InvenTree/part/templates/part/part_sidebar.html
+++ b/InvenTree/part/templates/part/part_sidebar.html
@@ -5,7 +5,9 @@
 {% settings_value "PART_INTERNAL_PRICE" as show_internal_price %}
 {% settings_value 'PART_SHOW_RELATED' as show_related %}
 
-{% include "sidebar_toggle.html" with target="#sidetree" %}
+{% include "sidebar_toggle.html" with target="sidetree" %}
+<a class="m-1"></a>
+
 {% trans "Parameters" as text %}
 {% include "sidebar_item.html" with label="part-parameters" text=text icon="fa-th-list" %}
 {% if part.is_template %}
diff --git a/InvenTree/templates/base.html b/InvenTree/templates/base.html
index 70abcca433..4ec04b4ff8 100644
--- a/InvenTree/templates/base.html
+++ b/InvenTree/templates/base.html
@@ -74,7 +74,7 @@
 <div class='main body wrapper container-fluid inventree-body'>
 
     <div class='row flex-nowrap inventree-body'>
-        <div class='col-auto px-1 sidetree-wrapper'>
+        <div class='col-auto px-1 sidetree-wrapper' style='display: none;'>
             <div id='sidetree' class='collapse collapse-horizontal show border-end' style='display: none;'>
             {% block sidetree %}
             {% endblock %}
diff --git a/InvenTree/templates/js/dynamic/nav.js b/InvenTree/templates/js/dynamic/nav.js
index 1c16c22200..a01de4a78d 100644
--- a/InvenTree/templates/js/dynamic/nav.js
+++ b/InvenTree/templates/js/dynamic/nav.js
@@ -154,7 +154,7 @@ function enableSidetree(label) {
         'core': {
             'data': {
                 'url': '/api/part/category/tree/',
-                'data': function(node){return {'id': node.id }; }
+                'data': function(node) {return {'id': node.id}; }
             }
         }
     }).bind('select_node.jstree', function(e, data) {
@@ -168,16 +168,27 @@ function enableSidetree(label) {
         var state = localStorage.getItem(`inventree-tree-state-${label}`) || 'expanded';
         
         // We wish to "toggle" the state!
-        setSidebarState(label, state == 'expanded' ? 'collapsed' : 'expanded');
+        setSidetreeState(label, state == 'expanded' ? 'collapsed' : 'expanded');
     });
 
     // Set the initial state (default = expanded)
     var state = localStorage.getItem(`inventree-tree-state-${label}`) || 'expanded';
 
-    // setSidebarState(label, state);
+    setSidetreeState(label, state);
 
     // Finally, show the sidebar
     $('#sidetree').show();
+
+    function setSidetreeState(label, state) {
+        if (state == 'collapsed') {
+            $('.sidetree-wrapper').hide(100);
+            $(`#sidetree-toggle-icon`).removeClass('fa-chevron-left').addClass('fa-chevron-right');
+        } else {
+            $('.sidetree-wrapper').show(100);
+            $(`#sidetree-toggle-icon`).removeClass('fa-chevron-right').addClass('fa-chevron-left');
+        }
+        localStorage.setItem(`inventree-tree-state-${label}`, state);
+    }
 }
 
 /*