From e45f54ba1e5aa26fbdf42dcd907e9f4e777d7b7e Mon Sep 17 00:00:00 2001
From: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Date: Thu, 26 Mar 2020 15:23:34 -0700
Subject: Add SSL Certificate expiration warnings

Adds status icons in data table and alert banners for
expiring and expired certificates.
Warning will be visible within 30 days of certificate
expiration.
Critical/danger indicators will be visible when certificate
is expired.

Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I6f8c27d4ba1563a79b46eec7b869366ecee42f75
---
 src/locales/en-US.json                             |  6 ++
 src/store/modules/GlobalStore.js                   |  2 +-
 .../SslCertificates/SslCertificates.vue            | 77 ++++++++++++++++++++++
 src/views/Overview/OverviewQuickLinks.vue          |  5 +-
 4 files changed, 88 insertions(+), 2 deletions(-)

(limited to 'src')

diff --git a/src/locales/en-US.json b/src/locales/en-US.json
index d1d5f615..22bb5142 100644
--- a/src/locales/en-US.json
+++ b/src/locales/en-US.json
@@ -238,6 +238,12 @@
     "httpsCertificate": "HTTPS Certificate",
     "ldapCertificate": "LDAP Certificate",
     "replaceCertificate": "Replace certificate",
+    "alert": {
+      "certificateExpiredMessage": "%{certificate} has expired. Consider replacing it with a new certificate.",
+      "certificateExpiringMessage": "%{certificate} is expiring soon. Consider replacing it with a new certificate.",
+      "certificatesExpiredMessage": "Some certificates have expired. Consider replacing them with new certificates.",
+      "certificatesExpiringMessage": "Some certificates are expiring soon. Consider replacing them with new certificates."
+    },
     "modal": {
       "certificateType": "Certificate type",
       "certificateFile": "Certificate file",
diff --git a/src/store/modules/GlobalStore.js b/src/store/modules/GlobalStore.js
index dd12fc23..6511a45a 100644
--- a/src/store/modules/GlobalStore.js
+++ b/src/store/modules/GlobalStore.js
@@ -25,7 +25,7 @@ const GlobalStore = {
   namespaced: true,
   state: {
     hostName: '--',
-    bmcTime: '--',
+    bmcTime: null,
     hostStatus: 'unreachable'
   },
   getters: {
diff --git a/src/views/AccessControl/SslCertificates/SslCertificates.vue b/src/views/AccessControl/SslCertificates/SslCertificates.vue
index ae28271f..313b3218 100644
--- a/src/views/AccessControl/SslCertificates/SslCertificates.vue
+++ b/src/views/AccessControl/SslCertificates/SslCertificates.vue
@@ -1,6 +1,36 @@
 <template>
   <b-container fluid>
     <page-title />
+    <b-row>
+      <b-col xl="9">
+        <!-- Expired certificates banner -->
+        <alert :show="expiredCertificateTypes.length > 0" variant="danger">
+          <template v-if="expiredCertificateTypes.length > 1">
+            {{ $t('pageSslCertificates.alert.certificatesExpiredMessage') }}
+          </template>
+          <template v-else>
+            {{
+              $t('pageSslCertificates.alert.certificateExpiredMessage', {
+                certificate: expiredCertificateTypes[0]
+              })
+            }}
+          </template>
+        </alert>
+        <!-- Expiring certificates banner -->
+        <alert :show="expiringCertificateTypes.length > 0" variant="warning">
+          <template v-if="expiringCertificateTypes.length > 1">
+            {{ $t('pageSslCertificates.alert.certificatesExpiringMessage') }}
+          </template>
+          <template v-else>
+            {{
+              $t('pageSslCertificates.alert.certificateExpiringMessage', {
+                certificate: expiringCertificateTypes[0]
+              })
+            }}
+          </template>
+        </alert>
+      </b-col>
+    </b-row>
     <b-row>
       <b-col xl="9" class="text-right">
         <b-button
@@ -21,6 +51,10 @@
           </template>
 
           <template v-slot:cell(validUntil)="{ value }">
+            <status-icon
+              v-if="getDaysUntilExpired(value) < 31"
+              :status="getIconStatus(value)"
+            />
             {{ value | formatDate }}
           </template>
 
@@ -56,17 +90,21 @@ import IconTrashcan from '@carbon/icons-vue/es/trash-can/20';
 import ModalUploadCertificate from './ModalUploadCertificate';
 import PageTitle from '../../../components/Global/PageTitle';
 import TableRowAction from '../../../components/Global/TableRowAction';
+import StatusIcon from '../../../components/Global/StatusIcon';
+import Alert from '../../../components/Global/Alert';
 
 import BVToastMixin from '../../../components/Mixins/BVToastMixin';
 
 export default {
   name: 'SslCertificates',
   components: {
+    Alert,
     IconAdd,
     IconReplace,
     IconTrashcan,
     ModalUploadCertificate,
     PageTitle,
+    StatusIcon,
     TableRowAction
   },
   mixins: [BVToastMixin],
@@ -127,10 +165,32 @@ export default {
     },
     certificatesForUpload() {
       return this.$store.getters['sslCertificates/availableUploadTypes'];
+    },
+    bmcTime() {
+      return this.$store.getters['global/bmcTime'];
+    },
+    expiredCertificateTypes() {
+      return this.certificates.reduce((acc, val) => {
+        const daysUntilExpired = this.getDaysUntilExpired(val.validUntil);
+        if (daysUntilExpired < 1) {
+          acc.push(val.certificate);
+        }
+        return acc;
+      }, []);
+    },
+    expiringCertificateTypes() {
+      return this.certificates.reduce((acc, val) => {
+        const daysUntilExpired = this.getDaysUntilExpired(val.validUntil);
+        if (daysUntilExpired < 31 && daysUntilExpired > 0) {
+          acc.push(val.certificate);
+        }
+        return acc;
+      }, []);
     }
   },
   created() {
     this.$store.dispatch('sslCertificates/getCertificates');
+    this.$store.dispatch('global/getBmcTime');
   },
   methods: {
     onTableRowAction(event, rowItem) {
@@ -203,6 +263,23 @@ export default {
         })
         .then(success => this.successToast(success))
         .catch(({ message }) => this.errorToast(message));
+    },
+    getDaysUntilExpired(date) {
+      if (this.bmcTime) {
+        const validUntilMs = date.getTime();
+        const currentBmcTimeMs = this.bmcTime.getTime();
+        const oneDayInMs = 24 * 60 * 60 * 1000;
+        return Math.round((validUntilMs - currentBmcTimeMs) / oneDayInMs);
+      }
+      return null;
+    },
+    getIconStatus(date) {
+      const daysUntilExpired = this.getDaysUntilExpired(date);
+      if (daysUntilExpired < 1) {
+        return 'danger';
+      } else if (daysUntilExpired < 31) {
+        return 'warning';
+      }
     }
   }
 };
diff --git a/src/views/Overview/OverviewQuickLinks.vue b/src/views/Overview/OverviewQuickLinks.vue
index 9f3ba52e..3a0b9cfe 100644
--- a/src/views/Overview/OverviewQuickLinks.vue
+++ b/src/views/Overview/OverviewQuickLinks.vue
@@ -3,7 +3,10 @@
     <div>
       <dl>
         <dt>{{ $t('pageOverview.quicklinks.bmcTime') }}</dt>
-        <dd>{{ bmcTime | formatDate }} {{ bmcTime | formatTime }}</dd>
+        <dd v-if="bmcTime">
+          {{ bmcTime | formatDate }} {{ bmcTime | formatTime }}
+        </dd>
+        <dd v-else>--</dd>
       </dl>
     </div>
     <div>
-- 
cgit v1.2.3