@oneuptime/common 12.0.22 → 12.0.24

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

@@ -0,0 +1,352 @@
+import "@testing-library/jest-dom";
+import CriteriaFilterUtil from "../../../../App/FeatureSet/Dashboard/src/Utils/Form/Monitor/CriteriaFilter";
+import {
+  afterEach,
+  beforeEach,
+  describe,
+  expect,
+  jest,
+  test,
+} from "@jest/globals";
+import { cleanup, render, screen, waitFor } from "@testing-library/react";
+import * as React from "react";
+import { CheckOn, CriteriaFilter } from "../../../Types/Monitor/CriteriaFilter";
+import MonitorCriteriaInstance from "../../../Types/Monitor/MonitorCriteriaInstance";
+import MonitorStep from "../../../Types/Monitor/MonitorStep";
+import MonitorSteps from "../../../Types/Monitor/MonitorSteps";
+import MonitorType from "../../../Types/Monitor/MonitorType";
+import ObjectID from "../../../Types/ObjectID";
+import AlertSeverity from "../../../Models/DatabaseModels/AlertSeverity";
+import IncidentSeverity from "../../../Models/DatabaseModels/IncidentSeverity";
+import MonitorStatus from "../../../Models/DatabaseModels/MonitorStatus";
+import { DropdownOption } from "../../../UI/Components/Dropdown/Dropdown";
+import ModelAPI from "../../../UI/Utils/ModelAPI/ModelAPI";
+import ProjectUtil from "../../../UI/Utils/Project";
+
+/*
+ * The wiring test for the monitor-type/criteria alignment.
+ *
+ * CriteriaFilterMonitorTypeChange.test.ts pins the two pure helpers that
+ * decide WHAT the criteria should become. Nothing pinned that the criteria
+ * form actually calls them - and that wiring is the entire fix, because the
+ * reported defect is not a wrong answer from a helper, it is a form that
+ * never asked. Delete the effect in MonitorSteps.tsx, or drop
+ * props.monitorType from its dependency array, or drop the seed-id capture
+ * that the effect early-returns without, and every one of those helper
+ * tests still passes while the bug is fully back.
+ *
+ * So this test does what the user does: it mounts the criteria form the way
+ * the create form remounts it - holding criteria seeded for one monitor
+ * type, told it is now showing another - and asserts on what the form hands
+ * back to the surrounding form through onChange.
+ *
+ * MonitorStep is mocked out. What is under test is this component's own
+ * seeding and alignment, not the several hundred fields its child renders.
+ */
+
+jest.mock(
+  "../../../../App/FeatureSet/Dashboard/src/Components/Form/Monitor/MonitorStep",
+  () => {
+    return {
+      __esModule: true,
+      default: () => {
+        return null;
+      },
+    };
+  },
+);
+
+jest.mock("../../../../App/FeatureSet/Dashboard/src/Utils/Probe", () => {
+  return {
+    __esModule: true,
+    default: {
+      getAllProbes: () => {
+        return Promise.resolve([]);
+      },
+    },
+  };
+});
+
+jest.mock("../../../../App/FeatureSet/Dashboard/src/Utils/ProjectUser", () => {
+  return {
+    __esModule: true,
+    default: {
+      fetchProjectUsersAsDropdownOptions: () => {
+        return Promise.resolve([]);
+      },
+    },
+  };
+});
+
+import MonitorStepsElement from "../../../../App/FeatureSet/Dashboard/src/Components/Form/Monitor/MonitorSteps";
+
+const PROJECT_ID: ObjectID = new ObjectID(
+  "11111111-1111-4111-8111-111111111111",
+);
+
+const ONLINE_STATUS_ID: string = "22222222-2222-4222-8222-222222222222";
+const OFFLINE_STATUS_ID: string = "33333333-3333-4333-8333-333333333333";
+const INCIDENT_SEVERITY_ID: string = "44444444-4444-4444-8444-444444444444";
+const ALERT_SEVERITY_ID: string = "55555555-5555-4555-8555-555555555555";
+
+const MONITOR_NAME: string = "Acme";
+
+function listOf<T>(data: Array<T>): unknown {
+  return {
+    data: data,
+    count: data.length,
+    skip: 0,
+    limit: 50,
+  };
+}
+
+function monitorStatus(data: {
+  id: string;
+  name: string;
+  isOperationalState: boolean;
+  isOfflineState: boolean;
+}): MonitorStatus {
+  const status: MonitorStatus = new MonitorStatus();
+  status._id = data.id;
+  status.name = data.name;
+  status.isOperationalState = data.isOperationalState;
+  status.isOfflineState = data.isOfflineState;
+  return status;
+}
+
+function incidentSeverity(): IncidentSeverity {
+  const severity: IncidentSeverity = new IncidentSeverity();
+  severity._id = INCIDENT_SEVERITY_ID;
+  severity.name = "Critical";
+  return severity;
+}
+
+function alertSeverity(): AlertSeverity {
+  const severity: AlertSeverity = new AlertSeverity();
+  severity._id = ALERT_SEVERITY_ID;
+  severity.name = "Critical";
+  return severity;
+}
+
+/*
+ * The criteria form fetches statuses, severities, on-call policies, labels,
+ * teams and incident roles on mount. Only the first three shape what it
+ * seeds; the rest just have to answer.
+ */
+function mockModelApi(): void {
+  jest
+    .spyOn(ModelAPI, "getList")
+    .mockImplementation((request: { modelType: unknown }): never => {
+      const modelType: unknown = request.modelType;
+
+      if (modelType === MonitorStatus) {
+        return listOf([
+          monitorStatus({
+            id: ONLINE_STATUS_ID,
+            name: "Operational",
+            isOperationalState: true,
+            isOfflineState: false,
+          }),
+          monitorStatus({
+            id: OFFLINE_STATUS_ID,
+            name: "Offline",
+            isOperationalState: false,
+            isOfflineState: true,
+          }),
+        ]) as never;
+      }
+
+      if (modelType === IncidentSeverity) {
+        return listOf([incidentSeverity()]) as never;
+      }
+
+      if (modelType === AlertSeverity) {
+        return listOf([alertSeverity()]) as never;
+      }
+
+      return listOf([]) as never;
+    });
+}
+
+function seededStepsFor(monitorType: MonitorType): MonitorSteps {
+  return MonitorSteps.getDefaultMonitorSteps({
+    monitorType: monitorType,
+    monitorName: MONITOR_NAME,
+    defaultMonitorStatusId: new ObjectID(ONLINE_STATUS_ID),
+    onlineMonitorStatusId: new ObjectID(ONLINE_STATUS_ID),
+    offlineMonitorStatusId: new ObjectID(OFFLINE_STATUS_ID),
+    defaultIncidentSeverityId: new ObjectID(INCIDENT_SEVERITY_ID),
+    defaultAlertSeverityId: new ObjectID(ALERT_SEVERITY_ID),
+  });
+}
+
+function checksIn(monitorSteps: MonitorSteps): Array<CheckOn> {
+  return (monitorSteps.data?.monitorStepsInstanceArray || []).flatMap(
+    (monitorStep: MonitorStep) => {
+      return (
+        monitorStep.data?.monitorCriteria.data?.monitorCriteriaInstanceArray ||
+        []
+      ).flatMap((instance: MonitorCriteriaInstance) => {
+        return (instance.data?.filters || []).map((filter: CriteriaFilter) => {
+          return filter.checkOn;
+        });
+      });
+    },
+  );
+}
+
+// The checks in `monitorSteps` that this monitor type's form cannot draw.
+function unrenderableChecksIn(
+  monitorSteps: MonitorSteps,
+  monitorType: MonitorType,
+): Array<string> {
+  const offered: Array<string> =
+    CriteriaFilterUtil.getCheckOnOptionsByMonitorType(monitorType).map(
+      (option: DropdownOption) => {
+        return option.value.toString();
+      },
+    );
+
+  return checksIn(monitorSteps)
+    .map((checkOn: CheckOn) => {
+      return checkOn.toString();
+    })
+    .filter((checkOn: string) => {
+      return !offered.includes(checkOn);
+    });
+}
+
+interface MountedForm {
+  // Everything the form has pushed up through onChange, in order.
+  changes: Array<MonitorSteps>;
+  latest: () => MonitorSteps;
+}
+
+/*
+ * Mount the criteria form the way the create form remounts it after the
+ * user has been away on another step: holding the criteria it seeded
+ * earlier, told the monitor type is now something else.
+ *
+ * Waits for the form to finish loading rather than for its first onChange.
+ * The first onChange is the component handing straight back what it was
+ * given, which happens on mount, before the statuses and severities it
+ * needs have arrived and therefore before it can align anything - so a
+ * test that stops there reads the stale value and would pass whether or
+ * not the alignment exists.
+ */
+async function mountWith(data: {
+  initialValue?: MonitorSteps | undefined;
+  monitorType: MonitorType;
+}): Promise<MountedForm> {
+  const changes: Array<MonitorSteps> = [];
+
+  render(
+    <MonitorStepsElement
+      monitorType={data.monitorType}
+      monitorName={MONITOR_NAME}
+      {...(data.initialValue ? { initialValue: data.initialValue } : {})}
+      onChange={(value: MonitorSteps) => {
+        changes.push(value);
+      }}
+    />,
+  );
+
+  /*
+   * Rendered only once isLoading is false - until then the component is a
+   * bare loader.
+   */
+  await waitFor(() => {
+    expect(screen.getByText("Default Monitor Status")).toBeInTheDocument();
+  });
+
+  return {
+    changes: changes,
+    latest: () => {
+      return changes[changes.length - 1]!;
+    },
+  };
+}
+
+describe("the criteria form keeps its criteria in step with the monitor type", () => {
+  beforeEach(() => {
+    jest.spyOn(ProjectUtil, "getCurrentProjectId").mockReturnValue(PROJECT_ID);
+    mockModelApi();
+  });
+
+  afterEach(() => {
+    cleanup();
+    jest.restoreAllMocks();
+  });
+
+  test("criteria seeded for a Website do not survive a switch to External Status Page", async () => {
+    /*
+     * The reported defect, end to end. The user seeded criteria on a
+     * Website monitor, went back a step, picked External Status Page, and
+     * came forward again - which unmounts and remounts this component with
+     * the criteria it seeded the first time round.
+     */
+    const form: MountedForm = await mountWith({
+      initialValue: seededStepsFor(MonitorType.Website),
+      monitorType: MonitorType.ExternalStatusPage,
+    });
+
+    /*
+     * Before the fix the criteria still checked "Is Online" and "Response
+     * Status Code", which an External Status Page monitor does not offer,
+     * so the Filter Type dropdown rendered react-select's empty
+     * "Select...". Without the fix this waits out its timeout and reports
+     * exactly which checks were left behind.
+     */
+    await waitFor(() => {
+      expect(
+        unrenderableChecksIn(form.latest(), MonitorType.ExternalStatusPage),
+      ).toEqual([]);
+    });
+
+    /*
+     * And the corrected criteria were pushed up to the surrounding form,
+     * rather than merely held in this component's own state - that second
+     * onChange is what gets saved.
+     */
+    expect(form.changes.length).toBeGreaterThan(1);
+    expect(checksIn(form.latest()).length).toBeGreaterThan(0);
+  });
+
+  test("criteria that already suit the monitor type are handed back unchanged", async () => {
+    /*
+     * The ordinary path - the user never changed their mind. The form must
+     * not rewrite criteria that are already right, or every mount would
+     * churn their generated ids and dirty an untouched form.
+     */
+    const seeded: MonitorSteps = seededStepsFor(MonitorType.Website);
+
+    const form: MountedForm = await mountWith({
+      initialValue: seeded,
+      monitorType: MonitorType.Website,
+    });
+
+    expect(form.latest().toJSON()).toEqual(seeded.toJSON());
+
+    /*
+     * Exactly one onChange: the component handing back what it was given.
+     * A second one would mean it had rewritten criteria that were already
+     * correct.
+     */
+    expect(form.changes).toHaveLength(1);
+  });
+
+  test("with no criteria to start from, the form still seeds for the monitor type it was given", async () => {
+    // The other way into this component: the criteria step, first visit.
+    const form: MountedForm = await mountWith({
+      initialValue: undefined,
+      monitorType: MonitorType.ExternalStatusPage,
+    });
+
+    expect(checksIn(form.latest())).toContain(
+      CheckOn.ExternalStatusPageIsOnline,
+    );
+    expect(
+      unrenderableChecksIn(form.latest(), MonitorType.ExternalStatusPage),
+    ).toEqual([]);
+  });
+});

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

@@ -0,0 +1,278 @@
+import "@testing-library/jest-dom";
+import { afterEach, describe, expect, test } from "@jest/globals";
+import { cleanup, render, screen } from "@testing-library/react";
+import React from "react";
+import LayerCard from "../../../../App/FeatureSet/Dashboard/src/Components/OnCallPolicy/OnCallScheduleLayer/LayerCard";
+import LayerRotationSummary from "../../../../App/FeatureSet/Dashboard/src/Components/OnCallPolicy/OnCallScheduleLayer/LayerRotationSummary";
+import { getLayerPreviewEvents } from "../../../../App/FeatureSet/Dashboard/src/Components/OnCallPolicy/OnCallScheduleLayer/LayerShiftPreview";
+import { OverrideUserInfo } from "../../../../App/FeatureSet/Dashboard/src/Components/OnCallPolicy/OnCallScheduleLayer/ScheduleOverrides";
+import OnCallDutyPolicyScheduleLayer from "../../../Models/DatabaseModels/OnCallDutyPolicyScheduleLayer";
+import OnCallDutyPolicyScheduleLayerUser from "../../../Models/DatabaseModels/OnCallDutyPolicyScheduleLayerUser";
+import User from "../../../Models/DatabaseModels/User";
+import Dictionary from "../../../Types/Dictionary";
+import OneUptimeDate from "../../../Types/Date";
+import EventInterval from "../../../Types/Events/EventInterval";
+import Recurring from "../../../Types/Events/Recurring";
+import ObjectID from "../../../Types/ObjectID";
+import RestrictionTimes, {
+  RestrictionType,
+} from "../../../Types/OnCallDutyPolicy/RestrictionTimes";
+import { UserOverrideRecord } from "../../../Types/OnCallDutyPolicy/UserOverrideUtil";
+
+/*
+ * https://github.com/OneUptime/oneuptime/issues/3411
+ *
+ * The layer card's live "<name> on call now" line and the shift table it
+ * expands into are the two places on the Layers tab that make a claim about who
+ * is covering right now. Both used to be computed from the raw rotation, so
+ * during an override they named the originally-scheduled user while the
+ * "Final schedule" calendar at the bottom of the SAME page, and the code that
+ * actually rings a phone, named the substitute.
+ *
+ * LayerShiftPreview's own suite pins the event-level substitution. What these
+ * tests add is the half that only the rendered component can prove: a
+ * substitute is by construction NOT assigned to the layer, so nothing in the
+ * layer's own user list can name them - and a fix that substitutes the id but
+ * cannot resolve the name turns "Alice on call now" into "Unknown user on call
+ * now", which is not an improvement.
+ */
+
+const USER_A_ID: string = "aaaaaaaa-1111-4111-8111-111111111111";
+const USER_B_ID: string = "bbbbbbbb-2222-4222-8222-222222222222";
+// A second rotation member. The shift table only renders for a real rotation.
+const USER_C_ID: string = "cccccccc-3333-4333-8333-333333333333";
+
+const USER_A_NAME: string = "Alice Scheduled";
+const USER_B_NAME: string = "Bob Covering";
+const USER_C_NAME: string = "Carol Rotation";
+
+function makeUser(id: string, name: string): User {
+  const user: User = new User();
+  user.id = new ObjectID(id);
+  user.name = name as any;
+  user.email = `${id}@example.com` as any;
+  return user;
+}
+
+function makeLayerUser(
+  id: string,
+  name: string,
+  order: number = 1,
+): OnCallDutyPolicyScheduleLayerUser {
+  const layerUser: OnCallDutyPolicyScheduleLayerUser =
+    new OnCallDutyPolicyScheduleLayerUser();
+  layerUser.id = new ObjectID(`6666666${order}-6666-4666-8666-666666666666`);
+  layerUser.userId = new ObjectID(id);
+  layerUser.user = makeUser(id, name);
+  layerUser.order = order;
+  return layerUser;
+}
+
+/*
+ * The rotation summary deliberately renders only prose for a single-user layer
+ * ("X is always on call - there is no rotation"): with one person every period
+ * is theirs and a shift table says nothing. The turn table, and therefore the
+ * "On call now" badge this bug mislabelled, only exists for a real rotation, so
+ * these fixtures put two people on the layer.
+ */
+function rotationUsers(): Array<OnCallDutyPolicyScheduleLayerUser> {
+  return [
+    makeLayerUser(USER_A_ID, USER_A_NAME, 1),
+    makeLayerUser(USER_C_ID, USER_C_NAME, 2),
+  ];
+}
+
+function makeLayer(): OnCallDutyPolicyScheduleLayer {
+  const layer: OnCallDutyPolicyScheduleLayer =
+    new OnCallDutyPolicyScheduleLayer();
+  const now: Date = OneUptimeDate.getCurrentDate();
+
+  layer.id = new ObjectID("33333333-3333-4333-8333-333333333333");
+  layer.name = "Primary" as any;
+  layer.startsAt = OneUptimeDate.addRemoveDays(now, -30);
+  layer.handOffTime = OneUptimeDate.addRemoveDays(now, -30);
+  layer.rotation = Recurring.fromJSON({
+    _type: "Recurring",
+    value: {
+      intervalType: EventInterval.Day,
+      intervalCount: { _type: "PositiveNumber", value: 1 },
+    },
+  } as any) as any;
+
+  const restrictionTimes: RestrictionTimes = new RestrictionTimes();
+  restrictionTimes.restictionType = RestrictionType.None;
+  restrictionTimes.dayRestrictionTimes = null;
+  layer.restrictionTimes = restrictionTimes as any;
+
+  return layer;
+}
+
+function activeGlobalOverride(): UserOverrideRecord {
+  const now: Date = OneUptimeDate.getCurrentDate();
+  return {
+    overrideUserId: USER_A_ID,
+    routeAlertsToUserId: USER_B_ID,
+    startsAt: OneUptimeDate.addRemoveHours(now, -1),
+    endsAt: OneUptimeDate.addRemoveHours(now, 1),
+    onCallDutyPolicyId: null,
+  };
+}
+
+const SUBSTITUTE_INFO: Dictionary<OverrideUserInfo> = {
+  [USER_B_ID]: { name: USER_B_NAME, email: `${USER_B_ID}@example.com` },
+};
+
+const noop: () => void = (): void => {
+  return undefined;
+};
+
+function renderCard(options: {
+  overrides: Array<UserOverrideRecord>;
+  overrideUserInfo: Dictionary<OverrideUserInfo>;
+}): void {
+  render(
+    <LayerCard
+      layer={makeLayer()}
+      users={[makeLayerUser(USER_A_ID, USER_A_NAME)]}
+      timezone="UTC"
+      index={0}
+      total={1}
+      isExpanded={false}
+      actionsDisabled={false}
+      isDeleteButtonLoading={false}
+      overrides={options.overrides}
+      overridePolicyContextId=""
+      overrideUserInfo={options.overrideUserInfo}
+      onToggleExpand={noop}
+      onMoveUp={noop}
+      onMoveDown={noop}
+      onDeleteLayer={noop}
+      onLayerChange={noop}
+      onUsersChange={noop}
+    />,
+  );
+}
+
+// The live line reads "<name> on call now", so anchor on that phrase's row.
+function getOnCallNowLineText(): string {
+  const label: HTMLElement = screen.getByText(/on call now/i);
+  return label.closest("div")?.textContent || label.textContent || "";
+}
+
+describe("Layer card names the substitute during an override (issue #3411)", () => {
+  afterEach(() => {
+    cleanup();
+  });
+
+  test("without an override the rotation user is named - the baseline", () => {
+    renderCard({ overrides: [], overrideUserInfo: {} });
+
+    const line: string = getOnCallNowLineText();
+    expect(line).toContain(USER_A_NAME);
+    expect(line).not.toContain(USER_B_NAME);
+    expect(line).not.toContain("covering via override");
+  });
+
+  test("during an override the SUBSTITUTE is named, and marked as covering", () => {
+    renderCard({
+      overrides: [activeGlobalOverride()],
+      overrideUserInfo: SUBSTITUTE_INFO,
+    });
+
+    const line: string = getOnCallNowLineText();
+    expect(line).toContain(USER_B_NAME);
+    expect(line).toContain("covering via override");
+    expect(line).not.toContain(`${USER_A_NAME} on call now`);
+  });
+
+  /*
+   * The substitute's name has to come from the override payload: they are not
+   * on this layer, so the layer's user list cannot supply it. Withholding the
+   * info must degrade to "Unknown user" rather than silently reverting to the
+   * overridden user's name, which would look correct while being wrong.
+   */
+  test("a substitute with no display info renders as Unknown user, never as the overridden user", () => {
+    renderCard({
+      overrides: [activeGlobalOverride()],
+      overrideUserInfo: {},
+    });
+
+    const line: string = getOnCallNowLineText();
+    expect(line).toContain("Unknown user");
+    /*
+     * Alice legitimately reappears in the same row as "Up next" - she resumes
+     * when the override ends - so the assertion is about the CLAIM, not about
+     * her name being absent from the row.
+     */
+    expect(line).not.toContain(`${USER_A_NAME} on call now`);
+  });
+});
+
+describe("Rotation summary marks a covered turn (issue #3411)", () => {
+  afterEach(() => {
+    cleanup();
+  });
+
+  function renderSummary(options: {
+    overrides: Array<UserOverrideRecord>;
+    overrideUserInfo: Dictionary<OverrideUserInfo>;
+  }): void {
+    const preview: {
+      events: Array<any>;
+      now: Date;
+    } = getLayerPreviewEvents({
+      layer: makeLayer(),
+      users: rotationUsers(),
+      timezone: "UTC",
+      numberOfShifts: 6,
+      overrides: options.overrides,
+    });
+
+    render(
+      <LayerRotationSummary
+        layer={makeLayer()}
+        users={rotationUsers()}
+        timezone="UTC"
+        events={preview.events}
+        now={preview.now}
+        hasLowerPriorityLayer={false}
+        overrideUserInfo={options.overrideUserInfo}
+      />,
+    );
+  }
+
+  test("the covered turn is attributed to the substitute and tagged Covering", () => {
+    renderSummary({
+      overrides: [activeGlobalOverride()],
+      overrideUserInfo: SUBSTITUTE_INFO,
+    });
+
+    expect(screen.getAllByText(USER_B_NAME).length).toBeGreaterThan(0);
+    expect(screen.getAllByText("Covering").length).toBeGreaterThan(0);
+  });
+
+  test("without an override no turn is tagged Covering", () => {
+    renderSummary({ overrides: [], overrideUserInfo: {} });
+
+    expect(screen.queryByText("Covering")).toBeNull();
+  });
+
+  /*
+   * The "Order" row states the layer's configured rotation, which an override
+   * does not change. Substituting there would misrepresent the schedule as
+   * having been reconfigured.
+   */
+  test("the rotation order still lists the assigned user, not the substitute", () => {
+    renderSummary({
+      overrides: [activeGlobalOverride()],
+      overrideUserInfo: SUBSTITUTE_INFO,
+    });
+
+    const orderLabel: HTMLElement = screen.getByText("Order");
+    const orderRow: string = orderLabel.parentElement?.textContent || "";
+
+    expect(orderRow).toContain(USER_A_NAME);
+    expect(orderRow).toContain(USER_C_NAME);
+    expect(orderRow).not.toContain(USER_B_NAME);
+  });
+});