feat(core): display the end date of the scheduled incidents

packages/@statusfy/core/client/components/Incident.vue

@@ -66,8 +66,15 @@
       <div v-else>
         <nice-date
           :date="incident.scheduled"
+          :include-u-t-c="false"
           format="long"
         />
+        &nbsp;-&nbsp;
+        <nice-date
+          :date="getScheduledEndDate()"
+          :include-u-t-c="false"
+          format="long"
+        /> (UTC)
       </div>
     </div>
 
@@ -184,6 +191,14 @@ export default {
         el.appendChild(iconElement);
       });
     }
+  },
+  methods: {
+    getScheduledEndDate() {
+      return this.$statusfy.dates
+        .parse(this.incident.scheduled)
+        .add(this.incident.duration, "m")
+        .toISOString();
+    }
   }
 };
 </script>

packages/@statusfy/core/client/components/NiceDate.vue

@@ -11,6 +11,10 @@ export default {
       type: String,
       required: true
     },
+    includeUTC: {
+      type: Boolean,
+      default: true
+    },
     format: {
       default: "short",
       validator: value => ["short", "long", "month"].indexOf(value) !== -1
@@ -20,12 +24,11 @@ export default {
     label() {
       const $t = this.$t.bind(this);
       const parsedDate = this.$statusfy.dates.parse(this.date);
+      const format = this.includeUTC
+        ? $t(`dates.formats.${this.format}`)
+        : $t(`dates.formats.${this.format}`).replace(" UTC", "");
 
-      return this.$statusfy.dates.format(
-        parsedDate,
-        $t(`dates.formats.${this.format}`),
-        this.$i18n.locale
-      );
+      return this.$statusfy.dates.format(parsedDate, format, this.$i18n.locale);
     }
   }
 };