Merge 2192bfa42b into 46d90a6a99

# Conflicts:
#	package-lock.json

db/knex_migrations/2024-03-15-0000-show-last-heartbeat.js

@@ -0,0 +1,16 @@
+exports.up = function (knex) {
+    // Add new column status_page.show_last_heartbeat
+    return knex.schema
+        .alterTable("status_page", function (table) {
+            table.boolean("show_last_heartbeat").notNullable().defaultTo(false);
+        });
+
+};
+
+exports.down = function (knex) {
+    // Drop column status_page.show_last_heartbeat
+    return knex.schema
+        .alterTable("status_page", function (table) {
+            table.dropColumn("show_last_heartbeat");
+        });
+};

package.json

@@ -47,7 +47,7 @@
         "build-docker-nightly-local": "npm run build && docker build -f docker/dockerfile -t louislam/uptime-kuma:nightly2 --target nightly .",
         "build-docker-pr-test": "docker buildx build -f docker/dockerfile --platform linux/amd64,linux/arm64 -t louislam/uptime-kuma:pr-test2 --target pr-test2 . --push",
         "upload-artifacts": "docker buildx build -f docker/dockerfile --platform linux/amd64 -t louislam/uptime-kuma:upload-artifact --build-arg VERSION --build-arg GITHUB_TOKEN --target upload-artifact . --progress plain",
-        "setup": "git checkout 1.23.13 && npm ci --production && npm run download-dist",
+        "setup": "git checkout 1.23.14 && npm ci --production && npm run download-dist",
         "download-dist": "node extra/download-dist.js",
         "mark-as-nightly": "node extra/mark-as-nightly.js",
         "reset-password": "node extra/reset-password.js",
@@ -72,7 +72,7 @@
         "start-server-node14-win": "private\\node14\\node.exe server/server.js"
     },
     "dependencies": {
-        "@grpc/grpc-js": "~1.7.3",
+        "@grpc/grpc-js": "~1.8.22",
         "@louislam/ping": "~0.4.4-mod.1",
         "@louislam/sqlite3": "15.1.6",
         "@vvo/tzdb": "^6.125.0",
@@ -91,7 +91,7 @@
         "dayjs": "~1.11.5",
         "dev-null": "^0.1.1",
         "dotenv": "~16.0.3",
-        "express": "~4.19.2",
+        "express": "~4.21.0",
         "express-basic-auth": "~1.2.1",
         "express-static-gzip": "~2.1.7",
         "feed": "^4.2.2",
@@ -138,8 +138,8 @@
         "redbean-node": "~0.3.0",
         "redis": "~4.5.1",
         "semver": "~7.5.4",
-        "socket.io": "~4.7.5",
-        "socket.io-client": "~4.7.5",
+        "socket.io": "~4.8.0",
+        "socket.io-client": "~4.8.0",
         "socks-proxy-agent": "6.1.1",
         "tar": "~6.2.1",
         "tcp-ping": "~0.1.1",
@@ -172,7 +172,7 @@
         "cross-env": "~7.0.3",
         "delay": "^5.0.0",
         "dns2": "~2.0.1",
-        "dompurify": "~3.0.11",
+        "dompurify": "~3.1.7",
         "eslint": "~8.14.0",
         "eslint-plugin-jsdoc": "~46.4.6",
         "eslint-plugin-vue": "~8.7.1",

server/model/status_page.js

@@ -409,6 +409,7 @@ class StatusPage extends BeanModel {
             showPoweredBy: !!this.show_powered_by,
             googleAnalyticsId: this.google_analytics_tag_id,
             showCertificateExpiry: !!this.show_certificate_expiry,
+            showLastHeartbeat: !!this.show_last_heartbeat
         };
     }
 
@@ -432,6 +433,7 @@ class StatusPage extends BeanModel {
             showPoweredBy: !!this.show_powered_by,
             googleAnalyticsId: this.google_analytics_tag_id,
             showCertificateExpiry: !!this.show_certificate_expiry,
+            showLastHeartbeat: !!this.show_last_heartbeat
         };
     }
 

server/socket-handlers/status-page-socket-handler.js

@@ -165,6 +165,7 @@ module.exports.statusPageSocketHandler = (socket) => {
             statusPage.footer_text = config.footerText;
             statusPage.custom_css = config.customCSS;
             statusPage.show_powered_by = config.showPoweredBy;
+            statusPage.show_last_heartbeat = config.showLastHeartbeat;
             statusPage.show_certificate_expiry = config.showCertificateExpiry;
             statusPage.modified_date = R.isoDateTime();
             statusPage.google_analytics_tag_id = config.googleAnalyticsId;

src/components/PublicGroupList.vue

@@ -38,7 +38,8 @@
                                             <font-awesome-icon v-if="editMode" icon="arrows-alt-v" class="action drag me-3" />
                                             <font-awesome-icon v-if="editMode" icon="times" class="action remove me-3" @click="removeMonitor(group.index, monitor.index)" />
 
-                                            <Uptime :monitor="monitor.element" type="24" :pill="true" />
+                                            <Status v-if="showLastHeartbeat" :status="statusOfLastHeartbeat(monitor.element.id)" />
+                                            <Uptime v-else :monitor="monitor.element" type="24" :pill="true" />
                                             <a
                                                 v-if="showLink(monitor)"
                                                 :href="monitor.element.url"
@@ -91,6 +92,7 @@ import Draggable from "vuedraggable";
 import HeartbeatBar from "./HeartbeatBar.vue";
 import Uptime from "./Uptime.vue";
 import Tag from "./Tag.vue";
+import Status from "./Status.vue";
 
 export default {
     components: {
@@ -99,6 +101,7 @@ export default {
         HeartbeatBar,
         Uptime,
         Tag,
+        Status,
     },
     props: {
         /** Are we in edit mode? */
@@ -113,7 +116,11 @@ export default {
         /** Should expiry be shown? */
         showCertificateExpiry: {
             type: Boolean,
-        }
+        },
+        /** Should only the last heartbeat be shown? */
+        showLastHeartbeat: {
+            type: Boolean,
+        },
     },
     data() {
         return {
@@ -182,6 +189,17 @@ export default {
             }
         },
 
+        /**
+         * Returns the status of the last heartbeat
+         * @param {number} monitorId Id of the monitor to get status for
+         * @returns {number} Status of the last heartbeat
+         */
+        statusOfLastHeartbeat(monitorId) {
+            let heartbeats = this.$root.heartbeatList[monitorId] ?? [];
+            let lastHeartbeat = heartbeats[heartbeats.length - 1];
+            return lastHeartbeat?.status;
+        },
+
         /**
          * Returns certificate expiry color based on days remaining
          * @param {object} monitor Monitor to show expiry for

src/lang/en.json

@@ -879,6 +879,7 @@
     "nostrRecipients": "Recipients Public Keys (npub)",
     "nostrRecipientsHelp": "npub format, one per line",
     "showCertificateExpiry": "Show Certificate Expiry",
+    "showLastHeartbeat": "Show Last Heartbeat Only",
     "noOrBadCertificate": "No/Bad Certificate",
     "cacheBusterParam": "Add the {0} parameter",
     "cacheBusterParamDescription": "Randomly generated parameter to skip caches.",

src/pages/StatusPage.vue

@@ -68,6 +68,12 @@
                     <label class="form-check-label" for="show-certificate-expiry">{{ $t("showCertificateExpiry") }}</label>
                 </div>
 
+                <!-- Show last heartbeat -->
+                <div class="my-3 form-check form-switch">
+                    <input id="show-last-heartbeat" v-model="config.showLastHeartbeat" class="form-check-input" type="checkbox">
+                    <label class="form-check-label" for="show-last-heartbeat">{{ $t("showLastHeartbeat") }}</label>
+                </div>
+
                 <div v-if="false" class="my-3">
                     <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">
@@ -328,7 +334,7 @@
                     👀 {{ $t("statusPageNothing") }}
                 </div>
 
-                <PublicGroupList :edit-mode="enableEditMode" :show-tags="config.showTags" :show-certificate-expiry="config.showCertificateExpiry" />
+                <PublicGroupList :edit-mode="enableEditMode" :show-tags="config.showTags" :show-certificate-expiry="config.showCertificateExpiry" :show-last-heartbeat="config.showLastHeartbeat" />
             </div>
 
             <footer class="mt-5 mb-4">