@oneuptime/common 13.0.5 → 13.0.7

package/Tests/App/Dashboard/EmbeddedMetricEventScope.test.tsx

@@ -0,0 +1,358 @@
+import "@testing-library/jest-dom";
+import {
+  afterEach,
+  beforeEach,
+  describe,
+  expect,
+  jest,
+  test,
+} from "@jest/globals";
+import {
+  cleanup,
+  fireEvent,
+  render,
+  screen,
+  waitFor,
+} from "@testing-library/react";
+import * as React from "react";
+import getJestMockFunction, { MockFunction } from "../../MockType";
+import EmbeddedMetricCard from "../../../../App/FeatureSet/Dashboard/src/Components/Metrics/EmbeddedMetricCard";
+import MonitorMetricsPage from "../../../../App/FeatureSet/Dashboard/src/Pages/Monitor/View/Metrics";
+import SloMetricsPage from "../../../../App/FeatureSet/Dashboard/src/Pages/Slo/View/Metrics";
+import PageComponentProps from "../../../../App/FeatureSet/Dashboard/src/Pages/PageComponentProps";
+import MetricQueryConfigData from "../../../Types/Metrics/MetricQueryConfigData";
+import MetricViewData from "../../../Types/Metrics/MetricViewData";
+import MonitorType from "../../../Types/Monitor/MonitorType";
+import InBetween from "../../../Types/BaseDatabase/InBetween";
+import Search from "../../../Types/BaseDatabase/Search";
+import ObjectID from "../../../Types/ObjectID";
+import Route from "../../../Types/API/Route";
+import TimeRange from "../../../Types/Time/TimeRange";
+import ChartTimeReferenceLineProps from "../../../UI/Components/Charts/Types/TimeReferenceLineProps";
+
+/*
+ * Exercise real page -> real tab -> real resource metric component -> real
+ * EmbeddedMetricCard. Only the shared hook and chart renderer are replaced,
+ * exposing the scope each API boundary receives. The hook integration suite
+ * separately verifies how this scope filters incidents, alerts and changes.
+ */
+const hookMock: MockFunction = getJestMockFunction();
+const metricViewMock: MockFunction = getJestMockFunction();
+const getItemMock: MockFunction = getJestMockFunction();
+const analyticsGetListMock: MockFunction = getJestMockFunction();
+
+jest.mock(
+  "../../../../App/FeatureSet/Dashboard/src/Components/Metrics/Utils/UseEventTimeReferenceLines",
+  () => {
+    return {
+      __esModule: true,
+      default: (props: unknown) => {
+        hookMock(props);
+        return {
+          lines: [
+            {
+              date: new Date("2026-09-01T10:30:00.000Z"),
+              label: "Incident: scoped incident",
+              color: "#f00",
+            },
+          ],
+          markerCount: 1,
+        };
+      },
+    };
+  },
+);
+
+jest.mock(
+  "../../../../App/FeatureSet/Dashboard/src/Components/Metrics/MetricView",
+  () => {
+    return {
+      __esModule: true,
+      default: (props: unknown) => {
+        metricViewMock(props);
+        return <div data-testid="metric-view" />;
+      },
+    };
+  },
+);
+
+jest.mock("../../../UI/Utils/Translation", () => {
+  return {
+    __esModule: true,
+    default: () => {
+      return {
+        translateString: (value: unknown) => {
+          return value;
+        },
+        translateValue: (value: unknown) => {
+          return value;
+        },
+      };
+    },
+  };
+});
+
+jest.mock("../../../UI/Utils/Navigation", () => {
+  return {
+    __esModule: true,
+    default: {
+      getLastParamAsObjectID: () => {
+        return new ObjectID("0193c0de-5555-4aaa-8bbb-000000000005");
+      },
+    },
+  };
+});
+
+jest.mock("../../../UI/Utils/Project", () => {
+  return {
+    __esModule: true,
+    default: {
+      getCurrentProjectId: () => {
+        return new ObjectID("10000000-0000-4000-8000-000000000001");
+      },
+    },
+  };
+});
+
+jest.mock("../../../UI/Utils/ModelAPI/ModelAPI", () => {
+  return {
+    __esModule: true,
+    default: {
+      getItem: (...args: Array<unknown>) => {
+        return getItemMock(...args);
+      },
+    },
+  };
+});
+
+jest.mock("../../../UI/Utils/AnalyticsModelAPI/AnalyticsModelAPI", () => {
+  return {
+    __esModule: true,
+    default: {
+      getList: (...args: Array<unknown>) => {
+        return analyticsGetListMock(...args);
+      },
+    },
+  };
+});
+
+jest.mock("../../../../App/FeatureSet/Dashboard/src/Utils/Probe", () => {
+  return {
+    __esModule: true,
+    default: {
+      getAllProbes: () => {
+        return Promise.resolve([]);
+      },
+    },
+  };
+});
+
+jest.mock(
+  "../../../../App/FeatureSet/Dashboard/src/Components/Monitor/DisabledWarning",
+  () => {
+    return {
+      __esModule: true,
+      default: () => {
+        return null;
+      },
+    };
+  },
+);
+
+jest.mock(
+  "../../../../App/FeatureSet/Dashboard/src/Components/Slo/SloNoticeBanner",
+  () => {
+    return {
+      __esModule: true,
+      default: () => {
+        return null;
+      },
+    };
+  },
+);
+
+jest.mock(
+  "../../../../App/FeatureSet/Dashboard/src/Components/Slo/SloHistoryCharts",
+  () => {
+    return {
+      __esModule: true,
+      default: () => {
+        return null;
+      },
+    };
+  },
+);
+
+const RESOURCE_ID: string = "0193c0de-5555-4aaa-8bbb-000000000005";
+const PAGE_PROPS: PageComponentProps = {
+  pageRoute: new Route("/dashboard/resource"),
+  currentProject: null,
+  hasPaymentMethod: true,
+};
+const WINDOW: InBetween<Date> = new InBetween<Date>(
+  new Date("2026-09-01T10:00:00.000Z"),
+  new Date("2026-09-01T11:00:00.000Z"),
+);
+
+interface OverlayProps {
+  enabled: boolean;
+  window: InBetween<Date>;
+  queryConfigs?: Array<MetricQueryConfigData>;
+  refreshTick?: number;
+}
+
+interface MetricViewProps {
+  data: MetricViewData;
+  timeReferenceLines?: Array<ChartTimeReferenceLineProps>;
+  refreshNonce?: number;
+}
+
+function latestOverlay(): OverlayProps {
+  return hookMock.mock.calls[
+    hookMock.mock.calls.length - 1
+  ]![0] as OverlayProps;
+}
+
+function assertAllOverlayQueriesHaveScope(
+  attributeKey: string,
+  membership: boolean = false,
+): void {
+  expect(hookMock).toHaveBeenCalled();
+  for (const [rawProps] of hookMock.mock.calls) {
+    const props: OverlayProps = rawProps as OverlayProps;
+    expect(props.enabled).toBe(true);
+    expect(props.queryConfigs?.length).toBeGreaterThan(0);
+    for (const query of props.queryConfigs || []) {
+      const attributes: Record<string, unknown> = query.metricQueryData
+        .filterData.attributes as Record<string, unknown>;
+      if (membership) {
+        expect(attributes[attributeKey]).toBeInstanceOf(Search);
+        expect((attributes[attributeKey] as Search<string>).toString()).toBe(
+          RESOURCE_ID,
+        );
+      } else {
+        expect(attributes[attributeKey]).toBe(RESOURCE_ID);
+      }
+    }
+  }
+}
+
+beforeEach(() => {
+  hookMock.mockReset();
+  metricViewMock.mockReset();
+  getItemMock.mockReset();
+  analyticsGetListMock.mockReset();
+  getItemMock.mockResolvedValue({ monitorType: MonitorType.SyntheticMonitor });
+  analyticsGetListMock.mockResolvedValue({
+    data: [{ name: "custom.monitor.checkout_latency" }],
+  });
+});
+
+afterEach(() => {
+  cleanup();
+});
+
+describe("embedded metric event scope", () => {
+  test.each<[string, string, boolean]>([
+    ["Monitor Metrics", "monitorId", false],
+    ["Custom Metrics", "monitorId", false],
+    ["Incident Metrics", "monitorIds", true],
+    ["Alert Metrics", "monitorId", false],
+  ])(
+    "the monitor's %s tab scopes every chart overlay to that monitor",
+    async (tabName: string, attributeKey: string, membership: boolean) => {
+      render(<MonitorMetricsPage {...PAGE_PROPS} />);
+      await screen.findAllByTestId("metric-view");
+      const tab: HTMLElement = screen.getByRole("tab", { name: tabName });
+      if (tabName !== "Monitor Metrics") {
+        hookMock.mockClear();
+        fireEvent.click(tab);
+      }
+      await waitFor(() => {
+        expect(screen.getByRole("tab", { name: tabName })).toHaveAttribute(
+          "aria-selected",
+          "true",
+        );
+      });
+      await waitFor(() => {
+        expect(screen.getAllByTestId("metric-view").length).toBeGreaterThan(0);
+        assertAllOverlayQueriesHaveScope(attributeKey, membership);
+      });
+    },
+  );
+
+  test.each<[string, string, boolean]>([
+    ["SLO Metrics", "sloId", false],
+    ["Incident Metrics", "serviceLevelObjectiveIds", true],
+    ["Alert Metrics", "serviceLevelObjectiveIds", true],
+  ])(
+    "the SLO's %s tab scopes every chart overlay to that SLO",
+    async (tabName: string, attributeKey: string, membership: boolean) => {
+      render(<SloMetricsPage {...PAGE_PROPS} />);
+      if (tabName !== "SLO Metrics") {
+        hookMock.mockClear();
+        fireEvent.click(screen.getByRole("tab", { name: tabName }));
+      }
+      await waitFor(() => {
+        assertAllOverlayQueriesHaveScope(attributeKey, membership);
+      });
+    },
+  );
+
+  test("refreshing a fixed window refreshes the markers along with the metric data", () => {
+    const queryConfigs: Array<MetricQueryConfigData> = [
+      {
+        metricQueryData: {
+          filterData: { attributes: { monitorId: RESOURCE_ID } },
+        },
+      },
+    ];
+    render(
+      <EmbeddedMetricCard
+        queryConfigs={queryConfigs}
+        defaultTimeRange={{ range: TimeRange.CUSTOM, startAndEndDate: WINDOW }}
+      />,
+    );
+    expect(latestOverlay().refreshTick).toBe(0);
+    expect(latestOverlay().queryConfigs).toBe(queryConfigs);
+    fireEvent.click(screen.getByRole("button", { name: "Refresh" }));
+    expect(latestOverlay().refreshTick).toBe(1);
+    expect(latestOverlay().window).toEqual(WINDOW);
+    expect(latestOverlay().queryConfigs).toBe(queryConfigs);
+    const view: MetricViewProps = metricViewMock.mock.calls[
+      metricViewMock.mock.calls.length - 1
+    ]![0] as MetricViewProps;
+    expect(view.refreshNonce).toBe(1);
+    expect(
+      view.timeReferenceLines?.map((line: ChartTimeReferenceLineProps) => {
+        return line.label;
+      }),
+    ).toEqual(["Incident: scoped incident"]);
+  });
+
+  test("resource changes replace the overlay scope even when the time window stays fixed", () => {
+    const first: Array<MetricQueryConfigData> = [
+      {
+        metricQueryData: {
+          filterData: { attributes: { "resource.host.id": "host-a" } },
+        },
+      },
+    ];
+    const second: Array<MetricQueryConfigData> = [
+      {
+        metricQueryData: {
+          filterData: { attributes: { "resource.host.id": "host-b" } },
+        },
+      },
+    ];
+    const { rerender } = render(
+      <EmbeddedMetricCard queryConfigs={first} startAndEndDate={WINDOW} />,
+    );
+    expect(latestOverlay().queryConfigs).toBe(first);
+    rerender(
+      <EmbeddedMetricCard queryConfigs={second} startAndEndDate={WINDOW} />,
+    );
+    expect(latestOverlay().queryConfigs).toBe(second);
+    expect(latestOverlay().window).toBe(WINDOW);
+  });
+});

package/Tests/App/Dashboard/EntityFilterDropdownArchivedSlos.test.tsx

@@ -0,0 +1,340 @@
+import "@testing-library/jest-dom";
+import { cleanup, render, screen, waitFor } from "@testing-library/react";
+import {
+  afterEach,
+  beforeEach,
+  describe,
+  expect,
+  jest,
+  test,
+} from "@jest/globals";
+import React from "react";
+import { Mock } from "jest-mock";
+import ObjectID from "../../../Types/ObjectID";
+
+/*
+ * The entity picker behind dashboard SLO widgets and dashboard variables.
+ *
+ * An archived SLO is retired - not evaluated, its numbers frozen - so it must
+ * not be offered for a NEW widget or variable. But a widget that already points
+ * at one keeps loading it by id, and its settings must not pretend nothing is
+ * selected: a blank picker over a live selection is how that selection gets
+ * silently dropped on the next edit. So the picker lists only live SLOs and,
+ * separately, looks up any selected SLO that list is missing, showing it marked
+ * "(archived)". Every other entity type is untouched.
+ */
+
+interface ListArgs {
+  modelType: unknown;
+  query: Record<string, unknown>;
+  limit: number;
+  skip: number;
+  select: Record<string, unknown>;
+  sort: Record<string, unknown>;
+}
+
+interface Row {
+  _id: string;
+  name: string;
+}
+
+interface ListResultShape {
+  data: Array<Row>;
+  count: number;
+  skip: number;
+  limit: number;
+}
+
+const PROJECT_ID: ObjectID = new ObjectID(
+  "0193c0de-7777-4aaa-8bbb-000000000007",
+);
+
+const getListMock: Mock<(args: ListArgs) => Promise<ListResultShape>> =
+  jest.fn<(args: ListArgs) => Promise<ListResultShape>>();
+
+jest.mock("../../../UI/Utils/ModelAPI/ModelAPI", () => {
+  return {
+    __esModule: true,
+    default: {
+      getList: (args: ListArgs): Promise<ListResultShape> => {
+        return getListMock(args);
+      },
+    },
+  };
+});
+
+jest.mock("../../../UI/Utils/Project", () => {
+  return {
+    __esModule: true,
+    default: {
+      getCurrentProjectId: (): ObjectID => {
+        return PROJECT_ID;
+      },
+    },
+  };
+});
+
+jest.mock("../../../UI/Utils/API/API", () => {
+  return {
+    __esModule: true,
+    default: {
+      getFriendlyErrorMessage: (error: Error): string => {
+        return error.message;
+      },
+    },
+  };
+});
+
+jest.mock("react-i18next", () => {
+  return {
+    useTranslation: () => {
+      return {
+        t: (value: string): string => {
+          return value;
+        },
+      };
+    },
+  };
+});
+
+import EntityFilterDropdown from "../../../../App/FeatureSet/Dashboard/src/Components/Dashboard/Canvas/EntityFilterDropdown";
+import { EntityFilterModelType } from "../../../Types/Dashboard/DashboardComponents/ComponentArgument";
+import Includes from "../../../Types/BaseDatabase/Includes";
+import Monitor from "../../../Models/DatabaseModels/Monitor";
+import ServiceLevelObjective from "../../../Models/DatabaseModels/ServiceLevelObjective";
+
+const LIVE_SLO: Row = {
+  _id: "0193c0de-7777-4aaa-8bbb-000000000101",
+  name: "Checkout availability",
+};
+
+const ARCHIVED_SLO: Row = {
+  _id: "0193c0de-7777-4aaa-8bbb-000000000102",
+  name: "Legacy search latency",
+};
+
+function listOf(rows: Array<Row>): Promise<ListResultShape> {
+  return Promise.resolve({
+    data: rows,
+    count: rows.length,
+    skip: 0,
+    limit: 1000,
+  });
+}
+
+/*
+ * The server as the picker sees it: the pickable list returns only the live
+ * SLO, and a lookup by id returns whichever SLOs were asked for, archived or
+ * not.
+ */
+function serveSlos(args: ListArgs): Promise<ListResultShape> {
+  const idFilter: unknown = args.query["_id"];
+
+  if (idFilter instanceof Includes) {
+    const ids: Array<string> = (idFilter.values as Array<ObjectID>).map(
+      (id: ObjectID): string => {
+        return id.toString();
+      },
+    );
+
+    return listOf(
+      [LIVE_SLO, ARCHIVED_SLO].filter((row: Row): boolean => {
+        return ids.includes(row._id);
+      }),
+    );
+  }
+
+  return listOf([LIVE_SLO]);
+}
+
+function renderPicker(options: {
+  type: EntityFilterModelType;
+  isMultiSelect?: boolean | undefined;
+  value?: string | Array<string> | undefined;
+}): void {
+  render(
+    <EntityFilterDropdown
+      entityFilterModelType={options.type}
+      isMultiSelect={Boolean(options.isMultiSelect)}
+      value={options.value}
+      onChange={() => {
+        return undefined;
+      }}
+    />,
+  );
+}
+
+async function waitForOptions(): Promise<void> {
+  await waitFor(() => {
+    expect(screen.queryByText("Loading options...")).not.toBeInTheDocument();
+  });
+}
+
+function listCall(index: number): ListArgs {
+  return getListMock.mock.calls[index]![0];
+}
+
+beforeEach(() => {
+  getListMock.mockReset().mockImplementation(serveSlos);
+});
+
+afterEach(() => {
+  cleanup();
+});
+
+describe("EntityFilterDropdown and archived SLOs", () => {
+  test("offers only unarchived SLOs, within the current project", async () => {
+    renderPicker({ type: EntityFilterModelType.ServiceLevelObjective });
+    await waitForOptions();
+
+    expect(getListMock).toHaveBeenCalledTimes(1);
+    expect(listCall(0).modelType).toBe(ServiceLevelObjective);
+    expect(listCall(0).query["isArchived"]).toBe(false);
+    expect((listCall(0).query["projectId"] as ObjectID).toString()).toBe(
+      PROJECT_ID.toString(),
+    );
+  });
+
+  test("leaves every other entity type's list exactly as it was", async () => {
+    renderPicker({ type: EntityFilterModelType.Monitor });
+    await waitForOptions();
+
+    expect(getListMock).toHaveBeenCalledTimes(1);
+    expect(listCall(0).modelType).toBe(Monitor);
+    expect(Object.keys(listCall(0).query)).toEqual(["projectId"]);
+  });
+
+  test("keeps showing an archived SLO a widget already points at, marked as archived", async () => {
+    renderPicker({
+      type: EntityFilterModelType.ServiceLevelObjective,
+      value: ARCHIVED_SLO._id,
+    });
+
+    expect(
+      await screen.findByText("Legacy search latency (archived)"),
+    ).toBeInTheDocument();
+
+    expect(getListMock).toHaveBeenCalledTimes(2);
+
+    const lookup: ListArgs = listCall(1);
+    expect(lookup.modelType).toBe(ServiceLevelObjective);
+    // By id, in the project, and NOT narrowed to live SLOs - that is the point.
+    expect(Object.keys(lookup.query).sort()).toEqual(["_id", "projectId"]);
+    expect(
+      ((lookup.query["_id"] as Includes).values as Array<ObjectID>).map(
+        (id: ObjectID): string => {
+          return id.toString();
+        },
+      ),
+    ).toEqual([ARCHIVED_SLO._id]);
+    expect(lookup.limit).toBe(1);
+  });
+
+  test("in a multi-select, looks up only the selected SLOs the live list is missing", async () => {
+    renderPicker({
+      type: EntityFilterModelType.ServiceLevelObjective,
+      isMultiSelect: true,
+      value: [LIVE_SLO._id, ARCHIVED_SLO._id],
+    });
+
+    expect(
+      await screen.findByText("Legacy search latency (archived)"),
+    ).toBeInTheDocument();
+    expect(screen.getByText("Checkout availability")).toBeInTheDocument();
+
+    expect(getListMock).toHaveBeenCalledTimes(2);
+    expect(
+      ((listCall(1).query["_id"] as Includes).values as Array<ObjectID>).map(
+        (id: ObjectID): string => {
+          return id.toString();
+        },
+      ),
+    ).toEqual([ARCHIVED_SLO._id]);
+  });
+
+  test("never sends a malformed saved value to the lookup, so it cannot cost the real selection its label", async () => {
+    renderPicker({
+      type: EntityFilterModelType.ServiceLevelObjective,
+      isMultiSelect: true,
+      value: ["not-an-id", ARCHIVED_SLO._id],
+    });
+
+    expect(
+      await screen.findByText("Legacy search latency (archived)"),
+    ).toBeInTheDocument();
+
+    expect(getListMock).toHaveBeenCalledTimes(2);
+    expect(
+      ((listCall(1).query["_id"] as Includes).values as Array<ObjectID>).map(
+        (id: ObjectID): string => {
+          return id.toString();
+        },
+      ),
+    ).toEqual([ARCHIVED_SLO._id]);
+  });
+
+  test("makes no lookup at all when the only unlisted value is malformed", async () => {
+    renderPicker({
+      type: EntityFilterModelType.ServiceLevelObjective,
+      value: "not-an-id",
+    });
+    await waitForOptions();
+
+    expect(getListMock).toHaveBeenCalledTimes(1);
+  });
+
+  test("makes no second lookup when every selected SLO is live", async () => {
+    renderPicker({
+      type: EntityFilterModelType.ServiceLevelObjective,
+      value: LIVE_SLO._id,
+    });
+
+    expect(
+      await screen.findByText("Checkout availability"),
+    ).toBeInTheDocument();
+    expect(getListMock).toHaveBeenCalledTimes(1);
+  });
+
+  test("makes no second lookup when nothing is selected", async () => {
+    renderPicker({
+      type: EntityFilterModelType.ServiceLevelObjective,
+      isMultiSelect: true,
+      value: [],
+    });
+    await waitForOptions();
+
+    expect(getListMock).toHaveBeenCalledTimes(1);
+  });
+
+  test("a failed lookup of the stale selection leaves the picker working", async () => {
+    getListMock.mockImplementation((args: ListArgs) => {
+      if (args.query["_id"]) {
+        return Promise.reject(new Error("lookup failed"));
+      }
+
+      return listOf([LIVE_SLO]);
+    });
+
+    renderPicker({
+      type: EntityFilterModelType.ServiceLevelObjective,
+      value: ARCHIVED_SLO._id,
+    });
+    await waitForOptions();
+
+    await waitFor(() => {
+      expect(getListMock).toHaveBeenCalledTimes(2);
+    });
+    expect(screen.queryByText("lookup failed")).not.toBeInTheDocument();
+    expect(screen.getByText("Select...")).toBeInTheDocument();
+  });
+
+  test("a failed list still shows its error, as before", async () => {
+    getListMock.mockImplementation(() => {
+      return Promise.reject(new Error("list failed"));
+    });
+
+    renderPicker({ type: EntityFilterModelType.ServiceLevelObjective });
+
+    expect(await screen.findByText("list failed")).toBeInTheDocument();
+  });
+});