@oneuptime/common 11.3.25 → 11.3.26

package/Types/AI/AIChatTypes.ts

@@ -0,0 +1,231 @@
+import { JSONObject } from "../JSON";
+
+/*
+ * Shared types for the AI observability chat feature. These shapes are
+ * persisted as JSON columns on AIConversationMessage / AIRun / AIRunEvent and
+ * rendered by the dashboard, so they must stay JSON-serializable.
+ */
+
+/*
+ * Where a citation chip should deep-link to in the dashboard. The dashboard
+ * maps each target type onto its own RouteMap entry.
+ */
+export enum AIChatCitationTargetType {
+  Logs = "Logs",
+  Traces = "Traces",
+  TraceView = "TraceView",
+  Metrics = "Metrics",
+  Exceptions = "Exceptions",
+  Incidents = "Incidents",
+  IncidentView = "IncidentView",
+  Alerts = "Alerts",
+  AlertView = "AlertView",
+  Monitors = "Monitors",
+  MonitorView = "MonitorView",
+}
+
+export interface AIChatCitationTarget {
+  type: AIChatCitationTargetType;
+  // Route params keyed by param name (e.g. { traceId: "abc" }).
+  params?: { [key: string]: string };
+}
+
+/*
+ * Citations are minted server-side from validated tool arguments — never by
+ * the model. rowCount 0 is meaningful: it is proof of absence ("checked,
+ * found nothing").
+ */
+export interface AIChatCitation {
+  id: string; // "C1", "C2" — sequential per message
+  toolName: string;
+  label: string;
+  queryArguments: JSONObject; // validated tool args as executed — replayable
+  rowCount: number;
+  target?: AIChatCitationTarget | undefined;
+}
+
+/*
+ * ---------------------------------------------------------------------------
+ * Inline widgets
+ * ---------------------------------------------------------------------------
+ * A tool can attach a widget to its result. The widget is persisted on the
+ * assistant message (AIConversationMessage.widgets) and rendered inline in the
+ * chat by the dashboard. Widget `data` is type-specific and MUST stay
+ * JSON-serializable. Unlike the text sent to the LLM, widget data is built from
+ * the RAW rows (not the redacted/truncated LLM payload) because it is rendered
+ * back to the same user who already has RBAC access to it.
+ */
+export enum AIChatWidgetType {
+  // A time-series line chart (e.g. a metric aggregated over time).
+  TimeSeriesChart = "TimeSeriesChart",
+  // A bar chart, optionally stacked (e.g. log volume by severity over time).
+  BarChart = "BarChart",
+  // A generic sortable table.
+  Table = "Table",
+  // A trace waterfall (span tree with durations).
+  TraceWaterfall = "TraceWaterfall",
+  // A list of incident cards.
+  IncidentList = "IncidentList",
+  // A list of alert cards.
+  AlertList = "AlertList",
+  // A list of exception cards.
+  ExceptionList = "ExceptionList",
+  // KPI stat tiles.
+  StatCards = "StatCards",
+  // A single created/updated resource (e.g. the incident the agent just made).
+  ResourceCard = "ResourceCard",
+}
+
+/*
+ * One point in a chart series. x is an ISO timestamp (time charts) or a
+ * category label (categorical charts); y is the numeric value.
+ */
+export interface AIChatWidgetPoint {
+  x: string;
+  y: number | null;
+}
+
+export interface AIChatWidgetSeries {
+  name: string;
+  points: Array<AIChatWidgetPoint>;
+}
+
+export interface AIChatWidgetColumn {
+  key: string;
+  title: string;
+  // Rough hint for alignment/formatting in the renderer.
+  type?: "text" | "number" | "date" | undefined;
+}
+
+export interface AIChatWidgetStat {
+  label: string;
+  value: string | number;
+  unit?: string | undefined;
+}
+
+export interface AIChatWidgetSpan {
+  spanId: string;
+  parentSpanId?: string | undefined;
+  name: string;
+  // Offset of the span start from the trace start, in milliseconds.
+  startOffsetMs: number;
+  durationMs: number;
+  isError: boolean;
+  serviceName?: string | undefined;
+}
+
+/*
+ * Type-specific widget payload. Only the fields relevant to `type` are set:
+ * - TimeSeriesChart / BarChart: `series` (+ `stacked`, `unit`, `xIsTime`)
+ * - Table: `columns` + `rows`
+ * - TraceWaterfall: `spans` + `totalDurationMs`
+ * - IncidentList / AlertList / ExceptionList: `items`
+ * - StatCards: `stats`
+ * - ResourceCard: `resourceType`, `heading`, `subheading`, `fields`, `link`
+ */
+export interface AIChatWidgetData {
+  series?: Array<AIChatWidgetSeries> | undefined;
+  stacked?: boolean | undefined;
+  xIsTime?: boolean | undefined;
+  unit?: string | undefined;
+  valueLabel?: string | undefined;
+  columns?: Array<AIChatWidgetColumn> | undefined;
+  rows?: Array<JSONObject> | undefined;
+  spans?: Array<AIChatWidgetSpan> | undefined;
+  totalDurationMs?: number | undefined;
+  items?: Array<JSONObject> | undefined;
+  stats?: Array<AIChatWidgetStat> | undefined;
+  resourceType?: string | undefined;
+  heading?: string | undefined;
+  subheading?: string | undefined;
+  fields?: Array<{ label: string; value: string }> | undefined;
+  link?: AIChatCitationTarget | undefined;
+}
+
+export interface AIChatWidget {
+  id: string; // "W1", "W2" — sequential per message
+  citationId?: string | undefined; // correlates to the citation of the same tool call
+  type: AIChatWidgetType;
+  title: string;
+  description?: string | undefined;
+  data: AIChatWidgetData;
+}
+
+/*
+ * ---------------------------------------------------------------------------
+ * Tool actions (mutations + approvals)
+ * ---------------------------------------------------------------------------
+ * When the agent wants to run a mutating tool it records an AIChatToolAction on
+ * the assistant message. In "Ask for approval" mode the action starts Pending
+ * and the run pauses until the user approves/denies it; the resumed run then
+ * executes approved actions and marks them Executed/Failed.
+ */
+export enum AIChatToolActionStatus {
+  Pending = "Pending", // awaiting the user's decision
+  Approved = "Approved", // user approved; not yet executed
+  Denied = "Denied", // user declined
+  Executed = "Executed", // ran successfully
+  Failed = "Failed", // ran but failed
+  Skipped = "Skipped", // not run (e.g. budget exhausted)
+}
+
+export interface AIChatToolAction {
+  id: string; // equals the LLM tool call id
+  toolName: string;
+  title: string; // human label, e.g. "Create incident: Checkout is down"
+  description?: string | undefined;
+  arguments: JSONObject;
+  isMutation: boolean;
+  requiresApproval: boolean;
+  status: AIChatToolActionStatus;
+  resultSummary?: string | undefined;
+}
+
+export interface AIRunEventResultSummary {
+  rowCount?: number | undefined;
+  durationInMs?: number | undefined;
+  isTruncated?: boolean | undefined;
+  bytesSentToLlm?: number | undefined;
+  errorMessage?: string | undefined;
+}
+
+// What was sent to which LLM during a run — the per-run egress manifest.
+export interface AIRunEgressManifestToolEntry {
+  toolName: string;
+  rowCount: number;
+  bytesSentToLlm: number;
+  redactionCount: number;
+}
+
+/*
+ * The serialized in-flight state of a turn that paused to wait for tool
+ * approval. Persisted on AIRun.pausedState so ChatAgentRunner.resumeTurn can
+ * rehydrate the exact conversation and continue the loop. `messages` and
+ * `pendingToolCalls` are JSON projections of the runner's internal
+ * LLMMessage / LLMToolCall types (kept as JSONObject here so this shared type
+ * does not depend on server code).
+ */
+export interface AIRunPausedState {
+  messages: Array<JSONObject>;
+  pendingToolCalls: Array<JSONObject>;
+  llmCallCount: number;
+  toolCallCount: number;
+  totalTokens: number;
+  totalCostInUSDCents: number;
+  eventSequence: number;
+  citations: Array<AIChatCitation>;
+  widgets: Array<AIChatWidget>;
+  toolActions: Array<AIChatToolAction>;
+  egressToolEntries: Array<AIRunEgressManifestToolEntry>;
+  startedAtMs: number;
+}
+
+export interface AIRunEgressManifest {
+  llmProviderName?: string | undefined;
+  llmType?: string | undefined;
+  modelName?: string | undefined;
+  isGlobalProvider?: boolean | undefined;
+  llmCallCount: number;
+  totalTokens: number;
+  toolDataSentToLlm: Array<AIRunEgressManifestToolEntry>;
+}

package/Types/AI/AIRunEventType.ts

@@ -0,0 +1,17 @@
+enum AIRunEventType {
+  RunStarted = "RunStarted",
+  LlmCallStarted = "LlmCallStarted",
+  LlmCallCompleted = "LlmCallCompleted",
+  ToolCallStarted = "ToolCallStarted",
+  ToolCallCompleted = "ToolCallCompleted",
+  ToolCallFailed = "ToolCallFailed",
+  // The run paused to ask the user to approve one or more mutating actions.
+  ApprovalRequested = "ApprovalRequested",
+  // A mutating action the user approved was executed (or denied and skipped).
+  ActionExecuted = "ActionExecuted",
+  ActionDenied = "ActionDenied",
+  RunCompleted = "RunCompleted",
+  RunFailed = "RunFailed",
+}
+
+export default AIRunEventType;

package/Types/AI/AIRunStatus.ts

@@ -0,0 +1,28 @@
+enum AIRunStatus {
+  Running = "Running",
+  /*
+   * The run paused mid-turn to wait for the user to approve pending tool
+   * actions (see AIChatPermissionMode.AskForApproval). It is not terminal — it
+   * resumes when the user responds — but it is also not actively consuming
+   * compute, so the stale-run sweeper (which only touches Running runs) leaves
+   * it alone.
+   */
+  WaitingForApproval = "WaitingForApproval",
+  Completed = "Completed",
+  Error = "Error",
+  Cancelled = "Cancelled",
+  Stale = "Stale",
+}
+
+export default AIRunStatus;
+
+export class AIRunStatusHelper {
+  public static isTerminalStatus(status: AIRunStatus): boolean {
+    return (
+      status === AIRunStatus.Completed ||
+      status === AIRunStatus.Error ||
+      status === AIRunStatus.Cancelled ||
+      status === AIRunStatus.Stale
+    );
+  }
+}

package/Types/AI/AIRunType.ts

@@ -0,0 +1,6 @@
+enum AIRunType {
+  Chat = "Chat",
+  Investigation = "Investigation",
+}
+
+export default AIRunType;

package/Types/LLM/LlmType.ts

@@ -5,6 +5,12 @@ enum LlmType {
   Groq = "Groq",
   Mistral = "Mistral",
   Ollama = "Ollama",
+  /*
+   * Generic OpenAI-compatible servers (vLLM, LocalAI, LM Studio, text-gen-webui,
+   * etc.) that speak the OpenAI /chat/completions wire format but are typically
+   * self-hosted at a custom base URL and often require no API key.
+   */
+  OpenAICompatible = "OpenAICompatible",
 }
 
 export default LlmType;

package/UI/Components/Header/HeaderIconDropdownButton.tsx

@@ -37,21 +37,28 @@ const HeaderIconDropdownButton: FunctionComponent<ComponentProps> = (
     setIsComponentVisible(Boolean(props.showDropdown));
   }, [props.showDropdown]);
 
+  const hasLabel: boolean = Boolean(props.title);
+  const hasDropdown: boolean = Boolean(props.children);
+
+  const sizeClassName: string = hasLabel
+    ? "h-9 gap-1.5 pl-2.5 pr-3"
+    : "h-9 w-9 justify-center";
+
   return (
-    <div className="relative ml-1 flex-shrink-0">
+    <div className="relative ml-2 flex-shrink-0">
       <div>
         <button
           type="button"
-          className="flex items-center justify-center h-9 w-9 rounded-lg bg-gray-50 border border-gray-200 hover:bg-gray-100 hover:border-gray-300 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-1 transition-all duration-150"
-          id="user-menu-button"
-          aria-expanded="false"
-          aria-haspopup="true"
+          className={`flex items-center rounded-lg border border-gray-200 bg-gray-50 hover:bg-gray-100 hover:border-gray-300 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-1 transition-all duration-150 ${sizeClassName}`}
+          id={hasDropdown ? "user-menu-button" : undefined}
+          aria-expanded={hasDropdown ? isDropdownVisible : undefined}
+          aria-haspopup={hasDropdown ? "true" : undefined}
           onClick={() => {
             props.onClick?.();
             setIsComponentVisible(!isDropdownVisible);
           }}
         >
-          <span className="sr-only">{props.name}</span>
+          {!hasLabel && <span className="sr-only">{props.name}</span>}
           {props.iconImageUrl && (
             <Image
               className="h-7 w-7 rounded-md object-cover"
@@ -63,14 +70,17 @@ const HeaderIconDropdownButton: FunctionComponent<ComponentProps> = (
             />
           )}
           {props.icon && (
-            <Icon className="h-5 w-5 text-gray-500" icon={props.icon} />
+            <Icon
+              className={`${hasLabel ? "h-4 w-4" : "h-5 w-5"} text-gray-500`}
+              icon={props.icon}
+            />
+          )}
+          {hasLabel && (
+            <span className="text-sm font-medium text-gray-700 whitespace-nowrap">
+              {props.title}
+            </span>
           )}
         </button>
-        {props.title && (
-          <span className="ml-2 text-sm font-medium text-gray-700">
-            {props.title}
-          </span>
-        )}
         {props.badge && props.badge > 0 && (
           <span className="absolute -top-1 -right-1 flex h-5 w-5 items-center justify-center rounded-full bg-red-500 text-xs font-semibold text-white ring-2 ring-white">
             {props.badge}

package/UI/Components/Markdown.tsx/MarkdownViewer.tsx

@@ -144,6 +144,14 @@ const MermaidDiagram: FunctionComponent<{ chart: string }> = ({
 
 export interface ComponentProps {
   text: string;
+  /*
+   * Hardened rendering for untrusted / LLM-generated content. When true, links
+   * render as non-clickable text and images are never fetched — both are
+   * neutralized on react-markdown's PARSED tree, so (unlike pre-processing the
+   * raw markdown with regexes) no CommonMark syntax trick can smuggle a
+   * clickable exfil link or a zero-click tracking pixel through.
+   */
+  safeMode?: boolean;
 }
 
 // Language display names
@@ -348,6 +356,9 @@ const extractTextFromChildren: (children: unknown) => string = (
 const MarkdownViewer: FunctionComponent<ComponentProps> = (
   props: ComponentProps,
 ): ReactElement => {
+  // Captured here because the component overrides below shadow `props`.
+  const safeMode: boolean = props.safeMode === true;
+
   return (
     <div className="max-w-none">
       <ReactMarkdown
@@ -409,19 +420,40 @@ const MarkdownViewer: FunctionComponent<ComponentProps> = (
               />
             );
           },
-          a: ({ ...props }: any) => {
+          a: ({ children, ...props }: any) => {
+            if (safeMode) {
+              // Keep the link text, drop the href: no navigation, no exfil.
+              return (
+                <span className="underline decoration-dotted text-gray-700 font-medium">
+                  {children}
+                </span>
+              );
+            }
             return (
               <a
                 className="underline text-blue-600 hover:text-blue-800 font-medium transition-colors"
                 {...props}
-              />
+              >
+                {children}
+              </a>
             );
           },
-          img: ({ ...props }: any) => {
+          img: ({ alt, ...props }: any) => {
+            if (safeMode) {
+              /*
+               * Never emit an <img> for untrusted content — the browser would
+               * fetch its src on render (a zero-click exfil channel). Show the
+               * alt text (already plain, React-escaped) instead.
+               */
+              return alt ? (
+                <span className="text-gray-500 italic">{`[image: ${alt}]`}</span>
+              ) : null;
+            }
             return (
               <img
                 className="max-w-full h-auto rounded-md border border-gray-200 my-3"
                 loading="lazy"
+                alt={alt}
                 {...props}
               />
             );

package/UI/Components/Page/Page.tsx

@@ -10,6 +10,12 @@ import React, { FunctionComponent, ReactElement, useEffect } from "react";
 
 export interface ComponentProps {
   title?: string | undefined;
+  /*
+   * Optional one-line subtitle rendered under the title. Use it to say what the
+   * page is for when the title alone is not self-explanatory. Kept optional so
+   * existing pages that carry their description in a content card are unchanged.
+   */
+  description?: string | undefined;
   breadcrumbLinks?: Array<Link> | undefined;
   children: Array<ReactElement> | ReactElement;
   sideMenu?: undefined | ReactElement;
@@ -25,6 +31,9 @@ const Page: FunctionComponent<ComponentProps> = (
 ): ReactElement => {
   const { translateString } = useTranslateValue();
   const translatedTitle: string | undefined = translateString(props.title);
+  const translatedDescription: string | undefined = translateString(
+    props.description,
+  );
 
   useEffect(() => {
     if (props.breadcrumbLinks && props.breadcrumbLinks.length > 0) {
@@ -92,6 +101,11 @@ const Page: FunctionComponent<ComponentProps> = (
                   <h1 className="text-xl font-semibold leading-7 text-gray-900 sm:text-xl sm:tracking-tight sm:truncate">
                     {translatedTitle}
                   </h1>
+                  {translatedDescription && (
+                    <p className="max-w-3xl text-sm leading-6 text-gray-500">
+                      {translatedDescription}
+                    </p>
+                  )}
                 </div>
                 {props.headerRight && (
                   <div className="flex flex-wrap items-center sm:justify-end gap-3">

package/UI/Utils/LlmTypeDropdownOptions.ts

@@ -0,0 +1,40 @@
+import { DropdownOption } from "../Components/Dropdown/Dropdown";
+import LlmType from "../../Types/LLM/LlmType";
+
+/*
+ * Human-friendly display labels for each LLM provider. The dropdown `value`
+ * remains the raw LlmType enum value (which is persisted in the database), so
+ * only the label shown to the user changes.
+ */
+const LlmTypeDropdownOptions: Array<DropdownOption> = [
+  {
+    label: "OpenAI",
+    value: LlmType.OpenAI,
+  },
+  {
+    label: "Azure OpenAI",
+    value: LlmType.AzureOpenAI,
+  },
+  {
+    label: "Anthropic",
+    value: LlmType.Anthropic,
+  },
+  {
+    label: "Groq",
+    value: LlmType.Groq,
+  },
+  {
+    label: "Mistral",
+    value: LlmType.Mistral,
+  },
+  {
+    label: "Ollama",
+    value: LlmType.Ollama,
+  },
+  {
+    label: "OpenAI-Compatible (vLLM, LocalAI, etc.)",
+    value: LlmType.OpenAICompatible,
+  },
+];
+
+export default LlmTypeDropdownOptions;

package/UI/Utils/TestLLMProvider.ts

@@ -0,0 +1,59 @@
+import URL from "../../Types/API/URL";
+import Dictionary from "../../Types/Dictionary";
+import HTTPErrorResponse from "../../Types/API/HTTPErrorResponse";
+import HTTPResponse from "../../Types/API/HTTPResponse";
+import { JSONObject } from "../../Types/JSON";
+import { APP_API_URL } from "../Config";
+import API from "./API/API";
+
+export interface LLMProviderTestResult {
+  success: boolean;
+  message: string;
+}
+
+export default class TestLLMProvider {
+  /*
+   * Sends a small test prompt to an LLM provider (by id) via the
+   * /llm-provider/test endpoint and returns a friendly success/failure result.
+   * Callers pass the appropriate common headers (project tenant header for
+   * project providers, or none for admin/global providers).
+   */
+  public static async test(data: {
+    llmProviderId: string;
+    headers?: Dictionary<string> | undefined;
+  }): Promise<LLMProviderTestResult> {
+    try {
+      const response: HTTPResponse<JSONObject> | HTTPErrorResponse =
+        await API.post({
+          url: URL.fromString(APP_API_URL.toString()).addRoute(
+            "/llm-provider/test",
+          ),
+          data: {
+            llmProviderId: data.llmProviderId,
+          },
+          ...(data.headers ? { headers: data.headers } : {}),
+        });
+
+      if (response.isFailure()) {
+        return {
+          success: false,
+          message: API.getFriendlyMessage(response),
+        };
+      }
+
+      const responseData: JSONObject = response.data as JSONObject;
+
+      return {
+        success: true,
+        message:
+          (responseData["message"] as string) ||
+          "Connection successful. The LLM provider responded to a test prompt.",
+      };
+    } catch (err) {
+      return {
+        success: false,
+        message: API.getFriendlyMessage(err),
+      };
+    }
+  }
+}