@wso2/am-core-ui 0.0.18 → 0.0.19

package/dist/index-CjCkcuuI.js

@@ -0,0 +1,322 @@
+import { jsx as i, jsxs as w } from "react/jsx-runtime";
+import { c as Q } from "react/compiler-runtime";
+import { useParams as le, useSearchParams as me } from "react-router-dom";
+import { N as V, h as ce, aS as ue, T as v, c as de, d as he, aU as fe, P as ge } from "./index-B_Z0MwXk.js";
+import "@tanstack/react-query";
+import "react";
+import { useTheme as pe, Grid as F, Card as W, CardContent as Y, Skeleton as Z, Box as X, Stack as J, Typography as ee, Alert as ye, CardHeader as te, CircularProgress as ve, IconButton as be } from "@wso2/oxygen-ui";
+import { LineChart as se, ChartTooltip as ae } from "@wso2/oxygen-ui-charts-react";
+import { RefreshCcw as Re, PauseCircle as xe, BarChart3 as Se } from "@wso2/oxygen-ui-icons-react";
+import { E as Te } from "./EnvironmentSelector-B7Bl93s2.js";
+const $ = (e) => e / 1024 ** 3, ie = (e) => {
+  const t = /* @__PURE__ */ new Map();
+  return e.forEach(({
+    key: s,
+    points: n,
+    transform: o
+  }) => {
+    n?.forEach((a) => {
+      const l = t.get(a.time) ?? {
+        time: a.time,
+        label: ce(new Date(a.time), "MM/dd HH:mm")
+      };
+      t.set(a.time, {
+        ...l,
+        [s]: o ? o(a.value) : a.value
+      });
+    });
+  }), Array.from(t.values()).sort((s, n) => new Date(s.time).getTime() - new Date(n.time).getTime());
+}, ne = (e) => {
+  const t = Q(7), {
+    active: s,
+    payload: n,
+    formatter: o
+  } = e;
+  if (!s || !n || n.length === 0)
+    return null;
+  let a;
+  if (t[0] !== o || t[1] !== n) {
+    let m;
+    t[3] !== o ? (m = (r) => /* @__PURE__ */ w(J, { direction: "row", alignItems: "center", gap: 1, children: [
+      /* @__PURE__ */ i(X, { sx: {
+        width: 8,
+        height: 8,
+        borderRadius: "50%",
+        bgcolor: r.color ?? "text.secondary"
+      } }),
+      /* @__PURE__ */ i(ee, { variant: "body2", color: "textSecondary", flex: 1, children: r.name ?? r.dataKey }),
+      /* @__PURE__ */ i(ee, { variant: "body2", fontWeight: 600, children: typeof r.value == "number" && o ? o(r.value) : r.value ?? "--" })
+    ] }, r.dataKey ?? r.name), t[3] = o, t[4] = m) : m = t[4], a = n.map(m), t[0] = o, t[1] = n, t[2] = a;
+  } else
+    a = t[2];
+  let l;
+  return t[5] !== a ? (l = /* @__PURE__ */ i(W, { variant: "outlined", children: /* @__PURE__ */ i(Y, { children: /* @__PURE__ */ i(J, { direction: "column", gap: 0.5, children: a }) }) }), t[5] = a, t[6] = l) : l = t[6], l;
+}, Ne = (e) => {
+  const t = Q(27), {
+    metrics: s,
+    isLoading: n,
+    error: o
+  } = e, a = pe(), l = (s?.cpuUsage?.length ?? 0) > 0 || (s?.cpuRequests?.length ?? 0) > 0 || (s?.cpuLimits?.length ?? 0) > 0, m = (s?.memory?.length ?? 0) > 0 || (s?.memoryRequests?.length ?? 0) > 0 || (s?.memoryLimits?.length ?? 0) > 0;
+  if (o) {
+    const U = o instanceof Error ? o.message : "Failed to load metrics";
+    let y;
+    return t[0] !== U ? (y = /* @__PURE__ */ i(ye, { severity: "error", children: U }), t[0] = U, t[1] = y) : y = t[1], y;
+  }
+  let r;
+  t[2] === Symbol.for("react.memo_cache_sentinel") ? (r = {
+    xs: 12,
+    md: 6
+  }, t[2] = r) : r = t[2];
+  let c, b;
+  t[3] === Symbol.for("react.memo_cache_sentinel") ? (c = {
+    height: "100%"
+  }, b = /* @__PURE__ */ i(te, { title: "CPU Usage" }), t[3] = c, t[4] = b) : (c = t[3], b = t[4]);
+  let h;
+  t[5] === Symbol.for("react.memo_cache_sentinel") ? (h = {
+    display: "flex",
+    flexDirection: "column",
+    height: "100%",
+    "& svg:focus, & svg:focus-visible, & [tabindex]:focus, & [tabindex]:focus-visible": {
+      outline: "none"
+    }
+  }, t[5] = h) : h = t[5];
+  let d;
+  t[6] !== l || t[7] !== n || t[8] !== s?.cpuLimits || t[9] !== s?.cpuRequests || t[10] !== s?.cpuUsage || t[11] !== a ? (d = /* @__PURE__ */ i(F, { size: r, children: /* @__PURE__ */ w(W, { variant: "outlined", sx: c, children: [
+    b,
+    /* @__PURE__ */ i(Y, { sx: h, children: n ? /* @__PURE__ */ i(Z, { variant: "rounded", height: 260, width: "100%" }) : l ? /* @__PURE__ */ i(se, { data: ie([{
+      key: "cpuUsage",
+      points: s?.cpuUsage
+    }, {
+      key: "cpuRequests",
+      points: s?.cpuRequests
+    }, {
+      key: "cpuLimits",
+      points: s?.cpuLimits
+    }]), xAxisDataKey: "label", tooltip: {
+      show: !1
+    }, xAxis: {
+      show: !0,
+      interval: "preserveStartEnd"
+    }, yAxis: {
+      show: !0,
+      name: "Cores"
+    }, syncId: "metricsSync", lines: [{
+      dataKey: "cpuUsage",
+      name: "Usage",
+      stroke: a.palette.info.main,
+      dot: !1,
+      connectNulls: !0,
+      unit: " cores"
+    }, {
+      dataKey: "cpuRequests",
+      name: "Requests",
+      stroke: a.palette.warning.main,
+      dot: !1,
+      connectNulls: !0,
+      unit: " cores"
+    }, {
+      dataKey: "cpuLimits",
+      name: "Limits",
+      stroke: a.palette.error.main,
+      dot: !1,
+      connectNulls: !0,
+      strokeDasharray: "0",
+      unit: " cores"
+    }], children: /* @__PURE__ */ i(ae, { content: /* @__PURE__ */ i(ne, { title: "CPU", formatter: _e }) }) }) : /* @__PURE__ */ i(X, { display: "flex", justifyContent: "center", alignItems: "center", height: 260, children: /* @__PURE__ */ i(V, { message: "No CPU metrics available", subtitle: "Try changing the time range", disableBackground: !0 }) }) })
+  ] }) }), t[6] = l, t[7] = n, t[8] = s?.cpuLimits, t[9] = s?.cpuRequests, t[10] = s?.cpuUsage, t[11] = a, t[12] = d) : d = t[12];
+  let f;
+  t[13] === Symbol.for("react.memo_cache_sentinel") ? (f = {
+    xs: 12,
+    md: 6
+  }, t[13] = f) : f = t[13];
+  let x, g;
+  t[14] === Symbol.for("react.memo_cache_sentinel") ? (x = {
+    height: "100%"
+  }, g = /* @__PURE__ */ i(te, { title: "Memory Usage" }), t[14] = x, t[15] = g) : (x = t[14], g = t[15]);
+  let R;
+  t[16] === Symbol.for("react.memo_cache_sentinel") ? (R = {
+    display: "flex",
+    flexDirection: "column",
+    height: "100%",
+    "& svg:focus, & svg:focus-visible, & [tabindex]:focus, & [tabindex]:focus-visible": {
+      outline: "none"
+    }
+  }, t[16] = R) : R = t[16];
+  let u;
+  t[17] !== m || t[18] !== n || t[19] !== s?.memory || t[20] !== s?.memoryLimits || t[21] !== s?.memoryRequests || t[22] !== a ? (u = /* @__PURE__ */ i(F, { size: f, children: /* @__PURE__ */ w(W, { variant: "outlined", sx: x, children: [
+    g,
+    /* @__PURE__ */ i(Y, { sx: R, children: n ? /* @__PURE__ */ i(Z, { variant: "rounded", height: 260, width: "100%" }) : m ? /* @__PURE__ */ i(se, { data: ie([{
+      key: "memoryUsage",
+      points: s?.memory,
+      transform: $
+    }, {
+      key: "memoryRequests",
+      points: s?.memoryRequests,
+      transform: $
+    }, {
+      key: "memoryLimits",
+      points: s?.memoryLimits,
+      transform: $
+    }]), xAxisDataKey: "label", xAxis: {
+      show: !0,
+      interval: "preserveStartEnd"
+    }, yAxis: {
+      show: !0,
+      name: "GiB"
+    }, tooltip: {
+      show: !1
+    }, syncId: "metricsSync", lines: [{
+      dataKey: "memoryUsage",
+      name: "Usage",
+      stroke: a.palette.info.main,
+      dot: !1,
+      connectNulls: !0,
+      unit: " GB"
+    }, {
+      dataKey: "memoryRequests",
+      name: "Requests",
+      stroke: a.palette.warning.main,
+      dot: !1,
+      connectNulls: !0,
+      unit: " GB"
+    }, {
+      dataKey: "memoryLimits",
+      name: "Limits",
+      stroke: a.palette.error.main,
+      dot: !1,
+      connectNulls: !0,
+      strokeDasharray: "0",
+      unit: " GB"
+    }], children: /* @__PURE__ */ i(ae, { content: /* @__PURE__ */ i(ne, { title: "Memory", formatter: Ce }) }) }) : /* @__PURE__ */ i(X, { display: "flex", justifyContent: "center", alignItems: "center", height: 260, children: /* @__PURE__ */ i(V, { message: "No memory metrics available", subtitle: "Try changing the time range", disableBackground: !0 }) }) })
+  ] }) }), t[17] = m, t[18] = n, t[19] = s?.memory, t[20] = s?.memoryLimits, t[21] = s?.memoryRequests, t[22] = a, t[23] = u) : u = t[23];
+  let p;
+  return t[24] !== u || t[25] !== d ? (p = /* @__PURE__ */ w(F, { container: !0, spacing: 3, children: [
+    d,
+    u
+  ] }), t[24] = u, t[25] = d, t[26] = p) : p = t[26], p;
+};
+function _e(e) {
+  return `${e.toFixed(3)} cores`;
+}
+function Ce(e) {
+  return `${e.toFixed(2)} GB`;
+}
+const Ee = [{
+  value: v.TEN_MINUTES,
+  label: "10 Minutes"
+}, {
+  value: v.THIRTY_MINUTES,
+  label: "30 Minutes"
+}, {
+  value: v.ONE_HOUR,
+  label: "1 Hour"
+}, {
+  value: v.SIX_HOURS,
+  label: "6 Hours"
+}, {
+  value: v.TWELVE_HOURS,
+  label: "12 Hours"
+}, {
+  value: v.ONE_DAY,
+  label: "1 Day"
+}, {
+  value: v.SEVEN_DAYS,
+  label: "7 Days"
+}], re = () => {
+  const e = Q(51), {
+    agentId: t,
+    orgId: s,
+    projectId: n,
+    envId: o
+  } = le(), [a, l] = me(), {
+    customStartTime: m,
+    customEndTime: r,
+    hasCustomRange: c,
+    handleCustomRangeApply: b
+  } = ue(a, l);
+  let h;
+  e[0] !== c || e[1] !== a ? (h = c ? void 0 : Object.values(v).includes(a.get("timeRange") ?? "") ? a.get("timeRange") : v.ONE_HOUR, e[0] = c, e[1] = a, e[2] = h) : h = e[2];
+  const d = h;
+  let f;
+  e[3] !== t || e[4] !== s || e[5] !== n ? (f = {
+    orgName: s,
+    projName: n,
+    agentName: t
+  }, e[3] = t, e[4] = s, e[5] = n, e[6] = f) : f = e[6];
+  const {
+    data: x
+  } = de(f), g = x === void 0 ? void 0 : x[o ?? ""]?.status === "suspended", R = o ?? "";
+  let u;
+  e[7] !== r || e[8] !== m || e[9] !== c ? (u = c ? {
+    startTime: m,
+    endTime: r
+  } : {}, e[7] = r, e[8] = m, e[9] = c, e[10] = u) : u = e[10];
+  let p;
+  e[11] !== R || e[12] !== u ? (p = {
+    environmentName: R,
+    ...u
+  }, e[11] = R, e[12] = u, e[13] = p) : p = e[13];
+  const U = p;
+  let y;
+  e[14] !== t || e[15] !== s || e[16] !== n ? (y = {
+    agentName: t,
+    orgName: s,
+    projName: n
+  }, e[14] = t, e[15] = s, e[16] = n, e[17] = y) : y = e[17];
+  const q = g === !1 && !!t && !!s && !!n && !!o && (c || !!d), P = !c, H = c ? void 0 : d;
+  let L;
+  e[18] !== q || e[19] !== P || e[20] !== H ? (L = {
+    enabled: q,
+    enableAutoRefresh: P,
+    timeRange: H
+  }, e[18] = q, e[19] = P, e[20] = H, e[21] = L) : L = e[21];
+  const {
+    data: B,
+    error: K,
+    isLoading: O,
+    isRefetching: S,
+    refetch: G
+  } = he(y, U, L);
+  let k;
+  e[22] !== G ? (k = () => {
+    G();
+  }, e[22] = G, e[23] = k) : k = e[23];
+  const j = k;
+  let D;
+  e[24] !== a || e[25] !== l ? (D = (oe) => {
+    const A = new URLSearchParams(a);
+    A.set("timeRange", oe), A.delete("startTime"), A.delete("endTime"), l(A);
+  }, e[24] = a, e[25] = l, e[26] = D) : D = e[26];
+  const z = D;
+  let M;
+  e[27] === Symbol.for("react.memo_cache_sentinel") ? (M = /* @__PURE__ */ i(Te, {}), e[27] = M) : M = e[27];
+  let T;
+  e[28] !== r || e[29] !== m || e[30] !== b || e[31] !== z || e[32] !== d ? (T = /* @__PURE__ */ i(fe, { preset: d, customStart: m, customEnd: r, options: Ee, onPresetChange: z, onCustomRangeApply: b }), e[28] = r, e[29] = m, e[30] = b, e[31] = z, e[32] = d, e[33] = T) : T = e[33];
+  let N;
+  e[34] !== S ? (N = S ? /* @__PURE__ */ i(ve, { size: 16 }) : /* @__PURE__ */ i(Re, { size: 16 }), e[34] = S, e[35] = N) : N = e[35];
+  let _;
+  e[36] !== j || e[37] !== S || e[38] !== N ? (_ = /* @__PURE__ */ i(be, { size: "small", disabled: S, onClick: j, "aria-label": "Refresh", children: N }), e[36] = j, e[37] = S, e[38] = N, e[39] = _) : _ = e[39];
+  let C;
+  e[40] !== T || e[41] !== _ ? (C = /* @__PURE__ */ w(J, { direction: "row", spacing: 2, alignItems: "center", flexWrap: "wrap", children: [
+    M,
+    T,
+    _
+  ] }), e[40] = T, e[41] = _, e[42] = C) : C = e[42];
+  let E;
+  e[43] !== K || e[44] !== O || e[45] !== g || e[46] !== B ? (E = g ? /* @__PURE__ */ i(V, { iconElement: xe, message: "Environment Suspended", subtitle: "Metrics are unavailable while the environment is suspended." }) : /* @__PURE__ */ i(Ne, { metrics: B, isLoading: O, error: K }), e[43] = K, e[44] = O, e[45] = g, e[46] = B, e[47] = E) : E = e[47];
+  let I;
+  return e[48] !== C || e[49] !== E ? (I = /* @__PURE__ */ i(ge, { title: "System Metrics", disableIcon: !0, actions: C, children: E }), e[48] = C, e[49] = E, e[50] = I) : I = e[50], I;
+}, He = {
+  title: "System Metrics",
+  description: "A page component for System Metrics",
+  icon: Se,
+  path: "/metrics",
+  component: re,
+  levels: {
+    component: re
+  }
+};
+export {
+  re as MetricsComponent,
+  He as metaData
+};