Merge branch 'main' into dependabot/npm_and_yarn/vite-8.0.0

Author: zefir-git

.idea/runConfigurations/Local.xml

@@ -21,13 +21,16 @@
   },
   "devDependencies": {
     "@tailwindcss/typography": "^0.5.19",
-    "@tailwindcss/vite": "^4.2.1",
+    "@tailwindcss/vite": "^4.2.2",
+    "@types/markdown-it": "^14.1.2",
     "rollup-plugin-minify-template-literals": "^1.1.7",
     "typescript": "^5.9.3",
     "vite": "^8.0.0"
   },
   "dependencies": {
+    "@vercel/speed-insights": "^2.0.0",
     "lit": "^3.3.2",
+    "markdown-it": "^14.1.1",
     "navigo": "^8.11.1"
   }
 }

.idea/status.iml

@@ -0,0 +1,55 @@
+import { ServiceStatus } from "./models/ServiceStatus";
+import { NoticeStatus } from "./models/NoticeStatus";
+
+export namespace EnumMappings {
+  export const SERVICE_STATUS_STYLES: Record<
+    ServiceStatus,
+    { color: string; bar: string; label: string; icon: string }
+  > = {
+    [ServiceStatus.OPERATIONAL]: {
+      color: "fill-emerald-400",
+      bar: "bg-emerald-500",
+      label: "Operational",
+      icon:
+        `<path d="M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm45.66,85.66-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35a8,8,0,0,1,11.32,11.32Z"></path>`,
+    },
+    [ServiceStatus.UNDER_MAINTENANCE]: {
+      color: "fill-blue-400",
+      bar: "bg-blue-400",
+      label: "Under maintenance",
+      icon:
+        `<path d="M128 24a104 104 0 1 0 104 104A104.13 104.13 0 0 0 128 24m14.052 54.734a34.2 34.2 0 0 1 9.427 1.006 3.79 3.79 0 0 1 1.865 6.25l-17.76 19.265 2.682 12.485 12.484 2.677 19.266-17.782a3.79 3.79 0 0 1 6.25 1.865 34.4 34.4 0 0 1 1.02 8.333 34.122 34.122 0 0 1-47.833 31.282l-24.672 28.536a4 4 0 0 1-.187.203 15.168 15.168 0 0 1-21.448-21.453q.098-.095.203-.182l28.542-24.667a34.155 34.155 0 0 1 30.161-47.818" />`,
+    },
+    [ServiceStatus.DEGRADED_PERFORMANCE]: {
+      color: "fill-amber-400",
+      bar: "bg-amber-400",
+      label: "Degraded performance",
+      icon:
+        `<path d="M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm-8,56a8,8,0,0,1,16,0v56a8,8,0,0,1-16,0Zm8,104a12,12,0,1,1,12-12A12,12,0,0,1,128,184Z"></path>`,
+    },
+    [ServiceStatus.PARTIAL_OUTAGE]: {
+      color: "fill-orange-400",
+      bar: "bg-orange-400",
+      label: "Partial outage",
+      icon:
+        `<path d="M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm-8,56a8,8,0,0,1,16,0v56a8,8,0,0,1-16,0Zm8,104a12,12,0,1,1,12-12A12,12,0,0,1,128,184Z"></path>`,
+    },
+    [ServiceStatus.MAJOR_OUTAGE]: {
+      color: "fill-red-400",
+      bar: "bg-red-400",
+      label: "Major outage",
+      icon:
+        `<path d="M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm37.66,130.34a8,8,0,0,1-11.32,11.32L128,139.31l-26.34,26.35a8,8,0,0,1-11.32-11.32L116.69,128,90.34,101.66a8,8,0,0,1,11.32-11.32L128,116.69l26.34-26.35a8,8,0,0,1,11.32,11.32L139.31,128Z"></path>`,
+    },
+  };
+
+  export const NOTICE_STATUS_NAMES: Record<NoticeStatus, string> = {
+    [NoticeStatus.INCIDENT_IDENTIFIED]: "Identified",
+    [NoticeStatus.INCIDENT_INVESTIGATING]: "Investigating",
+    [NoticeStatus.INCIDENT_MONITORING]: "Monitoring",
+    [NoticeStatus.INCIDENT_RESOLVED]: "Resolved",
+    [NoticeStatus.MAINTENANCE_NOT_STARTED_YET]: "Planned",
+    [NoticeStatus.MAINTENANCE_IN_PROGRESS]: "In progress",
+    [NoticeStatus.MAINTENANCE_COMPLETED]: "Completed",
+  };
+}

package-lock.json

@@ -0,0 +1,134 @@
+export namespace Time {
+  export class Duration {
+    public readonly ms: number;
+
+    public constructor(ms: number) {
+      this.ms = ms;
+    }
+
+    private getParts() {
+      const totalSeconds = Math.floor(this.ms / 1000);
+      return {
+        days: Math.floor(totalSeconds / 86400),
+        hours: Math.floor((totalSeconds % 86400) / 3600),
+        minutes: Math.floor((totalSeconds % 3600) / 60),
+      };
+    }
+
+    public toISOString() {
+      const { days, hours, minutes } = this.getParts();
+
+      return "P" +
+        (days ? `${days}D` : "") +
+        (hours || minutes ? "T" : "") +
+        (hours ? `${hours}H` : "") +
+        (minutes ? `${minutes}M` : "");
+    }
+
+    public toString() {
+      const { days, hours, minutes } = this.getParts();
+
+      const parts = [
+        days && `${days} ${days === 1 ? "day" : "days"}`,
+        hours && `${hours} ${hours === 1 ? "hour" : "hours"}`,
+        minutes && `${minutes} ${minutes === 1 ? "minute" : "minutes"}`,
+      ].filter(Boolean) as string[];
+
+      return parts.length > 1
+        ? parts.slice(0, -1).join(", ") + " and " + parts.at(-1)
+        : parts[0] ?? "0 minutes";
+    }
+  }
+
+  export class Day {
+    public readonly date: Date;
+
+    public constructor(date: Date) {
+      this.date = new Date(date.getTime());
+      this.date.setHours(0, 0, 0, 0);
+    }
+
+    public static today() {
+      return new Day(new Date());
+    }
+
+    public is(date: Date): boolean;
+    public is(day: Day): boolean;
+    public is(d: Date | Day): boolean {
+      return d instanceof Day
+        ? d.date.getTime() === this.date.getTime()
+        : new Day(d).date.getTime() === this.date.getTime();
+    }
+
+    public toISOString() {
+      const year = this.date.getFullYear();
+      const month = String(this.date.getMonth() + 1).padStart(2, "0");
+      const day = String(this.date.getDate()).padStart(2, "0");
+
+      return `${year}-${month}-${day}`;
+    }
+
+    public toString() {
+      return this.date.toLocaleString(undefined, {
+        month: "long",
+        day: "numeric",
+        year: "numeric",
+      });
+    }
+
+    public add(days: number) {
+      const newDate = new Date(this.date.getTime());
+      newDate.setDate(this.date.getDate() + days);
+      return new Day(newDate);
+    }
+
+    public subtract(days: number) {
+      const newDate = new Date(this.date.getTime());
+      newDate.setDate(this.date.getDate() - days);
+      return new Day(newDate);
+    }
+
+    public next() {
+      return this.add(1);
+    }
+
+    public previous() {
+      return this.subtract(1);
+    }
+
+    public getTime() {
+      return this.date.getTime();
+    }
+  }
+
+  export class DateTime {
+    public readonly date: Date;
+
+    public constructor(date: Date) {
+      this.date = new Date(date.getTime());
+    }
+
+    public static now() {
+      return new DateTime(new Date());
+    }
+
+    public getDay() {
+      return new Day(this.date);
+    }
+
+    public toISOString() {
+      return this.date.toISOString();
+    }
+
+    public toString() {
+      return this.getDay().toString() + " at " + this.toTimeString();
+    }
+
+    public toTimeString() {
+      return this.date.toLocaleTimeString(undefined, {
+        hour: "numeric",
+        minute: "numeric",
+      });
+    }
+  }
+}

package.json

@@ -0,0 +1,6 @@
+export interface BaseComponent {
+  id: string;
+  name: { default: string };
+  status: string;
+  order: number;
+}

public/favicon.ico

@@ -0,0 +1,8 @@
+import { Notice } from "./Notice";
+
+export interface Incident extends Notice {
+  started: string;
+  resolved: string | null;
+  duration: number;
+  impact: string;
+}

src/EnumMappings.ts

@@ -1,6 +1,8 @@
 import { Site } from "./Site";
 import { SiteResponse } from "./SiteResponse";
 import { MetricDataPoint } from "../models/MetricDataPoint";
+import { Incident } from "./Incident";
+import { Maintenance } from "./Maintenance";
 
 export class InstatusApi {
   private readonly base: URL;
@@ -32,4 +34,40 @@ export class InstatusApi {
     const data: { data: MetricDataPoint[] } = await res.json();
     return data.data;
   }
+
+  public async getIncidents(): Promise<Incident[]> {
+    const res = await fetch(new URL("incidents", this.base));
+    if (!res.ok) {
+      throw new Error(`Failed to fetch incidents: ${res.status}`);
+    }
+    const data: { incidents: Incident[] } = await res.json();
+    return data.incidents;
+  }
+
+  public async getMaintenances(): Promise<Maintenance[]> {
+    const res = await fetch(new URL("maintenances", this.base));
+    if (!res.ok) {
+      throw new Error(`Failed to fetch maintenances: ${res.status}`);
+    }
+    const data: { maintenances: Maintenance[] } = await res.json();
+    return data.maintenances;
+  }
+
+  public async getIncident(id: string): Promise<Incident> {
+    const res = await fetch(new URL(`incidents/${id}`, this.base));
+    if (!res.ok) {
+      throw new Error(`Failed to fetch incident: ${res.status}`);
+    }
+    const data: { incident: Incident } = await res.json();
+    return data.incident;
+  }
+
+  public async getMaintenance(id: string): Promise<Maintenance> {
+    const res = await fetch(new URL(`maintenances/${id}`, this.base));
+    if (!res.ok) {
+      throw new Error(`Failed to fetch maintenance: ${res.status}`);
+    }
+    const data: { maintenance: Maintenance } = await res.json();
+    return data.maintenance;
+  }
 }