feat(console): add the ability to clear the console

src/components/panels/MiniconsolePanel.vue

@@ -17,8 +17,8 @@
         card-class="miniconsole-panel"
         :hide-buttons-on-collapse="true">
         <template #buttons>
+            <v-btn icon tile @click="clearConsole"><v-icon small>mdi-trash-can</v-icon></v-btn>
             <command-help-modal :in-toolbar="true" @onCommand="gcode = $event"></command-help-modal>
-
             <v-menu
                 :offset-y="true"
                 :close-on-content-click="false"
@@ -151,6 +151,10 @@ export default class MiniconsolePanel extends Mixins(BaseMixin) {
         }
     }
 
+    clearConsole() {
+        this.$store.dispatch('gui/console/clear')
+    }
+
     get hideWaitTemperatures(): boolean {
         return this.$store.state.gui.console.hideWaitTemperatures
     }

src/pages/Console.vue

@@ -38,6 +38,9 @@
             </v-col>
 
             <v-col class="col-auto d-flex align-center">
+                <v-btn class="mr-3 px-2 minwidth-0" color="lightgray" @click="clearConsole">
+                    <v-icon>mdi-trash-can</v-icon>
+                </v-btn>
                 <command-help-modal @onCommand="gcode = $event"></command-help-modal>
                 <v-menu
                     offset-y
@@ -148,6 +151,10 @@ export default class PageConsole extends Mixins(BaseMixin) {
         this.$store.dispatch('gui/saveSetting', { name: 'console.hideWaitTemperatures', value: newVal })
     }
 
+    clearConsole() {
+        this.$store.dispatch('gui/console/clear')
+    }
+
     get hideTlCommands(): boolean {
         return this.$store.state.gui.console.hideWaitTemperatures
     }

src/store/gui/console/actions.ts

@@ -9,6 +9,22 @@ export const actions: ActionTree<GuiConsoleState, RootState> = {
         commit('reset')
     },
 
+    clear({ commit }) {
+        const cleared_since = new Date().valueOf()
+        Vue.$socket.emit('server.database.post_item', {
+            namespace: 'mainsail',
+            key: 'console.cleared_since',
+            value: cleared_since,
+        })
+
+        commit('clear', {
+            cleared_since,
+        })
+
+        commit('server/clearGcodeStore', {}, { root: true })
+        commit('server/setConsoleClearedThisSession', {}, { root: true })
+    },
+
     saveSetting({ dispatch }, payload) {
         dispatch(
             'gui/saveSetting',

src/store/gui/console/getters.ts

@@ -36,4 +36,8 @@ export const getters: GetterTree<GuiConsoleState, any> = {
 
         return output
     },
+
+    getConsoleClearedSince: (state, getters, rootState) => {
+        return state.cleared_since
+    },
 }

src/store/gui/console/mutations.ts

@@ -8,6 +8,10 @@ export const mutations: MutationTree<GuiConsoleState> = {
         Object.assign(state, getDefaultState())
     },
 
+    clear(state, payload) {
+        Vue.set(state, 'cleared_since', payload.cleared_since)
+    },
+
     filterStore(state, payload) {
         Vue.set(state.consolefilters, payload.id, payload.values)
     },

src/store/gui/console/types.ts

@@ -1,4 +1,5 @@
 export interface GuiConsoleState {
+    cleared_since?: number
     hideWaitTemperatures: boolean
     hideTlCommands: boolean
     direction: 'table' | 'shell'

src/store/server/actions.ts

@@ -158,6 +158,24 @@ export const actions: ActionTree<ServerState, RootState> = {
             }
         })
 
+        const cleared_since = rootGetters['gui/console/getConsoleClearedSince']
+
+        events = events.filter((event) => {
+            if (!cleared_since) {
+                return true
+            }
+
+            if (event.time && event.time * 1000 < cleared_since) {
+                return false
+            }
+
+            if (event.date && new Date(event.date).valueOf() < cleared_since) {
+                return false
+            }
+
+            return true
+        })
+
         commit('setGcodeStore', events)
     },
 

src/store/server/getters.ts

@@ -9,7 +9,7 @@ export const getters: GetterTree<ServerState, any> = {
         (reverse = true, limit = 500) => {
             const events = [...state.events].slice(limit * -1) ?? []
 
-            if (events.length < 20) {
+            if (events.length < 20 && !state.console_cleared_this_session) {
                 const date = events.length ? events[0].date : new Date()
                 let message = ''
 

src/store/server/mutations.ts

@@ -64,6 +64,10 @@ export const mutations: MutationTree<ServerState> = {
         })
     },
 
+    setConsoleClearedThisSession(state) {
+        Vue.set(state, 'console_cleared_this_session', true)
+    },
+
     clearGcodeStore(state) {
         Vue.set(state, 'events', [])
     },

src/store/server/types.ts

@@ -40,6 +40,8 @@ export interface ServerState {
     websocket_count: number
     moonraker_version: string
 
+    console_cleared_this_session?: boolean
+
     power?: ServerPowerState
     updateManager?: ServerUpdateMangerState
     history?: ServerHistoryState
@@ -48,6 +50,7 @@ export interface ServerState {
 
 export interface ServerStateEvent {
     date: Date
+    time?: number
     formatTime: string
     type: string
     message: string