Adding visibility of this new status to Home page.

Adding MAINTENANCE to affected monitors (Events page).

src/kener.css

@@ -10,6 +10,7 @@ section {
   --up-color: #4ead94;
   --down-color: #ca3038;
   --degraded-color: #e6ca61;
+  --maintenance-color: #6699cc;
 }
 
 /*Colors for something UP*/
@@ -82,6 +83,33 @@ section {
   background: linear-gradient(0deg, var(--degraded-color) 90%, var(--up-color) 1%);
 }
 
+/*Colors for something in maintenance*/
+.bg-api-maintenance {
+  background-color: var(--maintenance-color);
+}
+.text-api-maintenance {
+  color: var(--maintenance-color);
+}
+
+.bg-api-maintenance-10 {
+  background: linear-gradient(0deg, var(--maintenance-color) 10%, var(--up-color) 1%);
+}
+.bg-api-maintenance-20 {
+  background: linear-gradient(0deg, var(--maintenance-color) 20%, var(--up-color) 1%);
+}
+.bg-api-maintenance-40 {
+  background: linear-gradient(0deg, var(--maintenance-color) 40%, var(--up-color) 1%);
+}
+.bg-api-maintenance-60 {
+  background: linear-gradient(0deg, var(--maintenance-color) 60%, var(--up-color) 1%);
+}
+.bg-api-maintenance-80 {
+  background: linear-gradient(0deg, var(--maintenance-color) 80%, var(--up-color) 1%);
+}
+.bg-api-maintenance-90 {
+  background: linear-gradient(0deg, var(--maintenance-color) 90%, var(--up-color) 1%);
+}
+
 /*Needed to show markdown properly*/
 .prose :where(code):not(:where([class~="not-prose"], [class~="not-prose"] *))::before {
   content: "";

src/lib/server/controllers/controller.js

@@ -722,6 +722,7 @@ export const GetDataGroupByDayAlternative = async (monitor_tag, start, end, time
         UP: 0,
         DOWN: 0,
         DEGRADED: 0,
+        MAINTENANCE: 0,
         NO_DATA: 0,
       };
     }
@@ -740,6 +741,7 @@ export const GetDataGroupByDayAlternative = async (monitor_tag, start, end, time
     UP: group.UP,
     DOWN: group.DOWN,
     DEGRADED: group.DEGRADED,
+    MAINTENANCE: group.MAINTENANCE,
     NO_DATA: group.NO_DATA,
   }));
 };
@@ -886,9 +888,9 @@ export const RemoveIncidentMonitor = async (incident_id, monitor_tag) => {
 };
 
 export const AddIncidentMonitor = async (incident_id, monitor_tag, monitor_impact) => {
-  //monitor_impact must be DOWN or DEGRADED or NONE
-  if (!["DOWN", "DEGRADED"].includes(monitor_impact)) {
-    throw new Error("Monitor impact must be either DOWN, DEGRADED ");
+  //monitor_impact must be DOWN or DEGRADED or MAINTENANCE or NONE
+  if (!["DOWN", "DEGRADED", "MAINTENANCE"].includes(monitor_impact)) {
+    throw new Error("Monitor impact must be either DOWN, DEGRADED, MAINTENANCE");
   }
 
   //check if monitor exists

src/lib/server/cron-minute.js

@@ -42,6 +42,10 @@ async function manualIncident(monitor) {
   for (let i = 0; i < impactArr.length; i++) {
     const element = impactArr[i];
 
+    if (element.monitor_impact === "MAINTENANCE") {
+      impact = "MAINTENANCE";
+      break;
+    }
     if (element.monitor_impact === "DOWN") {
       impact = "DOWN";
       break;

src/lib/server/page.js

@@ -125,6 +125,11 @@ const FetchData = async function (site, monitor, localTz, selectedLang, lang, is
       summaryDuration = getSummaryDuration(dayData.DOWN, selectedLang);
       summaryStatus = "DOWN";
     }
+    if (dayData.MAINTENANCE > 0) {
+      cssClass = returnStatusClass(dayData.MAINTENANCE, dayData.total, StatusObj.MAINTENANCE, site.barStyle);
+      summaryDuration = getSummaryDuration(dayData.MAINTENANCE, selectedLang);
+      summaryStatus = "MAINTENANCE";
+    }
     if (dayData.NO_DATA === dayData.total) {
       cssClass = StatusObj.NO_DATA;
       summaryStatus = NO_DATA;
@@ -178,6 +183,11 @@ const FetchData = async function (site, monitor, localTz, selectedLang, lang, is
       summaryStatus = "DOWN";
       summaryColorClass = "api-down";
     }
+    if (!!lastRow && lastRow.status == "MAINTENANCE") {
+      summaryDuration = getSummaryDuration(getCountOfSimilarStatuesEnd(todayDataDb, "MAINTENANCE"), selectedLang);
+      summaryStatus = "MAINTENANCE";
+      summaryColorClass = "api-maintenance";
+    }
     if (lastRow.status === "NO_DATA") {
       summaryStatus = NO_DATA;
       summaryColorClass = "api-nodata";

src/lib/server/tool.js

@@ -149,6 +149,7 @@ const StatusObj = {
   UP: "api-up",
   DEGRADED: "api-degraded",
   DOWN: "api-down",
+  MAINTENANCE: "api-maintenance",
   NO_DATA: "api-nodata",
 };
 // @ts-ignore

src/routes/(kener)/+layout.svelte

@@ -109,7 +109,8 @@
 	--bg-custom: {data.bgc};
 	--up-color: {data.site.colors.UP};
 	--down-color: {data.site.colors.DOWN};
-	--degraded-color: {data.site.colors.DEGRADED}
+	--degraded-color: {data.site.colors.DEGRADED};
+	--maintenance-color: {data.site.colors.MAINTENANCE};
 	"
   class="kener-theme-{kenerTheme}"
 >

src/routes/(kener)/+page.svelte

@@ -235,9 +235,14 @@
           </span>
 
           <span class="bg-api-down mr-1 inline-flex h-[8px] w-[8px] rounded-full opacity-75"></span>
-          <span class="">
+          <span class="mr-3">
             {l(data.lang, "DOWN")}
           </span>
+
+          <span class="bg-api-maintenance mr-1 inline-flex h-[8px] w-[8px] rounded-full opacity-75"></span>
+          <span class="">
+            {l(data.lang, "MAINTENANCE")}
+          </span>
         </Badge>
       </div>
     </div>

src/routes/(manage)/manage/(app)/app/events/+page.svelte

@@ -1214,6 +1214,11 @@
                   <Select.Content>
                     <Select.Group>
                       <Select.Label>Impact</Select.Label>
+                      {#if currentIncident.incident_type == "MAINTENANCE"}
+                        <Select.Item value="MAINTENANCE" label="MAINTENANCE" class="text-api-maintenance text-sm font-medium">
+                          MAINTENANCE
+                        </Select.Item>
+                      {/if}
                       <Select.Item value="DOWN" label="DOWN" class="text-api-down text-sm font-medium">
                         DOWN
                       </Select.Item>