From e1784c93b26e781518abe17dad50216d404ef1d9 Mon Sep 17 00:00:00 2001
From: Oliver Walters <oliver.henry.walters@gmail.com>
Date: Sun, 10 Apr 2022 18:03:19 +1000
Subject: [PATCH] Simplification

---
 InvenTree/part/templates/part/detail.html    | 16 ++++-------
 InvenTree/templates/js/translated/helpers.js | 29 +++++++++++++++-----
 InvenTree/templates/notes_buttons.html       |  8 ++++++
 3 files changed, 35 insertions(+), 18 deletions(-)
 create mode 100644 InvenTree/templates/notes_buttons.html

diff --git a/InvenTree/part/templates/part/detail.html b/InvenTree/part/templates/part/detail.html
index e7384a6a10..5cee2f4426 100644
--- a/InvenTree/part/templates/part/detail.html
+++ b/InvenTree/part/templates/part/detail.html
@@ -134,16 +134,11 @@
 
 <div class='panel panel-hidden' id='panel-part-notes'>
     <div class='panel-heading'>
-        <div class='row'>
-            <div class='col-sm-6'>
-                <h4>{% trans "Notes" %}</h4>
-            </div>
-            <div class='col-sm-6'>
-                <div class='btn-group float-right'>
-                    <button type='button' id='save-notes' title='{% trans "Save" %}' class='btn btn-success'>
-                        <span class='fas fa-save'></span> {% trans "Save Changes" %}
-                    </button>
-                </div>
+        <div class='d-flex flex-wrap'>
+            <h4>{% trans "Notes" %}</h4>
+            {% include "spacer.html" %}
+            <div class='btn-group' role='group'>
+                {% include "notes_buttons.html" %}
             </div>
         </div>
     </div>
@@ -424,7 +419,6 @@
             '{% url "api-part-detail" part.pk %}',
             {
                 editable: true,
-                save_button: '#save-notes',
             }
         );
     });
diff --git a/InvenTree/templates/js/translated/helpers.js b/InvenTree/templates/js/translated/helpers.js
index 413d6ac47a..46c9755c34 100644
--- a/InvenTree/templates/js/translated/helpers.js
+++ b/InvenTree/templates/js/translated/helpers.js
@@ -266,16 +266,31 @@ function setupNotesField(element, url, options={}) {
         shortcuts: [],
     });
 
-    mde.togglePreview();
-
+    
     if (!editable) {
+        // Set readonly
         mde.codemirror.setOption('readOnly', true);
-        $('#editor-toolbar').hide();        
-    }
+        
+        // Hide the toolbar
+        $(`#${element}`).next('.EasyMDEContainer').find('.editor-toolbar').hide();     
+        
+        // Hide the "edit" and "save" buttons
+        $('#edit-notes').hide();
+        $('#save-notes').hide();
+        
+    } else {
+        mde.togglePreview();
 
-    // Add callback for "save" button
-    if (options.save_button) {
-        $(options.save_button).click(function() {
+        // Add callback for "edit" button
+        $('#edit-notes').click(function() {
+            $('#edit-notes').hide();
+            $('#save-notes').show();
+
+            mde.togglePreview();
+        });
+
+        // Add callback for "save" button
+        $('#save-notes').click(function() {
 
             var data = {};
 
diff --git a/InvenTree/templates/notes_buttons.html b/InvenTree/templates/notes_buttons.html
new file mode 100644
index 0000000000..ac016a87e2
--- /dev/null
+++ b/InvenTree/templates/notes_buttons.html
@@ -0,0 +1,8 @@
+{% load i18n %}
+
+<button type='button' id='edit-notes' title='{% trans "Edit" %}' class='btn btn-primary'>
+    <span class='fas fa-edit'></span> {% trans "Edit" %}
+</button>
+<button type='button' id='save-notes' title='{% trans "Save" %}' class='btn btn-success' style='display: none;'>
+    <span class='fas fa-save'></span> {% trans "Save" %}
+</button>
\ No newline at end of file