@oneuptime/common 12.0.5 → 12.0.7

package/Utils/Dashboard/Components/Index.ts

@@ -7,6 +7,10 @@ import DashboardCephOsdListComponentUtil from "./DashboardCephOsdListComponent";
 import DashboardCephPoolListComponentUtil from "./DashboardCephPoolListComponent";
 import DashboardChartComponentUtil from "./DashboardChartComponent";
 import DashboardClockComponentUtil from "./DashboardClockComponent";
+import DashboardDataSourceChartComponentUtil from "./DashboardDataSourceChartComponent";
+import DashboardDataSourceGaugeComponentUtil from "./DashboardDataSourceGaugeComponent";
+import DashboardDataSourceTableComponentUtil from "./DashboardDataSourceTableComponent";
+import DashboardDataSourceValueComponentUtil from "./DashboardDataSourceValueComponent";
 import DashboardDockerContainerListComponentUtil from "./DashboardDockerContainerListComponent";
 import DashboardDockerHostListComponentUtil from "./DashboardDockerHostListComponent";
 import DashboardDockerImageListComponentUtil from "./DashboardDockerImageListComponent";
@@ -85,6 +89,30 @@ export default class DashboardComponentsUtil {
       >;
     }
 
+    if (dashboardComponentType === DashboardComponentType.DataSourceChart) {
+      return DashboardDataSourceChartComponentUtil.getComponentConfigArguments() as Array<
+        ComponentArgument<DashboardBaseComponent>
+      >;
+    }
+
+    if (dashboardComponentType === DashboardComponentType.DataSourceValue) {
+      return DashboardDataSourceValueComponentUtil.getComponentConfigArguments() as Array<
+        ComponentArgument<DashboardBaseComponent>
+      >;
+    }
+
+    if (dashboardComponentType === DashboardComponentType.DataSourceGauge) {
+      return DashboardDataSourceGaugeComponentUtil.getComponentConfigArguments() as Array<
+        ComponentArgument<DashboardBaseComponent>
+      >;
+    }
+
+    if (dashboardComponentType === DashboardComponentType.DataSourceTable) {
+      return DashboardDataSourceTableComponentUtil.getComponentConfigArguments() as Array<
+        ComponentArgument<DashboardBaseComponent>
+      >;
+    }
+
     if (dashboardComponentType === DashboardComponentType.LogStream) {
       return DashboardLogStreamComponentUtil.getComponentConfigArguments() as Array<
         ComponentArgument<DashboardBaseComponent>

package/Utils/Dashboard/HtmlWidgetDocument.ts

@@ -128,8 +128,10 @@ export default class HtmlWidgetDocument {
    *
    * Resolution is delegated to DashboardVariableInterpolation so this widget
    * agrees with every query-driven widget about what a variable currently
-   * means (selected value, else default, else nothing). Multi-select joins
-   * with "," because that is the form an author would paste into a filter.
+   * means: a single-select is its selected value, else its default, else
+   * nothing; a multi-select is its picks, and no picks is "All" — which
+   * lands here as "" rather than the default. Multi-select joins with ","
+   * because that is the form an author would paste into a filter.
    */
   public static resolveVariables(
     variables: Array<DashboardVariable> | undefined,

package/Utils/Dashboard/VariableInterpolation.ts

@@ -31,6 +31,23 @@ export interface ResolvedVariableValue {
  * key so the server's WHERE-builder produces `attributes[key] IN (...)`.
  */
 export default class DashboardVariableInterpolation {
+  /*
+   * The one place that decides what a variable currently *means*. Every
+   * widget and every selector defers to it, so the rules have to be
+   * stated rather than inferred:
+   *
+   * - A multi-select variable's `selectedValues` is its sole source of
+   *   truth. Empty or unset is the "All" state and produces no
+   *   predicate. `defaultValue` deliberately does NOT apply here: the
+   *   selector shows "All" whenever the list is empty and cannot show
+   *   anything else, so honouring a default would filter widgets behind
+   *   a control that reads "unfiltered". A default that only holds one
+   *   value also cannot express what a multi-select is for.
+   * - A single-select variable falls back to `defaultValue` only when
+   *   `selectedValue` is absent. An empty string is a real choice — the
+   *   "All" option — and must not be overwritten by the default, which
+   *   is why this uses `??` rather than `||`.
+   */
   public static resolveValue(
     variable: DashboardVariable,
   ): ResolvedVariableValue | undefined {
@@ -43,7 +60,8 @@ export default class DashboardVariableInterpolation {
       if (values.length > 0) {
         return { multi: values };
       }
-      // No multi-select picks. Fall through to default value handling.
+      // No picks: "All". Never falls back to the single-select default.
+      return undefined;
     }
 
     const v: string | undefined =

package/Utils/DataSource/DataSourceQueryText.ts

@@ -0,0 +1,94 @@
+import DashboardVariable from "../../Types/Dashboard/DashboardVariable";
+import DashboardVariableInterpolation, {
+  ResolvedVariableValue,
+} from "../Dashboard/VariableInterpolation";
+
+/*
+ * Pure text utilities for external Data Source queries: dashboard-variable
+ * interpolation into query text, and legend templates for series naming.
+ * Client-side only — the server never interpolates variables (it receives
+ * the final query text).
+ */
+export default class DataSourceQueryText {
+  /*
+   * Replace {{variableName}} tokens with the variable's current value.
+   * Multi-select values join with "|" — regex alternation, which drops
+   * straight into PromQL/LogQL label matchers (the dominant use). SQL
+   * users needing IN-lists can bind single-select variables. Unresolved
+   * variables leave the token untouched so the connector's error names
+   * the real problem instead of silently querying "".
+   */
+  public static applyVariables(
+    queryText: string,
+    variables: Array<DashboardVariable> | undefined,
+  ): string {
+    if (!queryText || !variables || variables.length === 0) {
+      return queryText;
+    }
+
+    let result: string = queryText;
+
+    for (const variable of variables) {
+      if (!variable.name) {
+        continue;
+      }
+
+      const resolved: ResolvedVariableValue | undefined =
+        DashboardVariableInterpolation.resolveValue(variable);
+
+      if (!resolved) {
+        continue;
+      }
+
+      const replacement: string =
+        resolved.multi && resolved.multi.length > 0
+          ? resolved.multi.join("|")
+          : resolved.scalar || "";
+
+      if (!replacement) {
+        continue;
+      }
+
+      /*
+       * {{ name }} with optional inner whitespace. Variable names come
+       * from user config — escape regex metacharacters.
+       */
+      const escapedName: string = variable.name.replace(
+        /[.*+?^${}()|[\]\\]/g,
+        "\\$&",
+      );
+      const token: RegExp = new RegExp(
+        `\\{\\{\\s*${escapedName}\\s*\\}\\}`,
+        "g",
+      );
+      result = result.replace(token, replacement);
+    }
+
+    return result;
+  }
+
+  /*
+   * Render a legend template against one series' attribute set:
+   * "{{instance}} ({{job}})" + { instance: "a:9090", job: "api" } →
+   * "a:9090 (api)". Unknown keys render as "(unset)". Returns the
+   * template untouched when it has no placeholders.
+   */
+  public static applyLegendTemplate(
+    template: string,
+    attributes: Record<string, string> | undefined,
+  ): string {
+    if (!template) {
+      return template;
+    }
+
+    return template.replace(
+      /\{\{\s*([^}\s]+)\s*\}\}/g,
+      (_match: string, key: string): string => {
+        const value: string | undefined = attributes
+          ? attributes[key]
+          : undefined;
+        return value === undefined || value === "" ? "(unset)" : value;
+      },
+    );
+  }
+}

package/Utils/DataSource/DataSourceValueReducer.ts

@@ -0,0 +1,156 @@
+import AggregatedModel from "../../Types/BaseDatabase/AggregatedModel";
+import AggregatedResult from "../../Types/BaseDatabase/AggregatedResult";
+import { DataSourceValueReduce } from "../../Types/Dashboard/DashboardComponents/DashboardDataSourceValueComponent";
+
+/*
+ * Collapsing an external Data Source time series into the single number the
+ * Value and Gauge widgets show.
+ *
+ * The metric widgets get this for free — the OneUptime metrics API already
+ * reduces server-side according to the query's "Aggregate by" — but an
+ * external query returns whatever its source returns, so the reduction is a
+ * widget setting and happens here, on the client.
+ */
+export default class DataSourceValueReducer {
+  /*
+   * Flatten the points into values in TIME order, discarding non-finite
+   * entries. Time order is what makes First/Last mean what they say; the
+   * finiteness filter matters because `value` is typed `number` but
+   * AggregatedModel carries a JSONValue index signature, and a SQL NULL /
+   * missing column arrives as null — left unchecked it poisons an average
+   * with NaN.
+   */
+  public static getNumericValues(
+    results: Array<AggregatedResult>,
+  ): Array<number> {
+    const values: Array<number> = [];
+
+    for (const point of DataSourceValueReducer.sortPointsByTime(results)) {
+      const value: number = point.value as number;
+      if (typeof value === "number" && Number.isFinite(value)) {
+        values.push(value);
+      }
+    }
+
+    return values;
+  }
+
+  /*
+   * Reduce to one number. Returns null for an empty input so callers can
+   * tell "the query returned nothing" apart from "the query returned 0" —
+   * seeding a reduction with 0 is what makes an empty widget render a
+   * confident, wrong zero.
+   *
+   * Undefined `reduce` means Last: for an external query, "what is this
+   * right now" is the overwhelmingly common intent, and it is the only
+   * reduction that leaves a raw gauge/instant query untouched.
+   */
+  public static reduce(
+    values: Array<number>,
+    reduce: DataSourceValueReduce | undefined,
+  ): number | null {
+    if (values.length === 0) {
+      return null;
+    }
+
+    switch (reduce) {
+      case DataSourceValueReduce.First:
+        return values[0]!;
+      case DataSourceValueReduce.Avg:
+        return (
+          values.reduce((sum: number, value: number) => {
+            return sum + value;
+          }, 0) / values.length
+        );
+      case DataSourceValueReduce.Sum:
+        return values.reduce((sum: number, value: number) => {
+          return sum + value;
+        }, 0);
+      /*
+       * Folded, not `Math.min(...values)`. The spread pushes one argument
+       * per point onto the call stack, and a fine-step query over a wide
+       * dashboard window really does return hundreds of thousands of points
+       * — enough to throw RangeError mid-render, and only for these two of
+       * the six reductions, which reads as a data problem rather than a bug.
+       */
+      case DataSourceValueReduce.Min:
+        return values.reduce((min: number, value: number) => {
+          return value < min ? value : min;
+        }, values[0]!);
+      case DataSourceValueReduce.Max:
+        return values.reduce((max: number, value: number) => {
+          return value > max ? value : max;
+        }, values[0]!);
+      case DataSourceValueReduce.Last:
+      default:
+        return values[values.length - 1]!;
+    }
+  }
+
+  /*
+   * Convenience for the widgets: numeric values + the reduced number in one
+   * pass. `value` is null when the query returned no usable points.
+   */
+  public static reduceResults(
+    results: Array<AggregatedResult>,
+    reduce: DataSourceValueReduce | undefined,
+  ): { values: Array<number>; value: number | null } {
+    const values: Array<number> =
+      DataSourceValueReducer.getNumericValues(results);
+
+    return {
+      values: values,
+      value: DataSourceValueReducer.reduce(values, reduce),
+    };
+  }
+
+  /*
+   * First error a connector attached to a result, so an empty widget can say
+   * WHY it is empty instead of just "no data".
+   */
+  public static getResultsErrorMessage(
+    results: Array<AggregatedResult>,
+  ): string | undefined {
+    return results.find((result: AggregatedResult) => {
+      return Boolean(result.errorMessage);
+    })?.errorMessage;
+  }
+
+  /*
+   * Points in timestamp order, for the sparkline. Connectors are expected to
+   * return sorted data, but "expected to" is not "guaranteed to" for a
+   * hand-written SQL query with no ORDER BY — an unsorted series draws a
+   * scribble, and Last would pick an arbitrary point.
+   */
+  public static sortPointsByTime(
+    results: Array<AggregatedResult>,
+  ): Array<AggregatedModel> {
+    const points: Array<AggregatedModel> = [];
+
+    for (const result of results) {
+      points.push(...result.data);
+    }
+
+    return points.sort((a: AggregatedModel, b: AggregatedModel): number => {
+      return (
+        DataSourceValueReducer.getTime(a) - DataSourceValueReducer.getTime(b)
+      );
+    });
+  }
+
+  private static getTime(point: AggregatedModel): number {
+    const timestamp: Date =
+      point.timestamp instanceof Date
+        ? point.timestamp
+        : new Date(point.timestamp as unknown as string);
+
+    const time: number = timestamp.getTime();
+
+    /*
+     * NaN sorts unpredictably. Park unparseable timestamps at the start —
+     * NEGATIVE_INFINITY, not 0, so they stay first even for a query that
+     * legitimately returns pre-1970 timestamps.
+     */
+    return Number.isNaN(time) ? Number.NEGATIVE_INFINITY : time;
+  }
+}

package/Utils/LegacySerializedArray.ts

@@ -0,0 +1,60 @@
+/*
+ * JSONFunctions.serializeValue had no Array.isArray branch. Arrays are
+ * typeof "object", so any array that reached it directly was walked by key and
+ * written out as { "0": ..., "1": ... }. Two shapes hit that path:
+ *
+ *   - an array nested directly inside another array, e.g. the
+ *     [facetKey, value] filter tuples of a telemetry saved view;
+ *   - a top-level array handed to LocalStorage/SessionStorage/Cookie, which
+ *     call serializeValue on the value itself rather than on a wrapper object.
+ *
+ * (An array under an object key was always safe, at any depth, because
+ * serialize() special-cases array-valued keys.)
+ *
+ * The serializer is fixed, but values written before the fix are still in
+ * databases and in browser storage. readLegacySerializedArray reads either
+ * shape, so those values load instead of being thrown away — or, worse,
+ * destructured and taking the page down with them.
+ */
+
+export function readLegacySerializedArray(
+  value: unknown,
+): Array<unknown> | null {
+  if (Array.isArray(value)) {
+    return value;
+  }
+
+  if (!value || typeof value !== "object") {
+    return null;
+  }
+
+  const record: Record<string, unknown> = value as Record<string, unknown>;
+  const keys: Array<string> = Object.keys(record);
+
+  /*
+   * An empty object is what an empty array serialized to, and in every place
+   * this is used an empty collection is the sensible reading.
+   */
+  if (keys.length === 0) {
+    return [];
+  }
+
+  /*
+   * Only a complete run of indices 0..n-1 could have come from an array. A
+   * genuine object that merely happens to have a "0" key keeps its own shape
+   * and is rejected here.
+   */
+  for (let index: number = 0; index < keys.length; index++) {
+    if (!Object.prototype.hasOwnProperty.call(record, String(index))) {
+      return null;
+    }
+  }
+
+  const restored: Array<unknown> = [];
+
+  for (let index: number = 0; index < keys.length; index++) {
+    restored.push(record[String(index)]);
+  }
+
+  return restored;
+}