From bf4458e7e47ac4df0dfc297c6444d77fee527519 Mon Sep 17 00:00:00 2001
From: Zeanon <thezeanon@gmail.com>
Date: Sun, 30 Jul 2023 22:36:08 +0200
Subject: [PATCH] Squashed commit of the following:

commit 1b763e23ef211e37e30d961e77c27b7c251d6c37
Merge: 4d241fc4 1a125548
Author: Stefan Dej <meteyou@gmail.com>
Date:   Sun Jul 30 21:23:05 2023 +0200

    [Automated] Merged develop into target master

commit 1a12554821a9eaf7737a7f4be5bb51c7552d6dce
Author: github-actions <41898282+github-actions[bot]@users.noreply.github.com>
Date:   Sun Jul 30 19:22:55 2023 +0000

    chore: push version number to v2.6.2

commit 7251a8c6bae2b92395de4c8c23e8e8e3900df66a
Author: Zhu Qian <xiaoqianzi15@gmail.com>
Date:   Mon Jul 31 03:17:39 2023 +0800

    locale(zh): update chinese locale (#1486)

    Co-authored-by: Stefan Dej <meteyou@gmail.com>

commit cda3098c9e09a054aa7baa69a3195e0a73f43e54
Author: Stefan Dej <meteyou@gmail.com>
Date:   Sun Jul 30 21:03:00 2023 +0200

    fix: fix issue with cannot extrude after a Klipper restart (#1495)

commit 9eb133bd85530ac08416e94f02ebe19f060bc095
Author: Stefan Dej <meteyou@gmail.com>
Date:   Sun Jul 30 21:02:28 2023 +0200

    fix: fix multiple issues in the refactored update manager (#1497)

commit 6a4cca751c88e89ddf5f2cc0f09a58f097a461af
Author: Stefan Dej <meteyou@gmail.com>
Date:   Sun Jul 30 21:01:05 2023 +0200

    fix: fix issue with create/edit presets and refactor settings (#1499)

commit d67ef3aa908601b6bb87353957bcc97ea4f829ea
Author: Stefan Dej <meteyou@gmail.com>
Date:   Sun Jul 30 12:41:08 2023 +0200

    fix: use webcam name instead of UUID for timelapse plugin (#1492)

commit aeee1982398acca803f7f4eae7b7b39a29253179
Author: Stefan Dej <meteyou@gmail.com>
Date:   Fri Jul 28 22:48:01 2023 +0200

    fix: fix issue with camel-case object names in temperature panel (#1491)

commit 5c4082010890e0b341754f42673affe7d1ca9d99
Author: Stefan Dej <meteyou@gmail.com>
Date:   Thu Jul 27 23:02:51 2023 +0200

    fix: fix flip function in several webcam clients (#1487)

commit e929c7cc0f45074f40407420b3585d9c02284fa1
Author: Stefan Dej <meteyou@gmail.com>
Date:   Thu Jul 27 09:42:07 2023 +0200

    fix: hide rpm in temperature_fans without tachometer_pin (#1489)

commit 0b47a80b133e6093aecdb0d7d87b718899dff0c7
Author: Stefan Dej <meteyou@gmail.com>
Date:   Mon Jul 24 22:13:16 2023 +0200

    refactor: refactor SettingsRow (#1484)

commit 8447be2ecee64fa4a3c0211ac57f42c3adf1d050
Author: Stefan Dej <meteyou@gmail.com>
Date:   Mon Jul 24 22:08:50 2023 +0200

    fix: fix editor save & restart button behavior (#1483)

commit 0c5aca8baffb65198f43a7d3b2b57571d8e911c9
Author: Daviteusz <daviteusz0@gmail.com>
Date:   Mon Jul 24 19:27:21 2023 +0200

    locale(pl): Update Polish translation (#1482)

commit eceb442a4c45f81f1e5cbcfc0d15572ecdb01cbd
Author: meteyou <meteyou@users.noreply.github.com>
Date:   Mon Jul 24 07:36:14 2023 +0000

    docs(changelog): update changelog
---
 CHANGELOG.md                                  |  33 ++
 package.json                                  |   2 +-
 src/components/TheEditor.vue                  |  20 +-
 src/components/mixins/webcam.ts               |  13 +
 .../panels/Machine/UpdatePanel/Entry.vue      |  97 +++---
 .../UpdatePanel/GitCommitsListDayCommit.vue   |   6 +-
 .../Machine/UpdatePanel/UpdateHintAlert.vue   |   8 +-
 .../Temperature/TemperaturePanelListItem.vue  |  12 +-
 .../settings/Presets/PresetsEntry.vue         |  56 +++
 .../settings/Presets/PresetsEntryCooldown.vue |  26 ++
 .../settings/Presets/PresetsForm.vue          | 182 ++++++++++
 .../settings/Presets/PresetsFormCooldown.vue  |  52 +++
 src/components/settings/SettingsEditorTab.vue |  45 +--
 .../settings/SettingsPresetsTab.vue           | 319 ++----------------
 src/components/settings/SettingsRow.vue       |   4 +-
 .../settings/SettingsTimelapseTab.vue         | 132 ++++----
 src/components/webcams/Hlsstreamer.vue        |  11 +-
 src/components/webcams/Ipstreamer.vue         |  13 +-
 src/components/webcams/JMuxerStream.vue       |  13 +-
 src/components/webcams/JanusStreamer.vue      |  14 +-
 src/components/webcams/Mjpegstreamer.vue      |  11 +-
 .../webcams/MjpegstreamerAdaptive.vue         |  15 +-
 src/components/webcams/Uv4lMjpeg.vue          |  11 +-
 .../webcams/WebrtcCameraStreamer.vue          |   9 +-
 src/components/webcams/WebrtcMediaMTX.vue     |  13 +-
 src/locales/cz.json                           |   2 -
 src/locales/da.json                           |   2 -
 src/locales/de.json                           |   2 -
 src/locales/en.json                           |   3 +-
 src/locales/es.json                           |   2 -
 src/locales/fr.json                           |   2 -
 src/locales/hu.json                           |   2 -
 src/locales/ja.json                           |   2 -
 src/locales/ko.json                           |   2 -
 src/locales/nl.json                           |   2 -
 src/locales/pl.json                           |  44 ++-
 src/locales/pt.json                           |   2 -
 src/locales/ru.json                           |   2 -
 src/locales/sv.json                           |   2 -
 src/locales/tr.json                           |   2 -
 src/locales/uk.json                           |   2 -
 src/locales/zh.json                           |  62 ++--
 src/locales/zh_TW.json                        |   2 -
 src/store/editor/actions.ts                   |   4 +-
 src/store/editor/getters.ts                   |   9 -
 src/store/gui/index.ts                        |   1 -
 src/store/gui/types.ts                        |   1 -
 src/store/gui/webcams/actions.ts              |  11 +-
 src/store/printer/actions.ts                  |  15 +
 src/store/server/timelapse/actions.ts         |   8 +
 src/store/server/updateManager/types.ts       |   4 +
 51 files changed, 720 insertions(+), 589 deletions(-)
 create mode 100644 src/components/settings/Presets/PresetsEntry.vue
 create mode 100644 src/components/settings/Presets/PresetsEntryCooldown.vue
 create mode 100644 src/components/settings/Presets/PresetsForm.vue
 create mode 100644 src/components/settings/Presets/PresetsFormCooldown.vue

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 7c96e03b4..ea0a17a75 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,39 @@
 # Changelog
 All notable changes to Mainsail will be documented in this file.
 
+## [2.6.1](https://github.com/mainsail-crew/mainsail/releases/tag/v2.6.1) - 2023-07-24
+### Bug Fixes and Improvements
+
+- Show delete dialog for single files too (#1442) | [7da3352](7da33523d1ec7c4a3206400fb92803685176167e)
+- Remove variable check in klipper config StreamParser (#1435) | [6e7ef65](6e7ef6554ec88ceb29f66b4d6a5d5f21ef77671b)
+- Fix condition in restartServiceNameExists check (#1450) | [a7e70c7](a7e70c75d0009ffed14e8717ad8286f91e4e7e8a)
+- Avoid hitting 100% before print is complete (#1455) | [3959000](39590004da7ca22fef82fbd148b31683c462bb13)
+- Fix issue with ETA and 12h time format (#1463) | [039a446](039a446944f05ea241574c65040d520bbbef0e9b)
+- Fix issue with CSV separator in contents (#1460) | [1895d2d](1895d2d90591946c792faaf3f62c52865f27cd62)
+- Fix issue with webcams in farm printers (#1469) | [5b2bea5](5b2bea51aab79aabfab02825cdce45be351c1c6f)
+
+### Refactor
+
+- Build version file for moonraker (#1449) | [21d3d39](21d3d395039ec855d062a5ee5e5b43e2d858f402)
+- Use moonraker webcam api instead of direct DB access (#1445) | [7c81690](7c81690c1e299c804edb4ede0acab7d77d1dedbe)
+- Change SettingsGeneralTab file (#1475) | [db09bbe](db09bbe043b2e43053779709f5260c7275bc4969)
+- Extract Presets and Settings from TemperaturePanel (#1465) | [be25316](be253165a003c50fd992f43c586ce5315dc2352d)
+- Display errors and warnings in the update_manager (#1453) | [0cefa24](0cefa24e766c568a56127bfd55272735383cb45e)
+
+### Localization
+
+- **pl**: Update Polish translation (#1434) | [73e503f](73e503fc6448ae174dd7f9d59236c820bd4b6631)
+- **pl**: Update Polish translation (#1447) | [d844125](d8441254db04d672fe2137f64e39127f524c4769)
+- **pl**: Update polish locale (#1471) | [a58bef2](a58bef2a03479262b4ee5db2b5d103e8dc2194c5)
+- **pl**: Update Polish translation (#1476) | [6758049](6758049d29c7410bcdedec689eaca503952b2c7e)
+- **tr**: Update turkish locale (#1480) | [f52b94c](f52b94c459ad759e160a568d3b6f366b0e65f484)
+- **zh**: Update Chinese (zh) localization (#1459) | [bcbef2f](bcbef2f19af4746b941ddcb29c98ff5f071611d0)
+
+### Other
+
+- **pwa**: Remove debug warnings in browser console (#1441) | [2962df2](2962df21e512baad6976dc502d6234c2969da686)
+- Add dev-dist to .gitignore (#1451) | [ef2d17c](ef2d17cadde566e8b713031cb7292d65ca1bec12)
+
 ## [2.6.0](https://github.com/mainsail-crew/mainsail/releases/tag/v2.6.0) - 2023-06-19
 ### Features
 
diff --git a/package.json b/package.json
index 0f92a11a0..f9b28e8fb 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "mainsail",
-    "version": "2.6.10",
+    "version": "2.6.11",
     "private": true,
     "decription": "a klipper web interface",
     "author": {
diff --git a/src/components/TheEditor.vue b/src/components/TheEditor.vue
index e6ec42b30..63463ab87 100644
--- a/src/components/TheEditor.vue
+++ b/src/components/TheEditor.vue
@@ -239,25 +239,33 @@ export default class TheEditor extends Mixins(BaseMixin) {
         if (!this.isWriteable) return null
         if (['printing', 'paused'].includes(this.printer_state)) return null
 
+        // check for generic services <service>.conf (like moonraker.conf, crowsnest.conf, sonar.conf)
         if (this.availableServices.includes(this.filenameWithoutExtension) && this.fileExtension === 'conf')
             return this.filenameWithoutExtension
+
+        // old webcam service DEPRECATED
         if (this.filename.startsWith('webcam') && ['conf', 'txt'].includes(this.fileExtension)) return 'webcamd'
+
+        // check for mooncord config files
         if (this.filename.startsWith('mooncord') && this.fileExtension === 'json') return 'mooncord'
-        if (this.filename === 'moonraker.conf') return this.moonrakerRestartInstance ?? 'moonraker'
 
+        // fallback for moonraker with multi instances
+        if (this.filename === 'moonraker.conf') return 'moonraker'
+
+        // all .cfg files will be klipper config files
         if (this.fileExtension === 'cfg') return 'klipper'
 
         return null
     }
 
     get restartServiceNameExists() {
-        if (!this.restartServiceName) return true
+        // hide the button, if there is no service found
+        if (this.restartServiceName === null) return false
 
-        return this.availableServices.includes(this.restartServiceName)
-    }
+        // klipper and moonraker uses specific api calls instead of generic service restart
+        if (['klipper', 'moonraker'].includes(this.restartServiceName)) return true
 
-    get moonrakerRestartInstance() {
-        return this.$store.state.gui.editor.moonrakerRestartInstance
+        return this.availableServices.includes(this.restartServiceName)
     }
 
     get confirmUnsavedChanges() {
diff --git a/src/components/mixins/webcam.ts b/src/components/mixins/webcam.ts
index 0508a3b8d..784b3dce0 100644
--- a/src/components/mixins/webcam.ts
+++ b/src/components/mixins/webcam.ts
@@ -47,4 +47,17 @@ export default class WebcamMixin extends Mixins(BaseMixin) {
                 return mdiWebcam
         }
     }
+
+    generateTransform(flip_horizontal: boolean, flip_vertical: boolean, rotation: number) {
+        let transforms = ''
+        if (flip_horizontal) transforms += ' scaleX(-1)'
+        if (flip_vertical) transforms += ' scaleY(-1)'
+        if (rotation === 180) transforms += ' rotate(180deg)'
+
+        // return transform when exist
+        if (transforms.trimStart().length) return transforms.trimStart()
+
+        // return none as fallback
+        return 'none'
+    }
 }
diff --git a/src/components/panels/Machine/UpdatePanel/Entry.vue b/src/components/panels/Machine/UpdatePanel/Entry.vue
index 53e1e77d7..9aaae04fa 100644
--- a/src/components/panels/Machine/UpdatePanel/Entry.vue
+++ b/src/components/panels/Machine/UpdatePanel/Entry.vue
@@ -19,7 +19,17 @@
                 <span v-else>{{ versionOutput }}</span>
             </v-col>
             <v-col class="col-auto pr-6 text-right" align-self="center">
-                <template v-if="needsRecovery">
+                <v-chip
+                    v-if="anomalies.length > 0"
+                    small
+                    label
+                    outlined
+                    color="primary"
+                    class="minwidth-0 px-1 mr-2"
+                    @click="toggleAnomalies = !toggleAnomalies">
+                    <v-icon small>{{ mdiInformation }}</v-icon>
+                </v-chip>
+                <template v-if="!isValid">
                     <v-menu :offset-y="true">
                         <template #activator="{ on, attrs }">
                             <v-chip
@@ -37,16 +47,16 @@
                             </v-chip>
                         </template>
                         <v-list dense class="py-0">
-                            <v-list-item @click="doRecovery(false)">
-                                <v-list-item-icon class="mr-0">
+                            <v-list-item v-if="!isCorrupt" @click="doRecovery(false)">
+                                <v-list-item-icon class="mr-0 pt-1">
                                     <v-icon small>{{ mdiReload }}</v-icon>
                                 </v-list-item-icon>
                                 <v-list-item-content>
                                     <v-list-item-title>{{ $t('Machine.UpdatePanel.SoftRecovery') }}</v-list-item-title>
                                 </v-list-item-content>
                             </v-list-item>
-                            <v-list-item @click="doRecovery(true)">
-                                <v-list-item-icon class="mr-0">
+                            <v-list-item :disabled="!existsRecoveryUrl" @click="doRecovery(true)">
+                                <v-list-item-icon class="mr-0 pt-1">
                                     <v-icon small>{{ mdiReload }}</v-icon>
                                 </v-list-item-icon>
                                 <v-list-item-content>
@@ -70,36 +80,30 @@
                 </v-chip>
             </v-col>
         </v-row>
-        <v-row v-if="notificationText" class="mt-0">
-            <v-col class="px-6 pt-0">
-                <v-alert text dense :color="notificationColor" :icon="notificationIcon" border="left">
-                    {{ notificationText }}
-                </v-alert>
-            </v-col>
-        </v-row>
-        <v-row v-if="gitMessages.length" class="mt-0">
+        <v-row v-if="warnings.length" class="mt-0">
             <v-col class="px-6 pt-0">
                 <v-alert
-                    v-for="(message, index) in gitMessages"
-                    :key="'message_' + index"
+                    v-for="(message, index) in warnings"
+                    :key="'warnings_' + index"
                     text
                     dense
                     border="left"
-                    type="info">
+                    color="orange"
+                    :icon="mdiCloseCircle">
                     {{ message }}
                 </v-alert>
             </v-col>
         </v-row>
-        <v-row v-if="warnings.length" class="mt-0">
+        <v-row v-show="toggleAnomalies" class="mt-0">
             <v-col class="px-6 pt-0">
                 <v-alert
-                    v-for="(message, index) in warnings"
-                    :key="'warnings_' + index"
+                    v-for="(message, index) in anomalies"
+                    :key="'anomalies_' + index"
                     text
                     dense
                     border="left"
-                    color="orange"
-                    :icon="mdiAlertCircle">
+                    color="info"
+                    :icon="mdiInformation">
                     {{ message }}
                 </v-alert>
             </v-col>
@@ -123,7 +127,7 @@ import { Component, Mixins, Prop } from 'vue-property-decorator'
 import BaseMixin from '@/components/mixins/base'
 import { ServerUpdateManagerStateGitRepo } from '@/store/server/updateManager/types'
 import {
-    mdiAlertCircle,
+    mdiCloseCircle,
     mdiCheck,
     mdiHelpCircleOutline,
     mdiInformation,
@@ -141,11 +145,13 @@ export default class UpdatePanelEntry extends Mixins(BaseMixin) {
     mdiInformation = mdiInformation
     mdiMenuDown = mdiMenuDown
     mdiReload = mdiReload
-    mdiAlertCircle = mdiAlertCircle
+    mdiCloseCircle = mdiCloseCircle
 
     boolShowCommitList = false
     boolShowUpdateHint = false
 
+    toggleAnomalies = false
+
     @Prop({ required: true }) readonly repo!: ServerUpdateManagerStateGitRepo
 
     get name() {
@@ -244,6 +250,10 @@ export default class UpdatePanelEntry extends Mixins(BaseMixin) {
         return this.repo.is_dirty ?? false
     }
 
+    get isCorrupt() {
+        return this.repo.corrupt ?? false
+    }
+
     get debugEnabled() {
         return this.repo.debug_enabled ?? false
     }
@@ -254,19 +264,21 @@ export default class UpdatePanelEntry extends Mixins(BaseMixin) {
         return !this.debugEnabled && (this.repo.detached ?? false)
     }
 
-    get needsRecovery() {
-        return !this.isValid || this.isDirty
+    get existsRecoveryUrl() {
+        const url = this.repo.recovery_url ?? '?'
+
+        return url !== '?'
     }
 
     get btnDisabled() {
         if (['printing', 'paused'].includes(this.printer_state)) return true
-        if (!this.isValid || this.isDirty || this.commitsBehind.length) return false
+        if (!this.isValid || this.isCorrupt || this.isDirty || this.commitsBehind.length) return false
 
         return !(this.localVersion && this.remoteVersion && semver.gt(this.remoteVersion, this.localVersion))
     }
 
     get btnIcon() {
-        if (this.isDetached || !this.isValid || this.isDirty) return mdiAlertCircle
+        if (this.isDetached || !this.isValid || this.isCorrupt || this.isDirty) return mdiCloseCircle
 
         if (
             this.commitsBehind.length ||
@@ -280,8 +292,7 @@ export default class UpdatePanelEntry extends Mixins(BaseMixin) {
     }
 
     get btnColor() {
-        if (this.isDetached || !this.isValid) return 'orange'
-        if (this.isDirty) return 'red'
+        if (this.isCorrupt || this.isDetached || this.isDirty || !this.isValid) return 'orange'
 
         if (
             this.commitsBehind.length ||
@@ -293,9 +304,10 @@ export default class UpdatePanelEntry extends Mixins(BaseMixin) {
     }
 
     get btnText() {
+        if (this.isCorrupt) return this.$t('Machine.UpdatePanel.Corrupt')
         if (this.isDetached) return this.$t('Machine.UpdatePanel.Detached')
-        if (!this.isValid) return this.$t('Machine.UpdatePanel.Invalid')
         if (this.isDirty) return this.$t('Machine.UpdatePanel.Dirty')
+        if (!this.isValid) return this.$t('Machine.UpdatePanel.Invalid')
         if (
             this.commitsBehind.length ||
             (this.localVersion && this.remoteVersion && semver.gt(this.remoteVersion, this.localVersion))
@@ -307,23 +319,8 @@ export default class UpdatePanelEntry extends Mixins(BaseMixin) {
         return this.$t('Machine.UpdatePanel.UpToDate')
     }
 
-    get notificationText() {
-        if (this.isDetached) return this.$t('Machine.UpdatePanel.Notification.Detached')
-        if (this.isDirty) return this.$t('Machine.UpdatePanel.Notification.Dirty')
-
-        return null
-    }
-
-    get notificationColor() {
-        return this.btnColor
-    }
-
-    get notificationIcon() {
-        return this.btnIcon
-    }
-
-    get gitMessages() {
-        return this.repo.git_messages ?? []
+    get anomalies() {
+        return this.repo.anomalies ?? []
     }
 
     get warnings() {
@@ -337,8 +334,12 @@ export default class UpdatePanelEntry extends Mixins(BaseMixin) {
         return semver.gt(this.remoteVersion, this.localVersion)
     }
 
+    get repo_name() {
+        return this.repo.repo_name ?? this.repo.name ?? ''
+    }
+
     get webLinkRelease() {
-        return `https://github.com/${this.repo.owner}/${this.repo.name}/releases/tag/${this.repo.remote_version}`
+        return `https://github.com/${this.repo.owner}/${this.repo_name}/releases/tag/${this.repo.remote_version}`
     }
 
     get hideUpdateWarning() {
diff --git a/src/components/panels/Machine/UpdatePanel/GitCommitsListDayCommit.vue b/src/components/panels/Machine/UpdatePanel/GitCommitsListDayCommit.vue
index 47df5d42e..7fcde9471 100644
--- a/src/components/panels/Machine/UpdatePanel/GitCommitsListDayCommit.vue
+++ b/src/components/panels/Machine/UpdatePanel/GitCommitsListDayCommit.vue
@@ -85,8 +85,12 @@ export default class GitCommitsListDayCommit extends Mixins(BaseMixin) {
             })
     }
 
+    get repo_name() {
+        return this.repo.repo_name ?? this.repo.name ?? ''
+    }
+
     get commitHref() {
-        return `https://github.com/${this.repo.owner}/${this.repo.name}/commit/${this.commit.sha}`
+        return `https://github.com/${this.repo.owner}/${this.repo_name}/commit/${this.commit.sha}`
     }
 
     get commitShortSha() {
diff --git a/src/components/panels/Machine/UpdatePanel/UpdateHintAlert.vue b/src/components/panels/Machine/UpdatePanel/UpdateHintAlert.vue
index 15a38f9e1..97c15c621 100644
--- a/src/components/panels/Machine/UpdatePanel/UpdateHintAlert.vue
+++ b/src/components/panels/Machine/UpdatePanel/UpdateHintAlert.vue
@@ -69,13 +69,17 @@ export default class UpdateHintAlert extends Mixins(BaseMixin) {
         return null
     }
 
+    get repo_name() {
+        return this.repo.repo_name ?? this.repo.name ?? ''
+    }
+
     get externalLink() {
         if (this.name === 'klipper') return '//www.klipper3d.org/Config_Changes.html'
         if (this.name === 'moonraker') return '//moonraker.readthedocs.io/en/latest/changelog/'
         if (this.repo?.configured_type === 'web')
-            return `//github.com/${this.repo.owner}/${this.repo.name}/releases/tag/${this.repo.remote_version}`
+            return `//github.com/${this.repo.owner}/${this.repo_name}/releases/tag/${this.repo.remote_version}`
 
-        return `//github.com/${this.repo.owner}/${this.repo.name}`
+        return `//github.com/${this.repo.owner}/${this.repo_name}`
     }
 
     get externalLinkText() {
diff --git a/src/components/panels/Temperature/TemperaturePanelListItem.vue b/src/components/panels/Temperature/TemperaturePanelListItem.vue
index 1234ca89f..ea6921fc5 100644
--- a/src/components/panels/Temperature/TemperaturePanelListItem.vue
+++ b/src/components/panels/Temperature/TemperaturePanelListItem.vue
@@ -90,9 +90,12 @@ export default class TemperaturePanelListItem extends Mixins(BaseMixin) {
     }
 
     get printerObjectSettings() {
-        if (!(this.objectName in (this.$store.state.printer?.configfile?.settings ?? {}))) return {}
+        // convert objectName to lowercase, because klipper only user lowercase in configfile.settings
+        const lowerCaseObjectName = this.objectName.toLowerCase()
 
-        return this.$store.state.printer?.configfile?.settings[this.objectName]
+        if (!(lowerCaseObjectName in (this.$store.state.printer?.configfile?.settings ?? {}))) return {}
+
+        return this.$store.state.printer?.configfile?.settings[lowerCaseObjectName]
     }
 
     get name() {
@@ -231,7 +234,10 @@ export default class TemperaturePanelListItem extends Mixins(BaseMixin) {
     }
 
     get rpm() {
-        if (!('rpm' in this.printerObject)) return null
+        const rpm = this.printerObject.rpm ?? null
+
+        // return null when rpm doesn't exist
+        if (rpm === null) return null
 
         let rpmNumber = parseInt(this.printerObject.rpm)
 
diff --git a/src/components/settings/Presets/PresetsEntry.vue b/src/components/settings/Presets/PresetsEntry.vue
new file mode 100644
index 000000000..1b9842555
--- /dev/null
+++ b/src/components/settings/Presets/PresetsEntry.vue
@@ -0,0 +1,56 @@
+<template>
+    <settings-row :title="preset.name" :sub-title="subTitle">
+        <v-btn small outlined class="ml-3" @click="editPreset">
+            <v-icon left small>{{ mdiPencil }}</v-icon>
+            {{ $t('Settings.Edit') }}
+        </v-btn>
+        <v-btn small outlined class="ml-3 minwidth-0 px-2" color="error" @click="deletePreset">
+            <v-icon small>{{ mdiDelete }}</v-icon>
+        </v-btn>
+    </settings-row>
+</template>
+
+<script lang="ts">
+import { Component, Mixins, Prop } from 'vue-property-decorator'
+import BaseMixin from '@/components/mixins/base'
+import SettingsRow from '@/components/settings/SettingsRow.vue'
+import { GuiPresetsStatePreset } from '@/store/gui/presets/types'
+import { convertName } from '@/plugins/helpers'
+import { mdiDelete, mdiPencil } from '@mdi/js'
+
+@Component({
+    components: { SettingsRow },
+})
+export default class PresetsEntry extends Mixins(BaseMixin) {
+    mdiPencil = mdiPencil
+    mdiDelete = mdiDelete
+
+    @Prop({ required: true }) readonly preset!: GuiPresetsStatePreset
+
+    get subTitle() {
+        let output: string[] = []
+
+        Object.keys(this.preset.values).forEach((key: string) => {
+            const values = this.preset.values[key]
+
+            if (values.bool) {
+                const name = key.indexOf(' ') ? key.slice(key.indexOf(' ') + 1) : key
+
+                output.push(convertName(name) + ': ' + values.value + '°C')
+            }
+        })
+
+        if (this.preset.gcode) output.push(this.$t('Settings.PresetsTab.CustomGCode').toString())
+
+        return output.join(', ')
+    }
+
+    editPreset() {
+        this.$emit('edit', this.preset)
+    }
+
+    deletePreset() {
+        this.$store.dispatch('gui/presets/delete', this.preset.id)
+    }
+}
+</script>
diff --git a/src/components/settings/Presets/PresetsEntryCooldown.vue b/src/components/settings/Presets/PresetsEntryCooldown.vue
new file mode 100644
index 000000000..c57f7a0b0
--- /dev/null
+++ b/src/components/settings/Presets/PresetsEntryCooldown.vue
@@ -0,0 +1,26 @@
+<template>
+    <settings-row :title="$t('Settings.PresetsTab.Cooldown')">
+        <v-btn small outlined class="ml-3" @click="editCooldown">
+            <v-icon left small>{{ mdiPencil }}</v-icon>
+            {{ $t('Settings.Edit') }}
+        </v-btn>
+    </settings-row>
+</template>
+
+<script lang="ts">
+import { Component, Mixins } from 'vue-property-decorator'
+import BaseMixin from '@/components/mixins/base'
+import SettingsRow from '@/components/settings/SettingsRow.vue'
+import { mdiPencil } from '@mdi/js'
+
+@Component({
+    components: { SettingsRow },
+})
+export default class PresetsEntryCooldown extends Mixins(BaseMixin) {
+    mdiPencil = mdiPencil
+
+    editCooldown() {
+        this.$emit('edit')
+    }
+}
+</script>
diff --git a/src/components/settings/Presets/PresetsForm.vue b/src/components/settings/Presets/PresetsForm.vue
new file mode 100644
index 000000000..0db5c6b36
--- /dev/null
+++ b/src/components/settings/Presets/PresetsForm.vue
@@ -0,0 +1,182 @@
+<template>
+    <v-card flat>
+        <v-form v-model="valid" @submit.prevent="savePreset">
+            <v-card-title>{{ title }}</v-card-title>
+            <v-card-text>
+                <v-row v-if="boolInvalidMin" class="mt-3">
+                    <v-col class="py-0">
+                        <v-alert dense text type="error">{{ $t('Settings.PresetsTab.PresetInfo') }}</v-alert>
+                    </v-col>
+                </v-row>
+                <settings-row :title="$t('Settings.PresetsTab.Name')">
+                    <v-text-field
+                        v-model="preset.name"
+                        :placeholder="$t('Settings.PresetsTab.PresetNamePlaceholder')"
+                        hide-details="auto"
+                        :rules="[rules.required, rules.unique]"
+                        dense
+                        outlined />
+                </settings-row>
+                <div v-for="(value, key) of preset.values" :key="key">
+                    <v-divider class="my-2" />
+                    <settings-row :title="converNameObject(key)">
+                        <v-checkbox v-model="value.bool" hide-details class="shrink mt-0" />
+                        <v-text-field
+                            v-model="value.value"
+                            hide-details="auto"
+                            :rules="[rules.invalid]"
+                            type="number"
+                            suffix="°C"
+                            dense
+                            outlined
+                            hide-spin-buttons
+                            @focus="$event.target.select()" />
+                    </settings-row>
+                </div>
+                <v-divider class="my-2" />
+                <settings-row :title="$t('Settings.PresetsTab.CustomGCode')">
+                    <v-textarea v-model="preset.gcode" outlined hide-details />
+                </settings-row>
+            </v-card-text>
+            <v-card-actions class="d-flex justify-end">
+                <v-btn text @click="closeForm">
+                    {{ $t('Settings.Cancel') }}
+                </v-btn>
+                <v-btn color="primary" text type="submit" :disabled="!valid">
+                    {{ storeButtonText }}
+                </v-btn>
+            </v-card-actions>
+        </v-form>
+    </v-card>
+</template>
+
+<script lang="ts">
+import { Component, Mixins, Prop } from 'vue-property-decorator'
+import BaseMixin from '@/components/mixins/base'
+import SettingsRow from '@/components/settings/SettingsRow.vue'
+import { GuiPresetsStatePreset } from '@/store/gui/presets/types'
+import { convertName } from '@/plugins/helpers'
+import { mdiDelete, mdiPencil } from '@mdi/js'
+
+@Component({
+    components: { SettingsRow },
+})
+export default class PresetsForm extends Mixins(BaseMixin) {
+    mdiPencil = mdiPencil
+    mdiDelete = mdiDelete
+
+    @Prop({ required: true }) readonly preset!: GuiPresetsStatePreset
+
+    valid = false
+    boolInvalidMin = false
+
+    private rules = {
+        required: (value: string) => value !== '' || this.$t('Settings.PresetsTab.ErrorNameRequired'),
+        unique: (value: string) => !this.existsPresetName(value) || this.$t('Settings.PresetsTab.ErrorNameNotUnique'),
+        invalid: (value: string) => parseFloat(value) >= 0 || this.$t('Settings.PresetsTab.ErrorInvalidValue'),
+    }
+
+    get title() {
+        if (this.preset.id === null) return this.$t('Settings.PresetsTab.CreateHeadline')
+
+        return this.$t('Settings.PresetsTab.EditHeadline')
+    }
+
+    get storeButtonText() {
+        if (this.preset.id === null) return this.$t('Settings.PresetsTab.StoreButton')
+
+        return this.$t('Settings.PresetsTab.UpdateButton')
+    }
+
+    get presets() {
+        return this.$store.getters['gui/presets/getPresets'] ?? []
+    }
+
+    get available_heaters() {
+        return (this.$store.state.printer?.heaters?.available_heaters ?? []).sort()
+    }
+
+    get available_temperature_fans() {
+        return (this.$store.state.printer?.heaters?.available_sensors ?? [])
+            .filter((name: string) => name.startsWith('temperature_fan '))
+            .sort()
+    }
+
+    mounted() {
+        const presetValues = Object.keys(this.preset.values)
+
+        // add missing heaters to preset
+        this.available_heaters
+            .filter((name: string) => !presetValues.includes(name))
+            .forEach((name: string) => {
+                this.preset.values[name] = {
+                    bool: false,
+                    type: 'heater',
+                    value: 0,
+                }
+            })
+
+        // add missing temperature_fans to preset
+        this.available_temperature_fans
+            .filter((name: string) => !presetValues.includes(name))
+            .forEach((name: string) => {
+                this.preset.values[name] = {
+                    bool: false,
+                    type: 'temperature_fan',
+                    value: 0,
+                }
+            })
+
+        // remove unused values from preset
+        presetValues
+            .filter(
+                (name: string) =>
+                    !this.available_heaters.includes(name) && !this.available_temperature_fans.includes(name)
+            )
+            .forEach((name) => {
+                delete this.preset.values[name]
+            })
+    }
+
+    existsPresetName(name: string) {
+        return (
+            this.presets.findIndex(
+                (preset: GuiPresetsStatePreset) => preset.name === name && preset.id !== this.preset.id
+            ) !== -1
+        )
+    }
+
+    converNameObject(name: string) {
+        return convertName(name.replace('temperature_fan ', ''))
+    }
+
+    closeForm() {
+        this.$emit('close')
+    }
+
+    savePreset() {
+        let setValues = 0
+        for (const key of Object.keys(this.preset.values)) {
+            if (this.preset.values[key].bool) setValues++
+        }
+        if (this.preset.gcode.length) setValues++
+
+        // stop here, when no values are set
+        if (setValues === 0) {
+            this.boolInvalidMin = true
+            return
+        }
+
+        // create new preset, if id === null
+        if (this.preset.id === null) {
+            this.$store.dispatch('gui/presets/store', { values: this.preset })
+            this.closeForm()
+            return
+        }
+
+        // update existing preset
+        this.$store.dispatch('gui/presets/update', { id: this.preset.id, values: this.preset })
+        this.closeForm()
+    }
+}
+</script>
diff --git a/src/components/settings/Presets/PresetsFormCooldown.vue b/src/components/settings/Presets/PresetsFormCooldown.vue
new file mode 100644
index 000000000..a56b54d11
--- /dev/null
+++ b/src/components/settings/Presets/PresetsFormCooldown.vue
@@ -0,0 +1,52 @@
+<template>
+    <v-card flat>
+        <v-form @submit.prevent="saveCooldown">
+            <v-card-title>{{ $t('Settings.PresetsTab.EditCooldown') }}</v-card-title>
+            <v-card-text>
+                <settings-row :title="$t('Settings.PresetsTab.CustomGCode')">
+                    <v-textarea v-model="gcode" outlined hide-details />
+                </settings-row>
+            </v-card-text>
+            <v-card-actions class="d-flex justify-end">
+                <v-btn text @click="closeForm">
+                    {{ $t('Settings.Cancel') }}
+                </v-btn>
+                <v-btn color="primary" text type="submit">
+                    {{ $t('Settings.PresetsTab.UpdateCooldown') }}
+                </v-btn>
+            </v-card-actions>
+        </v-form>
+    </v-card>
+</template>
+
+<script lang="ts">
+import { Component, Mixins, Prop } from 'vue-property-decorator'
+import BaseMixin from '@/components/mixins/base'
+import SettingsRow from '@/components/settings/SettingsRow.vue'
+import { mdiDelete, mdiPencil } from '@mdi/js'
+
+@Component({
+    components: { SettingsRow },
+})
+export default class PresetsFormCooldown extends Mixins(BaseMixin) {
+    mdiPencil = mdiPencil
+    mdiDelete = mdiDelete
+
+    @Prop({ required: true }) readonly inputGcode!: string
+
+    gcode = ''
+
+    mounted() {
+        this.gcode = this.inputGcode
+    }
+
+    closeForm() {
+        this.$emit('close')
+    }
+
+    saveCooldown() {
+        this.$store.dispatch('gui/presets/saveSetting', { name: 'cooldownGcode', value: this.gcode })
+        this.closeForm()
+    }
+}
+</script>
diff --git a/src/components/settings/SettingsEditorTab.vue b/src/components/settings/SettingsEditorTab.vue
index 5b83a3911..f4b507eda 100644
--- a/src/components/settings/SettingsEditorTab.vue
+++ b/src/components/settings/SettingsEditorTab.vue
@@ -6,25 +6,23 @@
                     :title="$t('Settings.EditorTab.UseEscToClose')"
                     :sub-title="$t('Settings.EditorTab.UseEscToCloseDescription')"
                     :dynamic-slot-width="true">
-                    <v-switch v-model="escToClose" hide-details class="mt-0"></v-switch>
+                    <v-switch v-model="escToClose" hide-details class="mt-0" />
                 </settings-row>
-                <v-divider class="my-2"></v-divider>
+                <v-divider class="my-2" />
                 <settings-row
                     :title="$t('Settings.EditorTab.ConfirmUnsavedChanges')"
                     :sub-title="$t('Settings.EditorTab.ConfirmUnsavedChangesDescription')"
                     :dynamic-slot-width="true">
-                    <v-switch v-model="confirmUnsavedChanges" hide-details class="mt-0"></v-switch>
+                    <v-switch v-model="confirmUnsavedChanges" hide-details class="mt-0" />
                 </settings-row>
-
-                <v-divider class="my-2"></v-divider>
+                <v-divider class="my-2" />
                 <settings-row
                     :title="$t('Settings.EditorTab.TabSize')"
                     :sub-title="$t('Settings.EditorTab.TabSizeDescription')"
                     :dynamic-slot-width="true">
-                    <v-select v-model="tabSize" :items="tabSizes" hide-details outlined dense attached></v-select>
+                    <v-select v-model="tabSize" :items="tabSizes" hide-details outlined dense attached />
                 </settings-row>
-
-                <v-divider class="my-2"></v-divider>
+                <v-divider class="my-2" />
                 <settings-row
                     :title="$t('Settings.EditorTab.KlipperRestartMethod')"
                     :sub-title="$t('Settings.EditorTab.KlipperRestartMethodDescription')">
@@ -34,23 +32,8 @@
                         hide-details
                         outlined
                         dense
-                        attached></v-select>
+                        attached />
                 </settings-row>
-                <v-divider class="my-2"></v-divider>
-                <template v-if="availableMoonrakerInstances.length > 1">
-                    <settings-row
-                        :title="$t('Settings.EditorTab.MoonrakerRestartInstance')"
-                        :sub-title="$t('Settings.EditorTab.MoonrakerRestartInstanceDescription')">
-                        <v-select
-                            v-model="moonrakerRestartInstance"
-                            :items="availableMoonrakerInstances"
-                            hide-details
-                            outlined
-                            dense
-                            attached></v-select>
-                    </settings-row>
-                    <v-divider class="my-2"></v-divider>
-                </template>
             </v-card-text>
         </v-card>
     </div>
@@ -115,19 +98,5 @@ export default class SettingsEditorTab extends Mixins(BaseMixin) {
     set klipperRestartMethod(newVal) {
         this.$store.dispatch('gui/saveSetting', { name: 'editor.klipperRestartMethod', value: newVal })
     }
-
-    get moonrakerRestartInstance() {
-        return this.$store.state.gui.editor.moonrakerRestartInstance
-    }
-
-    set moonrakerRestartInstance(newVal) {
-        this.$store.dispatch('gui/saveSetting', { name: 'editor.moonrakerRestartInstance', value: newVal })
-    }
-
-    get availableMoonrakerInstances() {
-        const available_instances = this.$store.state.server.system_info?.available_services ?? []
-
-        return available_instances.filter((name: string) => name.startsWith('moonraker')).sort()
-    }
 }
 </script>
diff --git a/src/components/settings/SettingsPresetsTab.vue b/src/components/settings/SettingsPresetsTab.vue
index cdfed2605..536f0359a 100644
--- a/src/components/settings/SettingsPresetsTab.vue
+++ b/src/components/settings/SettingsPresetsTab.vue
@@ -1,336 +1,69 @@
 <template>
     <div>
-        <v-card v-if="!form.bool && !cooldownForm.bool" flat>
+        <presets-form v-if="boolForm" :preset="formPreset" @close="boolForm = false" />
+        <presets-form-cooldown
+            v-else-if="boolFormCooldown"
+            :input-gcode="cooldownGcode"
+            @close="boolFormCooldown = false" />
+        <v-card v-else flat>
             <v-card-text>
                 <h3 class="text-h5 mb-3">{{ $t('Settings.PresetsTab.PreheatPresets') }}</h3>
                 <div v-for="(preset, key) in presets" :key="preset.index">
-                    <v-divider v-if="key" class="my-2"></v-divider>
-                    <settings-row :title="preset.name" :sub-title="getSubTitle(preset)">
-                        <v-btn small outlined class="ml-3" @click="editPreset(preset)">
-                            <v-icon left small>{{ mdiPencil }}</v-icon>
-                            {{ $t('Settings.Edit') }}
-                        </v-btn>
-                        <v-btn
-                            small
-                            outlined
-                            class="ml-3 minwidth-0 px-2"
-                            color="error"
-                            @click="deletePreset(preset.id)">
-                            <v-icon small>{{ mdiDelete }}</v-icon>
-                        </v-btn>
-                    </settings-row>
+                    <v-divider v-if="key" class="my-2" />
+                    <presets-entry :preset="preset" @edit="edit" />
                 </div>
-                <v-divider v-if="presets.length" class="my-2"></v-divider>
-                <settings-row :title="$t('Settings.PresetsTab.Cooldown').toString()">
-                    <v-btn small outlined class="ml-3" @click="editCooldown">
-                        <v-icon left small>{{ mdiPencil }}</v-icon>
-                        {{ $t('Settings.Edit') }}
-                    </v-btn>
-                </settings-row>
+                <v-divider v-if="presets.length" class="my-2" />
+                <presets-entry-cooldown @edit="boolFormCooldown = true" />
             </v-card-text>
             <v-card-actions class="d-flex justify-end">
                 <v-btn text color="primary" @click="createPreset">{{ $t('Settings.PresetsTab.AddPreset') }}</v-btn>
             </v-card-actions>
         </v-card>
-        <v-card v-else-if="form.bool" flat>
-            <v-form v-model="form.valid" @submit.prevent="savePreset">
-                <v-card-title>
-                    {{
-                        form.id === null
-                            ? $t('Settings.PresetsTab.CreateHeadline')
-                            : $t('Settings.PresetsTab.EditHeadline')
-                    }}
-                </v-card-title>
-                <v-card-text>
-                    <v-row v-if="form.boolInvalidMin" class="mt-3">
-                        <v-col class="py-0">
-                            <v-alert dense text type="error">{{ $t('Settings.PresetsTab.PresetInfo') }}</v-alert>
-                        </v-col>
-                    </v-row>
-                    <settings-row :title="$t('Settings.PresetsTab.Name').toString()">
-                        <v-text-field
-                            v-model="form.name"
-                            :placeholder="$t('Settings.PresetsTab.PresetNamePlaceholder')"
-                            hide-details="auto"
-                            :rules="[rules.required, rules.unique]"
-                            :append-icon="form.name !== '' ? mdiCloseCircle : {}"
-                            dense
-                            outlined
-                            @click:append="form.name !== '' ? (form.name = '') : {}"></v-text-field>
-                    </settings-row>
-                    <div v-for="heater of heaters" :key="heater.name">
-                        <v-divider class="my-2"></v-divider>
-                        <settings-row :title="convertName(heater.name)">
-                            <v-checkbox
-                                v-model="form.values[heater.name].bool"
-                                hide-details
-                                class="shrink mt-0"></v-checkbox>
-                            <v-text-field
-                                v-model="form.values[heater.name].value"
-                                hide-details="auto"
-                                :rules="[rules.invalid]"
-                                type="number"
-                                suffix="°C"
-                                dense
-                                outlined
-                                hide-spin-buttons
-                                @focus="$event.target.select()"></v-text-field>
-                        </settings-row>
-                    </div>
-                    <div v-for="fan of temperatureFans" :key="'temperature_fan ' + fan.name">
-                        <v-divider class="my-2"></v-divider>
-                        <settings-row :title="convertName(fan.name)">
-                            <v-checkbox
-                                v-model="form.values['temperature_fan ' + fan.name].bool"
-                                hide-details
-                                class="shrink mt-0"></v-checkbox>
-                            <v-text-field
-                                v-model="form.values['temperature_fan ' + fan.name].value"
-                                hide-details="auto"
-                                :rules="[rules.invalid]"
-                                type="number"
-                                suffix="°C"
-                                dense
-                                outlined
-                                hide-spin-buttons
-                                @focus="$event.target.select()"></v-text-field>
-                        </settings-row>
-                    </div>
-                    <v-divider class="my-2"></v-divider>
-                    <settings-row :title="$t('Settings.PresetsTab.CustomGCode').toString()">
-                        <v-textarea v-model="form.gcode" outlined hide-details></v-textarea>
-                    </settings-row>
-                </v-card-text>
-                <v-card-actions class="d-flex justify-end">
-                    <v-btn text @click="form.bool = false">
-                        {{ $t('Settings.Cancel') }}
-                    </v-btn>
-                    <v-btn color="primary" text type="submit" :disabled="!form.valid">
-                        {{
-                            form.id === null
-                                ? $t('Settings.PresetsTab.StoreButton')
-                                : $t('Settings.PresetsTab.UpdateButton')
-                        }}
-                    </v-btn>
-                </v-card-actions>
-            </v-form>
-        </v-card>
-        <v-card v-else-if="cooldownForm.bool" flat>
-            <v-form v-model="cooldownForm.valid" @submit.prevent="saveCooldown">
-                <v-card-title>{{ $t('Settings.PresetsTab.EditCooldown') }}</v-card-title>
-                <v-card-text>
-                    <settings-row :title="$t('Settings.PresetsTab.CustomGCode').toString()">
-                        <v-textarea v-model="cooldownForm.gcode" outlined hide-details></v-textarea>
-                    </settings-row>
-                </v-card-text>
-                <v-card-actions class="d-flex justify-end">
-                    <v-btn text @click="cooldownForm.bool = false">
-                        {{ $t('Settings.Cancel') }}
-                    </v-btn>
-                    <v-btn color="primary" text type="submit">
-                        {{ $t('Settings.PresetsTab.UpdateCooldown') }}
-                    </v-btn>
-                </v-card-actions>
-            </v-form>
-        </v-card>
     </div>
 </template>
 
 <script lang="ts">
-import { convertName } from '@/plugins/helpers'
 import { Component, Mixins } from 'vue-property-decorator'
 import BaseMixin from '../mixins/base'
 import SettingsRow from '@/components/settings/SettingsRow.vue'
 import { GuiPresetsStatePreset } from '@/store/gui/presets/types'
-import { mdiDelete, mdiPencil, mdiCloseCircle } from '@mdi/js'
-
-interface presetForm {
-    bool: boolean
-    valid: boolean
-    name: string
-    gcode: string
-    id: string | null
-    boolInvalidMin: boolean
-    values: {
-        [key: string]: {
-            bool: boolean
-            value: number
-            type: 'heater' | 'temperature_fan'
-        }
-    }
-}
+import { mdiDelete, mdiPencil } from '@mdi/js'
+import PresetsEntry from '@/components/settings/Presets/PresetsEntry.vue'
+import PresetsEntryCooldown from '@/components/settings/Presets/PresetsEntryCooldown.vue'
+import PresetsForm from '@/components/settings/Presets/PresetsForm.vue'
 
 @Component({
-    components: { SettingsRow },
+    components: { PresetsForm, PresetsEntryCooldown, PresetsEntry, SettingsRow },
 })
 export default class SettingsPresetsTab extends Mixins(BaseMixin) {
     mdiPencil = mdiPencil
     mdiDelete = mdiDelete
-    mdiCloseCircle = mdiCloseCircle
 
-    convertName = convertName
+    boolForm = false
+    boolFormCooldown = false
 
-    private form: presetForm = {
-        bool: false,
-        valid: false,
-        name: '',
-        gcode: '',
-        id: null,
-        boolInvalidMin: false,
-        values: {},
-    }
-
-    private cooldownForm = {
-        bool: false,
-        valid: false,
-        gcode: '',
-    }
-
-    private rules = {
-        required: (value: string) => value !== '' || this.$t('Settings.PresetsTab.ErrorNameRequired'),
-        unique: (value: string) => !this.existsPresetName(value) || this.$t('Settings.PresetsTab.ErrorNameNotUnique'),
-        invalid: (value: string) => parseFloat(value) >= 0 || this.$t('Settings.PresetsTab.ErrorInvalidValue'),
-    }
+    formPreset: GuiPresetsStatePreset = {} as GuiPresetsStatePreset
 
     get presets() {
         return this.$store.getters['gui/presets/getPresets'] ?? []
     }
 
-    get heaters() {
-        return this.$store.getters['printer/getHeaters'] ?? []
-    }
-
-    get temperatureFans() {
-        return this.$store.getters['printer/getTemperatureFans'] ?? []
-    }
-
     get cooldownGcode() {
         return this.$store.getters['gui/presets/getCooldownGcode']
     }
 
-    existsPresetName(name: string) {
-        return (
-            this.presets.findIndex(
-                (preset: GuiPresetsStatePreset) => preset.name === name && preset.id !== this.form.id
-            ) !== -1
-        )
-    }
-
-    getSubTitle(preset: GuiPresetsStatePreset) {
-        let output: string[] = []
-
-        Object.keys(preset.values).forEach((key: string) => {
-            const values = preset.values[key]
-
-            if (values.bool) {
-                const name = key.indexOf(' ') ? key.slice(key.indexOf(' ') + 1) : key
-
-                output.push(this.convertName(name) + ': ' + values.value + '°C')
-            }
-        })
-
-        if (preset.gcode) output.push(this.$t('Settings.PresetsTab.CustomGCode').toString())
-
-        return output.join(', ')
-    }
-
     createPreset() {
-        this.clearForm()
-        this.form.bool = true
-    }
-
-    clearForm() {
-        this.form.bool = false
-        this.form.id = null
-        this.form.name = ''
-        this.form.gcode = ''
-        this.form.boolInvalidMin = false
-        this.form.values = {}
-
-        for (const heater of this.heaters) {
-            this.form.values[heater.name] = {
-                bool: true,
-                value: 0,
-                type: 'heater',
-            }
-        }
-
-        for (const fan of this.temperatureFans) {
-            this.form.values['temperature_fan ' + fan.name] = {
-                bool: true,
-                value: 0,
-                type: 'temperature_fan',
-            }
-        }
-    }
-
-    editPreset(preset: GuiPresetsStatePreset) {
-        this.form.name = preset.name
-        this.form.id = preset.id ?? null
-        this.form.gcode = preset.gcode
-        this.form.values = {}
-
-        for (const heater of this.heaters) {
-            if (heater.name in preset.values) this.form.values[heater.name] = { ...preset.values[heater.name] }
-            else
-                this.form.values[heater.name] = {
-                    bool: false,
-                    value: 0,
-                    type: 'heater',
-                }
-        }
-
-        for (const fan of this.temperatureFans) {
-            if ('temperature_fan ' + fan.name in preset.values)
-                this.form.values['temperature_fan ' + fan.name] = { ...preset.values['temperature_fan ' + fan.name] }
-            else
-                this.form.values['temperature_fan ' + fan.name] = {
-                    bool: false,
-                    value: 0,
-                    type: 'temperature_fan',
-                }
-        }
-
-        this.form.bool = true
-    }
-
-    savePreset() {
-        let setValues = 0
-        for (const key of Object.keys(this.form.values)) {
-            if (this.form.values[key].bool) setValues++
-        }
-        if (this.form.gcode.length) setValues++
-
-        if (setValues === 0) this.form.boolInvalidMin = true
-        else if (this.form.valid) {
-            const preset: GuiPresetsStatePreset = {
-                name: this.form.name,
-                gcode: this.form.gcode,
-                values: this.form.values,
-            }
-
-            if (this.form.id !== null) {
-                this.$store.dispatch('gui/presets/update', { id: this.form.id, values: preset })
-            } else this.$store.dispatch('gui/presets/store', { values: preset })
-
-            this.clearForm()
-        }
-    }
-
-    editCooldown() {
-        this.cooldownForm.gcode = this.cooldownGcode
-        this.cooldownForm.bool = true
-    }
+        this.formPreset.id = null
+        this.formPreset.name = ''
+        this.formPreset.values = {}
+        this.formPreset.gcode = ''
 
-    saveCooldown() {
-        if (this.cooldownForm.valid) {
-            this.$store.dispatch('gui/presets/saveSetting', { name: 'cooldownGcode', value: this.cooldownForm.gcode })
-            this.cooldownForm.bool = false
-        }
+        this.boolForm = true
     }
 
-    deletePreset(id: string) {
-        this.$store.dispatch('gui/presets/delete', id)
+    edit(preset: GuiPresetsStatePreset) {
+        this.formPreset = { ...preset }
+        this.boolForm = true
     }
 }
 </script>
diff --git a/src/components/settings/SettingsRow.vue b/src/components/settings/SettingsRow.vue
index 7be3cd5a1..b9782dcbf 100644
--- a/src/components/settings/SettingsRow.vue
+++ b/src/components/settings/SettingsRow.vue
@@ -3,7 +3,7 @@
         <v-col :class="firstColClasses">
             <v-row class="d-flex flex-row">
                 <v-col v-if="loading" class="col-auto d-flex justify-center align-center pr-0">
-                    <v-progress-circular indeterminate color="primary" :size="24"></v-progress-circular>
+                    <v-progress-circular indeterminate color="primary" :size="24" />
                 </v-col>
                 <v-col v-else-if="icon" class="col-auto d-flex justify-center align-center pr-0">
                     <v-icon>{{ icon }}</v-icon>
@@ -15,7 +15,7 @@
             </v-row>
         </v-col>
         <v-col :class="secondColClasses">
-            <slot></slot>
+            <slot />
         </v-col>
     </v-row>
 </template>
diff --git a/src/components/settings/SettingsTimelapseTab.vue b/src/components/settings/SettingsTimelapseTab.vue
index a92b1fb06..b01dccf3e 100644
--- a/src/components/settings/SettingsTimelapseTab.vue
+++ b/src/components/settings/SettingsTimelapseTab.vue
@@ -4,8 +4,8 @@
             <v-card-text>
                 <h3 class="text-h5 mb-3">{{ $t('Settings.TimelapseTab.General') }}</h3>
                 <settings-row
-                    :title="$t('Settings.TimelapseTab.Enabled').toString()"
-                    :sub-title="$t('Settings.TimelapseTab.EnabledDescription').toString()"
+                    :title="$t('Settings.TimelapseTab.Enabled')"
+                    :sub-title="$t('Settings.TimelapseTab.EnabledDescription')"
                     :dynamic-slot-width="true">
                     <v-switch
                         v-model="enabled"
@@ -15,8 +15,8 @@
                 </settings-row>
                 <v-divider class="my-2" />
                 <settings-row
-                    :title="$t('Settings.TimelapseTab.Autorender').toString()"
-                    :sub-title="$t('Settings.TimelapseTab.AutorenderDescription').toString()"
+                    :title="$t('Settings.TimelapseTab.Autorender')"
+                    :sub-title="$t('Settings.TimelapseTab.AutorenderDescription')"
                     :dynamic-slot-width="true">
                     <v-switch
                         v-model="autorender"
@@ -26,8 +26,8 @@
                 </settings-row>
                 <v-divider class="my-2" />
                 <settings-row
-                    :title="$t('Settings.TimelapseTab.Camera').toString()"
-                    :sub-title="$t('Settings.TimelapseTab.CameraDescription').toString()">
+                    :title="$t('Settings.TimelapseTab.Camera')"
+                    :sub-title="$t('Settings.TimelapseTab.CameraDescription')">
                     <v-select
                         v-model="camera"
                         :items="cameraOptions"
@@ -38,8 +38,8 @@
                 </settings-row>
                 <v-divider class="my-2" />
                 <settings-row
-                    :title="$t('Settings.TimelapseTab.Mode').toString()"
-                    :sub-title="$t('Settings.TimelapseTab.ModeDescription').toString()">
+                    :title="$t('Settings.TimelapseTab.Mode')"
+                    :sub-title="$t('Settings.TimelapseTab.ModeDescription')">
                     <v-select
                         v-model="mode"
                         :items="modeOptions"
@@ -51,8 +51,8 @@
                 <template v-if="mode === 'hyperlapse'">
                     <v-divider class="my-2" />
                     <settings-row
-                        :title="$t('Settings.TimelapseTab.HyperlapseCycle').toString()"
-                        :sub-title="$t('Settings.TimelapseTab.HyperlapseCycleDescription').toString()">
+                        :title="$t('Settings.TimelapseTab.HyperlapseCycle')"
+                        :sub-title="$t('Settings.TimelapseTab.HyperlapseCycleDescription')">
                         <v-text-field
                             v-model="hyperlapseCycle"
                             type="number"
@@ -66,8 +66,8 @@
                 </template>
                 <v-divider class="my-2" />
                 <settings-row
-                    :title="$t('Settings.TimelapseTab.PreviewImage').toString()"
-                    :sub-title="$t('Settings.TimelapseTab.PreviewImageDescription').toString()"
+                    :title="$t('Settings.TimelapseTab.PreviewImage')"
+                    :sub-title="$t('Settings.TimelapseTab.PreviewImageDescription')"
                     :dynamic-slot-width="true">
                     <v-switch
                         v-model="previewimage"
@@ -77,8 +77,8 @@
                 </settings-row>
                 <v-divider class="my-2" />
                 <settings-row
-                    :title="$t('Settings.TimelapseTab.SaveFrames').toString()"
-                    :sub-title="$t('Settings.TimelapseTab.SaveFramesDescription').toString()"
+                    :title="$t('Settings.TimelapseTab.SaveFrames')"
+                    :sub-title="$t('Settings.TimelapseTab.SaveFramesDescription')"
                     :dynamic-slot-width="true">
                     <v-switch
                         v-model="saveframes"
@@ -88,8 +88,8 @@
                 </settings-row>
                 <v-divider class="my-2" />
                 <settings-row
-                    :title="$t('Settings.TimelapseTab.StreamDelayCompensation').toString()"
-                    :sub-title="$t('Settings.TimelapseTab.StreamDelayCompensationDescription').toString()">
+                    :title="$t('Settings.TimelapseTab.StreamDelayCompensation')"
+                    :sub-title="$t('Settings.TimelapseTab.StreamDelayCompensationDescription')">
                     <v-text-field
                         v-model="stream_delay_compensation"
                         type="number"
@@ -102,8 +102,8 @@
                 </settings-row>
                 <v-divider class="my-2" />
                 <settings-row
-                    :title="$t('Settings.TimelapseTab.GcodeVerbose').toString()"
-                    :sub-title="$t('Settings.TimelapseTab.GcodeVerboseDescription').toString()"
+                    :title="$t('Settings.TimelapseTab.GcodeVerbose')"
+                    :sub-title="$t('Settings.TimelapseTab.GcodeVerboseDescription')"
                     :dynamic-slot-width="true">
                     <v-switch
                         v-model="gcode_verbose"
@@ -114,8 +114,8 @@
                 <v-divider class="my-2" />
                 <h3 class="text-h5 mt-6 mb-3">{{ $t('Settings.TimelapseTab.Parkhead') }}</h3>
                 <settings-row
-                    :title="$t('Settings.TimelapseTab.Parkhead').toString()"
-                    :sub-title="$t('Settings.TimelapseTab.ParkheadDescription').toString()"
+                    :title="$t('Settings.TimelapseTab.Parkhead')"
+                    :sub-title="$t('Settings.TimelapseTab.ParkheadDescription')"
                     :dynamic-slot-width="true">
                     <v-switch
                         v-model="parkhead"
@@ -126,8 +126,8 @@
                 <template v-if="parkhead">
                     <v-divider class="my-2" />
                     <settings-row
-                        :title="$t('Settings.TimelapseTab.Parkpos').toString()"
-                        :sub-title="$t('Settings.TimelapseTab.ParkposDescription').toString()">
+                        :title="$t('Settings.TimelapseTab.Parkpos')"
+                        :sub-title="$t('Settings.TimelapseTab.ParkposDescription')">
                         <v-select
                             v-model="parkpos"
                             :items="parkposOptions"
@@ -139,8 +139,8 @@
                     <template v-if="['x_only', 'custom'].includes(parkpos)">
                         <v-divider class="my-2" />
                         <settings-row
-                            :title="$t('Settings.TimelapseTab.PosX').toString()"
-                            :sub-title="$t('Settings.TimelapseTab.PosXDescription').toString()">
+                            :title="$t('Settings.TimelapseTab.PosX')"
+                            :sub-title="$t('Settings.TimelapseTab.PosXDescription')">
                             <v-text-field
                                 v-model="park_custom_pos_x"
                                 type="number"
@@ -155,8 +155,8 @@
                     <template v-if="['y_only', 'custom'].includes(parkpos)">
                         <v-divider class="my-2" />
                         <settings-row
-                            :title="$t('Settings.TimelapseTab.PosY').toString()"
-                            :sub-title="$t('Settings.TimelapseTab.PosYDescription').toString()">
+                            :title="$t('Settings.TimelapseTab.PosY')"
+                            :sub-title="$t('Settings.TimelapseTab.PosYDescription')">
                             <v-text-field
                                 v-model="park_custom_pos_y"
                                 type="number"
@@ -171,8 +171,8 @@
                     <template v-if="['x_only', 'y_only', 'custom'].includes(parkpos)">
                         <v-divider class="my-2" />
                         <settings-row
-                            :title="$t('Settings.TimelapseTab.PosDZ').toString()"
-                            :sub-title="$t('Settings.TimelapseTab.PosDZDescription').toString()">
+                            :title="$t('Settings.TimelapseTab.PosDZ')"
+                            :sub-title="$t('Settings.TimelapseTab.PosDZDescription')">
                             <v-text-field
                                 v-model="park_custom_pos_dz"
                                 type="number"
@@ -186,8 +186,8 @@
                     </template>
                     <v-divider class="my-2" />
                     <settings-row
-                        :title="$t('Settings.TimelapseTab.TravelSpeed').toString()"
-                        :sub-title="$t('Settings.TimelapseTab.TravelSpeedDescription').toString()">
+                        :title="$t('Settings.TimelapseTab.TravelSpeed')"
+                        :sub-title="$t('Settings.TimelapseTab.TravelSpeedDescription')">
                         <v-text-field
                             v-model="park_travel_speed"
                             type="number"
@@ -200,8 +200,8 @@
                     </settings-row>
                     <v-divider class="my-2" />
                     <settings-row
-                        :title="$t('Settings.TimelapseTab.FwRetract').toString()"
-                        :sub-title="$t('Settings.TimelapseTab.FwRetractDescription').toString()"
+                        :title="$t('Settings.TimelapseTab.FwRetract')"
+                        :sub-title="$t('Settings.TimelapseTab.FwRetractDescription')"
                         :dynamic-slot-width="true">
                         <v-switch
                             v-model="fw_retract"
@@ -212,8 +212,8 @@
                     <template v-if="!fw_retract">
                         <v-divider class="my-2" />
                         <settings-row
-                            :title="$t('Settings.TimelapseTab.RetractSpeed').toString()"
-                            :sub-title="$t('Settings.TimelapseTab.RetractSpeedDescription').toString()">
+                            :title="$t('Settings.TimelapseTab.RetractSpeed')"
+                            :sub-title="$t('Settings.TimelapseTab.RetractSpeedDescription')">
                             <v-text-field
                                 v-model="park_retract_speed"
                                 type="number"
@@ -226,8 +226,8 @@
                         </settings-row>
                         <v-divider class="my-2" />
                         <settings-row
-                            :title="$t('Settings.TimelapseTab.RetractDistance').toString()"
-                            :sub-title="$t('Settings.TimelapseTab.RetractDistanceDescription').toString()">
+                            :title="$t('Settings.TimelapseTab.RetractDistance')"
+                            :sub-title="$t('Settings.TimelapseTab.RetractDistanceDescription')">
                             <v-text-field
                                 v-model="park_retract_distance"
                                 type="number"
@@ -236,12 +236,12 @@
                                 outlined
                                 dense
                                 :disabled="blockedsettings.includes('park_retract_distance')"
-                                hide-spin-buttons></v-text-field>
+                                hide-spin-buttons />
                         </settings-row>
                         <v-divider class="my-2" />
                         <settings-row
-                            :title="$t('Settings.TimelapseTab.UnretractSpeed').toString()"
-                            :sub-title="$t('Settings.TimelapseTab.UnretractSpeedDescription').toString()">
+                            :title="$t('Settings.TimelapseTab.UnretractSpeed')"
+                            :sub-title="$t('Settings.TimelapseTab.UnretractSpeedDescription')">
                             <v-text-field
                                 v-model="park_extrude_speed"
                                 type="number"
@@ -254,8 +254,8 @@
                         </settings-row>
                         <v-divider class="my-2" />
                         <settings-row
-                            :title="$t('Settings.TimelapseTab.UnretractDistance').toString()"
-                            :sub-title="$t('Settings.TimelapseTab.UnretractDistanceDescription').toString()">
+                            :title="$t('Settings.TimelapseTab.UnretractDistance')"
+                            :sub-title="$t('Settings.TimelapseTab.UnretractDistanceDescription')">
                             <v-text-field
                                 v-model="park_extrude_distance"
                                 type="number"
@@ -269,8 +269,8 @@
                     </template>
                     <v-divider class="my-2" />
                     <settings-row
-                        :title="$t('Settings.TimelapseTab.ParkTime').toString()"
-                        :sub-title="$t('Settings.TimelapseTab.ParkTimeDescription').toString()">
+                        :title="$t('Settings.TimelapseTab.ParkTime')"
+                        :sub-title="$t('Settings.TimelapseTab.ParkTimeDescription')">
                         <v-text-field
                             v-model="park_time"
                             type="number"
@@ -285,8 +285,8 @@
                 <v-divider class="my-2" />
                 <h3 class="text-h5 mt-6 mb-3">{{ $t('Settings.TimelapseTab.RenderingOptions') }}</h3>
                 <settings-row
-                    :title="$t('Settings.TimelapseTab.VariableFps').toString()"
-                    :sub-title="$t('Settings.TimelapseTab.VariableFpsDescription').toString()"
+                    :title="$t('Settings.TimelapseTab.VariableFps')"
+                    :sub-title="$t('Settings.TimelapseTab.VariableFpsDescription')"
                     :dynamic-slot-width="true">
                     <v-switch
                         v-model="variable_fps"
@@ -297,8 +297,8 @@
                 <template v-if="variable_fps">
                     <v-divider class="my-2" />
                     <settings-row
-                        :title="$t('Settings.TimelapseTab.Targetlength').toString()"
-                        :sub-title="$t('Settings.TimelapseTab.TargetlengthDescription').toString()">
+                        :title="$t('Settings.TimelapseTab.Targetlength')"
+                        :sub-title="$t('Settings.TimelapseTab.TargetlengthDescription')">
                         <v-text-field
                             v-model="targetlength"
                             type="number"
@@ -307,12 +307,12 @@
                             outlined
                             dense
                             :disabled="blockedsettings.includes('targetlength')"
-                            hide-spin-buttons></v-text-field>
+                            hide-spin-buttons />
                     </settings-row>
                     <v-divider class="my-2" />
                     <settings-row
-                        :title="$t('Settings.TimelapseTab.VariableFpsMin').toString()"
-                        :sub-title="$t('Settings.TimelapseTab.VariableFpsMinDescription').toString()">
+                        :title="$t('Settings.TimelapseTab.VariableFpsMin')"
+                        :sub-title="$t('Settings.TimelapseTab.VariableFpsMinDescription')">
                         <v-text-field
                             v-model="variable_fps_min"
                             type="number"
@@ -325,8 +325,8 @@
                     </settings-row>
                     <v-divider class="my-2" />
                     <settings-row
-                        :title="$t('Settings.TimelapseTab.VariableFpsMax').toString()"
-                        :sub-title="$t('Settings.TimelapseTab.VariableFpsMaxDescription').toString()">
+                        :title="$t('Settings.TimelapseTab.VariableFpsMax')"
+                        :sub-title="$t('Settings.TimelapseTab.VariableFpsMaxDescription')">
                         <v-text-field
                             v-model="variable_fps_max"
                             type="number"
@@ -341,8 +341,8 @@
                 <template v-else>
                     <v-divider class="my-2" />
                     <settings-row
-                        :title="$t('Settings.TimelapseTab.OutputFramerate').toString()"
-                        :sub-title="$t('Settings.TimelapseTab.OutputFramerateDescription').toString()">
+                        :title="$t('Settings.TimelapseTab.OutputFramerate')"
+                        :sub-title="$t('Settings.TimelapseTab.OutputFramerateDescription')">
                         <v-text-field
                             v-model="output_framerate"
                             type="number"
@@ -356,8 +356,8 @@
                 </template>
                 <v-divider class="my-2" />
                 <settings-row
-                    :title="$t('Settings.TimelapseTab.duplicatelastframe').toString()"
-                    :sub-title="$t('Settings.TimelapseTab.duplicatelastframeDescription').toString()">
+                    :title="$t('Settings.TimelapseTab.duplicatelastframe')"
+                    :sub-title="$t('Settings.TimelapseTab.duplicatelastframeDescription')">
                     <v-text-field
                         v-model="duplicatelastframe"
                         type="number"
@@ -369,8 +369,8 @@
                 </settings-row>
                 <v-divider class="my-2" />
                 <settings-row
-                    :title="$t('Settings.TimelapseTab.ConstantRateFactor').toString()"
-                    :sub-title="$t('Settings.TimelapseTab.ConstantRateFactorDescription').toString()">
+                    :title="$t('Settings.TimelapseTab.ConstantRateFactor')"
+                    :sub-title="$t('Settings.TimelapseTab.ConstantRateFactorDescription')">
                     <v-text-field
                         v-model="constant_rate_factor"
                         type="number"
@@ -382,8 +382,8 @@
                 </settings-row>
                 <v-divider class="my-2" />
                 <settings-row
-                    :title="$t('Settings.TimelapseTab.Pixelformat').toString()"
-                    :sub-title="$t('Settings.TimelapseTab.PixelformatDescription').toString()">
+                    :title="$t('Settings.TimelapseTab.Pixelformat')"
+                    :sub-title="$t('Settings.TimelapseTab.PixelformatDescription')">
                     <v-text-field
                         v-model="pixelformat"
                         type="text"
@@ -394,8 +394,8 @@
                 </settings-row>
                 <v-divider class="my-2" />
                 <settings-row
-                    :title="$t('Settings.TimelapseTab.TimeFormatCode').toString()"
-                    :sub-title="$t('Settings.TimelapseTab.TimeFormatCodeDescription').toString()">
+                    :title="$t('Settings.TimelapseTab.TimeFormatCode')"
+                    :sub-title="$t('Settings.TimelapseTab.TimeFormatCodeDescription')">
                     <v-text-field
                         v-model="time_format_code"
                         type="text"
@@ -406,8 +406,8 @@
                 </settings-row>
                 <v-divider class="my-2" />
                 <settings-row
-                    :title="$t('Settings.TimelapseTab.Extraoutputparams').toString()"
-                    :sub-title="$t('Settings.TimelapseTab.ExtraoutputparamsDescription').toString()">
+                    :title="$t('Settings.TimelapseTab.Extraoutputparams')"
+                    :sub-title="$t('Settings.TimelapseTab.ExtraoutputparamsDescription')">
                     <v-text-field
                         v-model="extraoutputparams"
                         type="text"
@@ -483,11 +483,11 @@ export default class SettingsTimelapseTab extends Mixins(BaseMixin) {
         const output: any = []
 
         webcams
-            .filter((webcam: GuiWebcamStateWebcam) => webcam.urlSnapshot !== '')
+            .filter((webcam: GuiWebcamStateWebcam) => webcam.snapshot_url !== '')
             .forEach((webcam: GuiWebcamStateWebcam) => {
                 output.push({
                     text: webcam.name,
-                    value: webcam.id,
+                    value: webcam.name,
                 })
             })
 
diff --git a/src/components/webcams/Hlsstreamer.vue b/src/components/webcams/Hlsstreamer.vue
index 1a45c8193..894aef4ec 100644
--- a/src/components/webcams/Hlsstreamer.vue
+++ b/src/components/webcams/Hlsstreamer.vue
@@ -36,17 +36,16 @@ export default class Hlsstreamer extends Mixins(BaseMixin, WebcamMixin) {
 
     get webcamStyle() {
         const output = {
-            transform: 'none',
+            transform: this.generateTransform(
+                this.camSettings.flip_horizontal ?? false,
+                this.camSettings.flip_vertical ?? false,
+                this.camSettings.rotation ?? 0
+            ),
             aspectRatio: 16 / 9,
             maxHeight: window.innerHeight - 155 + 'px',
             maxWidth: 'auto',
         }
 
-        let transforms = ''
-        if ('flipX' in this.camSettings && this.camSettings.flip_horizontal) transforms += ' scaleX(-1)'
-        if ('flipX' in this.camSettings && this.camSettings.flip_vertical) transforms += ' scaleY(-1)'
-        if (transforms.trimStart().length) return { transform: transforms.trimStart() }
-
         if (this.aspectRatio) {
             output.aspectRatio = this.aspectRatio
             output.maxWidth = (window.innerHeight - 155) * this.aspectRatio + 'px'
diff --git a/src/components/webcams/Ipstreamer.vue b/src/components/webcams/Ipstreamer.vue
index b4514acdd..9adc7ed13 100644
--- a/src/components/webcams/Ipstreamer.vue
+++ b/src/components/webcams/Ipstreamer.vue
@@ -20,12 +20,13 @@ export default class Ipstreamer extends Mixins(BaseMixin, WebcamMixin) {
     }
 
     get webcamStyle() {
-        let transforms = ''
-        if ('flipX' in this.camSettings && this.camSettings.flip_horizontal) transforms += ' scaleX(-1)'
-        if ('flipX' in this.camSettings && this.camSettings.flip_vertical) transforms += ' scaleY(-1)'
-        if (transforms.trimStart().length) return { transform: transforms.trimStart() }
-
-        return ''
+        return {
+            transform: this.generateTransform(
+                this.camSettings.flip_horizontal ?? false,
+                this.camSettings.flip_vertical ?? false,
+                this.camSettings.rotation ?? 0
+            ),
+        }
     }
 
     visibilityChanged(isVisible: boolean) {
diff --git a/src/components/webcams/JMuxerStream.vue b/src/components/webcams/JMuxerStream.vue
index 58f38f9b7..8326a523f 100644
--- a/src/components/webcams/JMuxerStream.vue
+++ b/src/components/webcams/JMuxerStream.vue
@@ -34,12 +34,13 @@ export default class JMuxerStreamer extends Mixins(BaseMixin, WebcamMixin) {
     }
 
     get webcamStyle() {
-        let transforms = ''
-        if ('flipX' in this.camSettings && this.camSettings.flip_horizontal) transforms += ' scaleX(-1)'
-        if ('flipX' in this.camSettings && this.camSettings.flip_vertical) transforms += ' scaleY(-1)'
-        if (transforms.trimStart().length) return { transform: transforms.trimStart() }
-
-        return ''
+        return {
+            transform: this.generateTransform(
+                this.camSettings.flip_horizontal ?? false,
+                this.camSettings.flip_vertical ?? false,
+                this.camSettings.rotation ?? 0
+            ),
+        }
     }
 
     mounted() {
diff --git a/src/components/webcams/JanusStreamer.vue b/src/components/webcams/JanusStreamer.vue
index 74e39ad04..7fd0831e0 100644
--- a/src/components/webcams/JanusStreamer.vue
+++ b/src/components/webcams/JanusStreamer.vue
@@ -24,9 +24,10 @@ import { JanusJs, JanusSession, JanusStreamingPlugin } from 'typed_janus_js'
 import BaseMixin from '@/components/mixins/base'
 import { ConstructorOptions } from 'typed_janus_js/src/interfaces/janus'
 import { GuiWebcamStateWebcam } from '@/store/gui/webcams/types'
+import WebcamMixin from '@/components/mixins/webcam'
 
 @Component
-export default class JanusStreamer extends Mixins(BaseMixin) {
+export default class JanusStreamer extends Mixins(BaseMixin, WebcamMixin) {
     private janusClient: JanusJs | null = null
     private session: JanusSession | null = null
     private handle: JanusStreamingPlugin | null = null
@@ -60,15 +61,14 @@ export default class JanusStreamer extends Mixins(BaseMixin) {
 
     get webcamStyle() {
         const output = {
-            transform: 'none',
+            transform: this.generateTransform(
+                this.camSettings.flip_horizontal ?? false,
+                this.camSettings.flip_vertical ?? false,
+                this.camSettings.rotation ?? 0
+            ),
             aspectRatio: 16 / 9,
         }
 
-        let transforms = ''
-        if ('flipX' in this.camSettings && this.camSettings.flip_horizontal) transforms += ' scaleX(-1)'
-        if ('flipX' in this.camSettings && this.camSettings.flip_vertical) transforms += ' scaleY(-1)'
-        if (transforms.trimStart().length) output.transform = transforms.trimStart()
-
         if (this.aspectRatio) output.aspectRatio = this.aspectRatio
 
         return output
diff --git a/src/components/webcams/Mjpegstreamer.vue b/src/components/webcams/Mjpegstreamer.vue
index 1e64a04d4..7d9cc1671 100644
--- a/src/components/webcams/Mjpegstreamer.vue
+++ b/src/components/webcams/Mjpegstreamer.vue
@@ -50,17 +50,16 @@ export default class Mjpegstreamer extends Mixins(BaseMixin, WebcamMixin) {
 
     get webcamStyle() {
         const output = {
-            transform: 'none',
+            transform: this.generateTransform(
+                this.camSettings.flip_horizontal ?? false,
+                this.camSettings.flip_vertical ?? false,
+                this.camSettings.rotation ?? 0
+            ),
             aspectRatio: 16 / 9,
             maxHeight: window.innerHeight - 155 + 'px',
             maxWidth: 'auto',
         }
 
-        let transforms = ''
-        if ('flipX' in this.camSettings && this.camSettings.flip_horizontal) transforms += ' scaleX(-1)'
-        if ('flipX' in this.camSettings && this.camSettings.flip_vertical) transforms += ' scaleY(-1)'
-        if (transforms.trimStart().length) output.transform = transforms.trimStart()
-
         if (this.aspectRatio) {
             output.aspectRatio = this.aspectRatio
             output.maxWidth = (window.innerHeight - 155) * this.aspectRatio + 'px'
diff --git a/src/components/webcams/MjpegstreamerAdaptive.vue b/src/components/webcams/MjpegstreamerAdaptive.vue
index 40d2c77f8..0966770d7 100644
--- a/src/components/webcams/MjpegstreamerAdaptive.vue
+++ b/src/components/webcams/MjpegstreamerAdaptive.vue
@@ -21,9 +21,10 @@ import Component from 'vue-class-component'
 import { Mixins, Prop, Watch } from 'vue-property-decorator'
 import BaseMixin from '@/components/mixins/base'
 import { GuiWebcamStateWebcam } from '@/store/gui/webcams/types'
+import WebcamMixin from '@/components/mixins/webcam'
 
 @Component
-export default class MjpegstreamerAdaptive extends Mixins(BaseMixin) {
+export default class MjpegstreamerAdaptive extends Mixins(BaseMixin, WebcamMixin) {
     private refresh = Math.ceil(Math.random() * Math.pow(10, 12))
     private isVisible = true
     private isVisibleDocument = true
@@ -51,18 +52,16 @@ export default class MjpegstreamerAdaptive extends Mixins(BaseMixin) {
 
     get webcamStyle() {
         const output = {
-            transform: 'none',
+            transform: this.generateTransform(
+                this.camSettings.flip_horizontal ?? false,
+                this.camSettings.flip_vertical ?? false,
+                this.camSettings.rotation ?? 0
+            ),
             aspectRatio: 16 / 9,
             maxHeight: window.innerHeight - 155 + 'px',
             maxWidth: 'auto',
         }
 
-        let transforms = ''
-        if (this.camSettings.flip_horizontal ?? false) transforms += ' scaleX(-1)'
-        if (this.camSettings.flip_vertical ?? false) transforms += ' scaleY(-1)'
-        if ((this.camSettings.rotation ?? 0) === 180) transforms += ' rotate(180deg)'
-        if (transforms.trimStart().length) output.transform = transforms.trimStart()
-
         if (this.aspectRatio) {
             output.aspectRatio = this.aspectRatio
             output.maxWidth = (window.innerHeight - 155) * this.aspectRatio + 'px'
diff --git a/src/components/webcams/Uv4lMjpeg.vue b/src/components/webcams/Uv4lMjpeg.vue
index c1795e41f..7b7912007 100644
--- a/src/components/webcams/Uv4lMjpeg.vue
+++ b/src/components/webcams/Uv4lMjpeg.vue
@@ -35,17 +35,16 @@ export default class Uv4lMjpeg extends Mixins(BaseMixin, WebcamMixin) {
 
     get webcamStyle() {
         const output = {
-            transform: 'none',
+            transform: this.generateTransform(
+                this.camSettings.flip_horizontal ?? false,
+                this.camSettings.flip_vertical ?? false,
+                this.camSettings.rotation ?? 0
+            ),
             aspectRatio: 16 / 9,
             maxHeight: window.innerHeight - 155 + 'px',
             maxWidth: 'auto',
         }
 
-        let transforms = ''
-        if ('flipX' in this.camSettings && this.camSettings.flip_horizontal) transforms += ' scaleX(-1)'
-        if ('flipX' in this.camSettings && this.camSettings.flip_vertical) transforms += ' scaleY(-1)'
-        if (transforms.trimStart().length) output.transform = transforms.trimStart()
-
         if (this.aspectRatio) {
             output.aspectRatio = this.aspectRatio
             output.maxWidth = (window.innerHeight - 155) * this.aspectRatio + 'px'
diff --git a/src/components/webcams/WebrtcCameraStreamer.vue b/src/components/webcams/WebrtcCameraStreamer.vue
index ed811f53c..c2e6eca8e 100644
--- a/src/components/webcams/WebrtcCameraStreamer.vue
+++ b/src/components/webcams/WebrtcCameraStreamer.vue
@@ -22,9 +22,10 @@
 import { Component, Mixins, Prop, Ref, Watch } from 'vue-property-decorator'
 import BaseMixin from '@/components/mixins/base'
 import { GuiWebcamStateWebcam } from '@/store/gui/webcams/types'
+import WebcamMixin from '@/components/mixins/webcam'
 
 @Component
-export default class WebrtcCameraStreamer extends Mixins(BaseMixin) {
+export default class WebrtcCameraStreamer extends Mixins(BaseMixin, WebcamMixin) {
     private pc: RTCPeerConnection | null = null
     private useStun = false
     private remote_pc_id: string | null = null
@@ -47,7 +48,11 @@ export default class WebrtcCameraStreamer extends Mixins(BaseMixin) {
 
     get webcamStyle() {
         const output = {
-            transform: 'none',
+            transform: this.generateTransform(
+                this.camSettings.flip_horizontal ?? false,
+                this.camSettings.flip_vertical ?? false,
+                this.camSettings.rotation ?? 0
+            ),
             aspectRatio: 16 / 9,
             maxHeight: window.innerHeight - 155 + 'px',
             maxWidth: 'auto',
diff --git a/src/components/webcams/WebrtcMediaMTX.vue b/src/components/webcams/WebrtcMediaMTX.vue
index 65abd7892..8d2ce39fc 100644
--- a/src/components/webcams/WebrtcMediaMTX.vue
+++ b/src/components/webcams/WebrtcMediaMTX.vue
@@ -47,12 +47,13 @@ export default class WebrtcRTSPSimpleServer extends Mixins(BaseMixin, WebcamMixi
     }
 
     get webcamStyle() {
-        let transforms = ''
-        if ('flipX' in this.camSettings && this.camSettings.flip_horizontal) transforms += ' scaleX(-1)'
-        if ('flipX' in this.camSettings && this.camSettings.flip_vertical) transforms += ' scaleY(-1)'
-        if (transforms.trimStart().length) return { transform: transforms.trimStart() }
-
-        return ''
+        return {
+            transform: this.generateTransform(
+                this.camSettings.flip_horizontal ?? false,
+                this.camSettings.flip_vertical ?? false,
+                this.camSettings.rotation ?? 0
+            ),
+        }
     }
 
     get url() {
diff --git a/src/locales/cz.json b/src/locales/cz.json
index 0b4c8e992..9b4165176 100644
--- a/src/locales/cz.json
+++ b/src/locales/cz.json
@@ -794,8 +794,6 @@
             "Editor": "Editor",
             "KlipperRestartMethod": "Metoda restartu Klipperu",
             "KlipperRestartMethodDescription": "Vyberte metodu restartu, která se použije při editaci konfiguračních souborů Klipperu v \"Uložit a restartovat\".",
-            "MoonrakerRestartInstance": "Restart instance Moonrakeru",
-            "MoonrakerRestartInstanceDescription": "Vyberte, která služba Moonrakeru se restartuje v \"Uložit a restartovat\", když se editují konfigurační soubory Moonrakeru.",
             "UseEscToClose": "Použít ESC pro zavření editoru",
             "UseEscToCloseDescription": "Umožňuje použití klávesy ESC k zavření editoru"
         },
diff --git a/src/locales/da.json b/src/locales/da.json
index fcc163a76..1dad1e719 100644
--- a/src/locales/da.json
+++ b/src/locales/da.json
@@ -793,8 +793,6 @@
             "Editor": "Editor",
             "KlipperRestartMethod": "Metode for genstart af Klipper",
             "KlipperRestartMethodDescription": "Vælg hvilken metode der skal bruges ved brug af 'Gem & Genstart' når der redigeres i Klipper config filer.",
-            "MoonrakerRestartInstance": "Genstart Moonraker instans",
-            "MoonrakerRestartInstanceDescription": "Vælg hvilken instans af Moonraker servicen der skal genstartes ved brug af 'Gem & Genstart' når der redigeres i Moonraker config filer.",
             "UseEscToClose": "Tryk ESC for at lukke Editor.",
             "UseEscToCloseDescription": "Tillader at ESC lukker Editor"
         },
diff --git a/src/locales/de.json b/src/locales/de.json
index cb033892f..266345981 100644
--- a/src/locales/de.json
+++ b/src/locales/de.json
@@ -834,8 +834,6 @@
             "Editor": "Editor",
             "KlipperRestartMethod": "Klipper Neustartmethode",
             "KlipperRestartMethodDescription": "Wähle aus, welche Neustartmethode verwendet werden soll wenn 'Speichern & Neustarten' geklickt wir im Editor.",
-            "MoonrakerRestartInstance": "Moonraker Neustartinstanz",
-            "MoonrakerRestartInstanceDescription": "Wähle aus, welche Moonrakerinstanz neu gestartet werden soll wenn 'Speichern & Neustarten' im Editor geklickt wird.",
             "UseEscToClose": "ESC drücken um Editor zu schließen",
             "UseEscToCloseDescription": "Erlaubt es den Editor mit ESC zu schließen.",
             "TabSize": "TAB Größe",
diff --git a/src/locales/en.json b/src/locales/en.json
index 554e2b78d..d908c106d 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -490,6 +490,7 @@
             "CommittedHoursAgo": "committed {hours} hours ago",
             "CommittedOnDate": "committed on {date}",
             "CommittedYesterday": "committed yesterday",
+            "Corrupt": "corrupt",
             "ConfigChanges": "Config Changes",
             "CountPackagesCanBeUpgraded": "{count} packages can be upgraded",
             "Detached": "detached",
@@ -834,8 +835,6 @@
             "Editor": "Editor",
             "KlipperRestartMethod": "Klipper restart method",
             "KlipperRestartMethodDescription": "Select which restart method will be used on 'Save & Restart' when editing Klipper config files.",
-            "MoonrakerRestartInstance": "Moonraker restart instance",
-            "MoonrakerRestartInstanceDescription": "Select which Moonraker service will restart on 'Save & Restart' when editing Moonraker config files.",
             "UseEscToClose": "Use ESC to close editor",
             "UseEscToCloseDescription": "Allows the ESC key to close the editor",
             "TabSize": "TAB Size",
diff --git a/src/locales/es.json b/src/locales/es.json
index 20867b237..c91fedeea 100644
--- a/src/locales/es.json
+++ b/src/locales/es.json
@@ -723,8 +723,6 @@
             "Editor": "Editor",
             "KlipperRestartMethod": "Metodo de reinicio de klipper",
             "KlipperRestartMethodDescription": "Elija metodo de reinicio que sera usado cuando editamos configuracion de klipper y presionamos \"Guardar y Reiniciar\"",
-            "MoonrakerRestartInstance": "Instancia de Moonraker a reinicar",
-            "MoonrakerRestartInstanceDescription": "Elija que instacia de moonrker se reiniciara cuando editando configuracionde monnraker presionemos \"Guardar y reiniciar\" ",
             "UseEscToClose": "Use ESC para cerrar",
             "UseEscToCloseDescription": "Permite que la tecla ESC cierre el editor"
         },
diff --git a/src/locales/fr.json b/src/locales/fr.json
index a4f4b5471..67583b071 100644
--- a/src/locales/fr.json
+++ b/src/locales/fr.json
@@ -777,8 +777,6 @@
             "Editor": "Editeur",
             "KlipperRestartMethod": "Méthode de redémarrage de Klipper",
             "KlipperRestartMethodDescription": "Choisissez la méthode utilisée pour redémarrer Klipper lors d'un appui sur 'Save & Restart' après édition des fichiers de configuration.",
-            "MoonrakerRestartInstance": "Redémarrage Moonraker",
-            "MoonrakerRestartInstanceDescription": "Choisissez quel service Moonraker doit redémarrer lors d'un appui sur 'Save & Restart' après édition des fichiers de configuration.",
             "UseEscToClose": "Utiliser la touche \"esc\" pour fermer l'éditeur",
             "UseEscToCloseDescription": "Autoriser la touche \"esc\" de fermer l'éditeur."
         },
diff --git a/src/locales/hu.json b/src/locales/hu.json
index 6b45a7d02..ae1fad5c5 100644
--- a/src/locales/hu.json
+++ b/src/locales/hu.json
@@ -722,8 +722,6 @@
             "Editor": "Szerkesztő",
             "KlipperRestartMethod": "Klipper újraindítási mód",
             "KlipperRestartMethodDescription": "Válaszd ki milyen újraindítási módot használjunk a 'Ment és Újraindít' esetén, amikor a klipper konfig fájlait szerkeszted.",
-            "MoonrakerRestartInstance": "Moonraker példány Újraindítása",
-            "MoonrakerRestartInstanceDescription": "Válaszd ki melyik Moonraker szolgáltatást indítsuk újra a 'Ment és Újraindít' esetén, amikor a Moonraker konfig fájlait szerkeszted.",
             "UseEscToClose": "Kilépéshez nyomd meg az ESC gombot",
             "UseEscToCloseDescription": "Az ESC gomb megnyomása bezárja a szerkesztőt",
             "TabSize": "TAB Méret",
diff --git a/src/locales/ja.json b/src/locales/ja.json
index 2542b8d7d..8747f4a2d 100644
--- a/src/locales/ja.json
+++ b/src/locales/ja.json
@@ -794,8 +794,6 @@
             "Editor": "エディター",
             "KlipperRestartMethod": "Klipper再始動の方法",
             "KlipperRestartMethodDescription": "Klipperの設定ファイルを編集する際に'保存して再始動'での再始動方法を選択してください。",
-            "MoonrakerRestartInstance": "Moonraker インスタンスの再始動",
-            "MoonrakerRestartInstanceDescription": "Moonrakerの設定ファイルを編集する際に'保存して再始動'で、どのMoonrakerサービスを再始動するか選択してください。",
             "UseEscToClose": "ESCキーでエディターを終了します。",
             "UseEscToCloseDescription": "ESCキーでエディターを終了できます。"
         },
diff --git a/src/locales/ko.json b/src/locales/ko.json
index 64588313f..db66d0fb4 100644
--- a/src/locales/ko.json
+++ b/src/locales/ko.json
@@ -801,8 +801,6 @@
             "Editor": "파일 편집기",
             "KlipperRestartMethod": "클리퍼 재시작 방법",
             "KlipperRestartMethodDescription": "printer.cfg 파일을 수정 후, '저장 및 다시 시작'을 클릭할 때 사용할 다시 시작 방법을 선택합니다",
-            "MoonrakerRestartInstance": "문래커 재시작 방법",
-            "MoonrakerRestartInstanceDescription": "moonraker.conf 파일을 수정할 때 '저장 및 다시 시작'을 클릭할 때 사용할 문래커 서비스를 선택합니다",
             "UseEscToClose": "ESC키를 눌러 종료",
             "UseEscToCloseDescription": "ESC 키를 눌렀을 때 파일 편집기를 종료하며 만약 비활성화 했을 경우 ESC 키를 누르는 즉시 기존 입력 값은 모두 취소됩니다"
         },
diff --git a/src/locales/nl.json b/src/locales/nl.json
index 6c78544e0..264072fec 100644
--- a/src/locales/nl.json
+++ b/src/locales/nl.json
@@ -799,8 +799,6 @@
             "Editor": "Editor",
             "KlipperRestartMethod": "Klipper restart methode",
             "KlipperRestartMethodDescription": "Selecteerd welke herstart methode gebruikt wordt bij 'Save & Restart' na het bewerken van de Klipper config files.",
-            "MoonrakerRestartInstance": "Moonraker instantie herstarten",
-            "MoonrakerRestartInstanceDescription": "Selecteer welke Moonraker service herstart na 'Save & Restart' bij het bewerken van Moonraker config bestanden.",
             "UseEscToClose": "Gebruik ESC om de editor te sluiten",
             "UseEscToCloseDescription": "Laat de ESC toets de editor sluiten"
         },
diff --git a/src/locales/pl.json b/src/locales/pl.json
index 53c8fa13d..4a6b935ef 100644
--- a/src/locales/pl.json
+++ b/src/locales/pl.json
@@ -153,7 +153,7 @@
         "Uploading": "Wgrywanie"
     },
     "EmergencyStopDialog": {
-        "AreYouSure": "Jesteś pewien?",
+        "AreYouSure": "Czy na pewno?",
         "EmergencyStop": "Awaryjny STOP",
         "No": "Nie",
         "Yes": "Tak"
@@ -477,17 +477,41 @@
             "CommittedYesterday": "Wydano wczoraj",
             "Detached": "Osobne",
             "Dirty": "brudny",
-            "ERROR": "BŁĄD",
             "Invalid": "Nieprawidłowe",
             "OSPackages": "Pakiety systemowe",
-            "PackagesCanBeUpgraded": "pakiety mogą być zaktualizowane",
             "System": "System",
             "Unknown": "nieznany",
             "Update": "Aktualizuj",
             "UpdateAll": "Zaktualizuj wszystko",
             "UpdateManager": "Menadżer aktualizacji",
             "Upgrade": "Uaktualnij",
-            "UpToDate": "aktualny"
+            "UpToDate": "aktualny",
+            "Abort": "Przerwij",
+            "GenericUpdateQuestion": "Sprawdź historię zmian (jeśli jest dostępna) i stronę GitHub dla tego projektu, aby sprawdzić, czy konieczne są jakiekolwiek ręczne korekty dla tej aktualizacji.",
+            "InitUpdateManager": "Menedżer aktualizacji nie został jeszcze zainicjowany. Jest to normalne zjawisko podczas pierwszego uruchomienia systemu. Kliknij przycisk odświeżania, aby zainicjować wszystkie komponenty.",
+            "MoonrakerUpdateQuestion": "Spowoduje to aktualizację API Moonraker. Zmiany w pliku moonraker.conf mogą być wymagane do dalszego korzystania z urządzenia.",
+            "Notification": {
+                "Dirty": "Lokalne repozytorium zostało zmodyfikowane i nie można go zaktualizować w tym stanie. Przywróć to repozytorium.",
+                "Detached": "Stan odłączony nie jest błędem ani problemem. Oznacza jedynie, że w lokalnym repozytorium istnieją dodatkowe zmiany, które nie istnieją w zdalnym repozytorium."
+            },
+            "StartUpdate": "Rozpocznij aktualizację",
+            "ThesePackagesCanBeUpgrade": "Te pakiety systemowe mogą być zaktualizowane:",
+            "WebClientUpdateQuestion": "W niektórych przypadkach aktualizacja klienta sieciowego może spowodować zmiany, które mogą spowodować niezgodność. Więcej informacji można znaleźć w uwagach wydania.",
+            "AreYouSure": "Czy na pewno?",
+            "Close": "Zamknij",
+            "CommitHistory": "Historia zmian",
+            "ConfigChanges": "Zmiany konfiguracji",
+            "CountPackagesCanBeUpgraded": "Można uaktualnić {count} pakietów",
+            "GitHubPage": "Strona GitHub",
+            "HardRecovery": "Przywróć twardo",
+            "IUnderstandTheRisks": "Rozumiem ryzyko",
+            "LinkToGithub": "Link do GitHub",
+            "KlipperUpdateQuestionFirmware": "Spowoduje to aktualizację oprogramowania hosta Klipper. Płyty sterujące z działającym firmware Klipper mogą wymagać flashowania ponownie skompilowanym firmware przed przywróceniem urządzenia do pracy.",
+            "KlipperUpdateQuestionConfig": "Ta aktualizacja może również zawierać zmiany w parametrach konfiguracyjnych, które będą musiały zostać zmodyfikowane w pliku printer.cfg, szczegóły można znaleźć w dzienniku zmian.",
+            "MoreCommitsInfo": "Można tu wyświetlić maksymalnie 30 zmian. Aby zobaczyć wszystkie zmiany, kliknij poniższy link:",
+            "SoftRecovery": "Przywróć miękko",
+            "UpdateWarning": "Ostrzeżenie o aktualizacji: {name}",
+            "UpgradeableSystemPackages": "Pakiety systemowe, które można uaktualnić"
         }
     },
     "Panels": {
@@ -687,7 +711,7 @@
         }
     },
     "PowerDeviceChangeDialog": {
-        "AreYouSure": "Jesteś pewien?",
+        "AreYouSure": "Czy na pewno?",
         "No": "Nie",
         "TurnDeviceOff": "Wyłącz {device}",
         "TurnDeviceOn": "Włącz {device}",
@@ -792,8 +816,6 @@
             "Editor": "Edytor",
             "KlipperRestartMethod": "Metoda restartu Klippera",
             "KlipperRestartMethodDescription": "Wybierz która metoda ponownego uruchomienia ma być używana podczas 'Zapisz i Uruchom ponownie' podczas edytowania plików konfiguracyjnych Klippera.",
-            "MoonrakerRestartInstance": "Ponowne uruchomienie instancji Moonrakera",
-            "MoonrakerRestartInstanceDescription": "Wybierz która metoda ponownego uruchomienia ma być używana podczas 'Zapisz i Uruchom ponownie' podczas edytowania plików konfiguracyjnych Moonrakera.",
             "UseEscToClose": "Naciśnij ESC, aby wyjść z edytora",
             "UseEscToCloseDescription": "Umożliwia zamknięcie edytora za pomocą klawisza ESC",
             "TabSize": "Rozmiar tabulacji",
@@ -832,7 +854,6 @@
             "FactoryReset": "Ustawienia fabryczne",
             "General": "Ogólny",
             "Language": "Język",
-            "MoonrakerDb": "Baza danych Moonraker",
             "PrinterName": "Nazwa drukarki",
             "Reset": "reset",
             "Restore": "Przywróć",
@@ -848,7 +869,8 @@
                 "FileRelative": "Pozycja pliku (względna)",
                 "Slicer": "Slicer (M73)"
             },
-            "DateFormat": "Format daty"
+            "DateFormat": "Format daty",
+            "MainsailSettingsMoonrakerDb": "Ustawienia Mainsail w bazie danych Moonraker"
         },
         "InterfaceSettings": "Ustawienia interfejsu",
         "MacrosTab": {
@@ -1019,7 +1041,9 @@
             "ScrewsTiltAdjustDialog": "Okno dialogowe regulacji nachylenia śrubami",
             "TempchartHeight": "Wykres temperatury - wysokość",
             "TempchartHeightDescription": "Modyfikuj wysokość wykresu temperatury w panelu sterowania.",
-            "PowerDeviceName": "Urządzenie zasilające drukarkę"
+            "PowerDeviceName": "Urządzenie zasilające drukarkę",
+            "HideUpdateWarnings": "Ukryj ostrzeżenia o aktualizacji",
+            "HideUpdateWarningsDescription": "Ta opcja ukryje wszystkie ostrzeżenia o aktualizacjach w menedżerze aktualizacji."
         },
         "WebcamsTab": {
             "AddWebcam": "Dodaj kamerę",
diff --git a/src/locales/pt.json b/src/locales/pt.json
index 06784c61a..290597e79 100644
--- a/src/locales/pt.json
+++ b/src/locales/pt.json
@@ -807,8 +807,6 @@
             "Editor": "Editor",
             "KlipperRestartMethod": "Método para reiniciar Klipper",
             "KlipperRestartMethodDescription": "Selecione o método de reinicialização que será usado em 'Salvar e Reiniciar' ao editar arquivos de configuração do Klipper.",
-            "MoonrakerRestartInstance": "Reiniciar a instância do Moonraker",
-            "MoonrakerRestartInstanceDescription": "Selecione qual serviço do Moonraker será reiniciado em 'Salvar e Reiniciar' ao editar arquivos de configuração do Moonraker.",
             "Spaces": "Espaços: {count}",
             "TabSize": "Tamanho TAB",
             "TabSizeDescription": "Ajusta quantos espaços devem ser usados para a indentação de TAB.",
diff --git a/src/locales/ru.json b/src/locales/ru.json
index 6458e58de..d66c97f1b 100644
--- a/src/locales/ru.json
+++ b/src/locales/ru.json
@@ -801,8 +801,6 @@
             "Editor": "Редактор",
             "KlipperRestartMethod": "Способ перезапуска Klipper",
             "KlipperRestartMethodDescription": "Выберите какой способ перезапуска Klipper будет использоваться, после нажатия 'СОХРАНИТЬ И ПЕРЕЗАПУСТИТЬ' при редактировании конфигурационных файлов Klipper.",
-            "MoonrakerRestartInstance": "Способ перезапуска Moonraker",
-            "MoonrakerRestartInstanceDescription": "Выберите какой способ перезапуска Moonraker будет использоваться, после нажатия 'СОХРАНИТЬ И ПЕРЕЗАПУСТИТЬ' при редактировании конфигурационных файлов Moonraker.",
             "UseEscToClose": "Использование клавиши ESC",
             "UseEscToCloseDescription": "Позволяет использовать клавишу ESC для закрытия редактора",
             "TabSize": "Размер табуляции",
diff --git a/src/locales/sv.json b/src/locales/sv.json
index 97af8c162..b73a32519 100644
--- a/src/locales/sv.json
+++ b/src/locales/sv.json
@@ -620,8 +620,6 @@
             "Editor": "Redigerare",
             "KlipperRestartMethod": "Klipper omstartsmetod",
             "KlipperRestartMethodDescription": "Välj vilken omstartsmetod som ska användas på 'Spara och starta om' vid redigering av Klipper-konfigurationsfiler.",
-            "MoonrakerRestartInstance": "Starta om Moonraker instans",
-            "MoonrakerRestartInstanceDescription": "Välj vilken Moonraker-tjänst som ska startas om under \"Spara och starta om\" när du redigerar Moonraker-konfigurationsfiler.",
             "UseEscToClose": "Använd ESC för att stänga redigeringsprogrammet",
             "UseEscToCloseDescription": "Tillåter att ESC-tangenten stänger redigeraren"
         },
diff --git a/src/locales/tr.json b/src/locales/tr.json
index f520a8ecd..d8675198a 100644
--- a/src/locales/tr.json
+++ b/src/locales/tr.json
@@ -833,8 +833,6 @@
             "Editor": "Editör",
             "KlipperRestartMethod": "Klipper yeniden başlatma yöntemi",
             "KlipperRestartMethodDescription": "Klipper yapılandırma dosyalarını düzenlerken 'Kaydet ve Yeniden Başlat' seçildiğinde hangi yeniden başlatma yönteminin kullanılacağını seçin.",
-            "MoonrakerRestartInstance": "Moonraker örnek yeniden başlatma",
-            "MoonrakerRestartInstanceDescription": "Moonraker yapılandırma dosyalarını düzenlerken 'Kaydet ve Yeniden Başlat' seçildiğinde hangi Moonraker hizmetinin yeniden başlayacağını seçin.",
             "UseEscToClose": "Editörü kapatmak için ESC tuşunu kullan",
             "UseEscToCloseDescription": "ESC tuşunun editörü kapatmasına izin verir",
             "TabSize": "TAB Boyutu",
diff --git a/src/locales/uk.json b/src/locales/uk.json
index 50d90f509..10d1e5993 100644
--- a/src/locales/uk.json
+++ b/src/locales/uk.json
@@ -735,8 +735,6 @@
             "Editor": "Редактор",
             "KlipperRestartMethod": "Метод перезапуску Klipper",
             "KlipperRestartMethodDescription": "Виберіть, який метод перезавантаження буде використовуватися на 'Зберегти та перезапустити' під час редагування файлів конфігурації Klipper..",
-            "MoonrakerRestartInstance": "Інстанція перезапуску Moonraker",
-            "MoonrakerRestartInstanceDescription": "Виберіть, яка послуга Moonraker перезапуститься на 'Зберегти та перезапустити' під час редагування файлів конфігурації Moonraker.",
             "UseEscToClose": "Використовуйте ESC для закриття редактора",
             "UseEscToCloseDescription": "Дозволяє клавішу ESC закрити редактор"
         },
diff --git a/src/locales/zh.json b/src/locales/zh.json
index 933c5dbef..f1ea6321d 100644
--- a/src/locales/zh.json
+++ b/src/locales/zh.json
@@ -478,27 +478,51 @@
             }
         },
         "UpdatePanel": {
-            "CheckForUpdates": "检查更新",
+            "Abort": "中止",
+            "AreYouSure": "你确定嘛?",
+            "CheckForUpdates": "检查跟新",
+            "Close": "关闭",
+            "CommitHistory": "提交历史记录",
             "Commits": "提交",
-            "CommitsAvailable": "没有新的提交 | 有{count}个提交 | 有{count}个提交",
-            "CommitsOnDate": "提交日期{date}",
-            "CommittedDaysAgo": "{days}天前提交",
-            "CommittedHoursAgo": "{hours}小时前提交",
-            "CommittedOnDate": "提交于{date}",
-            "CommittedYesterday": "昨天提交",
-            "Detached": "独立分支",
-            "Dirty": "被污染",
-            "ERROR": "错误",
+            "CommitsAvailable": "没有有效纪录 | {count} 提交可用 | {count} 提交可用",
+            "CommitsOnDate": "提交于 {date}",
+            "CommittedDaysAgo": "提交于 {days} 日前",
+            "CommittedHoursAgo": "提交于 {hours} 小时前",
+            "CommittedOnDate": "提交于 {date}",
+            "CommittedYesterday": "昨天完成提交",
+            "ConfigChanges": "配置修改",
+            "CountPackagesCanBeUpgraded": "{count} 功能包可以跟新",
+            "Detached": "分离",
+            "Dirty": "脏",
+            "GenericUpdateQuestion": "再Github页面检查此项目的提交记录 (如果有效) 来查看此更新是否需要进行任何手动调整。",
+            "GitHubPage": "GitHub 页",
+            "HardRecovery": "硬恢复",
+            "InitUpdateManager": "更新管理器尚未初始化。 这是第一次启动系统时的正常现象。 请单击刷新按钮来初始化所有组件。",
             "Invalid": "无效",
-            "OSPackages": "操作系统软件包",
-            "PackagesCanBeUpgraded": "数据包可以更新",
+            "IUnderstandTheRisks": "我了解风险",
+            "LinkToGithub": "连接到 GitHub",
+            "KlipperUpdateQuestionFirmware": "这将更新 Klipper 主机软件。 你可能需要重新跟新MCU固件以兼容跟新后的主机。",
+            "KlipperUpdateQuestionConfig": "此更新还可能包含需要在 Printer.cfg 文件中修改的配置参数的更改，请参阅更改日志了解详细信息。",
+            "MoonrakerUpdateQuestion": "这将更新 Moonraker API。 可能需要更改 Moonraker.conf 文件才能继续使用计算机。",
+            "MoreCommitsInfo": "此处最多可显示 30 个提交。 要查看所有提交，请单击以下链接：",
+            "Notification": {
+                "Detached": "分离状态不是错误也不是问题。 它仅意味着本地存储库中存在远程存储库中不存在的其他提交。",
+                "Dirty": "本地存储库已被修改，在此状态下无法更新。 请恢复此存储库。"
+            },
+            "OSPackages": "系统包",
+            "SoftRecovery": "软恢复",
+            "StartUpdate": "开始跟新",
             "System": "系统",
+            "ThesePackagesCanBeUpgrade": "一下系统包可以跟新:",
             "Unknown": "未知",
-            "Update": "更新",
-            "UpdateAll": "更新全部组件",
-            "UpdateManager": "更新管理",
-            "Upgrade": "更新",
-            "UpToDate": "已经更新到最新"
+            "Update": "跟新",
+            "UpdateAll": "跟新所有组件",
+            "UpdateManager": "跟新管理",
+            "UpdateWarning": "跟新警告: {name}",
+            "Upgrade": "升级",
+            "UpgradeableSystemPackages": "可以升级的系统包",
+            "UpToDate": "最新",
+            "WebClientUpdateQuestion": "在某些情况下，更新 Web 客户端可能会发生更改，从而导致不兼容。 请参阅发行说明以获取更多信息。"
         }
     },
     "ManualProbe": {
@@ -809,8 +833,6 @@
             "Editor": "编辑器",
             "KlipperRestartMethod": "Klipper重启方法",
             "KlipperRestartMethodDescription": "编辑完Klipper配置文件并按下\"保存并重启\"按钮后，使用哪种重启方法。",
-            "MoonrakerRestartInstance": "重启Moonraker实例",
-            "MoonrakerRestartInstanceDescription": "编辑完Moonraker配置文件并按下\"保存并重启\"按钮后，重启哪个Moonraker服务。",
             "UseEscToClose": "使用ESC关闭编辑器",
             "UseEscToCloseDescription": "允许使用ESC键关闭编辑器",
             "TabSize": "TAB长度",
@@ -1046,6 +1068,8 @@
             "Guide": "指南",
             "HideSaveConfigButtonForBedMesh": "仅bed_mesh更改时隐藏\"保存配置\"按钮",
             "HideSaveConfigButtonForBedMeshDescription": "如果只有bed_mesh更改需要保存到Klipper时，隐藏\"保存配置\"按钮。",
+            "HideUpdateWarnings": "隐藏更新警告",
+            "HideUpdateWarningsDescription": "此选项将隐藏更新管理器中的所有更新警告。",
             "LockSliders": "在触摸屏设备上锁定滑动条",
             "LockSlidersDelay": "滑动条锁定延迟时间",
             "LockSlidersDelayDescription": "滑动条将在给定延迟时间后锁定。如果设置为0或留空，滑动条将仅在页面更改/重新加载后锁定",
diff --git a/src/locales/zh_TW.json b/src/locales/zh_TW.json
index 7cb8cf995..6a386fc9c 100644
--- a/src/locales/zh_TW.json
+++ b/src/locales/zh_TW.json
@@ -773,8 +773,6 @@
             "Editor": "編輯器",
             "KlipperRestartMethod": "Klipper重新啟動方法",
             "KlipperRestartMethodDescription": "編輯完Klipper設定檔案並按下\"儲存並重新啟動\"按鈕後，使用哪種重新啟動方法。",
-            "MoonrakerRestartInstance": "重新啟動Moonraker",
-            "MoonrakerRestartInstanceDescription": "編輯完Moonraker設定檔案並按下\"儲存並重新啟動\"按鈕後，重新啟動哪個Moonraker服務。",
             "Spaces": "空間： {count}",
             "TabSize": "標籤大小",
             "UseEscToClose": "使用 ESC 關閉編輯器",
diff --git a/src/store/editor/actions.ts b/src/store/editor/actions.ts
index 2ea3b7849..c5112a90f 100644
--- a/src/store/editor/actions.ts
+++ b/src/store/editor/actions.ts
@@ -127,11 +127,9 @@ export const actions: ActionTree<EditorState, RootState> = {
                 Vue.$toast.success(i18n.t('Editor.SuccessfullySaved', { filename: data.item.path }).toString())
                 if (payload.restartServiceName === 'klipper') {
                     const klipperRestartMethod = getters['getKlipperRestartMethod']
-                    //dispatch('server/addEvent', { message: 'FIRMWARE_RESTART', type: 'command' })
                     Vue.$socket.emit('printer.gcode.script', { script: klipperRestartMethod })
                 } else if (payload.restartServiceName === 'moonraker') {
-                    const moonrakerRestartInstance = getters['getMoonrakerRestartInstance']
-                    Vue.$socket.emit('machine.services.restart', { service: moonrakerRestartInstance })
+                    Vue.$socket.emit('server.restart', {})
                 } else if (payload.restartServiceName !== null) {
                     Vue.$socket.emit('machine.services.restart', { service: payload.restartServiceName })
                 }
diff --git a/src/store/editor/getters.ts b/src/store/editor/getters.ts
index 0e0da0cf9..59ab41323 100644
--- a/src/store/editor/getters.ts
+++ b/src/store/editor/getters.ts
@@ -5,13 +5,4 @@ export const getters: GetterTree<EditorState, any> = {
     getKlipperRestartMethod: (state, getters, rootState) => {
         return rootState.gui.editor?.klipperRestartMethod ?? 'FIRMWARE_RESTART'
     },
-
-    getMoonrakerRestartInstance: (state, getters, rootState) => {
-        const available_services = rootState.server?.system_info?.available_services ?? []
-        const setting = rootState.gui.editor?.moonrakerRestartInstance ?? 'moonraker'
-
-        if (available_services.includes(setting)) return setting
-
-        return 'moonraker'
-    },
 }
diff --git a/src/store/gui/index.ts b/src/store/gui/index.ts
index df0f97afa..17b43779b 100644
--- a/src/store/gui/index.ts
+++ b/src/store/gui/index.ts
@@ -113,7 +113,6 @@ export const getDefaultState = (): GuiState => {
             confirmUnsavedChanges: true,
             klipperRestartMethod: 'FIRMWARE_RESTART',
             tabSize: 2,
-            moonrakerRestartInstance: null,
         },
         gcodeViewer: {
             extruderColors: ['#E76F51FF', '#F4A261FF', '#E9C46AFF', '#2A9D8FFF', '#264653FF'],
diff --git a/src/store/gui/types.ts b/src/store/gui/types.ts
index a2a1d327f..1af085b9c 100644
--- a/src/store/gui/types.ts
+++ b/src/store/gui/types.ts
@@ -61,7 +61,6 @@ export interface GuiState {
         confirmUnsavedChanges: boolean
         klipperRestartMethod: 'FIRMWARE_RESTART' | 'RESTART'
         tabSize: number
-        moonrakerRestartInstance: string | null
     }
     gcodeViewer: {
         extruderColors: string[]
diff --git a/src/store/gui/webcams/actions.ts b/src/store/gui/webcams/actions.ts
index 62d1abe07..16833c8c6 100644
--- a/src/store/gui/webcams/actions.ts
+++ b/src/store/gui/webcams/actions.ts
@@ -23,9 +23,18 @@ export const actions: ActionTree<GuiWebcamState, RootState> = {
         Vue.$socket.emit('server.webcams.post_item', payload)
     },
 
-    update({ dispatch }, payload: { webcam: GuiWebcamStateWebcam; oldWebcamName: string }) {
+    update({ dispatch, rootState }, payload: { webcam: GuiWebcamStateWebcam; oldWebcamName: string }) {
         Vue.$socket.emit('server.webcams.post_item', payload.webcam)
         if (payload.webcam.name !== payload.oldWebcamName) dispatch('delete', payload.oldWebcamName)
+
+        // check if timelapse plugin is active, if not stop here
+        if (!rootState.server?.components.includes('timelapse')) return
+
+        dispatch(
+            'server/timelapse/updateCamSettings',
+            { newName: payload.webcam.name, oldName: payload.oldWebcamName },
+            { root: true }
+        )
     },
 
     delete(_, payload: string) {
diff --git a/src/store/printer/actions.ts b/src/store/printer/actions.ts
index 64145e940..8a89be88e 100644
--- a/src/store/printer/actions.ts
+++ b/src/store/printer/actions.ts
@@ -71,6 +71,10 @@ export const actions: ActionTree<PrinterState, RootState> = {
         dispatch('getData', payload)
 
         Vue.$socket.emit('server.temperature_store', {}, { action: 'printer/tempHistory/init' })
+
+        setTimeout(() => {
+            dispatch('initExtruderCanExtrude')
+        }, 200)
     },
 
     getData({ commit, dispatch, state }, payload) {
@@ -125,6 +129,17 @@ export const actions: ActionTree<PrinterState, RootState> = {
         commit('setData', payload)
     },
 
+    initExtruderCanExtrude({ state }) {
+        const extruderList: string[] = Object.keys(state).filter((name) => name.startsWith('extruder'))
+        const reInitList: { [key: string]: string[] } = {}
+
+        extruderList.forEach((extruderName) => {
+            reInitList[extruderName] = ['can_extrude']
+        })
+
+        Vue.$socket.emit('printer.objects.query', { objects: reInitList }, { action: 'printer/getData' })
+    },
+
     initHelpList({ commit, dispatch }, payload) {
         commit('setHelplist', payload)
 
diff --git a/src/store/server/timelapse/actions.ts b/src/store/server/timelapse/actions.ts
index 99452eb8f..595036af1 100644
--- a/src/store/server/timelapse/actions.ts
+++ b/src/store/server/timelapse/actions.ts
@@ -52,6 +52,14 @@ export const actions: ActionTree<ServerTimelapseState, RootState> = {
         Vue.$socket.emit('machine.timelapse.post_settings', payload, { action: 'server/timelapse/initSettings' })
     },
 
+    updateCamSettings({ dispatch, state }, payload) {
+        // check if the changed webcam is the timelapse webcam, if not stop here
+        if (state.settings.camera !== payload.oldName) return
+
+        // send the new webcam name; if it is the same name, it will only update the settings
+        dispatch('saveSetting', { camera: payload.newName })
+    },
+
     resetSnackbar({ commit }) {
         commit('resetSnackbar')
     },
diff --git a/src/store/server/updateManager/types.ts b/src/store/server/updateManager/types.ts
index 3d51e40a8..91dfbe121 100644
--- a/src/store/server/updateManager/types.ts
+++ b/src/store/server/updateManager/types.ts
@@ -32,6 +32,7 @@ export interface ServerUpdateManagerStateGitRepoCommit {
 
 export interface ServerUpdateManagerStateGitRepo {
     name: string
+    repo_name?: string
     configured_type: string
     detected_type?: string
     channel?: string
@@ -47,12 +48,15 @@ export interface ServerUpdateManagerStateGitRepo {
     remote_hash?: string
     is_valid?: boolean
     is_dirty?: boolean
+    corrupt?: boolean
     detached?: boolean
     debug_enabled?: boolean
     commits_behind?: ServerUpdateManagerStateGitRepoCommit[]
     git_messages?: string[]
+    anomalies?: string[]
     warnings?: string[]
     info_tags?: string[]
+    recovery_url?: string
 }
 
 export interface ServerUpdateManagerStateGitRepoGroupedCommits {