Merge branch 'master' into master

2025-08-11 03:34:11 +08:00 · 2022-05-19 14:24:02 +02:00
parent 361e44ad6a 9fc5a3329f
commit a9f3142cee
155 changed files with 6708 additions and 1941 deletions
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,12 +1,12 @@
 <template>
-  <router-view />
+    <router-view />
 </template>

 <script>
 import { setPageLocale } from "./util-frontend";
 export default {
-  created() {
-    setPageLocale();
-  },
+    created() {
+        setPageLocale();
+    },
 };
 </script>
--- a/src/assets/app.scss
+++ b/src/assets/app.scss
@@ -469,6 +469,10 @@ textarea.form-control {
    color: $primary;
 }

+.prism-editor__textarea {
+    outline: none !important;
+}
+
 // Localization

@import "localization.scss";
--- a/src/components/Confirm.vue
+++ b/src/components/Confirm.vue
@@ -25,7 +25,7 @@
 </template>

 <script>
-import { Modal } from "bootstrap"
+import { Modal } from "bootstrap";

 export default {
    props: {
@@ -42,19 +42,20 @@ export default {
            default: "No",
        },
    },
+    emits: [ "yes" ],
    data: () => ({
        modal: null,
    }),
    mounted() {
-        this.modal = new Modal(this.$refs.modal)
+        this.modal = new Modal(this.$refs.modal);
    },
    methods: {
        show() {
-            this.modal.show()
+            this.modal.show();
        },
        yes() {
            this.$emit("yes");
        },
    },
-}
+};
 </script>
--- a/src/components/CopyableInput.vue
+++ b/src/components/CopyableInput.vue
@@ -57,6 +57,7 @@ export default {
            default: undefined,
        },
    },
+    emits: [ "update:modelValue" ],
    data() {
        return {
            visibility: "password",
--- a/src/components/CountUp.vue
+++ b/src/components/CountUp.vue
@@ -5,12 +5,15 @@

 <script lang="ts">

-import { sleep } from "../util.ts"
+import { sleep } from "../util.ts";

 export default {

    props: {
-        value: [String, Number],
+        value: {
+            type: [ String, Number ],
+            default: 0,
+        },
        time: {
            type: Number,
            default: 0.3,
@@ -25,12 +28,12 @@ export default {
        return {
            output: "",
            frameDuration: 30,
-        }
+        };
    },

    computed: {
        isNum() {
-            return typeof this.value === "number"
+            return typeof this.value === "number";
        },
    },

@@ -45,7 +48,7 @@ export default {
            } else {
                for (let i = 1; i < frames; i++) {
                    this.output += step;
-                    await sleep(15)
+                    await sleep(15);
                }
            }

@@ -59,5 +62,5 @@ export default {

    methods: {},

-}
+};
 </script>
--- a/src/components/Datetime.vue
+++ b/src/components/Datetime.vue
@@ -4,16 +4,19 @@

 <script>
 import dayjs from "dayjs";
-import relativeTime from "dayjs/plugin/relativeTime"
-import utc from "dayjs/plugin/utc"
-import timezone from "dayjs/plugin/timezone" // dependent on utc plugin
-dayjs.extend(utc)
-dayjs.extend(timezone)
-dayjs.extend(relativeTime)
+import relativeTime from "dayjs/plugin/relativeTime";
+import timezone from "dayjs/plugin/timezone"; // dependent on utc plugin
+import utc from "dayjs/plugin/utc";
+dayjs.extend(utc);
+dayjs.extend(timezone);
+dayjs.extend(relativeTime);

 export default {
    props: {
-        value: String,
+        value: {
+            type: String,
+            default: null,
+        },
        dateOnly: {
            type: Boolean,
            default: false,
@@ -29,5 +32,5 @@ export default {
            }
        },
    },
-}
+};
 </script>
--- a/src/components/HeartbeatBar.vue
+++ b/src/components/HeartbeatBar.vue
@@ -38,7 +38,7 @@ export default {
            beatMargin: 4,
            move: false,
            maxBeat: -1,
-        }
+        };
    },
    computed: {

@@ -69,12 +69,12 @@ export default {
            if (start < 0) {
                // Add empty placeholder
                for (let i = start; i < 0; i++) {
-                    placeholders.push(0)
+                    placeholders.push(0);
                }
                start = 0;
            }

-            return placeholders.concat(this.beatList.slice(start))
+            return placeholders.concat(this.beatList.slice(start));
        },

        wrapStyle() {
@@ -84,7 +84,7 @@ export default {
            return {
                padding: `${topBottom}px ${leftRight}px`,
                width: "100%",
-            }
+            };
        },

        barStyle() {
@@ -94,12 +94,12 @@ export default {
                return {
                    transition: "all ease-in-out 0.25s",
                    transform: `translateX(${width}px)`,
-                }
+                };

            }
            return {
                transform: "translateX(0)",
-            }
+            };

        },

@@ -109,7 +109,7 @@ export default {
                height: this.beatHeight + "px",
                margin: this.beatMargin + "px",
                "--hover-scale": this.hoverScale,
-            }
+            };
        },

    },
@@ -120,7 +120,7 @@ export default {

                setTimeout(() => {
                    this.move = false;
-                }, 300)
+                }, 300);
            },
            deep: true,
        },
@@ -162,15 +162,16 @@ export default {
    methods: {
        resize() {
            if (this.$refs.wrap) {
-                this.maxBeat = Math.floor(this.$refs.wrap.clientWidth / (this.beatWidth + this.beatMargin * 2))
+                this.maxBeat = Math.floor(this.$refs.wrap.clientWidth / (this.beatWidth + this.beatMargin * 2));
            }
        },

        getBeatTitle(beat) {
-            return `${this.$root.datetime(beat.time)}` + ((beat.msg) ? ` - ${beat.msg}` : ``);
-        }
+            return `${this.$root.datetime(beat.time)}` + ((beat.msg) ? ` - ${beat.msg}` : "");
+        },
+
    },
-}
+};
 </script>

 <style lang="scss" scoped>
--- a/src/components/HiddenInput.vue
+++ b/src/components/HiddenInput.vue
@@ -48,18 +48,19 @@ export default {
            default: undefined,
        },
    },
+    emits: [ "update:modelValue" ],
    data() {
        return {
            visibility: "password",
-        }
+        };
    },
    computed: {
        model: {
            get() {
-                return this.modelValue
+                return this.modelValue;
            },
            set(value) {
-                this.$emit("update:modelValue", value)
+                this.$emit("update:modelValue", value);
            }
        }
    },
@@ -74,5 +75,5 @@ export default {
            this.visibility = "password";
        },
    }
-}
+};
 </script>
--- a/src/components/MonitorList.vue
+++ b/src/components/MonitorList.vue
@@ -21,7 +21,7 @@

            <router-link v-for="(item, index) in sortedMonitorList" :key="index" :to="monitorURL(item.id)" class="item" :class="{ 'disabled': ! item.active }">
                <div class="row">
-                    <div class="col-9 col-md-8 small-padding" :class="{ 'monitorItem': $root.userHeartbeatBar == 'bottom' || $root.userHeartbeatBar == 'none' }">
+                    <div class="col-9 col-md-8 small-padding" :class="{ 'monitor-item': $root.userHeartbeatBar == 'bottom' || $root.userHeartbeatBar == 'none' }">
                        <div class="info">
                            <Uptime :monitor="item" type="24" :pill="true" />
                            {{ item.name }}
@@ -47,8 +47,8 @@

 <script>
 import HeartbeatBar from "../components/HeartbeatBar.vue";
-import Uptime from "../components/Uptime.vue";
 import Tag from "../components/Tag.vue";
+import Uptime from "../components/Uptime.vue";
 import { getMonitorRelativeURL } from "../util.ts";

 export default {
@@ -105,7 +105,7 @@ export default {

            // Simple filter by search text
            // finds monitor name, tag name or tag value
-            if (this.searchText != "") {
+            if (this.searchText !== "") {
                const loweredSearchText = this.searchText.toLowerCase();
                result = result.filter(monitor => {
                    return monitor.name.toLowerCase().includes(loweredSearchText)
@@ -170,12 +170,6 @@ export default {
    }
 }

-.dark {
-    .footer {
-      //  background-color: $dark-bg;
-    }
-}
-
@media (max-width: 770px) {
    .list-header {
        margin: -20px;
@@ -198,7 +192,7 @@ export default {
    max-width: 15em;
 }

-.monitorItem {
+.monitor-item {
    width: 100%;
 }

--- a/src/components/NotificationDialog.vue
+++ b/src/components/NotificationDialog.vue
@@ -69,7 +69,6 @@

 <script lang="ts">
 import { Modal } from "bootstrap";
-import { ucfirst } from "../util.ts";

 import Confirm from "./Confirm.vue";
 import NotificationFormList from "./notifications";
@@ -79,7 +78,7 @@ export default {
        Confirm,
    },
    props: {},
-    emits: ["added"],
+    emits: [ "added" ],
    data() {
        return {
            model: null,
--- a/src/components/PingChart.vue
+++ b/src/components/PingChart.vue
@@ -18,13 +18,13 @@

 <script lang="ts">
 import { BarController, BarElement, Chart, Filler, LinearScale, LineController, LineElement, PointElement, TimeScale, Tooltip } from "chart.js";
-import dayjs from "dayjs";
-import utc from "dayjs/plugin/utc";
-import timezone from "dayjs/plugin/timezone";
 import "chartjs-adapter-dayjs";
+import dayjs from "dayjs";
+import timezone from "dayjs/plugin/timezone";
+import utc from "dayjs/plugin/utc";
 import { LineChart } from "vue-chart-3";
 import { useToast } from "vue-toastification";
-import { UP, DOWN, PENDING } from "../util.ts";
+import { DOWN, log } from "../util.ts";

 dayjs.extend(utc);
 dayjs.extend(timezone);
@@ -217,9 +217,11 @@ export default {
    watch: {
        // Update chart data when the selected chart period changes
        chartPeriodHrs: function (newPeriod) {
+
+            // eslint-disable-next-line eqeqeq
            if (newPeriod == "0") {
-                newPeriod = null;
                this.heartbeatList = null;
+                this.$root.storage().removeItem(`chart-period-${this.monitorId}`);
            } else {
                this.loading = true;

@@ -228,6 +230,7 @@ export default {
                        toast.error(res.msg);
                    } else {
                        this.heartbeatList = res.data;
+                        this.$root.storage()[`chart-period-${this.monitorId}`] = newPeriod;
                    }
                    this.loading = false;
                });
@@ -239,7 +242,11 @@ export default {
        // And mirror latest change to this.heartbeatList
        this.$watch(() => this.$root.heartbeatList[this.monitorId],
            (heartbeatList) => {
-                if (this.chartPeriodHrs != 0) {
+
+                log.debug("ping_chart", `this.chartPeriodHrs type ${typeof this.chartPeriodHrs}, value: ${this.chartPeriodHrs}`);
+
+                // eslint-disable-next-line eqeqeq
+                if (this.chartPeriodHrs != "0") {
                    const newBeat = heartbeatList.at(-1);
                    if (newBeat && dayjs.utc(newBeat.time) > dayjs.utc(this.heartbeatList.at(-1)?.time)) {
                        this.heartbeatList.push(heartbeatList.at(-1));
@@ -248,6 +255,12 @@ export default {
            },
            { deep: true }
        );
+
+        // Load chart period from storage if saved
+        let period = this.$root.storage()[`chart-period-${this.monitorId}`];
+        if (period != null) {
+            this.chartPeriodHrs = Math.min(period, 6);
+        }
    }
 };
 </script>
@@ -278,7 +291,7 @@ export default {

        .dropdown-item {
            border-radius: 0.3rem;
-            padding: 2px 16px 4px 16px;
+            padding: 2px 16px 4px;

            .dark & {
                background: $dark-bg;
@@ -286,6 +299,7 @@ export default {

            .dark &:hover {
                background: $dark-font-color;
+                color: $dark-font-color2;
            }
        }

--- a/src/components/ProxyDialog.vue
+++ b/src/components/ProxyDialog.vue
@@ -25,7 +25,7 @@
                            <label for="proxy-host" class="form-label">{{ $t("Proxy Server") }}</label>
                            <div class="d-flex">
                                <input id="proxy-host" v-model="proxy.host" type="text" class="form-control" required :placeholder="$t('Server Address')">
-                                <input v-model="proxy.port" type="number" class="form-control ms-2" style="width: 100px" required min="1" max="65535" :placeholder="$t('Port')">
+                                <input v-model="proxy.port" type="number" class="form-control ms-2" style="width: 100px;" required min="1" max="65535" :placeholder="$t('Port')">
                            </div>
                        </div>

@@ -105,7 +105,7 @@ export default {
        Confirm,
    },
    props: {},
-    emits: ["added"],
+    emits: [ "added" ],
    data() {
        return {
            model: null,
--- a/src/components/PublicGroupList.vue
+++ b/src/components/PublicGroupList.vue
@@ -41,7 +41,7 @@
                                            <Uptime :monitor="monitor.element" type="24" :pill="true" />
                                            {{ monitor.element.name }}
                                        </div>
-                                        <div v-if="showTags" class="tags">
+                                        <div v-if="showTag" class="tags">
                                            <Tag v-for="tag in monitor.element.tags" :key="tag" :item="tag" :size="'sm'" />
                                        </div>
                                    </div>
@@ -145,7 +145,7 @@ export default {

 .mobile {
    .item {
-        padding: 13px 0 10px 0;
+        padding: 13px 0 10px;
    }
 }

--- a/src/components/Status.vue
+++ b/src/components/Status.vue
@@ -5,7 +5,10 @@
 <script>
 export default {
    props: {
-        status: Number,
+        status: {
+            type: Number,
+            default: 0,
+        }
    },

    computed: {
--- a/src/components/Tag.vue
+++ b/src/components/Tag.vue
@@ -1,13 +1,14 @@
 <template>
-    <div class="tag-wrapper rounded d-inline-flex"
-         :class="{ 'px-3': size == 'normal',
-                   'py-1': size == 'normal',
-                   'm-2': size == 'normal',
-                   'px-2': size == 'sm',
-                   'py-0': size == 'sm',
-                   'm-1': size == 'sm',
-         }"
-         :style="{ backgroundColor: item.color, fontSize: size == 'sm' ? '0.7em' : '1em' }"
+    <div
+        class="tag-wrapper rounded d-inline-flex"
+        :class="{ 'px-3': size == 'normal',
+                  'py-1': size == 'normal',
+                  'm-2': size == 'normal',
+                  'px-2': size == 'sm',
+                  'py-0': size == 'sm',
+                  'm-1': size == 'sm',
+        }"
+        :style="{ backgroundColor: item.color, fontSize: size == 'sm' ? '0.7em' : '1em' }"
    >
        <span class="tag-text">{{ displayText }}</span>
        <span v-if="remove != null" class="ps-1 btn-remove" @click="remove(item)">
@@ -34,14 +35,14 @@ export default {
    },
    computed: {
        displayText() {
-            if (this.item.value == "") {
+            if (this.item.value === "") {
                return this.item.name;
            } else {
                return `${this.item.name}: ${this.item.value}`;
            }
        }
    }
-}
+};
 </script>

 <style lang="scss" scoped>
--- a/src/components/TagsManager.vue
+++ b/src/components/TagsManager.vue
@@ -34,18 +34,20 @@
                            label="name"
                        >
                            <template #option="{ option }">
-                                <div class="mx-2 py-1 px-3 rounded d-inline-flex"
-                                     style="margin-top: -5px; margin-bottom: -5px; height: 24px;"
-                                     :style="{ color: textColor(option), backgroundColor: option.color + ' !important' }"
+                                <div
+                                    class="mx-2 py-1 px-3 rounded d-inline-flex"
+                                    style="margin-top: -5px; margin-bottom: -5px; height: 24px;"
+                                    :style="{ color: textColor(option), backgroundColor: option.color + ' !important' }"
                                >
                                    <span>
                                        {{ option.name }}</span>
                                </div>
                            </template>
                            <template #singleLabel="{ option }">
-                                <div class="py-1 px-3 rounded d-inline-flex"
-                                     style="height: 24px;"
-                                     :style="{ color: textColor(option), backgroundColor: option.color + ' !important' }"
+                                <div
+                                    class="py-1 px-3 rounded d-inline-flex"
+                                    style="height: 24px;"
+                                    :style="{ color: textColor(option), backgroundColor: option.color + ' !important' }"
                                >
                                    <span>{{ option.name }}</span>
                                </div>
@@ -53,10 +55,11 @@
                        </vue-multiselect>
                        <div v-if="newDraftTag.select?.name == null" class="d-flex mb-2">
                            <div class="w-50 pe-2">
-                                <input v-model="newDraftTag.name" class="form-control"
-                                       :class="{'is-invalid': validateDraftTag.nameInvalid}"
-                                       :placeholder="$t('Name')"
-                                       @keydown.enter.prevent="onEnter"
+                                <input
+                                    v-model="newDraftTag.name" class="form-control"
+                                    :class="{'is-invalid': validateDraftTag.nameInvalid}"
+                                    :placeholder="$t('Name')"
+                                    @keydown.enter.prevent="onEnter"
                                />
                                <div class="invalid-feedback">
                                    {{ $t("Tag with this name already exist.") }}
@@ -75,17 +78,19 @@
                                    deselect-label=""
                                >
                                    <template #option="{ option }">
-                                        <div class="mx-2 py-1 px-3 rounded d-inline-flex"
-                                             style="height: 24px; color: white;"
-                                             :style="{ backgroundColor: option.color + ' !important' }"
+                                        <div
+                                            class="mx-2 py-1 px-3 rounded d-inline-flex"
+                                            style="height: 24px; color: white;"
+                                            :style="{ backgroundColor: option.color + ' !important' }"
                                        >
                                            <span>{{ option.name }}</span>
                                        </div>
                                    </template>
                                    <template #singleLabel="{ option }">
-                                        <div class="py-1 px-3 rounded d-inline-flex"
-                                             style="height: 24px; color: white;"
-                                             :style="{ backgroundColor: option.color + ' !important' }"
+                                        <div
+                                            class="py-1 px-3 rounded d-inline-flex"
+                                            style="height: 24px; color: white;"
+                                            :style="{ backgroundColor: option.color + ' !important' }"
                                        >
                                            <span>{{ option.name }}</span>
                                        </div>
@@ -94,10 +99,11 @@
                            </div>
                        </div>
                        <div class="mb-2">
-                            <input v-model="newDraftTag.value" class="form-control"
-                                   :class="{'is-invalid': validateDraftTag.valueInvalid}"
-                                   :placeholder="$t('value (optional)')"
-                                   @keydown.enter.prevent="onEnter"
+                            <input
+                                v-model="newDraftTag.value" class="form-control"
+                                :class="{'is-invalid': validateDraftTag.valueInvalid}"
+                                :placeholder="$t('value (optional)')"
+                                @keydown.enter.prevent="onEnter"
                            />
                            <div class="invalid-feedback">
                                {{ $t("Tag with this value already exist.") }}
@@ -123,8 +129,8 @@
 <script>
 import { Modal } from "bootstrap";
 import VueMultiselect from "vue-multiselect";
-import Tag from "../components/Tag.vue";
 import { useToast } from "vue-toastification";
+import Tag from "../components/Tag.vue";
 const toast = useToast();

 export default {
@@ -159,14 +165,14 @@ export default {
        tagOptions() {
            const tagOptions = this.existingTags;
            for (const tag of this.newTags) {
-                if (!tagOptions.find(t => t.name == tag.name && t.color == tag.color)) {
+                if (!tagOptions.find(t => t.name === tag.name && t.color === tag.color)) {
                    tagOptions.push(tag);
                }
            }
            return tagOptions;
        },
        selectedTags() {
-            return this.preSelectedTags.concat(this.newTags).filter(tag => !this.deleteTags.find(monitorTag => monitorTag.id == tag.id));
+            return this.preSelectedTags.concat(this.newTags).filter(tag => !this.deleteTags.find(monitorTag => monitorTag.id === tag.id));
        },
        colorOptions() {
            return [
@@ -192,7 +198,7 @@ export default {
            let nameInvalid = false;
            let valueInvalid = false;
            let invalid = true;
-            if (this.deleteTags.find(tag => tag.name == this.newDraftTag.select?.name && tag.value == this.newDraftTag.value)) {
+            if (this.deleteTags.find(tag => tag.name === this.newDraftTag.select?.name && tag.value === this.newDraftTag.value)) {
                // Undo removing a Tag
                nameInvalid = false;
                valueInvalid = false;
@@ -202,9 +208,9 @@ export default {
                nameInvalid = true;
                invalid = true;
            } else if (this.newTags.concat(this.preSelectedTags).filter(tag => (
-                tag.name == this.newDraftTag.select?.name && tag.value == this.newDraftTag.value
+                tag.name === this.newDraftTag.select?.name && tag.value === this.newDraftTag.value
            ) || (
-                tag.name == this.newDraftTag.name && tag.value == this.newDraftTag.value
+                tag.name === this.newDraftTag.name && tag.value === this.newDraftTag.value
            )).length > 0) {
                // Try to add a tag with existing name and value
                valueInvalid = true;
@@ -250,7 +256,7 @@ export default {
        deleteTag(item) {
            if (item.new) {
                // Undo Adding a new Tag
-                this.newTags = this.newTags.filter(tag => !(tag.name == item.name && tag.value == item.value));
+                this.newTags = this.newTags.filter(tag => !(tag.name === item.name && tag.value === item.value));
            } else {
                // Remove an Existing Tag
                this.deleteTags.push(item);
@@ -266,9 +272,9 @@ export default {
        addDraftTag() {
            console.log("Adding Draft Tag: ", this.newDraftTag);
            if (this.newDraftTag.select != null) {
-                if (this.deleteTags.find(tag => tag.name == this.newDraftTag.select.name && tag.value == this.newDraftTag.value)) {
+                if (this.deleteTags.find(tag => tag.name === this.newDraftTag.select.name && tag.value === this.newDraftTag.value)) {
                    // Undo removing a tag
-                    this.deleteTags = this.deleteTags.filter(tag => !(tag.name == this.newDraftTag.select.name && tag.value == this.newDraftTag.value));
+                    this.deleteTags = this.deleteTags.filter(tag => !(tag.name === this.newDraftTag.select.name && tag.value === this.newDraftTag.value));
                } else {
                    // Add an existing Tag
                    this.newTags.push({
@@ -345,7 +351,7 @@ export default {
                    tagId = newTagResult.id;
                    // Assign the new ID to the tags of the same name & color
                    this.newTags.map(tag => {
-                        if (tag.name == newTag.name && tag.color == newTag.color) {
+                        if (tag.name === newTag.name && tag.color === newTag.color) {
                            tag.id = newTagResult.id;
                        }
                    });
--- a/src/components/ToggleSection.vue
+++ b/src/components/ToggleSection.vue
@@ -49,7 +49,7 @@ export default {
 <style lang="scss" scoped>
@import "../assets/vars.scss";

-h5:after {
+h5::after {
    content: "";
    display: block;
    width: 50%;
--- a/src/components/TwoFADialog.vue
+++ b/src/components/TwoFADialog.vue
@@ -46,7 +46,7 @@
                                    <input v-model="token" type="text" maxlength="6" class="form-control">
                                    <button class="btn btn-outline-primary" type="button" @click="verifyToken()">{{ $t("Verify Token") }}</button>
                                </div>
-                                <p v-show="tokenValid" class="mt-2" style="color: green">{{ $t("tokenValidSettingsMsg") }}</p>
+                                <p v-show="tokenValid" class="mt-2" style="color: green;">{{ $t("tokenValidSettingsMsg") }}</p>
                            </div>
                        </div>
                    </div>
--- a/src/components/Uptime.vue
+++ b/src/components/Uptime.vue
@@ -5,8 +5,14 @@
 <script>
 export default {
    props: {
-        monitor: Object,
-        type: String,
+        monitor: {
+            type: Object,
+            default: null,
+        },
+        type: {
+            type: String,
+            default: null,
+        },
        pill: {
            type: Boolean,
            default: false,
@@ -22,33 +28,33 @@ export default {
                return Math.round(this.$root.uptimeList[key] * 10000) / 100 + "%";
            }

-            return this.$t("notAvailableShort")
+            return this.$t("notAvailableShort");
        },

        color() {
            if (this.lastHeartBeat.status === 0) {
-                return "danger"
+                return "danger";
            }

            if (this.lastHeartBeat.status === 1) {
-                return "primary"
+                return "primary";
            }

            if (this.lastHeartBeat.status === 2) {
-                return "warning"
+                return "warning";
            }

-            return "secondary"
+            return "secondary";
        },

        lastHeartBeat() {
            if (this.monitor.id in this.$root.lastHeartbeatList && this.$root.lastHeartbeatList[this.monitor.id]) {
-                return this.$root.lastHeartbeatList[this.monitor.id]
+                return this.$root.lastHeartbeatList[this.monitor.id];
            }

            return {
                status: -1,
-            }
+            };
        },

        className() {
@@ -59,7 +65,7 @@ export default {
            return "";
        },
    },
-}
+};
 </script>

 <style>
--- a/src/components/notifications/Apprise.vue
+++ b/src/components/notifications/Apprise.vue
@@ -8,6 +8,9 @@
                <a href="https://github.com/caronc/apprise/wiki#notification-services" target="_blank">https://github.com/caronc/apprise/wiki#notification-services</a>
            </i18n-t>
        </div>
+
+        <label for="title" class="form-label">{{ $t("Title") }}</label>
+        <input id="title" v-model="$parent.notification.title" type="text" class="form-control">
    </div>
    <div class="mb-3">
        <i18n-t tag="p" keypath="Status:">
--- a/src/components/notifications/ClickSendSMS.vue
+++ b/src/components/notifications/ClickSendSMS.vue
@@ -1,12 +1,11 @@
 <template>
    <div class="mb-3">
-        <label for="clicksendsms-login" class="form-label">API Username</label>
-        <div class="form-text">
-            {{ $t("apiCredentials") }}
+        <label for="clicksendsms-login" class="form-label">{{ $t("API Username") }}</label>
+        <i18n-t tag="div" class="form-text" keypath="wayToGetClickSendSMSToken">
            <a href="http://dashboard.clicksend.com/account/subaccounts" target="_blank">{{ $t("here") }}</a>
-        </div>
+        </i18n-t>
        <input id="clicksendsms-login" v-model="$parent.notification.clicksendsmsLogin" type="text" class="form-control" required>
-        <label for="clicksendsms-key" class="form-label">API Key</label>
+        <label for="clicksendsms-key" class="form-label">{{ $t("API Key") }}</label>
        <HiddenInput id="clicksendsms-key" v-model="$parent.notification.clicksendsmsPassword" :required="true" autocomplete="one-time-code"></HiddenInput>
    </div>
    <div class="mb-3">
@@ -16,15 +15,15 @@
        </div>
    </div>
    <div class="mb-3">
-        <label for="clicksendsms-to-number" class="form-label">Recipient Number</label>
+        <label for="clicksendsms-to-number" class="form-label">{{ $t("Recipient Number") }}</label>
        <input id="clicksendsms-to-number" v-model="$parent.notification.clicksendsmsToNumber" type="text" minlength="8" maxlength="14" class="form-control" required>
    </div>
    <div class="mb-3">
-        <label for="clicksendsms-sender-name" class="form-label">From Name/Number -
-            <a href="https://help.clicksend.com/article/4kgj7krx00-what-is-a-sender-id-or-sender-number" target="_blank">More Info</a>
+        <label for="clicksendsms-sender-name" class="form-label">{{ $t("From Name/Number") }} -
+            <a href="https://help.clicksend.com/article/4kgj7krx00-what-is-a-sender-id-or-sender-number" target="_blank">{{ $t("Read more") }}</a>
        </label>
        <input id="clicksendsms-sender-name" v-model="$parent.notification.clicksendsmsSenderName" type="text" minlength="3" maxlength="11" class="form-control">
-        <div class="form-text">Leave blank to use a shared sender number.</div>
+        <div class="form-text">{{ $t("Leave blank to use a shared sender number.") }}</div>
    </div>
 </template>
 <script>
--- a/src/components/notifications/Gotify.vue
+++ b/src/components/notifications/Gotify.vue
@@ -28,5 +28,5 @@ export default {
            this.$parent.notification.gotifyPriority = 8;
        }
    },
-}
+};
 </script>
--- a/src/components/notifications/Line.vue
+++ b/src/components/notifications/Line.vue
@@ -7,7 +7,7 @@
        <b>{{ $t("Basic Settings") }}</b>
    </i18n-t>
    <div class="mb-3" style="margin-top: 12px;">
-        <label for="line-user-id" class="form-label">User ID</label>
+        <label for="line-user-id" class="form-label">{{ $t("User ID") }}</label>
        <input id="line-user-id" v-model="$parent.notification.lineUserID" type="text" class="form-control" required>
    </div>
    <i18n-t tag="div" keypath="lineDevConsoleTo" class="form-text">
--- a/src/components/notifications/Mattermost.vue
+++ b/src/components/notifications/Mattermost.vue
@@ -1,6 +1,6 @@
 <template>
    <div class="mb-3">
-        <label for="mattermost-webhook-url" class="form-label">{{ $t("Webhook URL") }}<span style="color:red;"><sup>*</sup></span></label>
+        <label for="mattermost-webhook-url" class="form-label">{{ $t("Webhook URL") }}<span style="color: red;"><sup>*</sup></span></label>
        <input id="mattermost-webhook-url" v-model="$parent.notification.mattermostWebhookUrl" type="text" class="form-control" required>
        <label for="mattermost-username" class="form-label">{{ $t("Username") }}</label>
        <input id="mattermost-username" v-model="$parent.notification.mattermostusername" type="text" class="form-control">
@@ -11,7 +11,7 @@
        <label for="mattermost-channel" class="form-label">{{ $t("Channel Name") }}</label>
        <input id="mattermost-channel-name" v-model="$parent.notification.mattermostchannel" type="text" class="form-control">
        <div class="form-text">
-            <span style="color:red;"><sup>*</sup></span>{{ $t("Required") }}
+            <span style="color: red;"><sup>*</sup></span>{{ $t("Required") }}
            <i18n-t tag="p" keypath="aboutWebhooks" style="margin-top: 8px;">
                <a href="https://docs.mattermost.com/developer/webhooks-incoming.html" target="_blank">https://docs.mattermost.com/developer/webhooks-incoming.html</a>
            </i18n-t>
--- a/src/components/notifications/Octopush.vue
+++ b/src/components/notifications/Octopush.vue
@@ -1,18 +1,18 @@
 <template>
    <div class="mb-3">
-        <label for="octopush-version" class="form-label">Octopush API Version</label>
+        <label for="octopush-version" class="form-label">{{ $t("Octopush API Version") }}</label>
        <select id="octopush-version" v-model="$parent.notification.octopushVersion" class="form-select">
-            <option value="2">Octopush (endpoint: api.octopush.com)</option>
-            <option value="1">Legacy Octopush-DM (endpoint: www.octopush-dm.com)</option>
+            <option value="2">{{ $t("octopush") }} ({{ $t("endpoint") }}: api.octopush.com)</option>
+            <option value="1">{{ $t("Legacy Octopush-DM") }} ({{ $t("endpoint") }}: www.octopush-dm.com)</option>
        </select>
        <div class="form-text">
            {{ $t("octopushLegacyHint") }}
        </div>
    </div>
    <div class="mb-3">
-        <label for="octopush-key" class="form-label">API KEY</label>
+        <label for="octopush-key" class="form-label">{{ $t("octopushAPIKey") }}</label>
        <HiddenInput id="octopush-key" v-model="$parent.notification.octopushAPIKey" :required="true" autocomplete="one-time-code"></HiddenInput>
-        <label for="octopush-login" class="form-label">API LOGIN</label>
+        <label for="octopush-login" class="form-label">{{ $t("octopushLogin") }}</label>
        <input id="octopush-login" v-model="$parent.notification.octopushLogin" type="text" class="form-control" required>
    </div>
    <div class="mb-3">
--- a/src/components/notifications/OneBot.vue
+++ b/src/components/notifications/OneBot.vue
@@ -0,0 +1,34 @@
+<template>
+    <div class="mb-3">
+        <div class="mb-3">
+            <label for="onebot-http-addr" class="form-label">{{ $t("onebotHttpAddress") }}<span style="color: red;"><sup>*</sup></span></label>
+            <input id="HttpUrl" v-model="$parent.notification.httpAddr" type="text" class="form-control" required>
+        </div>
+        <div class="mb-3">
+            <label for="onebot-access-token" class="form-label">AccessToken<span style="color: red;"><sup>*</sup></span></label>
+            <input id="HttpUrl" v-model="$parent.notification.accessToken" type="text" class="form-control" required>
+            <div class="form-text">
+                <p>{{ $t("onebotSafetyTips") }}</p>
+            </div>
+        </div>
+
+        <div class="mb-3">
+            <label for="onebot-msg-type" class="form-label">{{ $t("onebotMessageType") }}</label>
+            <select id="onebot-msg-type" v-model="$parent.notification.msgType" class="form-select">
+                <option value="group">{{ $t("onebotGroupMessage") }}</option>
+                <option value="private">{{ $t("onebotPrivateMessage") }}</option>
+            </select>
+        </div>
+
+        <div class="mb-3">
+            <label for="onebot-reciever-id" class="form-label">{{ $t("onebotUserOrGroupId") }}<span style="color: red;"><sup>*</sup></span></label>
+            <input id="secretKey" v-model="$parent.notification.recieverId" type="text" class="form-control" required>
+        </div>
+
+        <div class="form-text">
+            <i18n-t tag="p" keypath="Read more:">
+                <a href="https://github.com/botuniverse/onebot-11" target="_blank">https://github.com/botuniverse/onebot-11</a>
+            </i18n-t>
+        </div>
+    </div>
+</template>
--- a/src/components/notifications/PromoSMS.vue
+++ b/src/components/notifications/PromoSMS.vue
@@ -1,8 +1,8 @@
 <template>
    <div class="mb-3">
-        <label for="promosms-login" class="form-label">API LOGIN</label>
+        <label for="promosms-login" class="form-label">{{ $("promosmsLogin") }}</label>
        <input id="promosms-login" v-model="$parent.notification.promosmsLogin" type="text" class="form-control" required>
-        <label for="promosms-key" class="form-label">API PASSWORD</label>
+        <label for="promosms-key" class="form-label">{{ $("promosmsPassword") }}</label>
        <HiddenInput id="promosms-key" v-model="$parent.notification.promosmsPassword" :required="true" autocomplete="one-time-code"></HiddenInput>
    </div>
    <div class="mb-3">
--- a/src/components/notifications/PushDeer.vue
+++ b/src/components/notifications/PushDeer.vue
@@ -0,0 +1,19 @@
+<template>
+    <div class="mb-3">
+        <label for="pushdeer-key" class="form-label">{{ $t("PushDeer Key") }}</label>
+        <HiddenInput id="pushdeer-key" v-model="$parent.notification.pushdeerKey" :required="true" autocomplete="one-time-code" placeholder="PDUxxxx"></HiddenInput>
+    </div>
+
+    <i18n-t tag="p" keypath="More info on:" style="margin-top: 8px;">
+        <a href="http://www.pushdeer.com/" rel="noopener noreferrer" target="_blank">http://www.pushdeer.com/</a>
+    </i18n-t>
+</template>
+
+<script>
+import HiddenInput from "../HiddenInput.vue";
+export default {
+    components: {
+        HiddenInput,
+    },
+};
+</script>
--- a/src/components/notifications/Pushover.vue
+++ b/src/components/notifications/Pushover.vue
@@ -18,28 +18,29 @@
        </select>
        <label for="pushover-sound" class="form-label">{{ $t("Notification Sound") }}</label>
        <select id="pushover-sound" v-model="$parent.notification.pushoversounds" class="form-select">
-            <option>pushover</option>
-            <option>bike</option>
-            <option>bugle</option>
-            <option>cashregister</option>
-            <option>classical</option>
-            <option>cosmic</option>
-            <option>falling</option>
-            <option>gamelan</option>
-            <option>incoming</option>
-            <option>intermission</option>
-            <option>mechanical</option>
-            <option>pianobar</option>
-            <option>siren</option>
-            <option>spacealarm</option>
-            <option>tugboat</option>
-            <option>alien</option>
-            <option>climb</option>
-            <option>persistent</option>
-            <option>echo</option>
-            <option>updown</option>
-            <option>vibrate</option>
-            <option>none</option>
+            <option value="pushover">{{ $t("pushoversounds pushover") }}</option>
+            <option value="bike">{{ $t("pushoversounds bike") }}</option>
+            <option value="bugle">{{ $t("pushoversounds bugle") }}</option>
+            <option value="cashregister">{{ $t("pushoversounds cashregister") }}</option>
+            <option value="classical">{{ $t("pushoversounds classical") }}</option>
+            <option value="cosmic">{{ $t("pushoversounds cosmic") }}</option>
+            <option value="falling">{{ $t("pushoversounds falling") }}</option>
+            <option value="gamelan">{{ $t("pushoversounds gamelan") }}</option>
+            <option value="incoming">{{ $t("pushoversounds incoming") }}</option>
+            <option value="intermission">{{ $t("pushoversounds intermission") }}</option>
+            <option value="magic">{{ $t("pushoversounds magic") }}</option>
+            <option value="mechanical">{{ $t("pushoversounds mechanical") }}</option>
+            <option value="pianobar">{{ $t("pushoversounds pianobar") }}</option>
+            <option value="siren">{{ $t("pushoversounds siren") }}</option>
+            <option value="spacealarm">{{ $t("pushoversounds spacealarm") }}</option>
+            <option value="tugboat">{{ $t("pushoversounds tugboat") }}</option>
+            <option value="alien">{{ $t("pushoversounds alien") }}</option>
+            <option value="climb">{{ $t("pushoversounds climb") }}</option>
+            <option value="persistent">{{ $t("pushoversounds persistent") }}</option>
+            <option value="echo">{{ $t("pushoversounds echo") }}</option>
+            <option value="updown">{{ $t("pushoversounds updown") }}</option>
+            <option value="vibrate">{{ $t("pushoversounds vibrate") }}</option>
+            <option value="none">{{ $t("pushoversounds none") }}</option>
        </select>
        <div class="form-text">
            <span style="color: red;"><sup>*</sup></span>{{ $t("Required") }}
@@ -63,5 +64,5 @@ export default {
    components: {
        HiddenInput,
    },
-}
+};
 </script>
--- a/src/components/notifications/Pushy.vue
+++ b/src/components/notifications/Pushy.vue
@@ -1,11 +1,11 @@
 <template>
    <div class="mb-3">
-        <label for="pushy-app-token" class="form-label">API_KEY</label>
+        <label for="pushy-app-token" class="form-label">{{ $t("pushyAPIKey") }}</label>
        <HiddenInput id="pushy-app-token" v-model="$parent.notification.pushyAPIKey" :required="true" autocomplete="one-time-code"></HiddenInput>
    </div>

    <div class="mb-3">
-        <label for="pushy-user-key" class="form-label">USER_TOKEN</label>
+        <label for="pushy-user-key" class="form-label">{{ $t("pushyToken") }}</label>
        <div class="input-group mb-3">
            <HiddenInput id="pushy-user-key" v-model="$parent.notification.pushyToken" :required="true" autocomplete="one-time-code"></HiddenInput>
        </div>
--- a/src/components/notifications/TechulusPush.vue
+++ b/src/components/notifications/TechulusPush.vue
@@ -1,6 +1,6 @@
 <template>
    <div class="mb-3">
-        <label for="push-api-key" class="form-label">API_KEY</label>
+        <label for="push-api-key" class="form-label">{{ $t("API Key") }}</label>
        <HiddenInput id="push-api-key" v-model="$parent.notification.pushAPIKey" :required="true" autocomplete="one-time-code"></HiddenInput>
    </div>

--- a/src/components/notifications/index.js
+++ b/src/components/notifications/index.js
@@ -24,11 +24,13 @@ import AliyunSMS from "./AliyunSms.vue";
 import DingDing from "./DingDing.vue";
 import Bark from "./Bark.vue";
 import SerwerSMS from "./SerwerSMS.vue";
-import Stackfield from './Stackfield.vue';
+import Stackfield from "./Stackfield.vue";
 import WeCom from "./WeCom.vue";
 import GoogleChat from "./GoogleChat.vue";
 import Gorush from "./Gorush.vue";
 import Alerta from "./Alerta.vue";
+import OneBot from "./OneBot.vue";
+import PushDeer from "./PushDeer.vue";

 /**
 * Manage all notification form.
@@ -67,6 +69,8 @@ const NotificationFormList = {
    "GoogleChat": GoogleChat,
    "gorush": Gorush,
    "alerta": Alerta,
+    "OneBot": OneBot,
+    "PushDeer": PushDeer,
 };

 export default NotificationFormList;
--- a/src/components/settings/About.vue
+++ b/src/components/settings/About.vue
@@ -9,11 +9,11 @@

            <div class="mt-1">
                <div class="form-check">
-                    <label><input v-model="settings.checkUpdate" type="checkbox" @change="saveSettings()" /> Show update if available</label>
+                    <label><input v-model="settings.checkUpdate" type="checkbox" @change="saveSettings()" /> {{ $t("Show update if available") }}</label>
                </div>

                <div class="form-check">
-                    <label><input v-model="settings.checkBeta" type="checkbox" :disabled="!settings.checkUpdate" @change="saveSettings()" /> Also check beta release</label>
+                    <label><input v-model="settings.checkBeta" type="checkbox" :disabled="!settings.checkUpdate" @change="saveSettings()" /> {{ $t("Also check beta release") }}</label>
                </div>
            </div>
        </div>
@@ -44,6 +44,7 @@ export default {
 .logo {
    margin: 4em 1em;
 }
+
 .update-link {
    font-size: 0.9em;
 }
--- a/src/components/settings/Backup.vue
+++ b/src/components/settings/Backup.vue
@@ -69,7 +69,7 @@

            <div class="mb-2">
                <input
-                    id="importBackup"
+                    id="import-backend"
                    type="file"
                    class="form-control"
                    accept="application/json"
@@ -94,7 +94,7 @@
            <div
                v-if="importAlert"
                class="alert alert-danger mt-3"
-                style="padding: 6px 16px"
+                style="padding: 6px 16px;"
            >
                {{ importAlert }}
            </div>
@@ -159,7 +159,7 @@ export default {

        importBackup() {
            this.processing = true;
-            let uploadItem = document.getElementById("importBackup").files;
+            let uploadItem = document.getElementById("import-backend").files;

            if (uploadItem.length <= 0) {
                this.processing = false;
@@ -198,7 +198,7 @@ export default {
@import "../../assets/vars.scss";

 .dark {
-    #importBackup {
+    #import-backend {
        &::file-selector-button {
            color: $primary;
            background-color: $dark-bg;
--- a/src/components/settings/General.vue
+++ b/src/components/settings/General.vue
@@ -189,4 +189,3 @@ export default {
 };
 </script>

-<style></style>
--- a/src/components/settings/MonitorHistory.vue
+++ b/src/components/settings/MonitorHistory.vue
@@ -52,7 +52,7 @@

 <script>
 import Confirm from "../../components/Confirm.vue";
-import { debug } from "../../util.ts";
+import { log } from "../../util.ts";
 import { useToast } from "vue-toastification";

 const toast = useToast();
@@ -91,13 +91,13 @@ export default {

    methods: {
        loadDatabaseSize() {
-            debug("load database size");
+            log.debug("monitorhistory", "load database size");
            this.$root.getSocket().emit("getDatabaseSize", (res) => {
                if (res.ok) {
                    this.databaseSize = res.size;
-                    debug("database size: " + res.size);
+                    log.debug("monitorhistory", "database size: " + res.size);
                } else {
-                    debug(res);
+                    log.debug("monitorhistory", res);
                }
            });
        },
@@ -108,7 +108,7 @@ export default {
                    this.loadDatabaseSize();
                    toast.success("Done");
                } else {
-                    debug(res);
+                    log.debug("monitorhistory", res);
                }
            });
        },
@@ -129,5 +129,3 @@ export default {
    },
 };
 </script>
-
-<style></style>
--- a/src/components/settings/Security.vue
+++ b/src/components/settings/Security.vue
@@ -4,7 +4,7 @@
            <!-- Change Password -->
            <template v-if="!settings.disableAuth">
                <p>
-                    {{ $t("Current User") }}: <strong>{{ username }}</strong>
+                    {{ $t("Current User") }}: <strong>{{ $root.username }}</strong>
                    <button v-if="! settings.disableAuth" id="logout-btn" class="btn btn-danger ms-4 me-2 mb-2" @click="$root.logout">{{ $t("Logout") }}</button>
                </p>

@@ -269,7 +269,6 @@ export default {

    data() {
        return {
-            username: "",
            invalidPassword: false,
            password: {
                currentPassword: "",
@@ -297,10 +296,6 @@ export default {
        },
    },

-    mounted() {
-        this.loadUsername();
-    },
-
    methods: {
        savePassword() {
            if (this.password.newPassword !== this.password.repeatNewPassword) {
@@ -319,14 +314,6 @@ export default {
            }
        },

-        loadUsername() {
-            const jwtPayload = this.$root.getJWTPayload();
-
-            if (jwtPayload) {
-                this.username = jwtPayload.username;
-            }
-        },
-
        disableAuth() {
            this.settings.disableAuth = true;

@@ -334,6 +321,8 @@ export default {
            // Set it to empty if done
            this.saveSettings(() => {
                this.password.currentPassword = "";
+                this.$root.username = null;
+                this.$root.socket.token = "autoLogin";
            }, this.password.currentPassword);
        },

@@ -355,7 +344,7 @@ export default {
 <style lang="scss" scoped>
@import "../../assets/vars.scss";

-h5:after {
+h5::after {
    content: "";
    display: block;
    width: 50%;
--- a/src/i18n.js
+++ b/src/i18n.js
@@ -43,7 +43,7 @@ for (let lang in languageList) {
    };
 }

-const rtlLangs = ["fa"];
+const rtlLangs = [ "fa" ];

 export const currentLocale = () => localStorage.locale
    || languageList[navigator.language] && navigator.language
--- a/src/icon.js
+++ b/src/icon.js
@@ -34,11 +34,13 @@ import {
    faAward,
    faLink,
    faChevronDown,
+    faSignOutAlt,
    faPen,
    faExternalLinkSquareAlt,
    faSpinner,
    faUndo,
    faPlusCircle,
+    faAngleDown,
 } from "@fortawesome/free-solid-svg-icons";

 library.add(
@@ -72,11 +74,13 @@ library.add(
    faAward,
    faLink,
    faChevronDown,
+    faSignOutAlt,
    faPen,
    faExternalLinkSquareAlt,
    faSpinner,
    faUndo,
    faPlusCircle,
+    faAngleDown,
 );

 export { FontAwesomeIcon };
--- a/src/languages/bg-BG.js
+++ b/src/languages/bg-BG.js
@@ -12,15 +12,15 @@ export default {
    keywordDescription: "Търси ключова дума в чист html или JSON отговор - чувствителна е към регистъра",
    pauseDashboardHome: "Пауза",
    deleteMonitorMsg: "Наистина ли желаете да изтриете този монитор?",
-    deleteNotificationMsg: "Наистина ли желаете да изтриете това известяване за всички монитори?",
+    deleteNotificationMsg: "Наистина ли желаете да изтриете това известие за всички монитори?",
    resolverserverDescription: "Cloudflare е сървърът по подразбиране, но можете да го промените по всяко време.",
    rrtypeDescription: "Изберете ресурсния запис, който желаете да наблюдавате",
    pauseMonitorMsg: "Наистина ли желаете да поставите в режим пауза?",
-    enableDefaultNotificationDescription: "За всеки нов монитор това известяване ще бъде активирано по подразбиране. Можете да го изключите за всеки отделен монитор.",
+    enableDefaultNotificationDescription: "За всеки нов монитор това известие ще бъде активирано по подразбиране. Можете да го изключите за всеки отделен монитор.",
    clearEventsMsg: "Наистина ли желаете да изтриете всички събития за този монитор?",
    clearHeartbeatsMsg: "Наистина ли желаете да изтриете всички записи за честотни проверки на този монитор?",
    confirmClearStatisticsMsg: "Наистина ли желаете да изтриете всички статистически данни?",
-    importHandleDescription: "Изберете 'Пропусни съществуващите', ако желаете да пропуснете всеки монитор или известяване със същото име. 'Презапис' ще изтрие всеки съществуващ монитор и известяване.",
+    importHandleDescription: "Изберете 'Пропусни съществуващите', ако желаете да пропуснете всеки монитор или известие със същото име. 'Презапис' ще изтрие всеки съществуващ монитор и известие.",
    confirmImportMsg: "Сигурни ли сте, че желаете импортирането на архива? Моля, уверете се, че сте избрали правилната опция за импортиране.",
    twoFAVerifyLabel: "Моля, въведете вашия токен код, за да проверите дали 2FA работи",
    tokenValidSettingsMsg: "Токен кодът е валиден! Вече можете да запазите настройките за 2FA.",
@@ -76,9 +76,9 @@ export default {
    "Max. Redirects": "Макс. брой пренасочвания",
    "Accepted Status Codes": "Допустими статус кодове",
    Save: "Запази",
-    Notifications: "Известявания",
+    Notifications: "Известия",
    "Not available, please setup.": "Не са налични. Моля, настройте.",
-    "Setup Notification": "Настройки за известявания",
+    "Setup Notification": "Настрой известие",
    Light: "Светла",
    Dark: "Тъмна",
    Auto: "Автоматично",
@@ -109,7 +109,7 @@ export default {
    Login: "Вход",
    "No Monitors, please": "Все още няма монитори. Моля, добавете поне ",
    "add one": "един.",
-    "Notification Type": "Тип известяване",
+    "Notification Type": "Тип известие",
    Email: "Имейл",
    Test: "Тест",
    "Certificate Info": "Информация за сертификат",
@@ -131,9 +131,9 @@ export default {
    Events: "Събития",
    Heartbeats: "Проверки",
    "Auto Get": "Авт. попълване",
-    backupDescription: "Можете да архивирате всички монитори и всички известявания в JSON файл.",
+    backupDescription: "Можете да архивирате всички монитори и всички известия в JSON файл.",
    backupDescription2: "PS: Имайте предвид, че данните за история и събития няма да бъдат включени.",
-    backupDescription3: "Чувствителни данни, като токен кодове за известяване, се съдържат в експортирания файл. Моля, бъдете внимателни с неговото съхранение.",
+    backupDescription3: "Чувствителни данни, като токен кодове за известия, се съдържат в експортирания файл. Моля, бъдете внимателни с неговото съхранение.",
    alertNoFile: "Моля, изберете файл за импортиране.",
    alertWrongFileType: "Моля, изберете JSON файл.",
    "Clear all statistics": "Изтрий цялата статистика",
@@ -197,12 +197,12 @@ export default {
    line: "Line Messenger",
    mattermost: "Mattermost",
    "Status Page": "Статус страница",
-    "Status Pages": "Статус страница",
+    "Status Pages": "Статус страници",
    "Primary Base URL": "Основен базов URL адрес",
    "Push URL": "Генериран Push URL адрес",
    needPushEvery: "Необходимо е да извършвате заявка към този URL адрес на всеки {0} секунди",
    pushOptionalParams: "Допълнителни, но не задължителни параметри: {0}",
-    defaultNotificationName: "Моето {notification} известяване ({number})",
+    defaultNotificationName: "Моето {notification} известие ({number})",
    here: "тук",
    Required: "Задължително поле",
    "Bot Token": "Бот токен",
@@ -252,7 +252,7 @@ export default {
    "Notification Sound": "Звуков сигнал",
    "More info on:": "Повече информация на: {0}",
    pushoverDesc1: "Приоритет Спешно (2) по подразбиране изчаква 30 секунди между повторните опити и изтича след 1 час.",
-    pushoverDesc2: "Ако желаете да изпратите известявания до различни устройства, попълнете полето Устройство.",
+    pushoverDesc2: "Ако желаете да изпратите известия до различни устройства, попълнете полето Устройство.",
    "SMS Type": "SMS тип",
    octopushTypePremium: "Премиум (Бърз - препоръчителен в случай на тревога)",
    octopushTypeLowCost: "Евтин (Бавен - понякога бива блокиран от оператора)",
@@ -275,7 +275,7 @@ export default {
    lineDevConsoleTo: "Line - Конзола за разработчици - {0}",
    "Basic Settings": "Основни настройки",
    "User ID": "Потребител ID",
-    "Messaging API": "API за известяване",
+    "Messaging API": "API за съобщаване",
    wayToGetLineChannelToken: "Необходимо е първо да посетите {0}, за да създадете (Messaging API) за доставчик и канал, след което може да вземете токен кода за канал и потребителско ID от споменатите по-горе елементи на менюто.",
    "Icon URL": "URL адрес за иконка",
    aboutIconURL: "Може да предоставите линк към картинка в поле \"URL Адрес за иконка\" за да отмените картинката на профила по подразбиране. Няма да се използва, ако вече сте настроили емотикон.",
@@ -291,7 +291,7 @@ export default {
    matrixHomeserverURL: "Сървър URL адрес (започва с http(s):// и порт по желание)",
    "Internal Room Id": "ID на вътрешна стая",
    matrixDesc1: "Може да намерите \"ID на вътрешна стая\" в разширените настройки на стаята във вашия Matrix клиент. Примерен изглед: !QMdRCpUIfLwsfjxye6:home.server.",
-    matrixDesc2: "Силно препоръчваме да създадете НОВ потребител и да НЕ използвате токен кодът на вашия личен Matrix потребирел, т.к. той позволява пълен достъп до вашия акаунт и всички стаи към които сте се присъединили. Вместо това създайте нов потребител и го поканете само в стаята, където желаете да получавате известяванията. Токен код за достъп ще получите изпълнявайки {0}",
+    matrixDesc2: "Силно препоръчваме да създадете НОВ потребител и да НЕ използвате токен кодът на вашия личен Matrix потребирел, т.к. той позволява пълен достъп до вашия акаунт и всички стаи към които сте се присъединили. Вместо това създайте нов потребител и го поканете само в стаята, където желаете да получавате известията. Токен код за достъп ще получите изпълнявайки {0}",
    Method: "Метод",
    Body: "Съобщение",
    Headers: "Хедъри",
@@ -343,7 +343,7 @@ export default {
    "No Monitors": "Няма монитори",
    "Untitled Group": "Група без заглавие",
    Services: "Услуги",
-    Discard: "Премахни",
+    Discard: "Отмени",
    Cancel: "Отмени",
    "Powered by": "Създадено чрез",
    serwersms: "SerwerSMS.pl",
@@ -353,8 +353,8 @@ export default {
    serwersmsSenderName: "SMS Подател име (регистриран през клиентския портал)",
    stackfield: "Stackfield",
    smtpDkimSettings: "DKIM Настройки",
-    smtpDkimDesc: "Моля, вижте Nodemailer DKIM {0} за инструкции.",
-    documentation: "документация",
+    smtpDkimDesc: "Моля, вижте {0} на Nodemailer DKIM за инструкции.",
+    documentation: "документацията",
    smtpDkimDomain: "Домейн",
    smtpDkimKeySelector: "Селектор на ключ",
    smtpDkimPrivateKey: "Частен ключ",
@@ -371,4 +371,97 @@ export default {
    alertaAlertState: "Състояние на тревога",
    alertaRecoverState: "Състояние на възстановяване",
    deleteStatusPageMsg: "Сигурни ли сте, че желаете да изтриете тази статус страница?",
+    Proxies: "Прокси",
+    default: "По подразбиране",
+    enabled: "Включено",
+    setAsDefault: "Зададен по подразбиране",
+    deleteProxyMsg: "Сигурни ли сте, че желаете да изтриете това прокси за всички монитори?",
+    proxyDescription: "За да функционират трябва да бъдат зададени към монитор.",
+    enableProxyDescription: "Това прокси няма да има ефект върху заявките за мониторинг, докато не бъде активирано. Може да контролирате временното деактивиране на проксито от всички монитори чрез статуса на активиране.",
+    setAsDefaultProxyDescription: "Това проки ще бъде включено по подразбиране за новите монитори. Може да го изключите по отделно за всеки един монитор.",
+    "Certificate Chain": "Верига на сертификата",
+    Valid: "Валиден",
+    Invalid: "Невалиден",
+    AccessKeyId: "ID на ключ за достъп",
+    SecretAccessKey: "Тайна на ключа за достъп",
+    PhoneNumbers: "Телефонни номера",
+    TemplateCode: "Шаблон Код",
+    SignName: "Знак име",
+    "Sms template must contain parameters: ": "SMS шаблонът трябва да съдържа следните параметри: ",
+    "Bark Endpoint": "Bark крайна точка",
+    WebHookUrl: "URL адрес на уеб кука",
+    SecretKey: "Таен ключ",
+    "For safety, must use secret key": "За сигурност, трябва да се използва таен ключ",
+    "Device Token": "Токен за устройство",
+    Platform: "Платформа",
+    iOS: "iOS",
+    Android: "Android",
+    Huawei: "Huawei",
+    High: "Висок",
+    Retry: "Повтори",
+    Topic: "Тема",
+    "WeCom Bot Key": "WeCom бот ключ",
+    "Setup Proxy": "Настрой прокси",
+    "Proxy Protocol": "Прокси протокол",
+    "Proxy Server": "Прокси сървър",
+    "Proxy server has authentication": "Прокси сървърът е с удостоверяване",
+    User: "Потребител",
+    Installed: "Инсталиран",
+    "Not installed": "Не е инсталиран",
+    Running: "Работи",
+    "Not running": "Не работи",
+    "Remove Token": "Премахни токен",
+    Start: "Стартирай",
+    Stop: "Спри",
+    "Uptime Kuma": "Uptime Kuma",
+    "Add New Status Page": "Добави нова статус страница",
+    Slug: "Слъг",
+    "Accept characters:": "Приеми символи:",
+    startOrEndWithOnly: "Започва или завършва само с {0}",
+    "No consecutive dashes": "Без последователни тирета",
+    Next: "Следващ",
+    "The slug is already taken. Please choose another slug.": "Този слъг вече се използва. Моля изберете друг.",
+    "No Proxy": "Без прокси",
+    "HTTP Basic Auth": "HTTP основно удостоверяване",
+    "New Status Page": "Нова статус страница",
+    "Page Not Found": "Страницата не е открита",
+    "Reverse Proxy": "Ревърс прокси",
+    Backup: "Архивиране",
+    About: "Относно",
+    wayToGetCloudflaredURL: "(Свалете \"cloudflared\" от {0})",
+    cloudflareWebsite: "Cloudflare уебсайт",
+    "Message:": "Съобщение:",
+    "Don't know how to get the token? Please read the guide:": "Не знаете как да вземете токен? Моля, прочетете ръководството:",
+    "The current connection may be lost if you are currently connecting via Cloudflare Tunnel. Are you sure want to stop it? Type your current password to confirm it.": "Текущата връзка може да прекъсне ако в момента сте свързани чрез \"Cloudflare Tunnel\". Сигурни ли сте, че желаете да го спрете? Въведете Вашата текуща парола за да потвърдите.",
+    "Other Software": "Друг софтуер",
+    "For example: nginx, Apache and Traefik.": "Например: Nginx, Apache и Traefik.",
+    "Please read": "Моля, прочетете",
+    "Subject:": "Тема:",
+    "Valid To:": "Валиден до:",
+    "Days Remaining:": "Оставащи дни:",
+    "Issuer:": "Издател:",
+    "Fingerprint:": "Пръстов отпечатък:",
+    "No status pages": "Няма статус страници",
+    topic: "Тема",
+    topicExplanation: "MQTT тема за мониториране",
+    successMessage: "Съобщение при успех",
+    successMessageExplanation: "MQTT съобщение, което ще бъде считано за успех",
+    Customize: "Персонализирай",
+    "Custom Footer": "Персонализиран долен колонтитул",
+    "Custom CSS": "Потребителски CSS",
+    "Domain Name Expiry Notification": "Известие при изтичащ домейн",
+    Proxy: "Прокси",
+    "Date Created": "Дата на създаване",
+    onebotHttpAddress: "OneBot HTTP адрес",
+    onebotMessageType: "OneBot тип съобщение",
+    onebotGroupMessage: "Група",
+    onebotPrivateMessage: "Лично",
+    onebotUserOrGroupId: "Група/Потребител ID",
+    onebotSafetyTips: "С цел безопасност трябва да зададете токен код за достъп",
+    "PushDeer Key": "PushDeer ключ",
+    "Footer Text": "Текст долен колонтитул",
+    "Show Powered By": "Покажи \"Създадено чрез\"",
+    "Domain Names": "Домейни",
+    signedInDisp: "Вписан като {0}",
+    signedInDispDisabled: "Удостоверяването е изключено.",
 };
--- a/src/languages/de-DE.js
+++ b/src/languages/de-DE.js
@@ -179,7 +179,7 @@ export default {
    "Edit Status Page": "Bearbeite Status-Seite",
    "Go to Dashboard": "Gehe zum Dashboard",
    "Status Page": "Status-Seite",
-    "Status Pages": "Status-Seite",
+    "Status Pages": "Status-Seiten",
    telegram: "Telegram",
    webhook: "Webhook",
    smtp: "E-Mail (SMTP)",
@@ -337,7 +337,7 @@ export default {
    "Hide Tags": "Tags ausblenden",
    Description: "Beschreibung",
    "No monitors available.": "Keine Monitore verfügbar.",
-    "Add one": "Füge eins hinzu",
+    "Add one": "Hinzufügen",
    "No Monitors": "Keine Monitore",
    "Untitled Group": "Gruppe ohne Titel",
    Services: "Dienste",
@@ -350,7 +350,7 @@ export default {
    serwersmsAPIPassword: "API Passwort",
    serwersmsPhoneNumber: "Telefonnummer",
    serwersmsSenderName: "Name des SMS-Absenders (über Kundenportal registriert)",
-    "stackfield": "Stackfield",
+    stackfield: "Stackfield",
    clicksendsms: "ClickSend SMS",
    apiCredentials: "API Zugangsdaten",
    smtpDkimSettings: "DKIM Einstellungen",
@@ -362,4 +362,94 @@ export default {
    smtpDkimHashAlgo: "Hash-Algorithmus (Optional)",
    smtpDkimheaderFieldNames: "Zu validierende Header-Schlüssel (optional)",
    smtpDkimskipFields: "Zu ignorierende Header Schlüssel (optional)",
+    PushByTechulus: "Push by Techulus",
+    gorush: "Gorush",
+    alerta: "Alerta",
+    alertaApiEndpoint: "API Endpunkt",
+    alertaEnvironment: "Umgebung",
+    alertaApiKey: "API Schlüssel",
+    alertaAlertState: "Alarmstatus",
+    alertaRecoverState: "Wiederherstellungsstatus",
+    deleteStatusPageMsg: "Bist du sicher, dass du diese Status-Seite löschen willst?",
+    Proxies: "Proxies",
+    default: "Standard",
+    enabled: "Aktiviert",
+    setAsDefault: "Als Standard setzen",
+    deleteProxyMsg: "Bist du sicher, dass du diesen Proxy für alle Monitore löschen willst?",
+    proxyDescription: "Proxies müssen einem Monitor zugewiesen werden, um zu funktionieren.",
+    enableProxyDescription: "Dieser Proxy wird keinen Effekt auf Monitor-Anfragen haben, bis er aktiviert ist. Du kannst ihn temporär von allen Monitoren nach Aktivierungsstatus deaktivieren.",
+    setAsDefaultProxyDescription: "Dieser Proxy wird standardmäßig für alle neuen Monitore aktiviert sein. Du kannst den Proxy immernoch für jeden Monitor einzeln deaktivieren.",
+    "Certificate Chain": "Zertifikatskette",
+    Valid: "Gültig",
+    Invalid: "Ungültig",
+    AccessKeyId: "AccessKey ID",
+    SecretAccessKey: "AccessKey Secret",
+    PhoneNumbers: "Telefonnummern",
+    TemplateCode: "Vorlagencode",
+    SignName: "Signaturname",
+    "Sms template must contain parameters: ": "SMS Vorlage muss folgende Parameter enthalten: ",
+    "Bark Endpoint": "Bark Endpunkt",
+    WebHookUrl: "Webhook URL",
+    SecretKey: "Geheimer Schlüssel",
+    "For safety, must use secret key": "Zur Sicherheit muss ein geheimer Schlüssel verwendet werden",
+    "Device Token": "Gerätetoken",
+    Platform: "Platform",
+    iOS: "iOS",
+    Android: "Android",
+    Huawei: "Huawei",
+    High: "Hoch",
+    Retry: "Wiederholungen",
+    Topic: "Thema",
+    "WeCom Bot Key": "WeCom Bot Schlüssel",
+    "Setup Proxy": "Proxy einrichten",
+    "Proxy Protocol": "Proxy Protokoll",
+    "Proxy Server": "Proxy-Server",
+    "Proxy server has authentication": "Proxy-Server hat Authentifizierung",
+    User: "Benutzer",
+    Installed: "Installiert",
+    "Not installed": "Nicht installiert",
+    Running: "Läuft",
+    "Not running": "Gestoppt",
+    "Remove Token": "Token entfernen",
+    Start: "Start",
+    Stop: "Stop",
+    "Uptime Kuma": "Uptime Kuma",
+    "Add New Status Page": "Neue Status-Seite hinzufügen",
+    Slug: "Slug",
+    "Accept characters:": "Akzeptierte Zeichen:",
+    startOrEndWithOnly: "Nur mit {0} anfangen und enden",
+    "No consecutive dashes": "Keine aufeinanderfolgenden Bindestriche",
+    Next: "Weiter",
+    "The slug is already taken. Please choose another slug.": "Der Slug ist bereits in Verwendung. Bitte wähle einen anderen.",
+    "No Proxy": "Kein Proxy",
+    "HTTP Basic Auth": "HTTP Basisauthentifizierung",
+    "New Status Page": "Neue Status-Seite",
+    "Page Not Found": "Seite nicht gefunden",
+    "Reverse Proxy": "Reverse Proxy",
+    Backup: "Sicherung",
+    About: "Über",
+    wayToGetCloudflaredURL: "(Lade cloudflared von {0} herunter)",
+    cloudflareWebsite: "Cloudflare Website",
+    "Message:": "Nachricht:",
+    "Don't know how to get the token? Please read the guide:": "Du weißt nicht, wie man den Token bekommt? Lies die Anleitung dazu:",
+    "The current connection may be lost if you are currently connecting via Cloudflare Tunnel. Are you sure want to stop it? Type your current password to confirm it.": "Die aktuelle Verbindung kann unterbrochen werden, wenn du aktuell über Cloudflare Tunnel verbunden bist. Bist du sicher, dass du es stoppen willst? Gib zur Bestätigung dein aktuelles Passwort ein.",
+    "Other Software": "Andere Software",
+    "For example: nginx, Apache and Traefik.": "Zum Beispiel: nginx, Apache und Traefik.",
+    "Please read": "Bitte lesen",
+    "Subject:": "Betreff:",
+    "Valid To:": "Gültig bis:",
+    "Days Remaining:": "Tage verbleibend:",
+    "Issuer:": "Aussteller:",
+    "Fingerprint:": "Fingerabdruck:",
+    "No status pages": "Keine Status-Seiten",
+    "Domain Name Expiry Notification": "Benachrichtigung bei Ablauf des Domainnamens",
+    Customize: "Anpassen",
+    "Custom Footer": "Eigener Footer",
+    "Custom CSS": "Eigenes CSS",
+    "Footer Text": "Fußzeile",
+    "Show Powered By": "Zeige 'Powered By'",
+    "Date Created": "Erstellt am",
+    "Domain Names": "Domainnamen",
+    signedInDisp: "Angemeldet als {0}",
+    signedInDispDisabled: "Authentifizierung deaktiviert.",
 };
--- a/src/languages/en.js
+++ b/src/languages/en.js
@@ -309,6 +309,10 @@ export default {
    "One record": "One record",
    steamApiKeyDescription: "For monitoring a Steam Game Server you need a Steam Web-API key. You can register your API key here: ",
    "Current User": "Current User",
+    topic: "Topic",
+    topicExplanation: "MQTT topic to monitor",
+    successMessage: "Success Message",
+    successMessageExplanation: "MQTT message that will be considered as success",
    recent: "Recent",
    Done: "Done",
    Info: "Info",
@@ -354,6 +358,9 @@ export default {
    serwersmsPhoneNumber: "Phone number",
    serwersmsSenderName: "SMS Sender Name (registered via customer portal)",
    stackfield: "Stackfield",
+    Customize: "Customize",
+    "Custom Footer": "Custom Footer",
+    "Custom CSS": "Custom CSS",
    smtpDkimSettings: "DKIM Settings",
    smtpDkimDesc: "Please refer to the Nodemailer DKIM {0} for usage.",
    documentation: "documentation",
@@ -423,7 +430,7 @@ export default {
    "Add New Status Page": "Add New Status Page",
    Slug: "Slug",
    "Accept characters:": "Accept characters:",
-    "startOrEndWithOnly": "Start or end with {0} only",
+    startOrEndWithOnly: "Start or end with {0} only",
    "No consecutive dashes": "No consecutive dashes",
    Next: "Next",
    "The slug is already taken. Please choose another slug.": "The slug is already taken. Please choose another slug.",
@@ -448,4 +455,70 @@ export default {
    "Issuer:": "Issuer:",
    "Fingerprint:": "Fingerprint:",
    "No status pages": "No status pages",
+    "Domain Name Expiry Notification": "Domain Name Expiry Notification",
+    Proxy: "Proxy",
+    "Date Created": "Date Created",
+    onebotHttpAddress: "OneBot HTTP Address",
+    onebotMessageType: "OneBot Message Type",
+    onebotGroupMessage: "Group",
+    onebotPrivateMessage: "Private",
+    onebotUserOrGroupId: "Group/User ID",
+    onebotSafetyTips: "For safety, must set access token",
+    "PushDeer Key": "PushDeer Key",
+    "Footer Text": "Footer Text",
+    "Show Powered By": "Show Powered By",
+    "Domain Names": "Domain Names",
+    signedInDisp: "Signed in as {0}",
+    signedInDispDisabled: "Auth Disabled.",
+    "Certificate Expiry Notification": "Certificate Expiry Notification",
+    "API Username": "API Username",
+    "API Key": "API Key",
+    "Recipient Number": "Recipient Number",
+    "From Name/Number": "From Name/Number",
+    "Leave blank to use a shared sender number.": "Leave blank to use a shared sender number.",
+    "Octopush API Version": "Octopush API Version",
+    "Legacy Octopush-DM": "Legacy Octopush-DM",
+    "endpoint": "endpoint",
+    octopushAPIKey: "\"API key\" from HTTP API credentials in control panel",
+    octopushLogin: "\"Login\" from HTTP API credentials in control panel",
+    promosmsLogin: "API Login Name",
+    promosmsPassword: "API Password",
+    "pushoversounds pushover": "Pushover (default)",
+    "pushoversounds bike": "Bike",
+    "pushoversounds bugle": "Bugle",
+    "pushoversounds cashregister": "Cash Register",
+    "pushoversounds classical": "Classical",
+    "pushoversounds cosmic": "Cosmic",
+    "pushoversounds falling": "Falling",
+    "pushoversounds gamelan": "Gamelan",
+    "pushoversounds incoming": "Incoming",
+    "pushoversounds intermission": "Intermission",
+    "pushoversounds magic": "Magic",
+    "pushoversounds mechanical": "Mechanical",
+    "pushoversounds pianobar": "Piano Bar",
+    "pushoversounds siren": "Siren",
+    "pushoversounds spacealarm": "Space Alarm",
+    "pushoversounds tugboat": "Tug Boat",
+    "pushoversounds alien": "Alien Alarm (long)",
+    "pushoversounds climb": "Climb (long)",
+    "pushoversounds persistent": "Persistent (long)",
+    "pushoversounds echo": "Pushover Echo (long)",
+    "pushoversounds updown": "Up Down (long)",
+    "pushoversounds vibrate": "Vibrate Only",
+    "pushoversounds none": "None (silent)",
+    pushyAPIKey: "Secret API Key",
+    pushyToken: "Device token",
+    "Show update if available": "Show update if available",
+    "Also check beta release": "Also check beta release",
+    "Using a Reverse Proxy?": "Using a Reverse Proxy?",
+    "Check how to config it for WebSocket": "Check how to config it for WebSocket",
+    "Steam Game Server": "Steam Game Server",
+    "Most likely causes:": "Most likely causes:",
+    "The resource is no longer available.": "The resource is no longer available.",
+    "There might be a typing error in the address.": "There might be a typing error in the address.",
+    "What you can try:": "What you can try:",
+    "Retype the address.": "Retype the address.",
+    "Go back to the previous page.": "Go back to the previous page.",
+    "Coming Soon": "Coming Soon",
+    wayToGetClickSendSMSToken: "You can get API Username and API Key from {0} .",
 };
--- a/src/languages/nl-NL.js
+++ b/src/languages/nl-NL.js
@@ -171,7 +171,7 @@ export default {
    "Avg. Response": "Gemiddelde Response",
    "Entry Page": "Entry Page",
    statusPageNothing: "Niets hier, voeg een groep of monitor toe.",
-    "No Services": "No Services",
+    "No Services": "Geen diensten",
    "All Systems Operational": "Alle systemen operationeel",
    "Partially Degraded Service": "Gedeeltelijk verminderde prestaties",
    "Degraded Service": "Verminderde prestaties",
@@ -205,4 +205,262 @@ export default {
    PushUrl: "Push URL",
    HeadersInvalidFormat: "The request headers is geen geldige JSON: ",
    BodyInvalidFormat: "De request body is geen geldige JSON: ",
+    "Primary Base URL": "Hoofd Basis URL",
+    "Push URL": "Push URL",
+    needPushEvery: "Je moet deze URL elke {0} seconden aanroepen.",
+    pushOptionalParams: "Optionele parameters: {0}",
+    defaultNotificationName: "Mijn {notification} Alert ({number})",
+    here: "hier",
+    Required: "Verplicht",
+    "Bot Token": "Bot Token",
+    wayToGetTelegramToken: "Je kunt een token krijgen van {0}.",
+    "Chat ID": "Chat ID",
+    supportTelegramChatID: "Ondersteuning Directe Chat / Groep / Kanaal Chat ID",
+    wayToGetTelegramChatID: "Je kunt je CHAT ID krijgen door een bericht te sturen naar de bot en naar deze URL te gaan om het chat_id te bekijken:",
+    "YOUR BOT TOKEN HERE": "DE BOT TOKEN HIER",
+    chatIDNotFound: "Chat ID is niet gevonden; stuur eerst een bericht naar de bot",
+    "Post URL": "Post URL",
+    "Content Type": "Content Type",
+    webhookJsonDesc: "{0} is goed voor een moderne HTTP server zoals Express.js",
+    webhookFormDataDesc: "{multipart} is goed voor PHP. De JSON moet worden ontleed met {decodeFunction}",
+    secureOptionNone: "Geen / STARTTLS (25, 587)",
+    secureOptionTLS: "TLS (465)",
+    "Ignore TLS Error": "Negeer TLS Error",
+    "From Email": "Van Email",
+    emailCustomSubject: "Aangepast Onderwerp",
+    "To Email": "Naar Email",
+    smtpCC: "CC",
+    smtpBCC: "BCC",
+    "Discord Webhook URL": "Discord Webhook URL",
+    wayToGetDiscordURL: "Je kunt dit krijgen door te gaan naar Server Instellingen -> Integraties -> Creëer Webhook",
+    "Bot Display Name": "Bot Weergave Naam",
+    "Prefix Custom Message": "Prefix Aangepast Bericht",
+    "Hello @everyone is...": "Hallo {'@'}iedereen is...",
+    "Webhook URL": "Webhook URL",
+    wayToGetTeamsURL: "Je kunt hier leren hoe je een webhook URL kunt maken {0}.",
+    Number: "Nummer",
+    Recipients: "Ontvangers",
+    needSignalAPI: "Je moet een signal client met REST API hebben.",
+    wayToCheckSignalURL: "Je kunt op deze URL zien hoe je een kunt instellen:",
+    signalImportant: "BELANGRIJK: Je kunt groepen en nummers niet mengen in ontvangers!",
+    "Application Token": "Applicatie Token",
+    "Server URL": "Server URL",
+    Priority: "Prioriteit",
+    "Icon Emoji": "Icoon Emoji",
+    "Channel Name": "Kanaal Naam",
+    "Uptime Kuma URL": "Uptime Kuma URL",
+    aboutWebhooks: "Meer info over Webhooks op: {0}",
+    aboutChannelName: "Voer de kanaal naam in op {0} Kannaal Naam veld als je het Webhook kanaal wilt omzeilen. Bv: #other-channel",
+    aboutKumaURL: "Als je de Uptime Kuma URL veld leeg laat, wordt standaard het GitHub project pagina weergegeven.",
+    emojiCheatSheet: "Emoji cheat sheet: {0}",
+    PushByTechulus: "Push door Techulus",
+    clicksendsms: "ClickSend SMS",
+    GoogleChat: "Google Chat (Google Workspace alleen)",
+    "User Key": "Gebruikers sleutel",
+    Device: "Apparaat",
+    "Message Title": "Bericht Titel",
+    "Notification Sound": "Notificatie Geluid",
+    "More info on:": "Meer info op: {0}",
+    pushoverDesc1: "Nood prioriteit (2) heeft standaard een 30 seconden timeout tussen pogingen en verloopt na 1 uur.",
+    pushoverDesc2: "Vul het appraat veld in als je notificaties naar andere apparaten wilt versturen.",
+    "SMS Type": "SMS Type",
+    octopushTypePremium: "Premium (Snel - aangeraden voor te alarmeren)",
+    octopushTypeLowCost: "Low Cost (Langzaam - wordt soms geblokkeerd door operator)",
+    checkPrice: "Controleer {0} prijzen:",
+    apiCredentials: "API referenties",
+    octopushLegacyHint: "Wil je de legacy versie van Octopush (2011-2020) gebruiken of de nieuwe versie?",
+    "Check octopush prices": "Controleer Octopush prijzen {0}.",
+    octopushPhoneNumber: "Telefoon nummer (Int. formaat, eg : +33612345678) ",
+    octopushSMSSender: "SMS zender naam : 3-11 alfanumerieke karakters en spatie (a-zA-Z0-9)",
+    "LunaSea Device ID": "LunaSea Apparaat ID",
+    "Apprise URL": "Apprise URL",
+    "Example:": "Voorbeeld: {0}",
+    "Read more:": "Lees meer: {0}",
+    "Status:": "Status: {0}",
+    "Read more": "Lees meer",
+    appriseInstalled: "Apprise is geïnstalleerd.",
+    appriseNotInstalled: "Apprise is niet geïnstalleerd. {0}",
+    "Access Token": "Access Token",
+    "Channel access token": "Kanaal access token",
+    "Line Developers Console": "Line Developers Console",
+    lineDevConsoleTo: "Line Developers Console - {0}",
+    "Basic Settings": "Basis Instellingen",
+    "User ID": "Gebruiker ID",
+    "Messaging API": "Berichten API",
+    wayToGetLineChannelToken: "Begin met {0} te openen, creëer een provider en kanaal (Messaging API), dan kun je de kanaal access token en gebruikers ID van de hierboven genoemde menu items krijgen.",
+    "Icon URL": "Icoon URL",
+    aboutIconURL: "Je kunt een link om de standaard profiel afbeelding te overschrijving in \"Icoon URL\" meegeven. Dit wordt niet gebruikt als Icon Emoji is ingesteld.",
+    aboutMattermostChannelName: "Je kunt het standaard kanaal dat de Webhook plaatst overschijven door de kanaal naam in te vullen in het \"Channel Name\" veld. Dit moet worden ingeschakeld in de Mattermost Webhook instellingen. Bv. #ander-kanaal",
+    matrix: "Matrix",
+    promosmsTypeEco: "SMS ECO - Goedkoop maar langzaam en vaak overbelast. Gelimiteerd tot Poolse ontvangers.",
+    promosmsTypeFlash: "SMS FLASH - Berichten worden automatisch weergegeven op het apparaat van de ontvanger. Gelimiteerd tot Poolse ontvangers.",
+    promosmsTypeFull: "SMS FULL - Premium tier van SMS, je kunt de ontvanger naam gebruiken (Je moet eerst de naam registreren). Betrouwbaar voor alarmeringen.",
+    promosmsTypeSpeed: "SMS SPEED - Hoogste prioriteit in systeem. Is veel sneller en betrouwbaarder maar kost meer (ongeveer twee keer zoveel als volle SMS prijs).",
+    promosmsPhoneNumber: "Telefoon nummer (voor Poolse ontvangers. Je kunt gebieds codes overslaan)",
+    promosmsSMSSender: "SMS Ontvanger naam : Voor geregistreerde naam of een van de standaarden: InfoSMS, SMS Info, MaxSMS, INFO, SMS",
+    "Feishu WebHookUrl": "Feishu WebHookURL",
+    matrixHomeserverURL: "Homeserver URL (met http(s):// en optioneel poort)",
+    "Internal Room Id": "Interne Room ID",
+    matrixDesc1: "Je kunt de interne room ID vinden door in de geavanceerde sectie van de room instellingen in je Matrix client te kijken. Het zou moeten uitzien als !QMdRCpUIfLwsfjxye6:home.server.",
+    matrixDesc2: "Het wordt ten zeerste aanbevolen om een nieuwe gebruiker aan te maken en niet de access token van je account te gebruiken, aangezien dit volledige toegang geeft tot je account en alle kamers waar je lid van bent. Maak in plaats daarvan een nieuwe gebruiker aan en nodig deze alleen uit voor de ruimte waarin je de melding wilt ontvangen. Je kunt de access token krijgen door het volgende uit te voeren {0}",
+    "Monitor History": "Monitor Geschiedenis",
+    clearDataOlderThan: "Bewaar monitor geschiedenis voor {0} dagen.",
+    PasswordsDoNotMatch: "Wachtwoorden komen niet overeen",
+    records: "records",
+    "One record": "Een record",
+    steamApiKeyDescription: "Om een Steam Game Server te monitoren heb je een Steam Web-API key nodig. Je kunt hier je API key registreren: ",
+    "Current User": "Huidge Gebruiker",
+    topic: "Onderwerp",
+    topicExplanation: "MQTT onderwerp om te monitoren",
+    successMessage: "Succesbericht",
+    successMessageExplanation: "MQTT bericht dat als succes wordt beschouwd.",
+    recent: "Recent",
+    Done: "Klaar",
+    Info: "Info",
+    Security: "Beveiliging",
+    "Steam API Key": "Steam API Sleutel",
+    "Shrink Database": "Verklein Database",
+    "Pick a RR-Type...": "Kies een RR-Type...",
+    "Pick Accepted Status Codes...": "Kies geaccepteerde Status Codes...",
+    Default: "Standaard",
+    "HTTP Options": "HTTP Opties",
+    "Create Incident": "Creëer Incident",
+    Title: "Titel",
+    Content: "Content",
+    Style: "Stijl",
+    info: "info",
+    warning: "waarschuwing",
+    danger: "gevaar",
+    primary: "primair",
+    light: "licht",
+    dark: "donker",
+    Post: "Post",
+    "Please input title and content": "Voer alstublieft titel en content in",
+    Created: "Gemaakt",
+    "Last Updated": "Laatst Bijgewerkt",
+    Unpin: "Losmaken",
+    "Switch to Light Theme": "Wissel naar Licht Thema",
+    "Switch to Dark Theme": "Wissel naar Donker Thema",
+    "Show Tags": "Toon Labels",
+    "Hide Tags": "Verberg Labels",
+    Description: "Beschrijving",
+    "No monitors available.": "Geen monitors beschikbaar.",
+    "Add one": "Voeg een toe",
+    "No Monitors": "Geen Monitors",
+    "Untitled Group": "Naamloze Groep",
+    Services: "Diensten",
+    Discard: "Weggooien",
+    Cancel: "Annuleren",
+    "Powered by": "Mogelijk gemaakt door",
+    shrinkDatabaseDescription: "Trigger database VACUUM voor SQLite. Als de database na 1.10.0 gemaakt is, dan is AUTO_VACUUM al aangezet en deze actie niet nodig.",
+    serwersms: "SerwerSMS.pl",
+    serwersmsAPIUser: "API Gebruikersnaam (incl. webapi_ prefix)",
+    serwersmsAPIPassword: "API Wachtwoord",
+    serwersmsPhoneNumber: "Telefoon nummer",
+    serwersmsSenderName: "SMS Zender Naam (geregistreerd via klant portaal)",
+    stackfield: "Stackfield",
+    Customize: "Aanpassen",
+    "Custom Footer": "Aangepaste Footer",
+    "Custom CSS": "Aangepaste CSS",
+    smtpDkimSettings: "DKIM Instellingen",
+    smtpDkimDesc: "Refereer alsjeblieft naar Nodemailer DKIM {0} voor gebruik.",
+    documentation: "documentatie",
+    smtpDkimDomain: "Domein Naam",
+    smtpDkimKeySelector: "Sleutel Kiezer",
+    smtpDkimPrivateKey: "Prive Sleutel",
+    smtpDkimHashAlgo: "Hash Algoritme (Optioneel)",
+    smtpDkimheaderFieldNames: "Header sleutels om te ondertekenen (Optioneel)",
+    smtpDkimskipFields: "Header sleutels niet om te ondertekenen (Optioneel)",
+    gorush: "Gorush",
+    alerta: "Alerta",
+    alertaApiEndpoint: "API Eindpunt",
+    alertaEnvironment: "Omgeving",
+    alertaApiKey: "API Sleutel",
+    alertaAlertState: "Alert Staat",
+    alertaRecoverState: "Herstel Staat",
+    deleteStatusPageMsg: "Weet je zeker je deze status pagina wilt verwijderen?",
+    Proxies: "Proxies",
+    default: "Standaard",
+    enabled: "Ingeschakeld",
+    setAsDefault: "Stel in als standaard",
+    deleteProxyMsg: "Weet je zeker dat je deze proxy wilt verwijderen voor alle monitors?",
+    proxyDescription: "Proxies moeten worden toegewezen aan een monitor om te functioneren.",
+    enableProxyDescription: "Deze proxy heeft geen effect op monitor verzoeken totdat het is geactiveerd. Je kunt tijdelijk de proxy uitschakelen voor alle monitors voor activatie status.",
+    setAsDefaultProxyDescription: "Deze proxy wordt standaard aangezet voor alle nieuwe monitors. Je kunt nog steeds de proxy apart uitschakelen voor elke monitor.",
+    "Certificate Chain": "Certificaat Chain",
+    Valid: "Geldig",
+    Invalid: "Ongeldig",
+    AccessKeyId: "AccessKey ID",
+    SecretAccessKey: "AccessKey Secret",
+    PhoneNumbers: "TelefoonNummers",
+    TemplateCode: "TemplateCode",
+    SignName: "SignName",
+    "Sms template must contain parameters: ": "Sms sjabloon moet de volgende parameters bevatten: ",
+    "Bark Endpoint": "Bark Endpoint",
+    WebHookUrl: "WebHookUrl",
+    SecretKey: "SecretKey",
+    "For safety, must use secret key": "Voor de veiligheid moet je de secret key gebruiken",
+    "Device Token": "Apparaat Token",
+    Platform: "Platform",
+    iOS: "iOS",
+    Android: "Android",
+    Huawei: "Huawei",
+    High: "Hoog",
+    Retry: "Opnieuw",
+    Topic: "Onderwerp",
+    "WeCom Bot Key": "WeCom Bot Sleutel",
+    "Setup Proxy": "Proxy instellen",
+    "Proxy Protocol": "Proxy Protocol",
+    "Proxy Server": "Proxy Server",
+    "Proxy server has authentication": "Proxy server heeft authenticatie",
+    User: "Gebruiker",
+    Installed: "Geïnstalleerd",
+    "Not installed": "Niet geïnstalleerd",
+    Running: "Actief",
+    "Not running": "Niet actief",
+    "Remove Token": "Verwijder Token",
+    Start: "Start",
+    Stop: "Stop",
+    "Uptime Kuma": "Uptime Kuma",
+    "Add New Status Page": "Voeg nieuwe status pagina toe",
+    Slug: "Slug",
+    "Accept characters:": "Geaccepteerde tekens:",
+    startOrEndWithOnly: "Start of eindig alleen met {0}",
+    "No consecutive dashes": "Geen opeenvolgende streepjes",
+    Next: "Volgende",
+    "The slug is already taken. Please choose another slug.": "De slug is al in gebruik. Kies een andere slug.",
+    "No Proxy": "Geen Proxy",
+    "HTTP Basic Auth": "HTTP Basic Auth",
+    "New Status Page": "Nieuwe Status Pagina",
+    "Page Not Found": "Pagina Niet gevonden",
+    "Reverse Proxy": "Reverse Proxy",
+    Backup: "Backup",
+    About: "Over",
+    wayToGetCloudflaredURL: "(Download cloudflared van {0})",
+    cloudflareWebsite: "Cloudflare Website",
+    "Message:": "Bericht:",
+    "Don't know how to get the token? Please read the guide:": "Lees de uitleg als je niet weet hoe je een token krijgt:",
+    "The current connection may be lost if you are currently connecting via Cloudflare Tunnel. Are you sure want to stop it? Type your current password to confirm it.": "De huidge verbinding kan worden verbroken als je momenteel bent verbonden met Cloudflare Tunnel. Weet je zeker dat je het wilt stoppen? Typ je huidige wachtwoord om het te bevestigen.",
+    "Other Software": "Andere Software",
+    "For example: nginx, Apache and Traefik.": "Bijvoorbeeld: nginx, Apache and Traefik.",
+    "Please read": "Lees alstublieft",
+    "Subject:": "Onderwerp:",
+    "Valid To:": "Geldig Tot:",
+    "Days Remaining:": "Dagen Resterend:",
+    "Issuer:": "Uitgever:",
+    "Fingerprint:": "Vingerafruk:",
+    "No status pages": "Geen status pagina's",
+    "Domain Name Expiry Notification": "Domein Naam Verloop Notificatie",
+    Proxy: "Proxy",
+    "Date Created": "Datum Aangemaakt",
+    onebotHttpAddress: "OneBot HTTP Adres",
+    onebotMessageType: "OneBot Bericht Type",
+    onebotGroupMessage: "Groep",
+    onebotPrivateMessage: "Privé",
+    onebotUserOrGroupId: "Groep/Gebruiker ID",
+    onebotSafetyTips: "Voor de veiligheid moet een toegangssleutel worden ingesteld",
+    "PushDeer Key": "PushDeer Key",
+    "Footer Text": "Footer Tekst",
+    "Show Powered By": "Laat 'Mogeljik gemaakt door' zien",
+    "Domain Names": "Domein Namen",
 };
--- a/src/languages/pl.js
+++ b/src/languages/pl.js
@@ -66,7 +66,7 @@ export default {
    Keyword: "Słowo kluczowe",
    "Friendly Name": "Przyjazna nazwa",
    URL: "URL",
-    Hostname: "Hostname",
+    Hostname: "Nazwa hosta",
    Port: "Port",
    "Heartbeat Interval": "Częstotliwość bicia serca",
    Retries: "Prób",
@@ -216,7 +216,7 @@ export default {
    signal: "Signal",
    Number: "Numer",
    Recipients: "Odbiorcy",
-    needSignalAPI: "Musisz posiadać klienta Signal z REST API.",
+    needSignalAPI: "Musisz mieć klienta Signal z REST API.",
    wayToCheckSignalURL: "W celu dowiedzenia się, jak go skonfigurować, odwiedź poniższy link:",
    signalImportant: "UWAGA: Nie można mieszać nazw grup i numerów odbiorców!",
    gotify: "Gotify",
@@ -234,6 +234,7 @@ export default {
    "rocket.chat": "Rocket.chat",
    pushover: "Pushover",
    pushy: "Pushy",
+    PushByTechulus: "Push od Techulus",
    octopush: "Octopush",
    promosms: "PromoSMS",
    lunasea: "LunaSea",
@@ -278,7 +279,7 @@ export default {
    promosmsTypeEco: "SMS ECO - tanie, lecz wolne. Dostępne tylko w Polsce",
    promosmsTypeFlash: "SMS FLASH - wiadomość automatycznie wyświetli się na urządzeniu. Dostępne tylko w Polsce.",
    promosmsTypeFull: "SMS FULL - szybkie i dostępne międzynarodowo. Wersja premium usługi, która pozwala min. ustawić własną nazwę nadawcy.",
-    promosmsTypeSpeed: "SMS SPEED - wysyłka priorytetowa, posiada wszystkie zalety SMS FULL",
+    promosmsTypeSpeed: "SMS SPEED - wysyłka priorytetowa, ma wszystkie zalety SMS FULL",
    promosmsPhoneNumber: "Numer odbiorcy",
    promosmsSMSSender: "Nadawca SMS (wcześniej zatwierdzone nazwy z panelu PromoSMS)",
    "Primary Base URL": "Główny URL",
@@ -306,6 +307,10 @@ export default {
    "One record": "Jeden rekord",
    steamApiKeyDescription: "Do monitorowania serwera gier Steam potrzebny jest klucz Steam Web-API. Możesz zarejestrować swój klucz API tutaj: ",
    "Current User": "Aktualny użytkownik",
+    topic: "Temat",
+    topicExplanation: "Temat MQTT do monitorowania",
+    successMessage: "Komunikat o powodzeniu",
+    successMessageExplanation: "Komunikat MQTT, który zostanie uznany za powodzenie",
    recent: "Ostatnie",
    Done: "Zrobione",
    Info: "Info",
@@ -344,7 +349,7 @@ export default {
    Discard: "Odrzuć",
    Cancel: "Anuluj",
    "Powered by": "Napędzane przez",
-    shrinkDatabaseDescription: "Uruchom VACUUM na bazie SQLite. Jeżeli twoja baza została stworzona po wersji 1.10.0, to posiada już włączoną opcję AUTO_VACUUM i stosowanie ręcznego oczyszczania nie jest potrzebne.",
+    shrinkDatabaseDescription: "Uruchom VACUUM na bazie SQLite. Jeżeli twoja baza została stworzona po wersji 1.10.0, to ma już włączoną opcję AUTO_VACUUM i stosowanie ręcznego oczyszczania nie jest potrzebne.",
    clicksendsms: "ClickSend SMS",
    apiCredentials: "Poświadczenia API",
    serwersms: "SerwerSMS.pl",
@@ -352,14 +357,111 @@ export default {
    serwersmsAPIPassword: "Hasło API",
    serwersmsPhoneNumber: "Numer telefonu",
    serwersmsSenderName: "Nazwa nadawcy (zatwierdzona w panelu klienta)",
-    "stackfield": "Stackfield",
+    stackfield: "Stackfield",
+    Customize: "Dostosuj",
+    "Custom Footer": "Niestandardowa stopka",
+    "Custom CSS": "Niestandardowy CSS",
    smtpDkimSettings: "Ustawienia DKIM",
    smtpDkimDesc: "Zapoznaj się z Nodemailer DKIM {0}, aby dowiedzieć się więcej",
    documentation: "dokumentacja",
    smtpDkimDomain: "Nazwa domeny",
    smtpDkimKeySelector: "Selektor klucza",
    smtpDkimPrivateKey: "Klucz prywatny",
-    smtpDkimHashAlgo: "Algorytm Hashowania (opcjonalne)",
+    smtpDkimHashAlgo: "Algorytm haszujący (opcjonalne)",
    smtpDkimheaderFieldNames: "Klucze nagłówka do podpisu (opcjonalne)",
    smtpDkimskipFields: "Klucze nagłówka do pominięcia (opcjonalne)",
+    gorush: "Gorush",
+    alerta: "Alerta",
+    alertaApiEndpoint: "Punkt końcowy API",
+    alertaEnvironment: "Środowisko",
+    alertaApiKey: "Klucz API",
+    alertaAlertState: "Alert State",
+    alertaRecoverState: "Recover State",
+    deleteStatusPageMsg: "Jesteś pewien, że chcesz usunąć tę stronę statusów?",
+    Proxies: "Proxy",
+    default: "Domyślny",
+    enabled: "Włączony",
+    setAsDefault: "Ustaw jako domyślny",
+    deleteProxyMsg: "Jesteś pewien, że chcesz usunąć proxy ze wszystkich monitorów?",
+    proxyDescription: "Proxy muszą być przypisane do monitora, aby działały.",
+    enableProxyDescription: "Ten serwer proxy nie będzie miał wpływu na żądania monitorów, dopóki nie zostanie aktywowany. Możesz kontrolować tymczasowe wyłączenie serwera proxy ze wszystkich monitorów za pomocą statusu aktywacji.",
+    setAsDefaultProxyDescription: "Ten serwer proxy będzie domyślnie włączony dla nowych monitorów. Można go jednak wyłączyć osobno dla każdego monitora.",
+    "Certificate Chain": "Łańcuch certyfikatów",
+    Valid: "Ważny",
+    Invalid: "Nieważny",
+    AccessKeyId: "AccessKey ID",
+    SecretAccessKey: "AccessKey Sekret",
+    PhoneNumbers: "Numery telefonów",
+    TemplateCode: "Kod szablonu",
+    SignName: "Podpis",
+    "Sms template must contain parameters: ": "Szablon sms musi posiadać parametry: ",
+    "Bark Endpoint": "Punkt końcowy Bark",
+    WebHookUrl: "WebHookUrl",
+    SecretKey: "Tajny klucz",
+    "For safety, must use secret key": "Ze względów bezpieczeństwa musisz użyć tajnego klucza",
+    "Device Token": "Device Token",
+    Platform: "Platforma",
+    iOS: "iOS",
+    Android: "Android",
+    Huawei: "Huawei",
+    High: "Wysoki",
+    Retry: "Ponów",
+    Topic: "Temat",
+    "WeCom Bot Key": "Klucz bota WeCom",
+    "Setup Proxy": "Skonfiguruj proxy",
+    "Proxy Protocol": "Protokół proxy",
+    "Proxy Server": "Serwer proxy",
+    "Proxy server has authentication": "Serwer proxy ma autoryzację",
+    User: "Użytkownik",
+    Installed: "Zainstalowany",
+    "Not installed": "Nie zainstalowany",
+    Running: "Działa",
+    "Not running": "Nie działa",
+    "Remove Token": "Usuń token",
+    Start: "Start",
+    Stop: "Stop",
+    "Uptime Kuma": "Uptime Kuma",
+    "Add New Status Page": "Dodaj nową stronę statusów",
+    Slug: "Symbol",
+    "Accept characters:": "Dozwolone znaki:",
+    startOrEndWithOnly: "Zaczynające się i kończące wyłącznie {0} znakami",
+    "No consecutive dashes": "Bez powtarzających się myślników",
+    Next: "Dalej",
+    "The slug is already taken. Please choose another slug.": "Ten symbol jest już zajęty. Proszę, wybierz inny.",
+    "No Proxy": "Bez proxy",
+    "HTTP Basic Auth": "Podstawowa autoryzacja HTTP",
+    "New Status Page": "Nowa strona statusu",
+    "Page Not Found": "Strona nie została znaleziona",
+    "Reverse Proxy": "Odwrotne Proxy",
+    Backup: "Backup",
+    About: "O skrypcie",
+    wayToGetCloudflaredURL: "(Pobierz cloudflared z {0})",
+    cloudflareWebsite: "Strona Cloudflare",
+    "Message:": "Wiadomość:",
+    "Don't know how to get the token? Please read the guide:": "Nie wiesz jak uzyksać token? Przeczytaj proszę poradnik:",
+    "The current connection may be lost if you are currently connecting via Cloudflare Tunnel. Are you sure want to stop it? Type your current password to confirm it.": "Bieżące połączenie może zostać utracone, jeśli aktualnie łączysz się przez tunel Cloudflare. Czy na pewno chcesz to przerwać? Wpisz swoje aktualne hasło, aby je potwierdzić.",
+    "Other Software": "Inne oprogramowanie",
+    "For example: nginx, Apache and Traefik.": "Na przykład: nginx, Apache i Traefik.",
+    "Please read": "Przeczytaj proszę",
+    "Subject:": "Temat:",
+    "Valid To:": "Ważdny do:",
+    "Days Remaining:": "Pozostało dni:",
+    "Issuer:": "Wydawca:",
+    "Fingerprint:": "Odcisk palca:",
+    "No status pages": "Brak stron statusów",
+    "Domain Name Expiry Notification": "Powiadomienie o wygasaniu domeny",
+    Proxy: "Proxy",
+    "Date Created": "Data stworzenia",
+    onebotHttpAddress: "Adres HTTP OneBot",
+    onebotMessageType: "Rodzaj wiadomości OneBot",
+    onebotGroupMessage: "Grupowa",
+    onebotPrivateMessage: "Prywatna",
+    onebotUserOrGroupId: "ID Grupy/Użytkownika",
+    onebotSafetyTips: "Ze względów bezpieczeństwa musisz ustawić token dostępu",
+    "PushDeer Key": "Klucz PushDeer",
+    "Footer Text": "Treść stopki",
+    "Show Powered By": "Pokaż co napędza stronę",
+    "Domain Names": "Domeny",
+    signedInDisp: "Zalogowany jako {0}",
+    signedInDispDisabled: "Autoryzacja wyłączona.",
 };
--- a/src/languages/ru-RU.js
+++ b/src/languages/ru-RU.js
@@ -374,14 +374,14 @@ export default {
    serwersmsSenderName: "SMS Имя Отправителя (регистрированный через пользовательский портал)",
    stackfield: "Stackfield",
    smtpDkimSettings: "DKIM Настройки",
-    smtpDkimDesc: "Please refer to the Nodemailer DKIM {0} for usage.",
-    documentation: "документация",
+    smtpDkimDesc: "Пожалуйста ознакомьтесь с {0} Nodemailer DKIM для использования.",
+    documentation: "документацией",
    smtpDkimDomain: "Имя Домена",
    smtpDkimKeySelector: "Ключ",
    smtpDkimPrivateKey: "Приватный ключ",
    smtpDkimHashAlgo: "Алгоритм хэша (опционально)",
    smtpDkimheaderFieldNames: "Заголовок ключей для подписи (опционально)",
-    smtpDkimskipFields: "Заколовок ключей не для подписи (опционально)",
+    smtpDkimskipFields: "Заголовок ключей не для подписи (опционально)",
    gorush: "Gorush",
    alerta: "Alerta",
    alertaApiEndpoint: "Конечная точка API",
@@ -389,4 +389,12 @@ export default {
    alertaApiKey: "Ключ API",
    alertaAlertState: "Состояние алерта",
    alertaRecoverState: "Состояние восстановления",
+    Proxies: "Прокси",
+    default: "По умолчанию",
+    enabled: "Включено",
+    setAsDefault: "Установлено по умолчанию",
+    deleteProxyMsg: "Вы действительно хотите удалить этот прокси для всех мониторов?",
+    proxyDescription: "Прокси должны быть привязаны к монитору, чтобы работать.",
+    enableProxyDescription: "Этот прокси не будет влиять на запросы монитора, пока не будет активирован. Вы можете контролировать временное отключение прокси для всех мониторов через статус активации.",
+    setAsDefaultProxyDescription: "Этот прокси будет по умолчанию включен для новых мониторов. Вы всё ещё можете отдельно отключать прокси в каждом мониторе.",
 };
--- a/src/languages/vi-VN.js
+++ b/src/languages/vi-VN.js
@@ -239,6 +239,7 @@ export default {
    "rocket.chat": "Rocket.chat",
    pushover: "Pushover",
    pushy: "Pushy",
+    PushByTechulus: "Push by Techulus",
    octopush: "Octopush",
    promosms: "PromoSMS",
    clicksendsms: "ClickSend SMS",
@@ -308,6 +309,10 @@ export default {
    "One record": "One record",
    steamApiKeyDescription: "Để theo dõi các Steam Game Server bạn cần một Steam Web-API key. Bạn có thể đăng ký API key tại đây: ",
    "Current User": "User hiện tại",
+    topic: "Topic",
+    topicExplanation: "MQTT topic to monitor",
+    successMessage: "Success Message",
+    successMessageExplanation: "MQTT message that will be considered as success",
    recent: "Gần đây",
    Done: "Hoàn thành",
    Info: "Thông tin",
@@ -353,6 +358,9 @@ export default {
    serwersmsPhoneNumber: "Số điện thoại",
    serwersmsSenderName: "Tên người gửi SMS (Đã đăng ký qua portal)",
    "stackfield": "Stackfield",
+    Customize: "Customize",
+    "Custom Footer": "Custom Footer",
+    "Custom CSS": "Custom CSS",
    smtpDkimSettings: "Cài đặt xác thực Email(DKIM)",
    smtpDkimDesc: "Xem hướng dẫn tại {0}.",
    documentation: "Nodemailer DKIM",
@@ -362,4 +370,98 @@ export default {
    smtpDkimHashAlgo: "Hash Algorithm (Tuỳ chọn)",
    smtpDkimheaderFieldNames: "Header Keys to sign (Tuỳ chọn)",
    smtpDkimskipFields: "Header Keys not to sign (Tuỳ chọn)",
+    gorush: "Gorush",
+    alerta: "Alerta",
+    alertaApiEndpoint: "API Endpoint",
+    alertaEnvironment: "Environment",
+    alertaApiKey: "API Key",
+    alertaAlertState: "Alert State",
+    alertaRecoverState: "Recover State",
+    deleteStatusPageMsg: "Bạn có chắc chắn muốn xoá trang status này?",
+    Proxies: "Proxies",
+    default: "Mặc định",
+    enabled: "Enabled",
+    setAsDefault: "Set As Default",
+    deleteProxyMsg: "Bạn muốn xoá proxy này cho tất cả monitors?",
+    proxyDescription: "Proxies must be assigned to a monitor to function.",
+    enableProxyDescription: "Proxy này chưa ảnh hưởng tới monitor requests cho tới khi được activated. Bạn có thể tạm thời tắt proxy cho tất cả monitors bằng trạng thái activation.",
+    setAsDefaultProxyDescription: "Proxy này sẽ bật mặc định cho tất cả monitors mới. Bạn có thể tắt riêng lẻ proxy trên mỗi monitor.",
+    "Certificate Chain": "Certificate Chain",
+    Valid: "Hợp lệ",
+    Invalid: "Không hợp lệ",
+    AccessKeyId: "AccessKey ID",
+    SecretAccessKey: "AccessKey Secret",
+    PhoneNumbers: "PhoneNumbers",
+    TemplateCode: "TemplateCode",
+    SignName: "SignName",
+    "Sms template must contain parameters: ": "Sms template must contain parameters: ",
+    "Bark Endpoint": "Bark Endpoint",
+    WebHookUrl: "WebHookUrl",
+    SecretKey: "SecretKey",
+    "For safety, must use secret key": "Để an toàn, hãy dùng secret key",
+    "Device Token": "Device Token",
+    Platform: "Platform",
+    iOS: "iOS",
+    Android: "Android",
+    Huawei: "Huawei",
+    High: "High",
+    Retry: "Retry",
+    Topic: "Topic",
+    "WeCom Bot Key": "WeCom Bot Key",
+    "Setup Proxy": "Setup Proxy",
+    "Proxy Protocol": "Proxy Protocol",
+    "Proxy Server": "Proxy Server",
+    "Proxy server has authentication": "Proxy server has authentication",
+    User: "User",
+    Installed: "Installed",
+    "Not installed": "Not installed",
+    Running: "Running",
+    "Not running": "Not running",
+    "Remove Token": "Remove Token",
+    Start: "Start",
+    Stop: "Stop",
+    "Uptime Kuma": "Uptime Kuma",
+    "Add New Status Page": "Thêm mới Status Page",
+    Slug: "Slug",
+    "Accept characters:": "Accept characters:",
+    startOrEndWithOnly: "Start or end with {0} only",
+    "No consecutive dashes": "No consecutive dashes",
+    Next: "Next",
+    "The slug is already taken. Please choose another slug.": "The slug is already taken. Please choose another slug.",
+    "No Proxy": "No Proxy",
+    "HTTP Basic Auth": "HTTP Basic Auth",
+    "New Status Page": "New Status Page",
+    "Page Not Found": "Page Not Found",
+    "Reverse Proxy": "Reverse Proxy",
+    Backup: "Backup",
+    About: "About",
+    wayToGetCloudflaredURL: "(Download cloudflared from {0})",
+    cloudflareWebsite: "Cloudflare Website",
+    "Message:": "Message:",
+    "Don't know how to get the token? Please read the guide:": "Chưa biết cách lấy token? Xem hướng dẫn tại:",
+    "The current connection may be lost if you are currently connecting via Cloudflare Tunnel. Are you sure want to stop it? Type your current password to confirm it.": "Nếu bạn đang dùng Cloudflare Tunnel, kết nối hiện tại có thể đang bị mất. Bạn có muốn dừng lại? Nhập lại password để xác nhận.",
+    "Other Software": "Phần mềm khác",
+    "For example: nginx, Apache and Traefik.": "Ví dụ: Nginx, Apache hay Traefik.",
+    "Please read": "Hãy xem qua",
+    "Subject:": "Subject:",
+    "Valid To:": "Valid To:",
+    "Days Remaining:": "Số ngày còn lại:",
+    "Issuer:": "Issuer:",
+    "Fingerprint:": "Fingerprint:",
+    "No status pages": "No status pages",
+    "Domain Name Expiry Notification": "Cảnh báo hạn hạn Domain Name",
+    Proxy: "Proxy",
+    "Date Created": "Ngày khởi tạo",
+    onebotHttpAddress: "OneBot HTTP Address",
+    onebotMessageType: "OneBot Message Type",
+    onebotGroupMessage: "Group",
+    onebotPrivateMessage: "Private",
+    onebotUserOrGroupId: "Group/User ID",
+    onebotSafetyTips: "Để đảm bảo an toàn, hãy thiết lập access token",
+    "PushDeer Key": "PushDeer Key",
+    "Footer Text": "Footer Text",
+    "Show Powered By": "Show Powered By",
+    "Domain Names": "Domain Names",
+    signedInDisp: "Signed in as {0}",
+    signedInDispDisabled: "Auth Disabled.",
 };
--- a/src/languages/zh-CN.js
+++ b/src/languages/zh-CN.js
@@ -88,7 +88,7 @@ export default {
    Dark: "黑暗",
    Auto: "自动",
    "Theme - Heartbeat Bar": "主题 - 心跳栏",
-    Normal: "正常", // 此处还供 Gorush 的通知优先级功能使用，不应翻译为“正常显示”
+    Normal: "正常",
    Bottom: "靠下",
    None: "不显示",
    Timezone: "时区",
@@ -398,11 +398,9 @@ export default {
    Invalid: "无效",
    AccessKeyId: "AccessKey ID",
    SecretAccessKey: "AccessKey Secret",
-    /* 以下为阿里云短信服务 API Dysms#SendSms 的参数 */
    PhoneNumbers: "PhoneNumbers",
    TemplateCode: "TemplateCode",
    SignName: "SignName",
-    /* 以上为阿里云短信服务 API Dysms#SendSms 的参数 */
    "Bark Endpoint": "Bark 接入点",
    "Device Token": "Apple Device Token",
    Platform: "平台",
@@ -434,14 +432,14 @@ export default {
    "Add New Status Page": "添加新的状态页",
    Slug: "路径",
    "Accept characters:": "可接受的字符：",
-    "startOrEndWithOnly": "开头和结尾必须为 {0}",
+    startOrEndWithOnly: "开头和结尾必须为 {0}",
    "No consecutive dashes": "不能有连续的破折号",
    Next: "下一步",
    "The slug is already taken. Please choose another slug.": "该路径已被使用。请选择其他路径。",
    "No Proxy": "无代理",
    "HTTP Basic Auth": "HTTP 基础身份验证",
    "New Status Page": "新的状态页",
-    "Page Not Found": "状态页未找到",
+    "Page Not Found": "未找到该页面",
    "Reverse Proxy": "反向代理",
    "Subject:": "颁发给：",
    "Valid To:": "有效期至：",
@@ -449,4 +447,77 @@ export default {
    "Issuer:": "颁发者：",
    "Fingerprint:": "指纹：",
    "No status pages": "无状态页",
+    "Domain Name Expiry Notification": "域名到期时通知",
+    Proxy: "代理",
+    "Date Created": "创建于",
+    onebotHttpAddress: "OneBot HTTP 地址",
+    onebotMessageType: "OneBot 消息类型",
+    onebotGroupMessage: "群聊",
+    onebotPrivateMessage: "私聊",
+    onebotUserOrGroupId: "群组/用户ID",
+    onebotSafetyTips: "出于安全原因，请务必设置 AccessToken",
+    topic: "Topic",
+    topicExplanation: "MQTT 传递给监控的 Topic",
+    successMessage: "成功时消息",
+    successMessageExplanation: "MQTT 成功时所传递的消息",
+    Customize: "自定义",
+    "Custom Footer": "自定义底部",
+    "Custom CSS": "自定义 CSS",
+    "PushDeer Key": "PushDeer Key",
+    "Footer Text": "底部自定义文本",
+    "Show Powered By": "显示 Powered By",
+    "Domain Names": "域名",
+    "Certificate Expiry Notification": "证书到期时通知",
+    "API Username": "API 凭证 Username",
+    "API Key": "API 凭证 Key",
+    "Recipient Number": "收件人手机号码",
+    "From Name/Number": "发件人名称/手机号码",
+    "Leave blank to use a shared sender number.": "留空以使用平台共享的发件人手机号码",
+    "Octopush API Version": "Octopush API 版本",
+    "Legacy Octopush-DM": "旧版本 Octopush-DM",
+    endpoint: "接入点",
+    octopushAPIKey: "控制台 HTTP API credentials 里的 \"API key\"",
+    octopushLogin: "控制台 HTTP API credentials 里的 \"Login\"",
+    promosmsLogin: "API 登录名",
+    promosmsPassword: "API 密码",
+    "pushoversounds pushover": "Pushover（默认）",
+    "pushoversounds bike": "Bike",
+    "pushoversounds bugle": "Bugle",
+    "pushoversounds cashregister": "Cash Register",
+    "pushoversounds classical": "Classical",
+    "pushoversounds cosmic": "Cosmic",
+    "pushoversounds falling": "Falling",
+    "pushoversounds gamelan": "Gamelan",
+    "pushoversounds incoming": "Incoming",
+    "pushoversounds intermission": "Intermission",
+    "pushoversounds magic": "Magic",
+    "pushoversounds mechanical": "Mechanical",
+    "pushoversounds pianobar": "Piano Bar",
+    "pushoversounds siren": "Siren",
+    "pushoversounds spacealarm": "Space Alarm",
+    "pushoversounds tugboat": "Tug Boat",
+    "pushoversounds alien": "Alien Alarm（长铃声）",
+    "pushoversounds climb": "Climb（长铃声）",
+    "pushoversounds persistent": "Persistent（长铃声）",
+    "pushoversounds echo": "Pushover Echo（长铃声）",
+    "pushoversounds updown": "Up Down（长铃声）",
+    "pushoversounds vibrate": "仅震动",
+    "pushoversounds none": "无（禁音）",
+    pushyAPIKey: "API 密钥",
+    pushyToken: "设备 Token",
+    "Show update if available": "有更新时通知",
+    "Also check beta release": "一并检查 Beta 版更新",
+    "Using a Reverse Proxy?": "正在使用反向代理？",
+    "Check how to config it for WebSocket": "查看如何将反向代理与 WebSocket 一起使用",
+    "Steam Game Server": "Steam 游戏服务器",
+    "Most likely causes:": "最可能的原因：",
+    "The resource is no longer available.": "您所请求的资源已不再可用；",
+    "There might be a typing error in the address.": "您输入的地址可能有误。",
+    "What you can try:": "您可以尝试以下操作：",
+    "Retype the address.": "重新输入地址；",
+    "Go back to the previous page.": "返回到上一页面。",
+    "Coming Soon": "即将推出",
+    wayToGetClickSendSMSToken: "您可以从 {0} 获取 API 凭证 Username 和 凭证 Key。",
+    signedInDisp: "当前用户： {0}",
+    signedInDispDisabled: "已禁用身份验证",
 };
--- a/src/languages/zh-TW.js
+++ b/src/languages/zh-TW.js
@@ -33,7 +33,7 @@ export default {
    Appearance: "外觀",
    Theme: "主題",
    General: "一般",
-    "Primary Base URL": "主要基底 URL",
+    "Primary Base URL": "主要基底網址",
    Version: "版本",
    "Check Update On GitHub": "在 GitHub 檢查更新",
    List: "清單",
@@ -307,9 +307,12 @@ export default {
    PasswordsDoNotMatch: "密碼不相符。",
    records: "記錄",
    "One record": "一項記錄",
-    "Showing {from} to {to} of {count} records": "正在顯示 {count} 項記錄中的 {from} 至 {to} 項",
    steamApiKeyDescription: "若要監測 Steam 遊戲伺服器，您將需要 Steam Web-API 金鑰。您可以在此註冊您的 API 金鑰：",
    "Current User": "目前使用者",
+    topic: "Topic",
+    topicExplanation: "要監測的 MQTT Topic",
+    successMessage: "成功訊息",
+    successMessageExplanation: "視為成功的 MQTT 訊息",
    recent: "最近",
    Done: "完成",
    Info: "資訊",
@@ -355,6 +358,9 @@ export default {
    serwersmsPhoneNumber: "電話號碼",
    serwersmsSenderName: "SMS 寄件人名稱 (由客戶入口網站註冊)",
    stackfield: "Stackfield",
+    Customize: "自訂",
+    "Custom Footer": "自訂頁尾",
+    "Custom CSS": "自訂 CSS",
    smtpDkimSettings: "DKIM 設定",
    smtpDkimDesc: "請參考 Nodemailer DKIM {0} 使用方式。",
    documentation: "文件",
@@ -366,7 +372,7 @@ export default {
    smtpDkimskipFields: "不簽署的郵件標頭 (選填)",
    gorush: "Gorush",
    alerta: "Alerta",
-    alertaApiEndpoint: "API Endpoint",
+    alertaApiEndpoint: "API 端點",
    alertaEnvironment: "環境",
    alertaApiKey: "API 金鑰",
    alertaAlertState: "警示狀態",
@@ -380,4 +386,80 @@ export default {
    proxyDescription: "必須將代理伺服器指派給監測器才能運作。",
    enableProxyDescription: "此代理伺服器在啟用前不會在監測器上生效，您可以藉由控制啟用狀態來暫時對所有的監測器停用代理伺服器。",
    setAsDefaultProxyDescription: "預設情況下，新監測器將啟用此代理伺服器。您仍可分別停用各監測器的代理伺服器。",
+    "Certificate Chain": "憑證鏈結",
+    Valid: "有效",
+    Invalid: "無效",
+    AccessKeyId: "AccessKey ID",
+    SecretAccessKey: "AccessKey 密碼",
+    PhoneNumbers: "PhoneNumbers",
+    TemplateCode: "TemplateCode",
+    SignName: "SignName",
+    "Sms template must contain parameters: ": "Sms 範本必須包含參數：",
+    "Bark Endpoint": "Bark 端點",
+    WebHookUrl: "WebHookUrl",
+    SecretKey: "SecretKey",
+    "For safety, must use secret key": "為了安全起見，必須使用秘密金鑰",
+    "Device Token": "裝置權杖",
+    Platform: "平台",
+    iOS: "iOS",
+    Android: "Android",
+    Huawei: "華為",
+    High: "高",
+    Retry: "重試",
+    Topic: "Topic",
+    "WeCom Bot Key": "WeCom 機器人金鑰",
+    "Setup Proxy": "設置 Proxy",
+    "Proxy Protocol": "Proxy 通訊協定",
+    "Proxy Server": "Proxy 伺服器",
+    "Proxy server has authentication": "Proxy 伺服器啟用了驗證功能",
+    User: "使用者",
+    Installed: "已安裝",
+    "Not installed": "未安裝",
+    Running: "執行中",
+    "Not running": "未執行",
+    "Remove Token": "移除權杖",
+    Start: "開始",
+    Stop: "停止",
+    "Uptime Kuma": "Uptime Kuma",
+    "Add New Status Page": "新增狀態頁",
+    Slug: "Slug",
+    "Accept characters:": "可用字元：",
+    startOrEndWithOnly: "僅能使用 {0} 開頭或結尾",
+    "No consecutive dashes": "不得連續使用破折號",
+    Next: "下一步",
+    "The slug is already taken. Please choose another slug.": "此 slug 已被使用。請選擇其他 slug。",
+    "No Proxy": "無 Proxy",
+    "HTTP Basic Auth": "HTTP 基本驗證",
+    "New Status Page": "新狀態頁",
+    "Page Not Found": "找不到頁面",
+    "Reverse Proxy": "反向代理",
+    Backup: "備份",
+    About: "關於",
+    wayToGetCloudflaredURL: "(從 {0} 下載 cloudflared)",
+    cloudflareWebsite: "Cloudflare 網站",
+    "Message:": "訊息：",
+    "Don't know how to get the token? Please read the guide:": "不知道如何取得權杖嗎？請閱讀指南：",
+    "The current connection may be lost if you are currently connecting via Cloudflare Tunnel. Are you sure want to stop it? Type your current password to confirm it.": "如果您目前正透過 Cloudflare Tunnel 連線，可能會導致連線中斷。您確定要停止嗎？請輸入密碼以確認。",
+    "Other Software": "其他軟體",
+    "For example: nginx, Apache and Traefik.": "例如 nginx、Apache 和 Traefik。",
+    "Please read": "請閱覽",
+    "Subject:": "簽發給：",
+    "Valid To:": "有效期限：",
+    "Days Remaining:": "剩餘天數：",
+    "Issuer:": "簽發者：",
+    "Fingerprint:": "指紋：",
+    "No status pages": "無狀態頁",
+    "Domain Name Expiry Notification": "網域名稱到期通知",
+    Proxy: "Proxy",
+    "Date Created": "建立日期",
+    onebotHttpAddress: "OneBot HTTP 位址",
+    onebotMessageType: "OneBot 訊息類型",
+    onebotGroupMessage: "群組",
+    onebotPrivateMessage: "私人",
+    onebotUserOrGroupId: "群組/使用者 ID",
+    onebotSafetyTips: "為了安全起見，必須設置存取權杖",
+    "PushDeer Key": "PushDeer 金鑰",
+    "Footer Text": "頁尾文字",
+    "Show Powered By": "顯示技術支援文字",
+    "Domain Names": "網域名稱",
 };
--- a/src/layouts/EmptyLayout.vue
+++ b/src/layouts/EmptyLayout.vue
@@ -3,5 +3,6 @@
 </template>

 <script>
-export default {}
+export default {};
 </script>
+
--- a/src/layouts/Layout.vue
+++ b/src/layouts/Layout.vue
@@ -4,7 +4,7 @@
            <div class="container-fluid">
                {{ $root.connectionErrorMsg }}
                <div v-if="$root.showReverseProxyGuide">
-                    Using a Reverse Proxy? <a href="https://github.com/louislam/uptime-kuma/wiki/Reverse-Proxy" target="_blank">Check how to config it for WebSocket</a>
+                    {{ $t("Using a Reverse Proxy?") }} <a href="https://github.com/louislam/uptime-kuma/wiki/Reverse-Proxy" target="_blank">{{ $t("Check how to config it for WebSocket") }}</a>
                </div>
            </div>
        </div>
@@ -32,9 +32,32 @@
                    </router-link>
                </li>
                <li v-if="$root.loggedIn" class="nav-item">
-                    <router-link to="/settings" class="nav-link" :class="{ active: $route.path.includes('settings') }">
-                        <font-awesome-icon icon="cog" /> {{ $t("Settings") }}
-                    </router-link>
+                    <div class="dropdown dropdown-profile-pic">
+                        <div class="nav-link" data-bs-toggle="dropdown">
+                            <div class="profile-pic">{{ $root.usernameFirstChar }}</div>
+                            <font-awesome-icon icon="angle-down" />
+                        </div>
+                        <ul class="dropdown-menu">
+                            <li>
+                                <i18n-t v-if="$root.username != null" tag="span" keypath="signedInDisp" class="dropdown-item-text">
+                                    <strong>{{ $root.username }}</strong>
+                                </i18n-t>
+                                <span v-if="$root.username == null" class="dropdown-item-text">{{ $t("signedInDispDisabled") }}</span>
+                            </li>
+                            <li><hr class="dropdown-divider"></li>
+                            <li>
+                                <router-link to="/settings" class="dropdown-item" :class="{ active: $route.path.includes('settings') }">
+                                    <font-awesome-icon icon="cog" /> {{ $t("Settings") }}
+                                </router-link>
+                            </li>
+                            <li v-if="$root.loggedIn && $root.socket.token !== 'autoLogin'">
+                                <button class="dropdown-item" @click="$root.logout">
+                                    <font-awesome-icon icon="sign-out-alt" />
+                                    {{ $t("Logout") }}
+                                </button>
+                            </li>
+                        </ul>
+                    </div>
                </li>
            </ul>
        </header>
@@ -48,7 +71,7 @@
        </header>

        <main>
-            <router-view v-if="$root.loggedIn || forceShowContent" />
+            <router-view v-if="$root.loggedIn" />
            <Login v-if="! $root.loggedIn && $root.allowLoginDialog" />
        </main>

@@ -192,6 +215,81 @@ main {
    z-index: 99999;
 }

+// Profile Pic Button with Dropdown
+.dropdown-profile-pic {
+    user-select: none;
+
+    .nav-link {
+        cursor: pointer;
+        display: flex;
+        gap: 6px;
+        align-items: center;
+        background-color: rgba(200, 200, 200, 0.2);
+        padding: 0.5rem 0.8rem;
+
+        &:hover {
+            background-color: rgba(255, 255, 255, 0.2);
+        }
+    }
+
+    .dropdown-menu {
+        transition: all 0.2s;
+        padding-left: 0;
+        padding-bottom: 0;
+        margin-top: 8px !important;
+        border-radius: 16px;
+        overflow: hidden;
+
+        .dropdown-divider {
+            margin: 0;
+            border-top: 1px solid rgba(0, 0, 0, 0.4);
+            background-color: transparent;
+        }
+
+        .dropdown-item-text {
+            font-size: 14px;
+            padding-bottom: 0.7rem;
+        }
+
+        .dropdown-item {
+            padding: 0.7rem 1rem;
+        }
+
+        .dark & {
+            background-color: $dark-bg;
+            color: $dark-font-color;
+            border-color: $dark-border-color;
+
+            .dropdown-item {
+                color: $dark-font-color;
+
+                &.active {
+                    color: $dark-font-color2;
+                    background-color: $highlight !important;
+                }
+
+                &:hover {
+                    background-color: $dark-bg2;
+                }
+            }
+        }
+    }
+
+    .profile-pic {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        color: white;
+        background-color: $primary;
+        width: 24px;
+        height: 24px;
+        margin-right: 5px;
+        border-radius: 50rem;
+        font-weight: bold;
+        font-size: 10px;
+    }
+}
+
 .dark {
    header {
        background-color: $dark-header-bg;
--- a/src/mixins/socket.js
+++ b/src/mixins/socket.js
@@ -1,6 +1,6 @@
 import { io } from "socket.io-client";
 import { useToast } from "vue-toastification";
-import jwt_decode from "jwt-decode";
+import jwtDecode from "jwt-decode";
 import Favico from "favico.js";
 const toast = useToast();

@@ -28,6 +28,7 @@ export default {
                connectCount: 0,
                initedSocketIO: false,
            },
+            username: null,
            remember: (localStorage.remember !== "0"),
            allowLoginDialog: false,        // Allowed to show login dialog, but "loggedIn" have to be true too. This exists because prevent the login dialog show 0.1s in first before the socket server auth-ed.
            loggedIn: false,
@@ -89,7 +90,7 @@ export default {
            }

            socket = io(wsHost, {
-                transports: ["websocket"],
+                transports: [ "websocket" ],
            });

            socket.on("info", (info) => {
@@ -103,12 +104,13 @@ export default {
            socket.on("autoLogin", (monitorID, data) => {
                this.loggedIn = true;
                this.storage().token = "autoLogin";
+                this.socket.token = "autoLogin";
                this.allowLoginDialog = false;
            });

            socket.on("monitorList", (data) => {
                // Add Helper function
-                Object.entries(data).forEach(([monitorID, monitor]) => {
+                Object.entries(data).forEach(([ monitorID, monitor ]) => {
                    monitor.getUrl = () => {
                        try {
                            return new URL(monitor.url);
@@ -233,7 +235,6 @@ export default {
                    if (token !== "autoLogin") {
                        this.loginByToken(token);
                    } else {
-
                        // Timeout if it is not actually auto login
                        setTimeout(() => {
                            if (! this.loggedIn) {
@@ -241,7 +242,6 @@ export default {
                                this.$root.storage().removeItem("token");
                            }
                        }, 5000);
-
                    }
                } else {
                    this.allowLoginDialog = true;
@@ -266,7 +266,7 @@ export default {
            const jwtToken = this.$root.storage().token;

            if (jwtToken && jwtToken !== "autoLogin") {
-                return jwt_decode(jwtToken);
+                return jwtDecode(jwtToken);
            }
            return undefined;
        },
@@ -305,6 +305,7 @@ export default {
                    this.storage().token = res.token;
                    this.socket.token = res.token;
                    this.loggedIn = true;
+                    this.username = this.getJWTPayload()?.username;

                    // Trigger Chrome Save Password
                    history.pushState({}, "");
@@ -322,6 +323,7 @@ export default {
                    this.logout();
                } else {
                    this.loggedIn = true;
+                    this.username = this.getJWTPayload()?.username;
                }
            });
        },
@@ -331,6 +333,7 @@ export default {
            this.storage().removeItem("token");
            this.socket.token = null;
            this.loggedIn = false;
+            this.username = null;
            this.clearData();
        },

@@ -398,6 +401,14 @@ export default {

    computed: {

+        usernameFirstChar() {
+            if (typeof this.username == "string" && this.username.length >= 1) {
+                return this.username.charAt(0).toUpperCase();
+            } else {
+                return "🐻";
+            }
+        },
+
        lastHeartbeatList() {
            let result = {};

--- a/src/pages/Dashboard.vue
+++ b/src/pages/Dashboard.vue
@@ -25,9 +25,9 @@ export default {
        MonitorList,
    },
    data() {
-        return {}
+        return {};
    },
-}
+};
 </script>

 <style lang="scss" scoped>
--- a/src/pages/DashboardHome.vue
+++ b/src/pages/DashboardHome.vue
@@ -118,6 +118,7 @@ export default {
                return 0;
            });

+            // eslint-disable-next-line vue/no-side-effects-in-computed-properties
            this.heartBeatList = result;

            return result;
--- a/src/pages/EditMonitor.vue
+++ b/src/pages/EditMonitor.vue
@@ -30,7 +30,10 @@
                                        Push
                                    </option>
                                    <option value="steam">
-                                        Steam Game Server
+                                        {{ $t("Steam Game Server") }}
+                                    </option>
+                                    <option value="mqtt">
+                                        MQTT
                                    </option>
                                    <option value="docker">
                                        {{ $t("Docker Container") }}
@@ -56,7 +59,7 @@
                                <CopyableInput id="push-url" v-model="pushURL" type="url" disabled="disabled" />
                                <div class="form-text">
                                    {{ $t("needPushEvery", [monitor.interval]) }}<br />
-                                    {{ $t("pushOptionalParams", ["msg, ping"]) }}
+                                    {{ $t("pushOptionalParams", ["status, msg, ping"]) }}
                                </div>
                            </div>

@@ -70,15 +73,15 @@
                            </div>

                            <!-- Hostname -->
-                            <!-- TCP Port / Ping / DNS / Steam only -->
-                            <div v-if="monitor.type === 'port' || monitor.type === 'ping' || monitor.type === 'dns' || monitor.type === 'steam'" class="my-3">
+                            <!-- TCP Port / Ping / DNS / Steam / MQTT only -->
+                            <div v-if="monitor.type === 'port' || monitor.type === 'ping' || monitor.type === 'dns' || monitor.type === 'steam' || monitor.type === 'mqtt'" class="my-3">
                                <label for="hostname" class="form-label">{{ $t("Hostname") }}</label>
                                <input id="hostname" v-model="monitor.hostname" type="text" class="form-control" :pattern="`${ipRegexPattern}|${hostnameRegexPattern}`" required>
                            </div>

                            <!-- Port -->
-                            <!-- For TCP Port / Steam Type -->
-                            <div v-if="monitor.type === 'port' || monitor.type === 'steam'" class="my-3">
+                            <!-- For TCP Port / Steam / MQTT Type -->
+                            <div v-if="monitor.type === 'port' || monitor.type === 'steam' || monitor.type === 'mqtt'" class="my-3">
                                <label for="port" class="form-label">{{ $t("Port") }}</label>
                                <input id="port" v-model="monitor.port" type="number" class="form-control" required min="0" max="65535" step="1">
                            </div>
@@ -117,7 +120,7 @@
                                    </div>
                                </div>
                            </template>
-
+                            
                            <!-- Docker Container Name / ID -->
                            <!-- For Docker Type -->
                            <div v-if="monitor.type === 'docker'" class="my-3">
@@ -146,6 +149,36 @@
                                <input id="docker_daemon" v-model="monitor.docker_daemon" type="text" class="form-control" required>
                            </div>

+                            <!-- MQTT -->
+                            <!-- For MQTT Type -->
+                            <template v-if="monitor.type === 'mqtt'">
+                                <div class="my-3">
+                                    <label for="mqttUsername" class="form-label">MQTT {{ $t("Username") }}</label>
+                                    <input id="mqttUsername" v-model="monitor.mqttUsername" type="text" class="form-control">
+                                </div>
+
+                                <div class="my-3">
+                                    <label for="mqttPassword" class="form-label">MQTT {{ $t("Password") }}</label>
+                                    <input id="mqttPassword" v-model="monitor.mqttPassword" type="password" class="form-control">
+                                </div>
+
+                                <div class="my-3">
+                                    <label for="mqttTopic" class="form-label">MQTT {{ $t("Topic") }}</label>
+                                    <input id="mqttTopic" v-model="monitor.mqttTopic" type="text" class="form-control" required>
+                                    <div class="form-text">
+                                        {{ $t("topicExplanation") }}
+                                    </div>
+                                </div>
+
+                                <div class="my-3">
+                                    <label for="mqttSuccessMessage" class="form-label">MQTT {{ $t("successMessage") }}</label>
+                                    <input id="mqttSuccessMessage" v-model="monitor.mqttSuccessMessage" type="text" class="form-control">
+                                    <div class="form-text">
+                                        {{ $t("successMessageExplanation") }}
+                                    </div>
+                                </div>
+                            </template>
+
                            <!-- Interval -->
                            <div class="my-3">
                                <label for="interval" class="form-label">{{ $t("Heartbeat Interval") }} ({{ $t("checkEverySecond", [ monitor.interval ]) }})</label>
@@ -170,10 +203,10 @@

                            <h2 v-if="monitor.type !== 'push'" class="mt-5 mb-2">{{ $t("Advanced") }}</h2>

-                            <div class="my-3 form-check">
+                            <div v-if="monitor.type === 'http' || monitor.type === 'keyword' " class="my-3 form-check">
                                <input id="expiry-notification" v-model="monitor.expiryNotification" class="form-check-input" type="checkbox">
                                <label class="form-check-label" for="expiry-notification">
-                                    {{ $t("Domain Name Expiry Notification") }}
+                                    {{ $t("Certificate Expiry Notification") }}
                                </label>
                                <div class="form-text">
                                </div>
@@ -359,13 +392,12 @@
 </template>

 <script>
+import VueMultiselect from "vue-multiselect";
+import { useToast } from "vue-toastification";
+import CopyableInput from "../components/CopyableInput.vue";
 import NotificationDialog from "../components/NotificationDialog.vue";
 import ProxyDialog from "../components/ProxyDialog.vue";
 import TagsManager from "../components/TagsManager.vue";
-import CopyableInput from "../components/CopyableInput.vue";
-
-import { useToast } from "vue-toastification";
-import VueMultiselect from "vue-multiselect";
 import { genSecret, isDev } from "../util.ts";

 const toast = useToast();
@@ -420,21 +452,21 @@ export default {
        },

        pushURL() {
-            return this.$root.baseURL + "/api/push/" + this.monitor.pushToken + "?msg=OK&ping=";
+            return this.$root.baseURL + "/api/push/" + this.monitor.pushToken + "?status=up&msg=OK&ping=";
        },

        bodyPlaceholder() {
-            return this.$t("Example:", [`
+            return this.$t("Example:", [ `
 {
    "key": "value"
-}`]);
+}` ]);
        },

        headersPlaceholder() {
-            return this.$t("Example:", [`
+            return this.$t("Example:", [ `
 {
    "HeaderName": "HeaderValue"
-}`]);
+}` ]);
        }

    },
@@ -519,13 +551,17 @@ export default {
                    upsideDown: false,
                    expiryNotification: false,
                    maxredirects: 10,
-                    accepted_statuscodes: ["200-299"],
+                    accepted_statuscodes: [ "200-299" ],
                    dns_resolve_type: "A",
                    dns_resolve_server: "1.1.1.1",
                    docker_container: "",
                    docker_daemon: "/var/run/docker.sock",
                    docker_type: "socket",
                    proxyId: null,
+                    mqttUsername: "",
+                    mqttPassword: "",
+                    mqttTopic: "",
+                    mqttSuccessMessage: "",
                };

                if (this.$root.proxyList && !this.monitor.proxyId) {
@@ -537,7 +573,7 @@ export default {
                }

                for (let i = 0; i < this.$root.notificationList.length; i++) {
-                    if (this.$root.notificationList[i].isDefault == true) {
+                    if (this.$root.notificationList[i].isDefault === true) {
                        this.monitor.notificationIDList[this.$root.notificationList[i].id] = true;
                    }
                }
--- a/src/pages/List.vue
+++ b/src/pages/List.vue
@@ -11,6 +11,6 @@ export default {
    components: {
        MonitorList,
    },
-}
+};
 </script>

--- a/src/pages/ManageStatusPage.vue
+++ b/src/pages/ManageStatusPage.vue
@@ -92,7 +92,6 @@ export default {
        }

        .info {
-
            .title {
                font-weight: bold;
                font-size: 20px;
--- a/src/pages/NotFound.vue
+++ b/src/pages/NotFound.vue
@@ -22,16 +22,16 @@
            </div>

            <div class="guide">
-                Most likely causes:
+                {{ $t("Most likely causes:") }}
                <ul>
-                    <li>The resource is no longer available.</li>
-                    <li>There might be a typing error in the address.</li>
+                    <li>{{ $t("The resource is no longer available.") }}</li>
+                    <li>{{ $t("There might be a typing error in the address.") }}</li>
                </ul>

-                What you can try:<br />
+                {{ $t("What you can try:") }}<br />
                <ul>
-                    <li>Retype the address.</li>
-                    <li><a href="#" class="go-back" @click="goBack()">Go back to the previous page.</a></li>
+                    <li>{{ $t("Retype the address.") }}</li>
+                    <li><a href="#" class="go-back" @click="goBack()">{{ $t("Go back to the previous page.") }}</a></li>
                </ul>
            </div>
        </div>
--- a/src/pages/Settings.vue
+++ b/src/pages/Settings.vue
@@ -16,6 +16,14 @@
                            {{ item.title }}
                        </div>
                    </router-link>
+
+                    <!-- Logout Button -->
+                    <a v-if="$root.isMobile && $root.loggedIn && $root.socket.token !== 'autoLogin'" class="logout" @click.prevent="$root.logout">
+                        <div class="menu-item">
+                            <font-awesome-icon icon="sign-out-alt" />
+                            {{ $t("Logout") }}
+                        </div>
+                    </a>
                </div>
                <div class="settings-content col-lg-9 col-md-7">
                    <div v-if="currentPage" class="settings-content-header">
@@ -233,4 +241,8 @@ footer {
        }
    }
 }
+
+.logout {
+    color: $danger !important;
+}
 </style>
--- a/src/pages/StatusPage.vue
+++ b/src/pages/StatusPage.vue
@@ -16,11 +16,18 @@
                    <input id="title" v-model="config.title" type="text" class="form-control">
                </div>

+                <!-- Description -->
                <div class="my-3">
                    <label for="description" class="form-label">{{ $t("Description") }}</label>
                    <textarea id="description" v-model="config.description" class="form-control"></textarea>
                </div>

+                <!-- Footer Text -->
+                <div class="my-3">
+                    <label for="footer-text" class="form-label">{{ $t("Footer Text") }}</label>
+                    <textarea id="footer-text" v-model="config.footerText" class="form-control"></textarea>
+                </div>
+
                <div class="my-3 form-check form-switch">
                    <input id="switch-theme" v-model="config.theme" class="form-check-input" type="checkbox" true-value="dark" false-value="light">
                    <label class="form-check-label" for="switch-theme">{{ $t("Switch to Dark Theme") }}</label>
@@ -31,15 +38,21 @@
                    <label class="form-check-label" for="showTags">{{ $t("Show Tags") }}</label>
                </div>

+                <!-- Show Powered By -->
+                <div class="my-3 form-check form-switch">
+                    <input id="show-powered-by" v-model="config.showPoweredBy" class="form-check-input" type="checkbox">
+                    <label class="form-check-label" for="show-powered-by">{{ $t("Show Powered By") }}</label>
+                </div>
+
                <div v-if="false" class="my-3">
-                    <label for="password" class="form-label">{{ $t("Password") }} <sup>Coming Soon</sup></label>
+                    <label for="password" class="form-label">{{ $t("Password") }} <sup>{{ $t("Coming Soon") }}</sup></label>
                    <input id="password" v-model="config.password" disabled type="password" autocomplete="new-password" class="form-control">
                </div>

                <!-- Domain Name List -->
                <div class="my-3">
                    <label class="form-label">
-                        Domain Names
+                        {{ $t("Domain Names") }}
                        <font-awesome-icon icon="plus-circle" class="btn-add-domain action text-primary" @click="addDomainField" />
                    </label>

@@ -51,6 +64,12 @@
                    </ul>
                </div>

+                <!-- Custom CSS -->
+                <div class="my-3">
+                    <div class="mb-1">{{ $t("Custom CSS") }}</div>
+                    <prism-editor v-model="config.customCSS" class="css-editor" :highlight="highlighter" line-numbers></prism-editor>
+                </div>
+
                <div class="danger-zone">
                    <button class="btn btn-danger me-2" @click="deleteDialog">
                        <font-awesome-icon icon="trash" />
@@ -85,15 +104,16 @@

                <!-- Uploader -->
                <!--    url="/api/status-page/upload-logo" -->
-                <ImageCropUpload v-model="showImageCropUpload"
-                                 field="img"
-                                 :width="128"
-                                 :height="128"
-                                 :langType="$i18n.locale"
-                                 img-format="png"
-                                 :noCircle="true"
-                                 :noSquare="false"
-                                 @crop-success="cropSuccess"
+                <ImageCropUpload
+                    v-model="showImageCropUpload"
+                    field="img"
+                    :width="128"
+                    :height="128"
+                    :langType="$i18n.locale"
+                    img-format="png"
+                    :noCircle="true"
+                    :noSquare="false"
+                    @crop-success="cropSuccess"
                />

                <!-- Title -->
@@ -239,31 +259,50 @@
            </div>

            <footer class="mt-5 mb-4">
-                {{ $t("Powered by") }} <a target="_blank" href="https://github.com/louislam/uptime-kuma">{{ $t("Uptime Kuma" ) }}</a>
+                <div class="custom-footer-text text-start">
+                    <strong v-if="enableEditMode">{{ $t("Custom Footer") }}:</strong>
+                </div>
+                <Editable v-model="config.footerText" tag="div" :contenteditable="enableEditMode" :noNL="false" class="alert-heading p-2" />
+
+                <p v-if="config.showPoweredBy">
+                    {{ $t("Powered by") }} <a target="_blank" href="https://github.com/louislam/uptime-kuma">{{ $t("Uptime Kuma" ) }}</a>
+                </p>
            </footer>
        </div>

        <Confirm ref="confirmDelete" btn-style="btn-danger" :yes-text="$t('Yes')" :no-text="$t('No')" @yes="deleteStatusPage">
            {{ $t("deleteStatusPageMsg") }}
        </Confirm>
+
+        <component is="style" v-if="config.customCSS" type="text/css">
+            {{ config.customCSS }}
+        </component>
    </div>
 </template>

 <script>
 import axios from "axios";
-import PublicGroupList from "../components/PublicGroupList.vue";
-import ImageCropUpload from "vue-image-crop-upload";
-import { STATUS_PAGE_ALL_DOWN, STATUS_PAGE_ALL_UP, STATUS_PAGE_PARTIAL_DOWN, UP } from "../util.ts";
-import { useToast } from "vue-toastification";
 import dayjs from "dayjs";
 import Favico from "favico.js";
-import { getResBaseURL } from "../util-frontend";
+// import highlighting library (you can use any library you want just return html string)
+import { highlight, languages } from "prismjs/components/prism-core";
+import "prismjs/components/prism-css";
+import "prismjs/themes/prism-tomorrow.css"; // import syntax highlighting styles
+import ImageCropUpload from "vue-image-crop-upload";
+// import Prism Editor
+import { PrismEditor } from "vue-prism-editor";
+import "vue-prism-editor/dist/prismeditor.min.css"; // import the styles somewhere
+import { useToast } from "vue-toastification";
 import Confirm from "../components/Confirm.vue";
+import PublicGroupList from "../components/PublicGroupList.vue";
+import { getResBaseURL } from "../util-frontend";
+import { STATUS_PAGE_ALL_DOWN, STATUS_PAGE_ALL_UP, STATUS_PAGE_PARTIAL_DOWN, UP } from "../util.ts";

 const toast = useToast();

 const leavePageMsg = "Do you really want to leave? you have unsaved changes!";

+// eslint-disable-next-line no-unused-vars
 let feedInterval;

 const favicon = new Favico({
@@ -276,6 +315,7 @@ export default {
        PublicGroupList,
        ImageCropUpload,
        Confirm,
+        PrismEditor,
    },

    // Leave Page for vue route change
@@ -418,6 +458,13 @@ export default {
                this.$root.getSocket().emit("getStatusPage", this.slug, (res) => {
                    if (res.ok) {
                        this.config = res.config;
+
+                        if (!this.config.customCSS) {
+                            this.config.customCSS = "body {\n" +
+                                "  \n" +
+                                "}\n";
+                        }
+
                    } else {
                        toast.error(res.msg);
                    }
@@ -520,6 +567,10 @@ export default {
    },
    methods: {

+        highlighter(code) {
+            return highlight(code, languages.css);
+        },
+
        updateHeartbeatList() {
            // If editMode, it will use the data from websocket.
            if (! this.editMode) {
@@ -637,7 +688,7 @@ export default {
        },

        statusPageLogoLoaded(eventPayload) {
-            // Remark: may not work in dev, due to cros
+            // Remark: may not work in dev, due to CORS
            favicon.image(eventPayload.target);
        },

@@ -656,7 +707,7 @@ export default {
        },

        postIncident() {
-            if (this.incident.title == "" || this.incident.content == "") {
+            if (this.incident.title === "" || this.incident.content === "") {
                toast.error(this.$t("Please input title and content"));
                return;
            }
@@ -836,7 +887,7 @@ footer {

 .incident {
    .content {
-        &[contenteditable=true] {
+        &[contenteditable="true"] {
            min-height: 60px;
        }
    }
@@ -893,4 +944,18 @@ footer {
    }
 }

+/* required class */
+.css-editor {
+    /* we dont use `language-` classes anymore so thats why we need to add background and text color manually */
+
+    border-radius: 1rem;
+    padding: 10px 5px;
+    border: 1px solid #ced4da;
+
+    .dark & {
+        background: $dark-bg;
+        border: 1px solid $dark-border-color;
+    }
+}
+
 </style>
--- a/src/util.js
+++ b/src/util.js
@@ -7,7 +7,7 @@
 // Backend uses the compiled file util.js
 // Frontend uses util.ts
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getMonitorRelativeURL = exports.genSecret = exports.getCryptoRandomInt = exports.getRandomInt = exports.getRandomArbitrary = exports.TimeLogger = exports.polyfill = exports.debug = exports.ucfirst = exports.sleep = exports.flipStatus = exports.STATUS_PAGE_PARTIAL_DOWN = exports.STATUS_PAGE_ALL_UP = exports.STATUS_PAGE_ALL_DOWN = exports.PENDING = exports.UP = exports.DOWN = exports.appName = exports.isDev = void 0;
+exports.getMonitorRelativeURL = exports.genSecret = exports.getCryptoRandomInt = exports.getRandomInt = exports.getRandomArbitrary = exports.TimeLogger = exports.polyfill = exports.log = exports.debug = exports.ucfirst = exports.sleep = exports.flipStatus = exports.STATUS_PAGE_PARTIAL_DOWN = exports.STATUS_PAGE_ALL_UP = exports.STATUS_PAGE_ALL_DOWN = exports.PENDING = exports.UP = exports.DOWN = exports.appName = exports.isDev = void 0;
 const _dayjs = require("dayjs");
 const dayjs = _dayjs;
 exports.isDev = process.env.NODE_ENV === "development";
@@ -44,12 +44,92 @@ function ucfirst(str) {
    return firstLetter.toUpperCase() + str.substr(1);
 }
 exports.ucfirst = ucfirst;
+/**
+ * @deprecated Use log.debug
+ * @since https://github.com/louislam/uptime-kuma/pull/910
+ * @param msg
+ */
 function debug(msg) {
-    if (exports.isDev) {
-        console.log(msg);
-    }
+    exports.log.log("", msg, "debug");
 }
 exports.debug = debug;
+class Logger {
+    constructor() {
+        /**
+         * UPTIME_KUMA_HIDE_LOG=debug_monitor,info_monitor
+         *
+         * Example:
+         *  [
+         *     "debug_monitor",          // Hide all logs that level is debug and the module is monitor
+         *     "info_monitor",
+         *  ]
+         */
+        this.hideLog = {
+            info: [],
+            warn: [],
+            error: [],
+            debug: [],
+        };
+        if (typeof process !== "undefined" && process.env.UPTIME_KUMA_HIDE_LOG) {
+            let list = process.env.UPTIME_KUMA_HIDE_LOG.split(",").map(v => v.toLowerCase());
+            for (let pair of list) {
+                // split first "_" only
+                let values = pair.split(/_(.*)/s);
+                if (values.length >= 2) {
+                    this.hideLog[values[0]].push(values[1]);
+                }
+            }
+            this.debug("server", "UPTIME_KUMA_HIDE_LOG is set");
+            this.debug("server", this.hideLog);
+        }
+    }
+    log(module, msg, level) {
+        if (this.hideLog[level] && this.hideLog[level].includes(module)) {
+            return;
+        }
+        module = module.toUpperCase();
+        level = level.toUpperCase();
+        const now = new Date().toISOString();
+        const formattedMessage = (typeof msg === "string") ? `${now} [${module}] ${level}: ${msg}` : msg;
+        if (level === "INFO") {
+            console.info(formattedMessage);
+        }
+        else if (level === "WARN") {
+            console.warn(formattedMessage);
+        }
+        else if (level === "ERROR") {
+            console.error(formattedMessage);
+        }
+        else if (level === "DEBUG") {
+            if (exports.isDev) {
+                console.log(formattedMessage);
+            }
+        }
+        else {
+            console.log(formattedMessage);
+        }
+    }
+    info(module, msg) {
+        this.log(module, msg, "info");
+    }
+    warn(module, msg) {
+        this.log(module, msg, "warn");
+    }
+    error(module, msg) {
+        this.log(module, msg, "error");
+    }
+    debug(module, msg) {
+        this.log(module, msg, "debug");
+    }
+    exception(module, exception, msg) {
+        let finalMessage = exception;
+        if (msg) {
+            finalMessage = `${msg}: ${exception}`;
+        }
+        this.log(module, finalMessage, "error");
+    }
+}
+exports.log = new Logger();
 function polyfill() {
    /**
     * String.prototype.replaceAll() polyfill
@@ -121,13 +201,6 @@ let getRandomBytes = ((typeof window !== 'undefined' && window.crypto)
    : function () {
        return require("crypto").randomBytes;
    })();
-/**
- * Returns a random integer between min (inclusive) and max (exclusive).
- * @param {number} min The minimum value.
- * @param {number} max The maximum value.
- *
- * Generated by Trelent
- */
 function getCryptoRandomInt(min, max) {
    // synchronous version of: https://github.com/joepie91/node-random-number-csprng
    const range = max - min;
@@ -158,13 +231,6 @@ function getCryptoRandomInt(min, max) {
    }
 }
 exports.getCryptoRandomInt = getCryptoRandomInt;
-/**
- * Generates a random string of length `length` from the characters in `chars`.
- * @param {number} length The number of characters to generate.
- * @param {string} chars A string containing all the possible characters to use for generating the random string.
- *
- * Generated by Trelent
- */
 function genSecret(length = 64) {
    let secret = "";
    const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
--- a/src/util.ts
+++ b/src/util.ts
@@ -49,12 +49,105 @@ export function ucfirst(str: string) {
    return firstLetter.toUpperCase() + str.substr(1);
 }

+/**
+ * @deprecated Use log.debug
+ * @since https://github.com/louislam/uptime-kuma/pull/910
+ * @param msg
+ */
 export function debug(msg: any) {
-    if (isDev) {
-        console.log(msg);
+    log.log("", msg, "debug");
+}
+
+class Logger {
+
+    /**
+     * UPTIME_KUMA_HIDE_LOG=debug_monitor,info_monitor
+     *
+     * Example:
+     *  [
+     *     "debug_monitor",          // Hide all logs that level is debug and the module is monitor
+     *     "info_monitor",
+     *  ]
+     */
+    hideLog : any = {
+        info: [],
+        warn: [],
+        error: [],
+        debug: [],
+    };
+
+    constructor() {
+        if (typeof process !== "undefined" && process.env.UPTIME_KUMA_HIDE_LOG) {
+            let list = process.env.UPTIME_KUMA_HIDE_LOG.split(",").map(v => v.toLowerCase());
+
+            for (let pair of list) {
+                // split first "_" only
+                let values = pair.split(/_(.*)/s);
+
+                if (values.length >= 2) {
+                    this.hideLog[values[0]].push(values[1]);
+                }
+            }
+
+            this.debug("server", "UPTIME_KUMA_HIDE_LOG is set");
+            this.debug("server", this.hideLog);
+        }
+    }
+
+    log(module: string, msg: any, level: string) {
+        if (this.hideLog[level] && this.hideLog[level].includes(module)) {
+            return;
+        }
+
+        module = module.toUpperCase();
+        level = level.toUpperCase();
+
+        const now = new Date().toISOString();
+        const formattedMessage = (typeof msg === "string") ? `${now} [${module}] ${level}: ${msg}` : msg;
+
+        if (level === "INFO") {
+            console.info(formattedMessage);
+        } else if (level === "WARN") {
+            console.warn(formattedMessage);
+        } else if (level === "ERROR") {
+            console.error(formattedMessage);
+        } else if (level === "DEBUG") {
+            if (isDev) {
+                console.log(formattedMessage);
+            }
+        } else {
+            console.log(formattedMessage);
+        }
+    }
+
+    info(module: string, msg: any) {
+        this.log(module, msg, "info");
+    }
+
+    warn(module: string, msg: any) {
+        this.log(module, msg, "warn");
+    }
+
+   error(module: string, msg: any) {
+       this.log(module, msg, "error");
+    }
+
+   debug(module: string, msg: any) {
+       this.log(module, msg, "debug");
+    }
+
+    exception(module: string, exception: any, msg: any) {
+        let finalMessage = exception
+
+        if (msg) {
+            finalMessage = `${msg}: ${exception}`
+        }
+
+        this.log(module, finalMessage , "error");
    }
 }

+export const log = new Logger();

 declare global { interface String { replaceAll(str: string, newStr: string): string; } }