From 9dd460f2bf25fa296b0c6a951667f523dd9b75e0 Mon Sep 17 00:00:00 2001
From: Stefan Dej <meteyou@gmail.com>
Date: Sun, 13 Mar 2022 10:59:10 +0100
Subject: [PATCH 1/6] feat: add note button in context menu

Signed-off-by: Stefan Dej <meteyou@gmail.com>
---
 src/components/panels/HistoryListPanel.vue | 6 ++++++
 src/locales/en.json                        | 1 +
 2 files changed, 7 insertions(+)

diff --git a/src/components/panels/HistoryListPanel.vue b/src/components/panels/HistoryListPanel.vue
index a83ce464c..3983af5d4 100644
--- a/src/components/panels/HistoryListPanel.vue
+++ b/src/components/panels/HistoryListPanel.vue
@@ -209,6 +209,10 @@
                     <v-icon class="mr-1">{{ mdiTextBoxSearch }}</v-icon>
                     {{ $t('History.Details') }}
                 </v-list-item>
+                <v-list-item @click="createNote(contextMenu.item)">
+                    <v-icon class="mr-1">{{ mdiNotebookPlus }}</v-icon>
+                    {{ $t('History.AddNote') }}
+                </v-list-item>
                 <v-list-item
                     v-if="contextMenu.item.exists"
                     :disabled="printerIsPrinting || !klipperReadyForGui"
@@ -441,6 +445,7 @@ import {
     mdiMagnify,
     mdiCloseThick,
     mdiUpdate,
+    mdiNotebookPlus,
 } from '@mdi/js'
 @Component({
     components: { Panel },
@@ -457,6 +462,7 @@ export default class HistoryListPanel extends Mixins(BaseMixin) {
     mdiMagnify = mdiMagnify
     mdiUpdate = mdiUpdate
     mdiCloseThick = mdiCloseThick
+    mdiNotebookPlus = mdiNotebookPlus
 
     formatFilesize = formatFilesize
 
diff --git a/src/locales/en.json b/src/locales/en.json
index 8e7259abf..113e5ac82 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -245,6 +245,7 @@
         "Wireframe": "Wireframe"
     },
     "History": {
+        "AddNote": "Add note",
         "AllJobs": "All",
         "AvgPrinttime": "Avg. Printtime",
         "Cancel": "Cancel",

From 17d26bf2d4f86597a4d3df3701ae13c36b61e7b2 Mon Sep 17 00:00:00 2001
From: Stefan Dej <meteyou@gmail.com>
Date: Mon, 14 Mar 2022 01:20:35 +0100
Subject: [PATCH 2/6] feat: save history note

Signed-off-by: Stefan Dej <meteyou@gmail.com>
---
 src/components/panels/HistoryListPanel.vue | 48 ++++++++++++++++++++++
 src/locales/en.json                        |  3 ++
 src/store/server/history/actions.ts        | 24 ++++++++++-
 src/store/server/history/types.ts          |  1 +
 4 files changed, 75 insertions(+), 1 deletion(-)

diff --git a/src/components/panels/HistoryListPanel.vue b/src/components/panels/HistoryListPanel.vue
index fdda4f9d9..c2e6beb4d 100644
--- a/src/components/panels/HistoryListPanel.vue
+++ b/src/components/panels/HistoryListPanel.vue
@@ -433,6 +433,35 @@
                 </v-card-actions>
             </panel>
         </v-dialog>
+        <v-dialog v-model="noteDialog.boolShow" :max-width="600" persistent @keydown.esc="noteDialog.boolShow = false">
+            <panel
+                :title="$t('History.CreateNote')"
+                :icon="mdiNotebookPlus"
+                card-class="history-note-dialog"
+                :margin-bottom="false">
+                <template #buttons>
+                    <v-btn icon tile @click="noteDialog.boolShow = false">
+                        <v-icon>{{ mdiCloseThick }}</v-icon>
+                    </v-btn>
+                </template>
+                <v-card-text class="pb-0">
+                    <v-row>
+                        <v-col>
+                            <v-textarea
+                                v-model="noteDialog.note"
+                                outlined
+                                hide-details
+                                :label="$t('History.Note')"></v-textarea>
+                        </v-col>
+                    </v-row>
+                </v-card-text>
+                <v-card-actions>
+                    <v-spacer></v-spacer>
+                    <v-btn color="" text @click="noteDialog.boolShow = false">{{ $t('History.Cancel') }}</v-btn>
+                    <v-btn color="primary" text @click="storeNote">{{ $t('History.Save') }}</v-btn>
+                </v-card-actions>
+            </panel>
+        </v-dialog>
     </div>
 </template>
 
@@ -493,6 +522,12 @@ export default class HistoryListPanel extends Mixins(BaseMixin) {
         boolShow: false,
     }
 
+    private noteDialog: { item: ServerHistoryStateJob | null; note: string; boolShow: boolean } = {
+        item: null,
+        note: '',
+        boolShow: false,
+    }
+
     private deleteSelectedDialog = false
 
     get jobs() {
@@ -991,5 +1026,18 @@ export default class HistoryListPanel extends Mixins(BaseMixin) {
             }
         } else return '--'
     }
+
+    createNote(item: ServerHistoryStateJob) {
+        this.noteDialog.item = item
+        this.noteDialog.note = item.note ?? ''
+        this.noteDialog.boolShow = true
+    }
+
+    storeNote() {
+        this.$store.dispatch('server/history/saveHistoryNote', {
+            job_id: this.noteDialog.item?.job_id,
+            note: this.noteDialog.note,
+        })
+    }
 }
 </script>
diff --git a/src/locales/en.json b/src/locales/en.json
index 2e63a1139..25060235f 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -249,6 +249,7 @@
         "AllJobs": "All",
         "AvgPrinttime": "Printtime - Ø",
         "Cancel": "Cancel",
+        "CreateNote": "Create Note",
         "Delete": "Delete",
         "DeleteSelectedQuestion": "Do you really want to delete {count} selected jobs?",
         "Details": "Details",
@@ -272,12 +273,14 @@
         "LastModified": "Last Modified",
         "LayerHeight": "Layer Height",
         "LongestPrinttime": "Longest Printtime",
+        "Note": "Note",
         "ObjectHeight": "Object Height",
         "PrintDuration": "Print Time",
         "PrintHistory": "Print History",
         "PrintTime": "Print Time",
         "PrinttimeAvg": "Printtime - Ø",
         "Reprint": "Reprint",
+        "Save": "save",
         "Search": "search",
         "SelectedFilamentUsed": "Selected Filament Used",
         "SelectedJobs": "Selected Jobs",
diff --git a/src/store/server/history/actions.ts b/src/store/server/history/actions.ts
index 8a7f1f1f1..70a250250 100644
--- a/src/store/server/history/actions.ts
+++ b/src/store/server/history/actions.ts
@@ -17,7 +17,7 @@ export const actions: ActionTree<ServerHistoryState, RootState> = {
         commit('setTotals', payload.job_totals)
     },
 
-    getHistory({ commit, state }, payload) {
+    getHistory({ commit, dispatch, state }, payload) {
         if ('requestParams' in payload && 'start' in payload.requestParams && payload.requestParams.start === 0)
             commit('resetJobs')
 
@@ -34,6 +34,20 @@ export const actions: ActionTree<ServerHistoryState, RootState> = {
                 },
                 { action: 'server/history/getHistory' }
             )
+        else dispatch('loadHistoryNotes')
+    },
+
+    loadHistoryNotes({ rootState }) {
+        if (rootState.server?.dbNamespaces.includes('history_notes'))
+            Vue.$socket.emit(
+                'server.database.get_item',
+                { namespace: 'history_notes' },
+                { action: 'server/history/initHistoryNotes' }
+            )
+    },
+
+    initHistoryNotes(_, payload) {
+        window.console.log('initHistoryNotes', payload)
     },
 
     getChanged({ commit }, payload) {
@@ -50,4 +64,12 @@ export const actions: ActionTree<ServerHistoryState, RootState> = {
             })
         }
     },
+
+    saveHistoryNote(_, payload: { job_id: string; note: string }) {
+        Vue.$socket.emit('server.database.post_item', {
+            namespace: 'history_notes',
+            key: payload.job_id,
+            value: { text: payload.note },
+        })
+    },
 }
diff --git a/src/store/server/history/types.ts b/src/store/server/history/types.ts
index 87f9a345d..ada84d13b 100644
--- a/src/store/server/history/types.ts
+++ b/src/store/server/history/types.ts
@@ -18,6 +18,7 @@ export interface ServerHistoryStateJob {
     filename: string
     // eslint-disable-next-line
     metadata: any
+    note?: string
     print_duration: number
     status: string
     start_time: number

From 46b8ca78908e5d45f0ad9ccaf2527264fde8fe3f Mon Sep 17 00:00:00 2001
From: Stefan Dej <meteyou@gmail.com>
Date: Tue, 15 Mar 2022 23:17:38 +0100
Subject: [PATCH 3/6] feat: init history notes

Signed-off-by: Stefan Dej <meteyou@gmail.com>
---
 src/store/server/history/actions.ts   | 4 ++--
 src/store/server/history/index.ts     | 1 +
 src/store/server/history/mutations.ts | 4 ++++
 src/store/server/history/types.ts     | 7 +++++++
 4 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/src/store/server/history/actions.ts b/src/store/server/history/actions.ts
index 70a250250..f60bc9d0e 100644
--- a/src/store/server/history/actions.ts
+++ b/src/store/server/history/actions.ts
@@ -46,8 +46,8 @@ export const actions: ActionTree<ServerHistoryState, RootState> = {
             )
     },
 
-    initHistoryNotes(_, payload) {
-        window.console.log('initHistoryNotes', payload)
+    initHistoryNotes({ commit }, payload) {
+        commit('setHistoryNotes', payload)
     },
 
     getChanged({ commit }, payload) {
diff --git a/src/store/server/history/index.ts b/src/store/server/history/index.ts
index ca245f4f2..dbe0a27e5 100644
--- a/src/store/server/history/index.ts
+++ b/src/store/server/history/index.ts
@@ -15,6 +15,7 @@ export const getDefaultState = (): ServerHistoryState => {
             longest_job: 0,
             longest_print: 0,
         },
+        notes: {},
     }
 }
 
diff --git a/src/store/server/history/mutations.ts b/src/store/server/history/mutations.ts
index 2ef248761..5de777f44 100644
--- a/src/store/server/history/mutations.ts
+++ b/src/store/server/history/mutations.ts
@@ -16,6 +16,10 @@ export const mutations: MutationTree<ServerHistoryState> = {
         Vue.set(state, 'job_totals', payload)
     },
 
+    setHistoryNotes(state, payload) {
+        Vue.set(state, 'notes', payload)
+    },
+
     addJob(state, payload) {
         state.jobs.push(payload)
     },
diff --git a/src/store/server/history/types.ts b/src/store/server/history/types.ts
index ada84d13b..f4712e0fe 100644
--- a/src/store/server/history/types.ts
+++ b/src/store/server/history/types.ts
@@ -8,6 +8,9 @@ export interface ServerHistoryState {
         longest_job: number
         longest_print: number
     }
+    notes: {
+        [key: string]: ServerHistoryStateJobNote
+    }
 }
 
 export interface ServerHistoryStateJob {
@@ -41,3 +44,7 @@ export interface ServerHistoryStateAllPrintStatusEntry {
         color: string
     }
 }
+
+export interface ServerHistoryStateJobNote {
+    text: string
+}

From 6d25b97941eaf00e9a7a3297beff2c8b3e7f3151 Mon Sep 17 00:00:00 2001
From: Stefan Dej <meteyou@gmail.com>
Date: Tue, 15 Mar 2022 23:59:01 +0100
Subject: [PATCH 4/6] refactor: rework init history notes

Signed-off-by: Stefan Dej <meteyou@gmail.com>
---
 src/store/server/history/actions.ts   | 12 ++++++++++--
 src/store/server/history/index.ts     |  1 -
 src/store/server/history/mutations.ts |  7 +++----
 src/store/server/history/types.ts     |  7 -------
 4 files changed, 13 insertions(+), 14 deletions(-)

diff --git a/src/store/server/history/actions.ts b/src/store/server/history/actions.ts
index f60bc9d0e..737e2ca62 100644
--- a/src/store/server/history/actions.ts
+++ b/src/store/server/history/actions.ts
@@ -46,8 +46,16 @@ export const actions: ActionTree<ServerHistoryState, RootState> = {
             )
     },
 
-    initHistoryNotes({ commit }, payload) {
-        commit('setHistoryNotes', payload)
+    initHistoryNotes({ commit, state }, payload) {
+        const job_ids = Object.keys(payload.value)
+
+        job_ids.forEach((job_id: string) => {
+            const noteObject: { text: string } = payload.value[job_id]
+            commit('setHistoryNotes', {
+                job_id,
+                text: noteObject.text,
+            })
+        })
     },
 
     getChanged({ commit }, payload) {
diff --git a/src/store/server/history/index.ts b/src/store/server/history/index.ts
index dbe0a27e5..ca245f4f2 100644
--- a/src/store/server/history/index.ts
+++ b/src/store/server/history/index.ts
@@ -15,7 +15,6 @@ export const getDefaultState = (): ServerHistoryState => {
             longest_job: 0,
             longest_print: 0,
         },
-        notes: {},
     }
 }
 
diff --git a/src/store/server/history/mutations.ts b/src/store/server/history/mutations.ts
index 5de777f44..cc7e48f02 100644
--- a/src/store/server/history/mutations.ts
+++ b/src/store/server/history/mutations.ts
@@ -17,7 +17,8 @@ export const mutations: MutationTree<ServerHistoryState> = {
     },
 
     setHistoryNotes(state, payload) {
-        Vue.set(state, 'notes', payload)
+        const job = state.jobs.find((job) => job.job_id === payload.job_id)
+        if (job) Vue.set(job, 'note', payload.text)
     },
 
     addJob(state, payload) {
@@ -33,8 +34,6 @@ export const mutations: MutationTree<ServerHistoryState> = {
 
     destroyJob(state, payload) {
         const index = state.jobs.findIndex((job) => job.job_id === payload)
-        if (index !== -1) {
-            state.jobs.splice(index, 1)
-        }
+        if (index !== -1) state.jobs.splice(index, 1)
     },
 }
diff --git a/src/store/server/history/types.ts b/src/store/server/history/types.ts
index f4712e0fe..ada84d13b 100644
--- a/src/store/server/history/types.ts
+++ b/src/store/server/history/types.ts
@@ -8,9 +8,6 @@ export interface ServerHistoryState {
         longest_job: number
         longest_print: number
     }
-    notes: {
-        [key: string]: ServerHistoryStateJobNote
-    }
 }
 
 export interface ServerHistoryStateJob {
@@ -44,7 +41,3 @@ export interface ServerHistoryStateAllPrintStatusEntry {
         color: string
     }
 }
-
-export interface ServerHistoryStateJobNote {
-    text: string
-}

From e9bf0c05056fe9491896e42fa13c4250d2578dc9 Mon Sep 17 00:00:00 2001
From: Stefan Dej <meteyou@gmail.com>
Date: Wed, 16 Mar 2022 00:38:08 +0100
Subject: [PATCH 5/6] feat: edit job note

Signed-off-by: Stefan Dej <meteyou@gmail.com>
---
 src/components/panels/HistoryListPanel.vue | 43 ++++++++++++++++++----
 src/locales/en.json                        |  1 +
 src/store/server/history/actions.ts        |  7 +++-
 3 files changed, 43 insertions(+), 8 deletions(-)

diff --git a/src/components/panels/HistoryListPanel.vue b/src/components/panels/HistoryListPanel.vue
index c2e6beb4d..ccdec509e 100644
--- a/src/components/panels/HistoryListPanel.vue
+++ b/src/components/panels/HistoryListPanel.vue
@@ -172,7 +172,10 @@
                             </template>
                         </td>
                         <td class=" ">{{ item.filename }}</td>
-                        <td class="text-center">
+                        <td class="text-right text-no-wrap">
+                            <template v-if="'note' in item && item.note">
+                                <v-icon small class="mr-2">{{ mdiNotebook }}</v-icon>
+                            </template>
                             <v-tooltip top>
                                 <template #activator="{ on, attrs }">
                                     <span v-bind="attrs" v-on="on">
@@ -213,7 +216,13 @@
                     <v-icon class="mr-1">{{ mdiTextBoxSearch }}</v-icon>
                     {{ $t('History.Details') }}
                 </v-list-item>
-                <v-list-item @click="createNote(contextMenu.item)">
+                <v-list-item
+                    v-if="'note' in contextMenu.item && contextMenu.item.note"
+                    @click="editNote(contextMenu.item)">
+                    <v-icon class="mr-1">{{ mdiNotebookEdit }}</v-icon>
+                    {{ $t('History.EditNote') }}
+                </v-list-item>
+                <v-list-item v-else @click="createNote(contextMenu.item)">
                     <v-icon class="mr-1">{{ mdiNotebookPlus }}</v-icon>
                     {{ $t('History.AddNote') }}
                 </v-list-item>
@@ -435,8 +444,8 @@
         </v-dialog>
         <v-dialog v-model="noteDialog.boolShow" :max-width="600" persistent @keydown.esc="noteDialog.boolShow = false">
             <panel
-                :title="$t('History.CreateNote')"
-                :icon="mdiNotebookPlus"
+                :title="noteDialog.type === 'create' ? $t('History.CreateNote') : $t('History.EditNote')"
+                :icon="noteDialog.type === 'create' ? mdiNotebookPlus : mdiNotebookEdit"
                 card-class="history-note-dialog"
                 :margin-bottom="false">
                 <template #buttons>
@@ -458,7 +467,7 @@
                 <v-card-actions>
                     <v-spacer></v-spacer>
                     <v-btn color="" text @click="noteDialog.boolShow = false">{{ $t('History.Cancel') }}</v-btn>
-                    <v-btn color="primary" text @click="storeNote">{{ $t('History.Save') }}</v-btn>
+                    <v-btn color="primary" text @click="saveNote">{{ $t('History.Save') }}</v-btn>
                 </v-card-actions>
             </panel>
         </v-dialog>
@@ -484,7 +493,9 @@ import {
     mdiMagnify,
     mdiCloseThick,
     mdiUpdate,
+    mdiNotebookEdit,
     mdiNotebookPlus,
+    mdiNotebook,
 } from '@mdi/js'
 @Component({
     components: { Panel },
@@ -502,6 +513,8 @@ export default class HistoryListPanel extends Mixins(BaseMixin) {
     mdiUpdate = mdiUpdate
     mdiCloseThick = mdiCloseThick
     mdiNotebookPlus = mdiNotebookPlus
+    mdiNotebookEdit = mdiNotebookEdit
+    mdiNotebook = mdiNotebook
 
     formatFilesize = formatFilesize
 
@@ -522,10 +535,16 @@ export default class HistoryListPanel extends Mixins(BaseMixin) {
         boolShow: false,
     }
 
-    private noteDialog: { item: ServerHistoryStateJob | null; note: string; boolShow: boolean } = {
+    private noteDialog: {
+        item: ServerHistoryStateJob | null
+        note: string
+        boolShow: boolean
+        type: 'create' | 'edit'
+    } = {
         item: null,
         note: '',
         boolShow: false,
+        type: 'create',
     }
 
     private deleteSelectedDialog = false
@@ -1028,16 +1047,26 @@ export default class HistoryListPanel extends Mixins(BaseMixin) {
     }
 
     createNote(item: ServerHistoryStateJob) {
+        this.noteDialog.item = item
+        this.noteDialog.note = ''
+        this.noteDialog.type = 'create'
+        this.noteDialog.boolShow = true
+    }
+
+    editNote(item: ServerHistoryStateJob) {
         this.noteDialog.item = item
         this.noteDialog.note = item.note ?? ''
+        this.noteDialog.type = 'edit'
         this.noteDialog.boolShow = true
     }
 
-    storeNote() {
+    saveNote() {
         this.$store.dispatch('server/history/saveHistoryNote', {
             job_id: this.noteDialog.item?.job_id,
             note: this.noteDialog.note,
         })
+
+        this.noteDialog.boolShow = false
     }
 }
 </script>
diff --git a/src/locales/en.json b/src/locales/en.json
index 25060235f..28e30aeb5 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -253,6 +253,7 @@
         "Delete": "Delete",
         "DeleteSelectedQuestion": "Do you really want to delete {count} selected jobs?",
         "Details": "Details",
+        "EditNote": "Edit Note",
         "Empty": "empty",
         "EndTime": "End Time",
         "EstimatedFilament": "Estimated Filament",
diff --git a/src/store/server/history/actions.ts b/src/store/server/history/actions.ts
index 737e2ca62..fc34cddc8 100644
--- a/src/store/server/history/actions.ts
+++ b/src/store/server/history/actions.ts
@@ -73,11 +73,16 @@ export const actions: ActionTree<ServerHistoryState, RootState> = {
         }
     },
 
-    saveHistoryNote(_, payload: { job_id: string; note: string }) {
+    saveHistoryNote({ commit }, payload: { job_id: string; note: string }) {
         Vue.$socket.emit('server.database.post_item', {
             namespace: 'history_notes',
             key: payload.job_id,
             value: { text: payload.note },
         })
+
+        commit('setHistoryNotes', {
+            job_id: payload.job_id,
+            text: payload.note,
+        })
     },
 }

From a8b0abcd5f3a212401fc46562af47f2cffa1b05c Mon Sep 17 00:00:00 2001
From: Stefan Dej <meteyou@gmail.com>
Date: Fri, 18 Mar 2022 22:27:11 +0100
Subject: [PATCH 6/6] feat: display job history note in tooltip

Signed-off-by: Stefan Dej <meteyou@gmail.com>
---
 src/components/panels/HistoryListPanel.vue | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/components/panels/HistoryListPanel.vue b/src/components/panels/HistoryListPanel.vue
index ccdec509e..12d0aeb37 100644
--- a/src/components/panels/HistoryListPanel.vue
+++ b/src/components/panels/HistoryListPanel.vue
@@ -174,7 +174,14 @@
                         <td class=" ">{{ item.filename }}</td>
                         <td class="text-right text-no-wrap">
                             <template v-if="'note' in item && item.note">
-                                <v-icon small class="mr-2">{{ mdiNotebook }}</v-icon>
+                                <v-tooltip top>
+                                    <template #activator="{ on, attrs }">
+                                        <v-icon small class="mr-2" v-bind="attrs" v-on="on">
+                                            {{ mdiNotebook }}
+                                        </v-icon>
+                                    </template>
+                                    <span v-html="item.note.replaceAll('\n', '<br />')"></span>
+                                </v-tooltip>
                             </template>
                             <v-tooltip top>
                                 <template #activator="{ on, attrs }">