@oneuptime/common 12.0.32 → 12.0.34

package/UI/Utils/GlobalKeyboardShortcut.ts

@@ -0,0 +1,208 @@
+/**
+ * The plumbing behind single-key global shortcuts — "?" for the shortcuts
+ * dialog, and "g then <key>" to jump between pages.
+ *
+ * Chorded shortcuts (Cmd/Ctrl+K) can be bound naively because they never
+ * collide with typing. Single-key ones can: every letter a shortcut claims is
+ * a letter someone is also trying to type into a search box, a note, or a
+ * YAML editor. Everything in this module exists to decide, from an event
+ * alone, whether a keypress was meant for the page or for the app — and it is
+ * kept free of React so both halves can be pinned by tests.
+ */
+
+/**
+ * The parts of a KeyboardEvent a global shortcut actually reads. Widened to an
+ * interface so the guards below can be exercised without synthesising DOM
+ * events.
+ */
+export interface KeyboardEventLike {
+  key: string;
+  metaKey?: boolean | undefined;
+  ctrlKey?: boolean | undefined;
+  altKey?: boolean | undefined;
+  shiftKey?: boolean | undefined;
+  defaultPrevented?: boolean | undefined;
+  target?: EventTarget | null | undefined;
+}
+
+/**
+ * Shape we duck-type an event target into. Every field is optional because a
+ * target may be the document, the window, or a plain object in a test.
+ */
+interface ElementLike {
+  tagName?: string | undefined;
+  isContentEditable?: boolean | undefined;
+  getAttribute?: ((name: string) => string | null) | undefined;
+}
+
+/**
+ * How long the leader key stays armed. Long enough that "g" and "i" can be
+ * two deliberate presses rather than a chord, short enough that a "g" typed
+ * and then abandoned does not turn the next keystroke into a navigation.
+ */
+export const KEYBOARD_SEQUENCE_TIMEOUT_IN_MS: number = 1500;
+
+/**
+ * True when the keypress landed somewhere the user is composing text, and so
+ * belongs to that field rather than to the app.
+ *
+ * SELECT is included deliberately: a native select does its own type-ahead,
+ * and stealing those letters would break jumping to an option by name.
+ */
+export function isTextEntryTarget(
+  target: EventTarget | null | undefined,
+): boolean {
+  if (!target) {
+    return false;
+  }
+
+  const element: ElementLike = target as ElementLike;
+  const tagName: string = (element.tagName || "").toUpperCase();
+
+  if (tagName === "INPUT" || tagName === "TEXTAREA" || tagName === "SELECT") {
+    return true;
+  }
+
+  if (element.isContentEditable === true) {
+    return true;
+  }
+
+  /*
+   * jsdom does not implement isContentEditable (it is always undefined), and
+   * some editors set the attribute on a wrapper rather than the focused node.
+   * The attribute is the reliable half of the pair.
+   */
+  if (typeof element.getAttribute === "function") {
+    const attribute: string | null = element.getAttribute("contenteditable");
+
+    if (attribute !== null && attribute !== "false") {
+      return true;
+    }
+  }
+
+  return false;
+}
+
+/**
+ * True when a modal dialog is on screen. Global shortcuts stand down while one
+ * is open: navigating the page out from under a dialog the user is still
+ * filling in would discard their work without asking.
+ *
+ * The selector is the same one Modal itself uses to find the topmost dialog,
+ * so anything that reads as modal to assistive tech reads as modal here.
+ */
+export function hasOpenModalDialog(
+  root: ParentNode | null | undefined,
+): boolean {
+  if (!root) {
+    return false;
+  }
+
+  return root.querySelector('[role="dialog"][aria-modal="true"]') !== null;
+}
+
+/**
+ * The shared gate for every single-key global shortcut: the key must be
+ * unmodified (a chord belongs to whoever bound that chord), unclaimed by
+ * another handler, and pressed outside a text field.
+ *
+ * Shift is deliberately not rejected — "?" is Shift+/ on most layouts, and the
+ * event already reports the shifted `key`.
+ */
+export function shouldIgnoreGlobalKeyPress(event: KeyboardEventLike): boolean {
+  if (
+    event.metaKey === true ||
+    event.ctrlKey === true ||
+    event.altKey === true
+  ) {
+    return true;
+  }
+
+  if (event.defaultPrevented === true) {
+    return true;
+  }
+
+  return isTextEntryTarget(event.target);
+}
+
+// ---- leader-key sequences ---------------------------------------------------
+
+export enum KeyboardSequenceOutcome {
+  /** The leader key was pressed. The next key in time completes the sequence. */
+  Armed = "Armed",
+  /** A key arrived while armed and within the timeout. */
+  Completed = "Completed",
+  /** Not part of a sequence — the caller should do nothing. */
+  Ignored = "Ignored",
+}
+
+export interface KeyboardSequenceState {
+  /** When the leader was pressed, in epoch ms. `null` means "not armed". */
+  leaderPressedAt: number | null;
+}
+
+export interface KeyboardSequenceResult {
+  outcome: KeyboardSequenceOutcome;
+  /** The state to carry into the next keypress. */
+  state: KeyboardSequenceState;
+  /** The completing key, lowercased. Only set when the outcome is Completed. */
+  key: string | null;
+}
+
+export const EMPTY_KEYBOARD_SEQUENCE_STATE: KeyboardSequenceState = {
+  leaderPressedAt: null,
+};
+
+/**
+ * One step of a "leader then key" sequence, as a pure function of the previous
+ * state and the key just pressed.
+ *
+ * Written as a reducer rather than a stateful class so the interesting cases —
+ * an expired leader, a repeated leader, a key with no leader before it — are
+ * ordinary function calls in a test instead of timer choreography.
+ */
+export function reduceKeyboardSequence(input: {
+  state: KeyboardSequenceState;
+  key: string;
+  now: number;
+  leaderKey: string;
+  timeoutInMs: number;
+}): KeyboardSequenceResult {
+  const key: string = input.key.toLowerCase();
+  const leaderKey: string = input.leaderKey.toLowerCase();
+
+  const isArmed: boolean =
+    input.state.leaderPressedAt !== null &&
+    input.now - input.state.leaderPressedAt <= input.timeoutInMs;
+
+  /*
+   * A second leader press re-arms rather than completing. "g" is the one key
+   * that cannot be a destination, so treating "g g h" as "go home" is both the
+   * only sensible reading and the forgiving one.
+   */
+  if (key === leaderKey) {
+    return {
+      outcome: KeyboardSequenceOutcome.Armed,
+      state: { leaderPressedAt: input.now },
+      key: null,
+    };
+  }
+
+  if (isArmed) {
+    return {
+      outcome: KeyboardSequenceOutcome.Completed,
+      state: EMPTY_KEYBOARD_SEQUENCE_STATE,
+      key: key,
+    };
+  }
+
+  /*
+   * Either no leader, or one that timed out. Both disarm: a stale leader must
+   * not survive to pair with a keystroke a second later.
+   */
+  return {
+    outcome: KeyboardSequenceOutcome.Ignored,
+    state: EMPTY_KEYBOARD_SEQUENCE_STATE,
+    key: null,
+  };
+}

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/Telemetry/BrowserTelemetryConfig.ts

@@ -0,0 +1,28 @@
+import URL from "../../../Types/API/URL";
+
+export interface BrowserTelemetryConfig {
+  endpoint: URL | null;
+  browserIngestionKey: string;
+}
+
+type ReadEnvironmentVariable = (key: string) => string;
+
+/*
+ * Kept independent from the large UI Config module so this security boundary
+ * can be tested directly: backend OTLP names are intentionally not accepted
+ * by this function at all.
+ */
+export default function getBrowserTelemetryConfig(
+  readEnvironmentVariable: ReadEnvironmentVariable,
+): BrowserTelemetryConfig {
+  const endpoint: string = readEnvironmentVariable(
+    "PUBLIC_OPENTELEMETRY_EXPORTER_OTLP_ENDPOINT",
+  );
+
+  return {
+    endpoint: endpoint ? URL.fromString(endpoint) : null,
+    browserIngestionKey: readEnvironmentVariable(
+      "PUBLIC_OPENTELEMETRY_EXPORTER_OTLP_BROWSER_INGESTION_KEY",
+    ),
+  };
+}

package/UI/Utils/Telemetry/Telemetry.ts

@@ -1,7 +1,7 @@
 import {
+  BrowserOpenTelemetryExporterOtlpEndpoint,
+  BrowserOpenTelemetryExporterOtlpIngestionKey,
   DisableTelemetry,
-  OpenTelemetryExporterOtlpEndpoint,
-  OpenTelemetryExporterOtlpHeaders,
 } from "../../Config";
 import { ZoneContextManager } from "@opentelemetry/context-zone";
 import { OTLPTraceExporter } from "@opentelemetry/exporter-trace-otlp-http";
@@ -85,15 +85,17 @@ export default class Telemetry {
       return;
     }
 
-    const hasHeaders: boolean =
-      Object.keys(OpenTelemetryExporterOtlpHeaders).length > 0;
-
-    if (OpenTelemetryExporterOtlpEndpoint && hasHeaders) {
+    if (
+      BrowserOpenTelemetryExporterOtlpEndpoint &&
+      BrowserOpenTelemetryExporterOtlpIngestionKey
+    ) {
       const traceExporter: SpanExporter = new OTLPTraceExporter({
         url: URL.fromString(
-          OpenTelemetryExporterOtlpEndpoint?.toString() + "/v1/traces",
+          BrowserOpenTelemetryExporterOtlpEndpoint.toString() + "/v1/traces",
         ).toString(),
-        headers: OpenTelemetryExporterOtlpHeaders,
+        headers: {
+          "x-oneuptime-token": BrowserOpenTelemetryExporterOtlpIngestionKey,
+        },
       }) as unknown as SpanExporter;
 
       const providerConfig: TracerConfig = {

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 {