@oneuptime/common 12.0.31 → 12.0.33

package/UI/Components/SideOver/SideOver.tsx

@@ -1,13 +1,12 @@
 import Button, { ButtonStyleType } from "../Button/Button";
 import Icon from "../Icon/Icon";
 import IconProp from "../../../Types/Icon/IconProp";
-import { lockPageScroll, unlockPageScroll } from "../../Utils/PageScrollLock";
+import { usePageScrollLock } from "../../Utils/PageScrollLock";
 import React, {
   FunctionComponent,
   ReactElement,
   useEffect,
   useId,
-  useLayoutEffect,
   useState,
 } from "react";
 import { createPortal } from "react-dom";
@@ -26,6 +25,23 @@ export interface ComponentProps {
   children: ReactElement | Array<ReactElement>;
   submitButtonDisabled?: boolean | undefined;
   submitButtonText?: string | undefined;
+  /*
+   * Spinner on the submit button, and a disable that comes with it — the same
+   * affordance Modal has always forwarded to its footer. Without it a panel
+   * whose submit kicks off a long job has to hand-roll a "Creating..." label
+   * and remember to disable itself, which is what every such panel here did.
+   */
+  submitButtonIsLoading?: boolean | undefined;
+  /*
+   * Disables the footer's Close button. Only worth setting while the panel is
+   * running something it cannot abandon: the alternative every caller reached
+   * for was to no-op inside `onClose`, which leaves a live-looking button that
+   * does nothing when pressed.
+   *
+   * Note this does NOT disable the header's × — that one stays available so a
+   * panel can never trap the user.
+   */
+  closeButtonDisabled?: boolean | undefined;
   leftFooterElement?: ReactElement | undefined;
   size?: SideOverSize | undefined;
   /*
@@ -127,24 +143,7 @@ const SideOver: FunctionComponent<ComponentProps> = (
     };
   }, []);
 
-  /*
-   * A layout effect, not an ordinary one. Hiding the page scrollbar widens the
-   * viewport that `right: 0` resolves against, so a panel that painted before
-   * the lock landed would visibly jump sideways by the scrollbar's width on
-   * every platform that draws a classic scrollbar. Locking before paint means
-   * the panel is only ever drawn in its final position.
-   */
-  useLayoutEffect(() => {
-    if (props.disablePageScrollLock) {
-      return undefined;
-    }
-
-    lockPageScroll();
-
-    return () => {
-      unlockPageScroll();
-    };
-  }, [props.disablePageScrollLock]);
+  usePageScrollLock(!props.disablePageScrollLock);
 
   const sideOver: ReactElement = (
     /*
@@ -246,6 +245,7 @@ const SideOver: FunctionComponent<ComponentProps> = (
               <div className="flex justify-end space-x-3">
                 <Button
                   title="Close"
+                  disabled={props.closeButtonDisabled}
                   onClick={() => {
                     props.onClose();
                   }}
@@ -256,6 +256,7 @@ const SideOver: FunctionComponent<ComponentProps> = (
                   <Button
                     title={props.submitButtonText || "Save"}
                     disabled={props.submitButtonDisabled}
+                    isLoading={props.submitButtonIsLoading}
                     onClick={() => {
                       props.onSubmit!();
                     }}

package/UI/Utils/PageScrollLock.ts

@@ -12,6 +12,8 @@
  * under a dialog that is still open or locked forever with no dialog on screen.
  */
 
+import { useLayoutEffect } from "react";
+
 let openDialogCount: number = 0;
 let bodyOverflowBeforeLock: string = "";
 let bodyPaddingRightBeforeLock: string = "";
@@ -42,15 +44,89 @@ export const lockPageScroll: PageScrollLockFunction = (): void => {
   document.body.style.overflow = "hidden";
 };
 
+/*
+ * Restoring means putting the page back exactly as it was found, and "as it
+ * was found" is usually no inline value at all rather than an empty one. Going
+ * through removeProperty for that case says so directly — and it is also the
+ * only spelling jsdom honours for a longhand like padding-right, so the
+ * restore is assertable in a test instead of being taken on trust.
+ */
+type RestoreBodyStyleFunction = (property: string, value: string) => void;
+
+const restoreBodyStyle: RestoreBodyStyleFunction = (
+  property: string,
+  value: string,
+): void => {
+  if (value === "") {
+    document.body.style.removeProperty(property);
+
+    return;
+  }
+
+  document.body.style.setProperty(property, value);
+};
+
 export const unlockPageScroll: PageScrollLockFunction = (): void => {
-  openDialogCount = Math.max(0, openDialogCount - 1);
+  /*
+   * Nothing is open, so there is nothing of ours on the page to put back. A
+   * stray unlock — one surface releasing twice, a cleanup that outlives the
+   * lock it was paired with — has to be inert rather than paint a snapshot
+   * taken for some earlier dialog over whatever the page is wearing now.
+   */
+  if (openDialogCount === 0) {
+    return;
+  }
+
+  openDialogCount--;
 
   if (openDialogCount > 0 || typeof document === "undefined") {
     return;
   }
 
-  document.body.style.overflow = bodyOverflowBeforeLock;
-  document.body.style.paddingRight = bodyPaddingRightBeforeLock;
+  restoreBodyStyle("overflow", bodyOverflowBeforeLock);
+  restoreBodyStyle("padding-right", bodyPaddingRightBeforeLock);
+};
+
+/*
+ * The declarative form, and the one new surfaces should reach for.
+ *
+ * Every caller of the pair above writes the same effect: acquire on the way
+ * in, release from the cleanup, keyed on whether the surface is up. Written by
+ * hand that is four lines with three ways to get it wrong — release omitted,
+ * the wrong dependency, or the call placed after an early `return` so it stops
+ * running once the surface closes. Issue #3553 is what the first two look like
+ * from the outside: the Ask AI panel declared aria-modal, dimmed the page
+ * behind it, and let that page scroll away under the wheel because nothing
+ * ever took the lock.
+ *
+ * Passing the open flag straight in keeps the invariant to one line, and keeps
+ * it correct for surfaces like AIChatPanel that stay mounted while closed
+ * rather than being unmounted by their parent.
+ *
+ * A layout effect, not an ordinary one, and that is load-bearing for every
+ * caller rather than a detail of one. Hiding the page scrollbar widens the
+ * viewport that a fixed overlay resolves against, so a surface that painted
+ * before the lock landed jumps sideways by the scrollbar's width on any
+ * platform drawing a classic scrollbar — the full width for a panel pinned to
+ * `right: 0`, half of it for a centred dialog. Locking before paint means the
+ * surface is only ever drawn in its final position.
+ */
+export type UsePageScrollLockFunction = (isLocked: boolean) => void;
+
+export const usePageScrollLock: UsePageScrollLockFunction = (
+  isLocked: boolean,
+): void => {
+  useLayoutEffect(() => {
+    if (!isLocked) {
+      return undefined;
+    }
+
+    lockPageScroll();
+
+    return () => {
+      unlockPageScroll();
+    };
+  }, [isLocked]);
 };
 
 /*

package/UI/Utils/PermissionGate.ts

@@ -51,6 +51,11 @@ export interface PermissionCheckableModel {
   getReadPermissions: () => Array<Permission>;
   getUpdatePermissions: () => Array<Permission>;
   getDeletePermissions: () => Array<Permission>;
+  /*
+   * Set by the @OperationalResource() decorator. Optional here because the
+   * analytics models that are not decorated never define it at all.
+   */
+  isOperationalResource?: boolean | undefined;
 }
 
 /*
@@ -228,6 +233,33 @@ export default class PermissionGate {
     model: PermissionCheckableModel,
     action: ModelAction,
     userPermissions: Array<Permission>,
+  ): boolean {
+    if (this.hasDeclaredPermission(model, action, userPermissions)) {
+      return true;
+    }
+
+    /*
+     * The server widens a model's declared permissions with the matching
+     * *AllOperationalResources wildcard for anything marked
+     * @OperationalResource (TablePermission.getEffectiveModelPermissions, and
+     * its analytics twin). Without the same step here, somebody granted
+     * "Edit All Operational Resources" - and nothing else - was told by every
+     * gate in the UI that they could not edit a monitor, an incident or a
+     * dashboard, while the API happily accepted the write. The gate must not
+     * be stricter than the endpoint it is standing in front of.
+     */
+    const wildcard: Permission | null = this.getOperationalWildcard(
+      model,
+      action,
+    );
+
+    return Boolean(wildcard && userPermissions.includes(wildcard));
+  }
+
+  private static hasDeclaredPermission(
+    model: PermissionCheckableModel,
+    action: ModelAction,
+    userPermissions: Array<Permission>,
   ): boolean {
     switch (action) {
       case ModelAction.Create:
@@ -243,6 +275,35 @@ export default class PermissionGate {
     }
   }
 
+  /*
+   * The wildcard that covers this operation on this model, or null when the
+   * model is not an operational resource. Kept out of getModelPermissions on
+   * purpose: that list is what the "you need one of these permissions"
+   * sentence is built from, and the server names only the model's own
+   * permissions there too.
+   */
+  private static getOperationalWildcard(
+    model: PermissionCheckableModel,
+    action: ModelAction,
+  ): Permission | null {
+    if (!model.isOperationalResource) {
+      return null;
+    }
+
+    switch (action) {
+      case ModelAction.Create:
+        return Permission.CreateAllOperationalResources;
+      case ModelAction.Read:
+        return Permission.ReadAllOperationalResources;
+      case ModelAction.Update:
+        return Permission.EditAllOperationalResources;
+      case ModelAction.Delete:
+        return Permission.DeleteAllOperationalResources;
+      default:
+        return null;
+    }
+  }
+
   /*
    * Applies a gate to a card button in one line. Several tables replace the
    * built in create modal with a button that routes to a dedicated create

package/UI/Utils/SensitiveUrlToken.ts

@@ -0,0 +1,112 @@
+/*
+ * Client half of the sensitive-URL-token handoff.
+ *
+ * Common/Server/Views/Partials/SensitiveUrlToken.ejs runs in <head>, moves the
+ * bearer token out of the path into sessionStorage and rewrites the address bar
+ * to the token-free route. By the time React mounts, the token is no longer a
+ * route parameter, so pages read it from here instead of from the router.
+ *
+ * Deliberately not routed through Common/UI/Utils/Navigation: this is read
+ * during the reset and verification flows, where the value has to be available
+ * whether or not the bootstrap managed to clean the URL, and Navigation only
+ * ever sees whatever the router was given.
+ *
+ * TOKEN_ROUTES is duplicated in the partial. The two lists have to agree about
+ * which routes carry a token; Common/Tests/App/SensitiveUrlTokenBootstrap.test.ts
+ * asserts that they do.
+ */
+
+const STORAGE_KEY: string = "oneuptime-sensitive-url-token";
+
+/*
+ * Route segments whose NEXT path segment is a single-use bearer token. Matched
+ * against the second-to-last segment, so this covers
+ * /accounts/reset-password/<token>, /reset-password/<token> and
+ * /status-page/<id>/reset-password/<token> alike.
+ */
+const TOKEN_ROUTES: Array<string> = ["reset-password", "verify-email"];
+
+interface HandoffWindow extends Window {
+  __ONEUPTIME_SENSITIVE_URL_TOKEN__?: string | undefined;
+}
+
+export default class SensitiveUrlToken {
+  /*
+   * The token for the current page, or "" when there is none.
+   *
+   * Order matters. sessionStorage is where the bootstrap normally puts it and
+   * is the only source that survives a reload of the cleaned URL. The in-memory
+   * handoff covers blocked storage. The path is the last resort: it only holds
+   * a token when the bootstrap could not run, and reading it keeps the flow
+   * working on the browsers where that happens.
+   */
+  public static read(): string {
+    try {
+      const stored: string | null = window.sessionStorage.getItem(STORAGE_KEY);
+
+      if (stored) {
+        return stored;
+      }
+    } catch {
+      /* Private mode or storage disabled; fall through. */
+    }
+
+    const handedOff: string | undefined = (window as HandoffWindow)
+      .__ONEUPTIME_SENSITIVE_URL_TOKEN__;
+
+    if (handedOff) {
+      return handedOff;
+    }
+
+    return SensitiveUrlToken.readFromPath(window.location.pathname);
+  }
+
+  /*
+   * Pull the token out of a path, if that path is a token-bearing route.
+   * Returns "" for the cleaned form of the same route, which is what the
+   * address bar holds once the bootstrap has run.
+   */
+  public static readFromPath(pathname: string): string {
+    const segments: Array<string> = SensitiveUrlToken.segmentsOf(pathname);
+
+    if (segments.length < 2) {
+      return "";
+    }
+
+    if (!TOKEN_ROUTES.includes(segments[segments.length - 2]!)) {
+      return "";
+    }
+
+    const token: string = segments[segments.length - 1]!;
+
+    try {
+      return decodeURIComponent(token);
+    } catch {
+      // A malformed escape sequence is handed on verbatim.
+      return token;
+    }
+  }
+
+  /*
+   * Drop the stashed token once the flow that needed it has completed.
+   *
+   * Only call this on success. A failed reset (an expired token, a password the
+   * server rejected) has to leave the stash intact, or the retry — and any
+   * reload of the now token-free URL — has nothing to submit.
+   */
+  public static clear(): void {
+    try {
+      window.sessionStorage.removeItem(STORAGE_KEY);
+    } catch {
+      /* Nothing was stored, so nothing to remove. */
+    }
+
+    delete (window as HandoffWindow).__ONEUPTIME_SENSITIVE_URL_TOKEN__;
+  }
+
+  private static segmentsOf(pathname: string): Array<string> {
+    return (pathname || "").split("/").filter((segment: string): boolean => {
+      return segment !== "";
+    });
+  }
+}

package/UI/Utils/TestLLMProvider.ts

@@ -9,6 +9,14 @@ import API from "./API/API";
 export interface LLMProviderTestResult {
   success: boolean;
   message: string;
+  /*
+   * Whether the provider actually used the tool offered by the connection
+   * test. Reachability alone is not enough for Ask AI or investigations —
+   * they read the user's data exclusively through tools — so a provider can
+   * connect successfully and still be unusable for every AI feature.
+   * Undefined for an older server that does not report it.
+   */
+  supportsToolCalling?: boolean | undefined;
 }
 
 export default class TestLLMProvider {
@@ -48,6 +56,9 @@ export default class TestLLMProvider {
         message:
           (responseData["message"] as string) ||
           "Connection successful. The LLM provider responded to a test prompt.",
+        ...(typeof responseData["supportsToolCalling"] === "boolean"
+          ? { supportsToolCalling: responseData["supportsToolCalling"] }
+          : {}),
       };
     } catch (err) {
       return {

package/UI/Utils/UseDashboardTimeRangeZoom.ts

@@ -0,0 +1,77 @@
+import DashboardTimeRangeZoomUtil, {
+  DashboardTimeRangeZoomState,
+} from "../../Utils/Dashboard/DashboardTimeRangeZoom";
+import RangeStartAndEndDateTime from "../../Types/Time/RangeStartAndEndDateTime";
+import { useCallback, useState } from "react";
+
+export interface DashboardTimeRangeZoom {
+  /** The window to hand every widget on the board. */
+  startAndEndDate: RangeStartAndEndDateTime;
+  /** True while a panel drag-selection is narrowing the board. */
+  isZoomed: boolean;
+  /** An explicit pick from the time-range picker — a new baseline. */
+  setStartAndEndDate: (range: RangeStartAndEndDateTime) => void;
+  /** A drag-selection on a time-series panel — zooms the whole board. */
+  zoomToTimeRange: (startTime: Date, endTime: Date) => void;
+  /** Double-click on a panel, or the toolbar's reset — undoes the zoom. */
+  resetZoom: () => void;
+}
+
+export type UseDashboardTimeRangeZoomFunction = (
+  initialRange: RangeStartAndEndDateTime,
+) => DashboardTimeRangeZoom;
+
+/**
+ * Owns the dashboard-wide time range and the one level of undo that makes
+ * drag-to-zoom reversible. Both dashboard shells (the authenticated
+ * DashboardView and the public DashboardViewPage) use this so a panel
+ * gesture means the same thing on both.
+ *
+ * All three callbacks are identity-stable for the life of the dashboard:
+ * they are handed down through the canvas into React.memo'd widgets whose
+ * comparators do not look at function props, so a changing reference would
+ * leave a widget holding a stale closure.
+ */
+const useDashboardTimeRangeZoom: UseDashboardTimeRangeZoomFunction = (
+  initialRange: RangeStartAndEndDateTime,
+): DashboardTimeRangeZoom => {
+  const [state, setState] = useState<DashboardTimeRangeZoomState>(() => {
+    return DashboardTimeRangeZoomUtil.getInitialState(initialRange);
+  });
+
+  const setStartAndEndDate: (range: RangeStartAndEndDateTime) => void =
+    useCallback((range: RangeStartAndEndDateTime): void => {
+      setState((previous: DashboardTimeRangeZoomState) => {
+        return DashboardTimeRangeZoomUtil.selectRange(previous, range);
+      });
+    }, []);
+
+  const zoomToTimeRange: (startTime: Date, endTime: Date) => void = useCallback(
+    (startTime: Date, endTime: Date): void => {
+      setState((previous: DashboardTimeRangeZoomState) => {
+        return DashboardTimeRangeZoomUtil.zoomToWindow(
+          previous,
+          startTime,
+          endTime,
+        );
+      });
+    },
+    [],
+  );
+
+  const resetZoom: () => void = useCallback((): void => {
+    setState((previous: DashboardTimeRangeZoomState) => {
+      return DashboardTimeRangeZoomUtil.resetZoom(previous);
+    });
+  }, []);
+
+  return {
+    startAndEndDate: state.current,
+    isZoomed: DashboardTimeRangeZoomUtil.isZoomed(state),
+    setStartAndEndDate,
+    zoomToTimeRange,
+    resetZoom,
+  };
+};
+
+export default useDashboardTimeRangeZoom;

package/Utils/Dashboard/DashboardTimeRangeZoom.ts

@@ -0,0 +1,118 @@
+import InBetween from "../../Types/BaseDatabase/InBetween";
+import RangeStartAndEndDateTime from "../../Types/Time/RangeStartAndEndDateTime";
+import TimeRange from "../../Types/Time/TimeRange";
+
+/**
+ * The dashboard's time window, plus the window to go back to when a zoom
+ * is undone.
+ *
+ * A dashboard has exactly ONE time range and every widget renders it, so
+ * drag-selecting a window on a time-series panel is a statement about the
+ * whole board, not about that one panel. `baseline` is what makes the
+ * gesture reversible: the first zoom records the range that was in effect
+ * before it, later zooms keep that same original, and a reset restores it.
+ * `baseline === null` is the canonical "not zoomed" signal — the toolbar's
+ * reset affordance and the panels' double-click-to-reset both key off it.
+ */
+export interface DashboardTimeRangeZoomState {
+  /** The window every widget on the board is currently querying. */
+  current: RangeStartAndEndDateTime;
+  /** Window a reset returns to; null when no zoom is active. */
+  baseline: RangeStartAndEndDateTime | null;
+}
+
+export default class DashboardTimeRangeZoomUtil {
+  public static getInitialState(
+    range: RangeStartAndEndDateTime,
+  ): DashboardTimeRangeZoomState {
+    return {
+      current: range,
+      baseline: null,
+    };
+  }
+
+  public static isZoomed(state: DashboardTimeRangeZoomState): boolean {
+    return state.baseline !== null;
+  }
+
+  /**
+   * An explicit pick from the time-range picker. That is a new baseline,
+   * not a zoom: it drops any pending "return to" window, so the reset
+   * affordance disappears instead of offering to jump back to a range the
+   * user has deliberately moved on from.
+   */
+  public static selectRange(
+    _state: DashboardTimeRangeZoomState,
+    range: RangeStartAndEndDateTime,
+  ): DashboardTimeRangeZoomState {
+    return {
+      current: range,
+      baseline: null,
+    };
+  }
+
+  /**
+   * Drag-selected window from a time-series panel. Returns the state
+   * unchanged (same reference, so callers can skip a render) when the
+   * selection is not a usable window — the chart library can hand back a
+   * zero-width or invalid pair when a drag never left its starting bucket.
+   */
+  public static zoomToWindow(
+    state: DashboardTimeRangeZoomState,
+    startTime: Date,
+    endTime: Date,
+  ): DashboardTimeRangeZoomState {
+    if (!(startTime instanceof Date) || !(endTime instanceof Date)) {
+      return state;
+    }
+
+    const startTimeInMs: number = startTime.getTime();
+    const endTimeInMs: number = endTime.getTime();
+
+    if (Number.isNaN(startTimeInMs) || Number.isNaN(endTimeInMs)) {
+      return state;
+    }
+
+    // A drag right-to-left is the same window as left-to-right.
+    const lowerInMs: number = Math.min(startTimeInMs, endTimeInMs);
+    const upperInMs: number = Math.max(startTimeInMs, endTimeInMs);
+
+    if (lowerInMs === upperInMs) {
+      return state;
+    }
+
+    return {
+      current: {
+        range: TimeRange.CUSTOM,
+        startAndEndDate: new InBetween<Date>(
+          new Date(lowerInMs),
+          new Date(upperInMs),
+        ),
+      },
+      /*
+       * Zooming again while already zoomed keeps the ORIGINAL baseline, so
+       * one reset always lands back where the investigation started rather
+       * than unwinding one drag at a time.
+       */
+      baseline: state.baseline || state.current,
+    };
+  }
+
+  /**
+   * Undo the zoom. A no-op (same state reference) when nothing is zoomed,
+   * so a stray double-click on an unzoomed dashboard cannot retime the
+   * board or spend a refetch.
+   */
+  public static resetZoom(
+    state: DashboardTimeRangeZoomState,
+  ): DashboardTimeRangeZoomState {
+    if (state.baseline === null) {
+      return state;
+    }
+
+    return {
+      current: state.baseline,
+      baseline: null,
+    };
+  }
+}

package/Utils/EnterpriseLicense/EnterpriseLicenseSeats.ts

@@ -222,6 +222,22 @@ export default class EnterpriseLicenseSeatsUtil {
       return null;
     }
 
+    /*
+     * The active-only aggregate contains none of this installation's stale
+     * reported users. Subtracting that old count would remove users belonging
+     * to active instances and under-enforce the license. Treat the complete
+     * aggregate as other-instance usage. We also cannot add the two counts:
+     * the same users may exist on both this installation and active ones.
+     * Return null to use the existing uncertainty fallback, which takes the
+     * larger complete-or-live total without subtracting or double-counting.
+     *
+     * Undefined retains the legacy behavior for responses from older license
+     * servers that did not send activity provenance.
+     */
+    if (thisInstance.isCountedTowardsUsage === false) {
+      return null;
+    }
+
     const ownReportedCount: number | null = this.parseCount(
       thisInstance.userCount,
     );