Merge branch 'master' into feature/mariadb-add-connection-socket-config

.github/workflows/auto-test.yml

@@ -1,5 +1,9 @@
 name: Auto Test
 
+concurrency:
+  group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}-server
+  cancel-in-progress: true
+
 on:
   push:
     branches: [master, 1.23.X, 3.0.0]

db/knex_migrations/2025-12-31-2143-add-snmp-v3-username.js

@@ -0,0 +1,11 @@
+exports.up = async function (knex) {
+    await knex.schema.alterTable("monitor", (table) => {
+        table.string("snmp_v3_username", 255);
+    });
+};
+
+exports.down = async function (knex) {
+    await knex.schema.alterTable("monitor", (table) => {
+        table.dropColumn("snmp_v3_username");
+    });
+};

db/knex_migrations/2026-01-16-0000-add-screenshot-delay.js

@@ -0,0 +1,11 @@
+exports.up = function (knex) {
+    return knex.schema.alterTable("monitor", function (table) {
+        table.integer("screenshot_delay").notNullable().unsigned().defaultTo(0);
+    });
+};
+
+exports.down = function (knex) {
+    return knex.schema.alterTable("monitor", function (table) {
+        table.dropColumn("screenshot_delay");
+    });
+};

package.json

@@ -207,7 +207,7 @@
         "stylelint-config-standard": "~25.0.0",
         "terser": "~5.15.0",
         "test": "~3.3.0",
-        "testcontainers": "^10.13.1",
+        "testcontainers": "^11.5.0",
         "typescript": "~4.4.4",
         "v-pagination-3": "~0.1.7",
         "vite": "~5.4.15",

server/analytics/plausible-analytics.js

@@ -5,7 +5,7 @@ const { escape } = require("html-escaper");
  * Returns a string that represents the javascript that is required to insert the Plausible Analytics script
  * into a webpage.
  * @param {string} scriptUrl the Plausible Analytics script url.
- * @param {string} domainsToMonitor Domains to track seperated by a ',' to add Plausible Analytics script.
+ * @param {string} domainsToMonitor Domains to track separated by a ',' to add Plausible Analytics script.
  * @returns {string} HTML script tags to inject into page
  */
 function getPlausibleAnalyticsScript(scriptUrl, domainsToMonitor) {

server/model/domain_expiry.js

@@ -30,10 +30,13 @@ async function getRdapServer(tld) {
         return null;
     }
 
-    for (const service of rdapList["services"]) {
-        const [tlds, urls] = service;
-        if (tlds.includes(tld)) {
-            return urls[0];
+    const services = rdapList["services"] ?? [];
+    const rootTld = tld?.split(".").pop();
+    if (rootTld) {
+        for (const [tlds, urls] of services) {
+            if (tlds.includes(rootTld)) {
+                return urls[0];
+            }
         }
     }
     log.debug("rdap", `No RDAP server found for TLD ${tld}`);
@@ -173,16 +176,18 @@ class DomainExpiry extends BeanModel {
             });
         }
 
-        const rdap = await getRdapServer(tld.publicSuffix);
+        const publicSuffix = tld.publicSuffix;
+        const rootTld = publicSuffix.split(".").pop();
+        const rdap = await getRdapServer(publicSuffix);
         if (!rdap) {
             throw new TranslatableError("domain_expiry_unsupported_unsupported_tld_no_rdap_endpoint", {
-                publicSuffix: tld.publicSuffix,
+                publicSuffix,
             });
         }
 
         return {
             domain: tld.domain,
-            tld: tld.publicSuffix,
+            tld: rootTld,
         };
     }
 

server/model/monitor.js

@@ -1764,6 +1764,28 @@ class Monitor extends BeanModel {
                 this.timeout = pingGlobalTimeout;
             }
         }
+
+        if (this.type === "real-browser") {
+            // screenshot_delay validation
+            if (this.screenshot_delay !== undefined && this.screenshot_delay !== null) {
+                const delay = Number(this.screenshot_delay);
+                if (isNaN(delay) || delay < 0) {
+                    throw new Error("Screenshot delay must be a non-negative number");
+                }
+
+                // Must not exceed 0.8 * timeout (page.goto timeout is interval * 1000 * 0.8)
+                const maxDelayFromTimeout = this.interval * 1000 * 0.8;
+                if (delay >= maxDelayFromTimeout) {
+                    throw new Error(`Screenshot delay must be less than ${maxDelayFromTimeout}ms (0.8 × interval)`);
+                }
+
+                // Must not exceed 0.5 * interval to prevent blocking next check
+                const maxDelayFromInterval = this.interval * 1000 * 0.5;
+                if (delay >= maxDelayFromInterval) {
+                    throw new Error(`Screenshot delay must be less than ${maxDelayFromInterval}ms (0.5 × interval)`);
+                }
+            }
+        }
     }
 
     /**

server/monitor-types/real-browser-monitor-type.js

@@ -269,6 +269,11 @@ class RealBrowserMonitorType extends MonitorType {
             timeout: monitor.interval * 1000 * 0.8,
         });
 
+        // Wait for additional time before taking screenshot if configured
+        if (monitor.screenshot_delay > 0) {
+            await page.waitForTimeout(monitor.screenshot_delay);
+        }
+
         let filename = jwt.sign(monitor.id, server.jwtSecret) + ".png";
 
         await page.screenshot({

server/monitor-types/snmp.js

@@ -17,7 +17,22 @@ class SNMPMonitorType extends MonitorType {
                 timeout: monitor.timeout * 1000,
                 version: snmp.Version[monitor.snmpVersion],
             };
-            session = snmp.createSession(monitor.hostname, monitor.radiusPassword, sessionOptions);
+
+            if (monitor.snmpVersion === "3") {
+                if (!monitor.snmp_v3_username) {
+                    throw new Error("SNMPv3 username is required");
+                }
+                // SNMPv3 currently defaults to noAuthNoPriv.
+                // Supporting authNoPriv / authPriv requires additional inputs
+                // (auth/priv protocols, passwords), validation, secure storage,
+                // and database migrations, which is intentionally left for
+                // a follow-up PR to keep this change scoped.
+                sessionOptions.securityLevel = snmp.SecurityLevel.noAuthNoPriv;
+                sessionOptions.username = monitor.snmp_v3_username;
+                session = snmp.createV3Session(monitor.hostname, monitor.snmp_v3_username, sessionOptions);
+            } else {
+                session = snmp.createSession(monitor.hostname, monitor.radiusPassword, sessionOptions);
+            }
 
             // Handle errors during session creation
             session.on("error", (error) => {

server/notification-providers/wecom.js

@@ -18,7 +18,7 @@ class WeCom extends NotificationProvider {
                 },
             };
             config = this.getAxiosConfigWithProxy(config);
-            let body = this.composeMessage(heartbeatJSON, msg);
+            let body = this.composeMessage(notification, heartbeatJSON, msg);
             await axios.post(
                 `https://qyapi.weixin.qq.com/cgi-bin/webhook/send?key=${notification.weComBotKey}`,
                 body,
@@ -32,11 +32,12 @@ class WeCom extends NotificationProvider {
 
     /**
      * Generate the message to send
+     * @param {object} notification Notification configuration
      * @param {object} heartbeatJSON Heartbeat details (For Up/Down only)
      * @param {string} msg General message
      * @returns {object} Message
      */
-    composeMessage(heartbeatJSON, msg) {
+    composeMessage(notification, heartbeatJSON, msg) {
         let title = "UptimeKuma Message";
         if (msg != null && heartbeatJSON != null && heartbeatJSON["status"] === UP) {
             title = "UptimeKuma Monitor Up";
@@ -44,11 +45,26 @@ class WeCom extends NotificationProvider {
         if (msg != null && heartbeatJSON != null && heartbeatJSON["status"] === DOWN) {
             title = "UptimeKuma Monitor Down";
         }
+
+        let textObj = {
+            content: title + "\n" + msg,
+        };
+
+        // Handle mentioned_mobile_list if configured
+        if (notification.weComMentionedMobileList?.trim()) {
+            let mentionedMobiles = notification.weComMentionedMobileList
+                .split(",")
+                .map((mobile) => mobile.trim())
+                .filter((mobile) => mobile.length > 0);
+
+            if (mentionedMobiles.length > 0) {
+                textObj.mentioned_mobile_list = mentionedMobiles;
+            }
+        }
+
         return {
             msgtype: "text",
-            text: {
-                content: title + "\n" + msg,
-            },
+            text: textObj,
         };
     }
 }

src/components/MonitorList.vue

@@ -1,8 +1,24 @@
 <template>
-    <div class="shadow-box mb-3" :style="boxStyle">
+    <div class="shadow-box mb-3 p-0" :style="boxStyle">
         <div class="list-header">
-            <div class="header-top">
-                <div class="select-checkbox-wrapper">
+            <!-- Line 1: Checkbox + Status + Tags + Search Bar -->
+            <div class="filter-row">
+                <div class="search-wrapper">
+                    <a v-if="searchText != ''" class="search-icon" @click="clearSearchText">
+                        <font-awesome-icon icon="times" />
+                    </a>
+                    <form @submit.prevent>
+                        <input
+                            v-model="searchText"
+                            class="form-control search-input"
+                            :placeholder="$t('Search...')"
+                            :aria-label="$t('Search monitored sites')"
+                            autocomplete="off"
+                        />
+                    </form>
+                </div>
+
+                <div class="filters-group">
                     <input
                         v-if="!selectMode"
                         v-model="selectMode"
@@ -18,33 +34,23 @@
                         type="checkbox"
                         :aria-label="selectAll ? $t('deselectAllMonitorsAria') : $t('selectAllMonitorsAria')"
                     />
-                </div>
 
-                <div class="header-filter">
-                    <MonitorListFilter :filterState="filterState" @update-filter="updateFilter" />
-                </div>
-
-                <div class="search-wrapper ms-auto">
-                    <a v-if="searchText != ''" class="search-icon" @click="clearSearchText">
-                        <font-awesome-icon icon="times" />
-                    </a>
-                    <form>
-                        <input
-                            v-model="searchText"
-                            class="form-control search-input"
-                            :placeholder="$t('Search...')"
-                            :aria-label="$t('Search monitored sites')"
-                            autocomplete="off"
-                        />
-                    </form>
+                    <MonitorListFilter
+                        :filterState="filterState"
+                        :allCollapsed="allGroupsCollapsed"
+                        :hasGroups="groupMonitors.length >= 2"
+                        @update-filter="updateFilter"
+                        @toggle-collapse-all="toggleCollapseAll"
+                    />
                 </div>
             </div>
 
-            <div v-if="selectMode && selectedMonitorCount > 0" class="selected-count-row">
+            <!-- Line 2: Cancel + Actions (shown when selection mode is active) -->
+            <div v-if="selectMode && selectedMonitorCount > 0" class="selection-row">
                 <button class="btn btn-outline-normal" @click="cancelSelectMode">
                     {{ $t("Cancel") }}
                 </button>
-                <div class="actions-wrapper ms-2">
+                <div class="actions-wrapper">
                     <div class="dropdown">
                         <button
                             class="btn btn-outline-normal dropdown-toggle"
@@ -82,14 +88,14 @@
                         </ul>
                     </div>
                 </div>
-                <span class="selected-count ms-2">
+                <span class="selected-count">
                     {{ $t("selectedMonitorCountMsg", selectedMonitorCount) }}
                 </span>
             </div>
         </div>
         <div
             ref="monitorList"
-            class="monitor-list"
+            class="monitor-list px-2"
             :class="{ scrollbar: scrollbar }"
             :style="monitorListStyle"
             data-testid="monitor-list"
@@ -100,8 +106,8 @@
             </div>
 
             <MonitorListItem
-                v-for="(item, index) in sortedMonitorList"
-                :key="index"
+                v-for="item in sortedMonitorList"
+                :key="`${item.id}-${collapseKey}`"
                 :monitor="item"
                 :isSelectMode="selectMode"
                 :isSelected="isSelected"
@@ -154,6 +160,7 @@ export default {
                 active: null,
                 tags: null,
             },
+            collapseKey: 0,
         };
     },
     computed: {
@@ -229,6 +236,38 @@ export default {
                 this.searchText !== ""
             );
         },
+
+        /**
+         * Gets all group monitors at root level that have children
+         * @returns {Array} Array of group monitors with children
+         */
+        groupMonitors() {
+            const monitors = Object.values(this.$root.monitorList);
+            return monitors.filter(
+                (m) => m.type === "group" && m.parent === null && monitors.some((child) => child.parent === m.id)
+            );
+        },
+
+        /**
+         * Determines if all groups are collapsed.
+         * Note: collapseKey is included to force re-computation when toggleCollapseAll()
+         * updates localStorage, since Vue cannot detect localStorage changes.
+         * @returns {boolean} True if all groups are collapsed
+         */
+        allGroupsCollapsed() {
+            // collapseKey forces this computed to re-evaluate after localStorage updates
+            if (this.collapseKey < 0 || this.groupMonitors.length === 0) {
+                return true;
+            }
+
+            const storage = window.localStorage.getItem("monitorCollapsed");
+            if (storage === null) {
+                return true; // Default is collapsed
+            }
+
+            const storageObject = JSON.parse(storage);
+            return this.groupMonitors.every((group) => storageObject[`monitor_${group.id}`] !== false);
+        },
     },
     watch: {
         searchText() {
@@ -303,6 +342,26 @@ export default {
         updateFilter(newFilter) {
             this.filterState = newFilter;
         },
+        /**
+         * Toggle collapse state for all group monitors
+         * @returns {void}
+         */
+        toggleCollapseAll() {
+            const shouldCollapse = !this.allGroupsCollapsed;
+
+            let storageObject = {};
+            const storage = window.localStorage.getItem("monitorCollapsed");
+            if (storage !== null) {
+                storageObject = JSON.parse(storage);
+            }
+
+            this.groupMonitors.forEach((group) => {
+                storageObject[`monitor_${group.id}`] = shouldCollapse;
+            });
+
+            window.localStorage.setItem("monitorCollapsed", JSON.stringify(storageObject));
+            this.collapseKey++;
+        },
         /**
          * Deselect a monitor
          * @param {number} id ID of monitor
@@ -536,9 +595,11 @@ export default {
 .list-header {
     border-bottom: 1px solid #dee2e6;
     border-radius: 10px 10px 0 0;
-    margin: -10px;
     margin-bottom: 10px;
     padding: 10px;
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
 
     .dark & {
         background-color: $dark-header-bg;
@@ -546,37 +607,26 @@ export default {
     }
 }
 
-.search-row {
-    display: flex;
-    padding: 10px;
-    padding-bottom: 5px;
-}
-
-.header-top {
+.filter-row {
     display: flex;
     justify-content: flex-start;
     align-items: center;
     gap: 8px;
-    padding: 10px;
-
-    @media (max-width: 549px), (min-width: 770px) and (max-width: 1149px), (min-width: 1200px) and (max-width: 1499px) {
-        flex-wrap: wrap;
-    }
-}
-
-.select-checkbox-wrapper {
-    display: flex;
-    align-items: center;
+    flex-wrap: nowrap;
+    width: 100%;
 
     .form-check-input {
         cursor: pointer;
         margin: 0;
+        margin-left: 6px;
+        flex-shrink: 0;
     }
 }
 
-.header-filter {
+.filters-group {
     display: flex;
     align-items: center;
+    gap: 8px;
 }
 
 .actions-wrapper {
@@ -643,6 +693,13 @@ export default {
     }
 }
 
+.selection-row {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    width: 100%;
+}
+
 .selected-count {
     white-space: nowrap;
     font-size: 0.9em;
@@ -653,8 +710,7 @@ export default {
     }
 }
 
-.selected-count-row {
-    padding: 5px 10px 0 10px;
+.actions-row {
     display: flex;
     align-items: center;
 }
@@ -677,11 +733,29 @@ export default {
     }
 }
 
+@media (max-width: 975px) {
+    .filter-row {
+        flex-direction: column-reverse;
+        align-items: stretch;
+        gap: 8px;
+    }
+
+    .search-wrapper {
+        width: 100% !important;
+        max-width: 100% !important;
+        margin-left: 0 !important;
+        flex: 1 1 100%;
+    }
+
+    .filters-group {
+        width: 100%;
+    }
+}
+
 @media (max-width: 770px) {
     .list-header {
-        margin: -20px;
         margin-bottom: 10px;
-        padding: 5px;
+        padding: 20px;
     }
 }
 
@@ -689,15 +763,14 @@ export default {
     display: flex;
     align-items: center;
     position: relative;
+    flex: 1 1 auto;
+    min-width: 0;
+    max-width: 300px;
+    margin-left: auto;
+    order: 1;
 
-    @media (max-width: 549px), (min-width: 770px) and (max-width: 1149px), (min-width: 1200px) and (max-width: 1499px) {
-        order: -1;
+    form {
         width: 100%;
-        margin-bottom: 8px;
-
-        form {
-            width: 100%;
-        }
     }
 }
 
@@ -715,13 +788,9 @@ export default {
 }
 
 .search-input {
-    max-width: 15em;
+    width: 100%;
     padding-right: 30px;
-
-    @media (max-width: 549px), (min-width: 770px) and (max-width: 1149px), (min-width: 1200px) and (max-width: 1499px) {
-        max-width: 100%;
-        width: 100%;
-    }
+    transition: none !important;
 }
 
 .monitor-item {

src/components/MonitorListFilter.vue

@@ -1,139 +1,151 @@
 <template>
-    <div class="d-flex align-items-center flex-wrap gap-1">
-        <MonitorListFilterDropdown :filterActive="filterState.status?.length > 0">
-            <template #status>
-                <Status v-if="filterState.status?.length === 1" :status="filterState.status[0]" />
-                <span v-else>
-                    {{ $t("Status") }}
-                </span>
-            </template>
-            <template #dropdown>
-                <li>
-                    <div class="dropdown-item" tabindex="0" @click.stop="toggleStatusFilter(1)">
-                        <div class="d-flex align-items-center justify-content-between">
-                            <Status :status="1" />
-                            <span class="ps-3">
-                                {{ $root.stats.up }}
-                                <span v-if="filterState.status?.includes(1)" class="px-1 filter-active">
-                                    <font-awesome-icon icon="check" />
-                                </span>
+    <MonitorListFilterDropdown :filterActive="filterState.status?.length > 0 || filterState.active?.length > 0">
+        <template #status>
+            <Status
+                v-if="filterState.status?.length === 1 && !filterState.active?.length"
+                :status="filterState.status[0]"
+            />
+            <span
+                v-else-if="!filterState.status?.length && filterState.active?.length === 1"
+                class="badge status-pill"
+                :class="filterState.active[0] ? 'running' : 'paused'"
+            >
+                <font-awesome-icon :icon="filterState.active[0] ? 'play' : 'pause'" class="icon-small" />
+                {{ filterState.active[0] ? $t("Running") : $t("filterActivePaused") }}
+            </span>
+            <span v-else>
+                {{ $t("Status") }}
+            </span>
+        </template>
+        <template #dropdown>
+            <li>
+                <div class="dropdown-item" tabindex="0" @click.stop="toggleStatusFilter(1)">
+                    <div class="d-flex align-items-center justify-content-between">
+                        <Status :status="1" />
+                        <span class="ps-3">
+                            {{ $root.stats.up }}
+                            <span v-if="filterState.status?.includes(1)" class="px-1 filter-active">
+                                <font-awesome-icon icon="check" />
                             </span>
-                        </div>
+                        </span>
                     </div>
-                </li>
-                <li>
-                    <div class="dropdown-item" tabindex="0" @click.stop="toggleStatusFilter(0)">
-                        <div class="d-flex align-items-center justify-content-between">
-                            <Status :status="0" />
-                            <span class="ps-3">
-                                {{ $root.stats.down }}
-                                <span v-if="filterState.status?.includes(0)" class="px-1 filter-active">
-                                    <font-awesome-icon icon="check" />
-                                </span>
+                </div>
+            </li>
+            <li>
+                <div class="dropdown-item" tabindex="0" @click.stop="toggleStatusFilter(0)">
+                    <div class="d-flex align-items-center justify-content-between">
+                        <Status :status="0" />
+                        <span class="ps-3">
+                            {{ $root.stats.down }}
+                            <span v-if="filterState.status?.includes(0)" class="px-1 filter-active">
+                                <font-awesome-icon icon="check" />
                             </span>
-                        </div>
+                        </span>
                     </div>
-                </li>
-                <li>
-                    <div class="dropdown-item" tabindex="0" @click.stop="toggleStatusFilter(2)">
-                        <div class="d-flex align-items-center justify-content-between">
-                            <Status :status="2" />
-                            <span class="ps-3">
-                                {{ $root.stats.pending }}
-                                <span v-if="filterState.status?.includes(2)" class="px-1 filter-active">
-                                    <font-awesome-icon icon="check" />
-                                </span>
+                </div>
+            </li>
+            <li>
+                <div class="dropdown-item" tabindex="0" @click.stop="toggleStatusFilter(2)">
+                    <div class="d-flex align-items-center justify-content-between">
+                        <Status :status="2" />
+                        <span class="ps-3">
+                            {{ $root.stats.pending }}
+                            <span v-if="filterState.status?.includes(2)" class="px-1 filter-active">
+                                <font-awesome-icon icon="check" />
                             </span>
-                        </div>
+                        </span>
                     </div>
-                </li>
-                <li>
-                    <div class="dropdown-item" tabindex="0" @click.stop="toggleStatusFilter(3)">
-                        <div class="d-flex align-items-center justify-content-between">
-                            <Status :status="3" />
-                            <span class="ps-3">
-                                {{ $root.stats.maintenance }}
-                                <span v-if="filterState.status?.includes(3)" class="px-1 filter-active">
-                                    <font-awesome-icon icon="check" />
-                                </span>
+                </div>
+            </li>
+            <li>
+                <div class="dropdown-item" tabindex="0" @click.stop="toggleStatusFilter(3)">
+                    <div class="d-flex align-items-center justify-content-between">
+                        <Status :status="3" />
+                        <span class="ps-3">
+                            {{ $root.stats.maintenance }}
+                            <span v-if="filterState.status?.includes(3)" class="px-1 filter-active">
+                                <font-awesome-icon icon="check" />
                             </span>
-                        </div>
+                        </span>
                     </div>
-                </li>
-            </template>
-        </MonitorListFilterDropdown>
-        <MonitorListFilterDropdown :filterActive="filterState.active?.length > 0">
-            <template #status>
-                <span v-if="filterState.active?.length === 1">
-                    <span v-if="filterState.active[0]">{{ $t("Running") }}</span>
-                    <span v-else>{{ $t("filterActivePaused") }}</span>
-                </span>
-                <span v-else>
-                    {{ $t("filterActive") }}
-                </span>
-            </template>
-            <template #dropdown>
-                <li>
-                    <div class="dropdown-item" tabindex="0" @click.stop="toggleActiveFilter(true)">
-                        <div class="d-flex align-items-center justify-content-between">
-                            <span>{{ $t("Running") }}</span>
-                            <span class="ps-3">
-                                {{ $root.stats.active }}
-                                <span v-if="filterState.active?.includes(true)" class="px-1 filter-active">
-                                    <font-awesome-icon icon="check" />
-                                </span>
+                </div>
+            </li>
+            <li><hr class="dropdown-divider" /></li>
+            <li>
+                <div class="dropdown-item" tabindex="0" @click.stop="toggleActiveFilter(true)">
+                    <div class="d-flex align-items-center justify-content-between">
+                        <span class="badge status-pill running">
+                            <font-awesome-icon icon="play" class="icon-small" />
+                            {{ $t("Running") }}
+                        </span>
+                        <span class="ps-3">
+                            {{ $root.stats.active }}
+                            <span v-if="filterState.active?.includes(true)" class="px-1 filter-active">
+                                <font-awesome-icon icon="check" />
                             </span>
-                        </div>
+                        </span>
                     </div>
-                </li>
-                <li>
-                    <div class="dropdown-item" tabindex="0" @click.stop="toggleActiveFilter(false)">
-                        <div class="d-flex align-items-center justify-content-between">
-                            <span>{{ $t("filterActivePaused") }}</span>
-                            <span class="ps-3">
-                                {{ $root.stats.pause }}
-                                <span v-if="filterState.active?.includes(false)" class="px-1 filter-active">
-                                    <font-awesome-icon icon="check" />
-                                </span>
+                </div>
+            </li>
+            <li>
+                <div class="dropdown-item" tabindex="0" @click.stop="toggleActiveFilter(false)">
+                    <div class="d-flex align-items-center justify-content-between">
+                        <span class="badge status-pill paused">
+                            <font-awesome-icon icon="pause" class="icon-small" />
+                            {{ $t("filterActivePaused") }}
+                        </span>
+                        <span class="ps-3">
+                            {{ $root.stats.pause }}
+                            <span v-if="filterState.active?.includes(false)" class="px-1 filter-active">
+                                <font-awesome-icon icon="check" />
                             </span>
-                        </div>
+                        </span>
                     </div>
-                </li>
-            </template>
-        </MonitorListFilterDropdown>
-        <MonitorListFilterDropdown :filterActive="filterState.tags?.length > 0">
-            <template #status>
-                <Tag
-                    v-if="filterState.tags?.length === 1"
-                    :item="tagsList.find((tag) => tag.id === filterState.tags[0])"
-                    :size="'sm'"
-                />
-                <span v-else>
-                    {{ $t("Tags") }}
-                </span>
-            </template>
-            <template #dropdown>
-                <li v-for="tag in tagsList" :key="tag.id">
-                    <div class="dropdown-item" tabindex="0" @click.stop="toggleTagFilter(tag)">
-                        <div class="d-flex align-items-center justify-content-between">
-                            <span><Tag :item="tag" :size="'sm'" /></span>
-                            <span class="ps-3">
-                                {{ getTaggedMonitorCount(tag) }}
-                                <span v-if="filterState.tags?.includes(tag.id)" class="px-1 filter-active">
-                                    <font-awesome-icon icon="check" />
-                                </span>
+                </div>
+            </li>
+        </template>
+    </MonitorListFilterDropdown>
+    <MonitorListFilterDropdown :filterActive="filterState.tags?.length > 0">
+        <template #status>
+            <Tag
+                v-if="filterState.tags?.length === 1"
+                :item="tagsList.find((tag) => tag.id === filterState.tags[0])"
+                :size="'sm'"
+            />
+            <span v-else>
+                {{ $t("Tags") }}
+            </span>
+        </template>
+        <template #dropdown>
+            <li v-for="tag in tagsList" :key="tag.id">
+                <div class="dropdown-item" tabindex="0" @click.stop="toggleTagFilter(tag)">
+                    <div class="d-flex align-items-center justify-content-between">
+                        <span><Tag :item="tag" :size="'sm'" /></span>
+                        <span class="ps-3">
+                            {{ getTaggedMonitorCount(tag) }}
+                            <span v-if="filterState.tags?.includes(tag.id)" class="px-1 filter-active">
+                                <font-awesome-icon icon="check" />
                             </span>
-                        </div>
+                        </span>
                     </div>
-                </li>
-                <li v-if="tagsList.length === 0">
-                    <div class="dropdown-item disabled px-3">
-                        {{ $t("No tags found.") }}
-                    </div>
-                </li>
-            </template>
-        </MonitorListFilterDropdown>
-    </div>
+                </div>
+            </li>
+            <li v-if="tagsList.length === 0">
+                <div class="dropdown-item disabled px-3">
+                    {{ $t("No tags found.") }}
+                </div>
+            </li>
+        </template>
+    </MonitorListFilterDropdown>
+    <button
+        v-if="hasGroups"
+        type="button"
+        class="btn btn-outline-normal btn-collapse-all"
+        :title="allCollapsed ? $t('Expand All Groups') : $t('Collapse All Groups')"
+        @click="$emit('toggle-collapse-all')"
+    >
+        <font-awesome-icon :icon="allCollapsed ? 'folder' : 'folder-open'" fixed-width />
+    </button>
 </template>
 
 <script>
@@ -152,8 +164,16 @@ export default {
             type: Object,
             required: true,
         },
+        allCollapsed: {
+            type: Boolean,
+            default: true,
+        },
+        hasGroups: {
+            type: Boolean,
+            default: false,
+        },
     },
-    emits: ["updateFilter"],
+    emits: ["updateFilter", "toggle-collapse-all"],
     data() {
         return {
             tagsList: [],
@@ -252,6 +272,17 @@ export default {
     cursor: pointer;
 }
 
+.simple-status {
+    min-width: 64px;
+    border: 1px solid #d1d5db;
+    background-color: transparent !important;
+    color: inherit !important;
+
+    .dark & {
+        border-color: #6b7280;
+    }
+}
+
 .clear-filters-btn {
     font-size: 0.8em;
     margin-right: 5px;
@@ -275,4 +306,41 @@ export default {
         }
     }
 }
+
+.dropdown-divider {
+    margin: 0.5rem 0;
+    border-top: 1px solid #d1d5db;
+
+    .dark & {
+        border-top-color: #6b7280;
+    }
+}
+
+.status-pill {
+    min-width: 64px;
+    display: inline-block;
+    text-align: center;
+
+    &.running,
+    &.paused {
+        background-color: white !important;
+        border: 1px solid #d1d5db;
+        color: inherit;
+
+        .dark & {
+            background-color: transparent !important;
+            border-color: #6b7280;
+            color: $dark-font-color;
+        }
+
+        .icon-small {
+            font-size: 0.75em;
+            margin-right: 4px;
+        }
+    }
+}
+
+.btn-collapse-all {
+    transition: none !important;
+}
 </style>

src/components/MonitorListFilterDropdown.vue

@@ -103,7 +103,7 @@ export default {
     @extend .btn-outline-normal;
     display: flex;
     align-items: center;
-    margin-left: 5px;
+    margin-left: 0;
     color: $link-color;
 
     .dark & {

src/components/MonitorListItem.vue

@@ -24,12 +24,12 @@
             <router-link :to="monitorURL(monitor.id)" class="item" :class="{ disabled: !monitor.active }">
                 <div class="row">
                     <div
-                        class="col-9 col-xl-6 small-padding"
+                        class="col-9 col-xl-6 small-padding d-flex align-items-center"
                         :class="{
                             'monitor-item': $root.userHeartbeatBar == 'bottom' || $root.userHeartbeatBar == 'none',
                         }"
                     >
-                        <div class="info">
+                        <div class="info d-flex align-items-center gap-2">
                             <Uptime :monitor="monitor" type="24" :pill="true" />
                             <span v-if="hasChildren" class="collapse-padding" @click.prevent="changeCollapsed">
                                 <font-awesome-icon
@@ -383,6 +383,7 @@ export default {
 
     /* We don't want the padding change due to the border animated */
     .item {
+        padding: 12px 15px;
         transition: none !important;
     }
 

src/components/notifications/WeCom.vue

@@ -23,4 +23,16 @@
             </a>
         </i18n-t>
     </div>
+
+    <div class="mb-3">
+        <label for="wecom-mentioned-mobile-list" class="form-label">{{ $t("WeCom Mentioned Mobile List") }}</label>
+        <input
+            id="wecom-mentioned-mobile-list"
+            v-model="$parent.notification.weComMentionedMobileList"
+            type="text"
+            class="form-control"
+            placeholder="13800001111,13900002222,@all"
+        />
+        <p class="form-text">{{ $t("WeCom Mentioned Mobile List Description") }}</p>
+    </div>
 </template>

src/icon.js

@@ -53,6 +53,8 @@ import {
     faInfoCircle,
     faClone,
     faCertificate,
+    faFolder,
+    faFolderOpen,
 } from "@fortawesome/free-solid-svg-icons";
 
 library.add(
@@ -103,6 +105,8 @@ library.add(
     faInfoCircle,
     faClone,
     faCertificate,
+    faFolder,
+    faFolderOpen,
 );
 
 export { FontAwesomeIcon };

src/lang/en.json

@@ -39,7 +39,7 @@
     "General Monitor Type": "General Monitor Type",
     "Passive Monitor Type": "Passive Monitor Type",
     "Specific Monitor Type": "Specific Monitor Type",
-    "markdownSupported": "Markdown syntax supported",
+    "markdownSupported": "Markdown syntax supported. If using HTML, avoid leading spaces to prevent formatting issues.",
     "pauseDashboardHome": "Pause",
     "Pause": "Pause",
     "Name": "Name",
@@ -793,6 +793,8 @@
     "Retry": "Retry",
     "Topic": "Topic",
     "WeCom Bot Key": "WeCom Bot Key",
+    "WeCom Mentioned Mobile List": "WeCom Mentioned Mobile List",
+    "WeCom Mentioned Mobile List Description": "Enter phone numbers to mention. Separate multiple numbers with commas. Use {'@'}all to mention everyone.",
     "Setup Proxy": "Set Up Proxy",
     "Proxy Protocol": "Proxy Protocol",
     "Proxy Server": "Proxy Server",
@@ -1055,6 +1057,10 @@
     "remoteBrowserToggle": "By default Chromium runs inside the Uptime Kuma container. You can use a remote browser by toggling this switch.",
     "useRemoteBrowser": "Use a Remote Browser",
     "deleteRemoteBrowserMessage": "Are you sure want to delete this Remote Browser for all monitors?",
+    "Screenshot Delay": "Screenshot Delay (waits {milliseconds})",
+    "milliseconds": "{n} millisecond | {n} milliseconds",
+    "screenshotDelayDescription": "Optionally wait this many milliseconds before taking the screenshot. Maximum: {maxValueMs}ms (0.5 × interval).",
+    "screenshotDelayWarning": "Higher values keep the browser open longer, which may increase memory usage with many concurrent monitors.",
     "GrafanaOncallUrl": "Grafana Oncall URL",
     "systemService": "System Service",
     "systemServiceName": "Service Name",
@@ -1105,6 +1111,7 @@
     "snmpCommunityStringHelptext": "This string functions as a password to authenticate and control access to SNMP-enabled devices. Match it with your SNMP device's configuration.",
     "OID (Object Identifier)": "OID (Object Identifier)",
     "snmpOIDHelptext": "Enter the OID for the sensor or status you want to monitor. Use network management tools like MIB browsers or SNMP software if you're unsure about the OID.",
+    "snmpV3Username": "SNMPv3 Username",
     "Condition": "Condition",
     "SNMP Version": "SNMP Version",
     "Please enter a valid OID.": "Please enter a valid OID.",
@@ -1362,5 +1369,7 @@
     "None (Successful Connection)": "None (Successful Connection)",
     "expectedTlsAlertDescription": "Select the TLS alert you expect the server to return. Use {code} to verify mTLS endpoints reject connections without client certificates. See {link} for details.",
     "TLS Alert Spec": "RFC 8446",
-    "mariadbSocketPathDetectedHelptext": "environment variable detected, Hostname and Port will be ignored."
+    "mariadbSocketPathDetectedHelptext": "environment variable detected, Hostname and Port will be ignored.",
+    "Expand All Groups": "Expand All Groups",
+    "Collapse All Groups": "Collapse All Groups"
 }

src/pages/Dashboard.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="container-fluid">
         <div class="row">
-            <div v-if="!$root.isMobile" class="col-12 col-md-5 col-xl-4">
+            <div v-if="!$root.isMobile" class="col-12 col-md-5 col-xl-4 ps-0">
                 <div>
                     <router-link to="/add" class="btn btn-primary mb-3">
                         <font-awesome-icon icon="plus" />

src/pages/DashboardHome.vue

@@ -5,7 +5,7 @@
                 {{ $t("Quick Stats") }}
             </h1>
 
-            <div class="shadow-box big-padding text-center mb-4">
+            <div class="shadow-box big-padding text-center mb-3">
                 <div class="row">
                     <div class="col">
                         <h3>{{ $t("Up") }}</h3>

src/pages/EditMonitor.vue

@@ -511,8 +511,23 @@
                                 <select id="snmp_version" v-model="monitor.snmpVersion" class="form-select">
                                     <option value="1">SNMPv1</option>
                                     <option value="2c">SNMPv2c</option>
+                                    <option value="3">SNMPv3</option>
                                 </select>
                             </div>
+                            <div v-if="monitor.type === 'snmp' && monitor.snmpVersion === '3'" class="my-3">
+                                <label for="snmp_v3_username" class="form-label">
+                                    {{ $t("snmpV3Username") }}
+                                </label>
+
+                                <input
+                                    id="snmp_v3_username"
+                                    v-model="monitor.snmpV3Username"
+                                    type="text"
+                                    class="form-control"
+                                    placeholder="SNMPv3 username"
+                                    required
+                                />
+                            </div>
 
                             <div v-if="monitor.type === 'smtp'" class="my-3">
                                 <label for="smtp_security" class="form-label">{{ $t("SMTP Security") }}</label>
@@ -1263,6 +1278,36 @@
                                 <div class="form-text"></div>
                             </div>
 
+                            <!-- Screenshot Delay - Real Browser only -->
+                            <div v-if="monitor.type === 'real-browser'" class="my-3">
+                                <label for="screenshot-delay" class="form-label">
+                                    {{
+                                        $t("Screenshot Delay", {
+                                            milliseconds: $t("milliseconds", monitor.screenshot_delay),
+                                        })
+                                    }}
+                                </label>
+                                <input
+                                    id="screenshot-delay"
+                                    v-model="monitor.screenshot_delay"
+                                    type="number"
+                                    class="form-control"
+                                    min="0"
+                                    :max="Math.floor(monitor.interval * 1000 * 0.5)"
+                                    step="100"
+                                />
+                                <div class="form-text">
+                                    {{
+                                        $t("screenshotDelayDescription", {
+                                            maxValueMs: Math.floor(monitor.interval * 1000 * 0.5),
+                                        })
+                                    }}
+                                </div>
+                                <div v-if="monitor.screenshot_delay" class="form-text text-warning">
+                                    {{ $t("screenshotDelayWarning") }}
+                                </div>
+                            </div>
+
                             <div v-if="showDomainExpiryNotification" class="my-3 form-check">
                                 <input
                                     id="domain-expiry-notification"
@@ -2293,6 +2338,7 @@ const monitorDefaults = {
     kafkaProducerAllowAutoTopicCreation: false,
     gamedigGivenPortOnly: true,
     remote_browser: null,
+    screenshot_delay: 0,
     rabbitmqNodes: [],
     rabbitmqUsername: "",
     rabbitmqPassword: "",
@@ -2755,7 +2801,7 @@ message HealthCheckResponse {
                 this.monitor.jsonPath = "$";
             }
 
-            // Set default condition for for jsonPathOperator
+            // Set default condition for jsonPathOperator
             if (!this.monitor.jsonPathOperator) {
                 this.monitor.jsonPathOperator = "==";
             }

src/pages/StatusPage.vue

@@ -25,9 +25,7 @@
                         class="form-control"
                         data-testid="description-input"
                     ></textarea>
-                    <div class="form-text">
-                        {{ $t("markdownSupported") }}
-                    </div>
+                    <div class="form-text">{{ $t("markdownSupported") }}</div>
                 </div>
 
                 <!-- Footer Text -->
@@ -39,9 +37,7 @@
                         class="form-control"
                         data-testid="footer-text-input"
                     ></textarea>
-                    <div class="form-text">
-                        {{ $t("markdownSupported") }}
-                    </div>
+                    <div class="form-text">{{ $t("markdownSupported") }}</div>
                 </div>
 
                 <div class="my-3">

test/backend-test/test-domain.js

@@ -157,6 +157,17 @@ describe("Domain Expiry", () => {
                 assert.strictEqual(supportInfo.tld, "com");
             });
 
+            test("supports multi-level public suffix via RDAP fallback (e.g. com.br)", async () => {
+                const monitor = {
+                    type: "http",
+                    url: "https://record.com.br",
+                    domainExpiryNotification: true,
+                };
+                const supportInfo = await DomainExpiry.checkSupport(monitor);
+                assert.strictEqual(supportInfo.domain, "record.com.br");
+                assert.strictEqual(supportInfo.tld, "br");
+            });
+
             test("handles complex subdomain correctly", async () => {
                 const monitor = {
                     type: "http",

test/backend-test/test-snmp.js

@@ -0,0 +1,128 @@
+const { describe, test } = require("node:test");
+const assert = require("node:assert/strict");
+const { GenericContainer } = require("testcontainers");
+const { SNMPMonitorType } = require("../../server/monitor-types/snmp");
+const { UP } = require("../../src/util");
+const snmp = require("net-snmp");
+
+describe("SNMPMonitorType", () => {
+    test(
+        "check() sets heartbeat to UP when SNMP agent responds",
+        {
+            skip: !!process.env.CI && (process.platform !== "linux" || process.arch !== "x64"),
+        },
+        async () => {
+            const container = await new GenericContainer("polinux/snmpd").withExposedPorts("161/udp").start();
+
+            try {
+                // Get the mapped UDP port
+                const hostPort = container.getMappedPort("161/udp");
+                const hostIp = container.getHost();
+
+                // UDP service small wait to ensure snmpd is ready inside container
+                await new Promise((r) => setTimeout(r, 2000));
+
+                const monitor = {
+                    type: "snmp",
+                    hostname: hostIp,
+                    port: hostPort,
+                    snmpVersion: "2c",
+                    radiusPassword: "public",
+                    snmpOid: "1.3.6.1.2.1.1.1.0",
+                    timeout: 5,
+                    maxretries: 1,
+                    jsonPath: "$",
+                    jsonPathOperator: "!=",
+                    expectedValue: "",
+                };
+
+                const snmpMonitor = new SNMPMonitorType();
+                const heartbeat = {};
+
+                await snmpMonitor.check(monitor, heartbeat);
+
+                assert.strictEqual(heartbeat.status, UP);
+                assert.match(heartbeat.msg, /JSON query passes/);
+            } finally {
+                await container.stop();
+            }
+        }
+    );
+
+    test(
+        "check() throws when SNMP agent does not respond",
+        {
+            skip: !!process.env.CI && (process.platform !== "linux" || process.arch !== "x64"),
+        },
+        async () => {
+            const monitor = {
+                type: "snmp",
+                hostname: "127.0.0.1",
+                port: 65530, // Assuming no SNMP agent is running here
+                snmpVersion: "2c",
+                radiusPassword: "public",
+                snmpOid: "1.3.6.1.2.1.1.1.0",
+                timeout: 1,
+                maxretries: 1,
+            };
+
+            const snmpMonitor = new SNMPMonitorType();
+            const heartbeat = {};
+
+            await assert.rejects(() => snmpMonitor.check(monitor, heartbeat), /timeout|RequestTimedOutError/i);
+        }
+    );
+
+    test("check() uses SNMPv3 noAuthNoPriv session when version is 3", async () => {
+        const originalCreateV3Session = snmp.createV3Session;
+        const originalCreateSession = snmp.createSession;
+
+        let createV3Called = false;
+        let createSessionCalled = false;
+        let receivedOptions = null;
+
+        // Stub createV3Session
+        snmp.createV3Session = function (_host, _username, options) {
+            createV3Called = true;
+            receivedOptions = options;
+
+            return {
+                on: () => {},
+                close: () => {},
+                // Stop execution after session creation to avoid real network I/O.
+                get: (_oids, cb) => cb(new Error("stop test here")),
+            };
+        };
+
+        // Stub createSession
+        snmp.createSession = function () {
+            createSessionCalled = true;
+            return {};
+        };
+
+        const monitor = {
+            type: "snmp",
+            hostname: "127.0.0.1",
+            port: 161,
+            timeout: 5,
+            maxretries: 1,
+            snmpVersion: "3",
+            snmp_v3_username: "testuser",
+            snmpOid: "1.3.6.1.2.1.1.1.0",
+        };
+
+        const snmpMonitor = new SNMPMonitorType();
+        const heartbeat = {};
+
+        await assert.rejects(() => snmpMonitor.check(monitor, heartbeat), /stop test here/);
+
+        // Assertions
+        assert.strictEqual(createV3Called, true);
+        assert.strictEqual(createSessionCalled, false);
+        assert.strictEqual(receivedOptions.securityLevel, snmp.SecurityLevel.noAuthNoPriv);
+
+        // Restore originals
+        snmp.createV3Session = originalCreateV3Session;
+        snmp.createSession = originalCreateSession;
+    });
+});