From b1f266ceb185f86396ead2d2d78a2c2db3780a6c Mon Sep 17 00:00:00 2001
From: Tarun Singh <taruninsa1@gmail.com>
Date: Thu, 13 Jul 2023 20:00:23 -0400
Subject: [PATCH] Added expiry changes to status page and fixes

---
 server/model/monitor.js            |  2 +-
 server/model/status_page.js        |  1 -
 src/components/PublicGroupList.vue | 24 +++++++++++++++++++-----
 src/lang/en.json                   |  4 +++-
 src/lang/hi.json                   |  3 ++-
 src/pages/StatusPage.vue           |  2 +-
 6 files changed, 26 insertions(+), 10 deletions(-)

diff --git a/server/model/monitor.js b/server/model/monitor.js
index ed9505ba9..ddef056af 100644
--- a/server/model/monitor.js
+++ b/server/model/monitor.js
@@ -201,7 +201,7 @@ class Monitor extends BeanModel {
             }
         }
         return {
-            certExpiryDaysRemaining: "No/Bad Cert",
+            certExpiryDaysRemaining: "",
             validCert: false
         };
     }
diff --git a/server/model/status_page.js b/server/model/status_page.js
index e69441328..e168acf2f 100644
--- a/server/model/status_page.js
+++ b/server/model/status_page.js
@@ -90,7 +90,6 @@ class StatusPage extends BeanModel {
      * @param {StatusPage} statusPage
      */
     static async getStatusPageData(statusPage) {
-
         const config = await statusPage.toPublicJSON();
 
         // Incident
diff --git a/src/components/PublicGroupList.vue b/src/components/PublicGroupList.vue
index 3f93d8a5b..0ad693712 100644
--- a/src/components/PublicGroupList.vue
+++ b/src/components/PublicGroupList.vue
@@ -60,7 +60,7 @@
                                                     @click="$refs.monitorSettingDialog.show(group, monitor)"
                                                 />
                                             </span>
-                                            <p v-if="showCertificateExpiry" class="item-name"> Expiry: {{ formatExpiry(monitor) }} </p>
+                                            <span class="badge rounded-pill" :class=" 'bg-' + certExpiryColor(monitor)"> {{ $t("Expiry") }}: {{ formattedCertExpiryMessage(monitor) }} </span>
                                         </div>
                                         <div v-if="showTags" class="tags">
                                             <Tag v-for="tag in monitor.element.tags" :key="tag" :item="tag" :size="'sm'" />
@@ -165,13 +165,27 @@ export default {
          * @param {Object} monitor Monitor to show expiry for
          * @returns {string}
          */
-        formatExpiry(monitor) {
-            if (monitor?.element?.validCert) {
-                return monitor.element.certExpiryDaysRemaining + " days";
+        formattedCertExpiryMessage(monitor) {
+            if (monitor?.element?.validCert && monitor?.element?.certExpiryDaysRemaining) {
+                return monitor.element.certExpiryDaysRemaining + " " + this.$tc("day", monitor.element.certExpiryDaysRemaining);
+            } else if (monitor?.element?.validCert === false) {
+                return this.$t("noOrBadCertificate");
             } else {
-                return monitor.element.certExpiryDaysRemaining;
+                return "";
             }
         },
+
+        /**
+         * Returns certificate expiry based on days remaining
+         * @param {Object} monitor Monitor to show expiry for
+         * @returns {string}
+         */
+        certExpiryColor(monitor) {
+            if (monitor?.element?.validCert) {
+                return monitor.element.certExpiryDaysRemaining > 7 ? "primary" : "danger";
+            }
+            return "danger";
+        },
     }
 };
 </script>
diff --git a/src/lang/en.json b/src/lang/en.json
index 39d02a3e1..9e970b33c 100644
--- a/src/lang/en.json
+++ b/src/lang/en.json
@@ -755,5 +755,7 @@
     "Group": "Group",
     "Monitor Group": "Monitor Group",
     "noGroupMonitorMsg": "Not Available. Create a Group Monitor First.",
-    "Close": "Close"
+    "Close": "Close",
+    "showCertificateExpiry": "Show Certificate Expiry",
+    "noOrBadCertificate": "No/Bad Certificate"
 }
diff --git a/src/lang/hi.json b/src/lang/hi.json
index b6c9efda5..08efa6ff5 100644
--- a/src/lang/hi.json
+++ b/src/lang/hi.json
@@ -39,5 +39,6 @@
     "Reconnecting...": "पुनः कनेक्ट किया जा रहा है...",
     "Down": "बंद",
     "Passive Monitor Type": "निष्क्रिय मॉनिटर प्रकार",
-    "Status": "स्थिति"
+    "Status": "स्थिति",
+    "showCertificateExpiry": "प्रमाणपत्र समाप्ति दिखाएँ"
 }
diff --git a/src/pages/StatusPage.vue b/src/pages/StatusPage.vue
index 2f86ab173..5b777414c 100644
--- a/src/pages/StatusPage.vue
+++ b/src/pages/StatusPage.vue
@@ -57,7 +57,7 @@
                 <!-- Show certificate expiry -->
                 <div class="my-3 form-check form-switch">
                     <input id="show-certificate-expiry" v-model="config.showCertificateExpiry" class="form-check-input" type="checkbox">
-                    <label class="form-check-label" for="show-certificate-expiry">{{ $t("Show Certificate Expiry") }}</label>
+                    <label class="form-check-label" for="show-certificate-expiry">{{ $t("showCertificateExpiry") }}</label>
                 </div>
 
                 <div v-if="false" class="my-3">