@trilogy-data/trilogy-studio-components 0.1.0

package/dist/LLMView-lUTKOMbr.js

@@ -0,0 +1,558 @@
+import { defineComponent as q, inject as R, ref as y, computed as D, watch as M, nextTick as X, onMounted as Z, createElementBlock as u, openBlock as d, createElementVNode as a, createCommentVNode as b, createTextVNode as N, withDirectives as B, Fragment as U, renderList as V, toDisplayString as h, vModelSelect as x, normalizeClass as T, withKeys as ee, withModifiers as te, vModelText as ne, resolveComponent as O, createBlock as j, createVNode as se, withCtx as G } from "vue";
+import { y as A, z as oe, a as Q, B as ae, F as ie, I as re } from "./main-oVvKtGNk.js";
+const P = [
+  { name: "id", type: "int" },
+  { name: "quantity", type: "float" },
+  { name: "extended_price", type: "float::money" },
+  { name: "discount", type: "float::percent", description: "percent discount" },
+  { name: "tax", type: "float::percent", description: "tax, as percentage" },
+  { name: "return_flag", type: "string" },
+  { name: "line_status", type: "string" },
+  { name: "ship_date", type: "date" },
+  { name: "commit_date", type: "date" },
+  { name: "receipt_date", type: "date" },
+  { name: "ship_instruct", type: "string" },
+  { name: "ship_mode", type: "string" },
+  { name: "comment", type: "string" },
+  { name: "supplier.id", type: "int" },
+  { name: "supplier.nation.name", type: "string" },
+  { name: "supplier.name", type: "string" },
+  { name: "order.id", type: "int" },
+  { name: "order.date", type: "date" },
+  { name: "order.customer.name", type: "string" },
+  { name: "order.customer.nation.name", type: "string" },
+  { name: "order.customer.id", type: "int" }
+], le = [
+  {
+    name: "Basic Query",
+    description: "Tests if the LLM can create a simple trilogy query from user input.",
+    prompt: A("what were sales for the last 3 months by order date?", P),
+    expectedResponse: {
+      contains: ["extended_price"],
+      mustIdentify: "order.date",
+      notContains: ["FROM"]
+    }
+  },
+  {
+    name: "Aggregate Query",
+    description: "Tests if the LLM can generate an aggregate query.",
+    prompt: A("what are sales by supplier name and nation?", P),
+    expectedResponse: {
+      contains: ["extended_price"],
+      mustIdentify: "supplier.nation.name",
+      notContains: ["FROM", "GROUP BY"]
+    }
+  },
+  {
+    name: "Complex Query",
+    description: "Tests for a more complex query, with limits and ordering.",
+    prompt: A("Who were the top ten customers by sales in august 1995?", P),
+    expectedResponse: {
+      contains: ["extended_price", "order.customer.name", "8"],
+      mustIdentify: "order.customer.name",
+      notContains: ["FROM", "GROUP BY"]
+    }
+  },
+  {
+    name: "Multi-part Conditions",
+    description: "Tests for a query that includes multiple conditions.",
+    prompt: A(
+      "Who were the top ten customers by sales in august 1995 who had orders that shipped in october or september?",
+      P
+    ),
+    expectedResponse: {
+      contains: ["extended_price", "order.customer.name", "8"],
+      mustIdentify: "order.customer.name",
+      notContains: ["FROM", "GROUP BY"]
+    }
+  },
+  {
+    name: "Test Count(*) Handling",
+    description: "Test proper counting of identifiers",
+    prompt: A("How many customers are there by country?", P),
+    expectedResponse: {
+      contains: ["order.customer.id"],
+      mustIdentify: "order.customer.nation.name",
+      notContains: ["FROM", "GROUP BY", "*"]
+    }
+  }
+], de = q({
+  name: "LLMValidationView",
+  props: {
+    initialProvider: {
+      type: String,
+      default: ""
+    }
+  },
+  setup(e) {
+    const s = R("llmConnectionStore"), r = y([]), I = y(""), i = y(!1), L = y(!1), t = y(""), c = y(null), f = y([]), S = y([]), C = 5, $ = 4, o = y(
+      e.initialProvider || (Object.keys(s.connections).length > 0 ? Object.keys(s.connections)[0] : "")
+    ), g = y(le), E = D(() => Object.keys(s.connections)), k = D(() => !!o.value && s.getConnection(o.value) !== null);
+    M(r, () => {
+      X(() => {
+        c.value && (c.value.scrollTop = c.value.scrollHeight);
+      });
+    });
+    const W = (p) => p ? s.getConnectionStatus(p) : "disconnected", Y = (p, l) => {
+      const n = { passed: !0 };
+      let v = oe(p);
+      if (l.contains) {
+        for (const m of l.contains)
+          if (!v.toLowerCase().includes(m.toLowerCase()))
+            return n.passed = !1, n.reason = `Response missing expected phrase: "${m}"`, n;
+      }
+      if (l.notContains)
+        for (const m of l.notContains) {
+          const w = v.split(`
+`);
+          for (const _ of w)
+            if (!_.trim().startsWith("#") && _.toLowerCase().includes(m.toLowerCase()))
+              return n.passed = !1, n.reason = `Response contains forbidden phrase: "${m}"`, n;
+        }
+      if (l.mustIdentify) {
+        const m = v.toLowerCase(), w = l.mustIdentify.toLowerCase();
+        if (!m.includes(w) && !H(m, w))
+          return n.passed = !1, n.reason = `Response did not identify the issue: "${l.mustIdentify}"`, n;
+      }
+      return n;
+    }, H = (p, l) => {
+      const n = {
+        "missing index": [
+          "no index",
+          "should create index",
+          "index would improve",
+          "needs an index"
+        ]
+      };
+      return l in n ? n[l].some((v) => p.includes(v)) : !1;
+    }, z = async () => {
+      if (!I.value.trim() || i.value || !o.value) return;
+      r.value.push({
+        role: "user",
+        content: I.value
+      });
+      const p = I.value;
+      I.value = "", i.value = !0, t.value = "";
+      try {
+        const l = {
+          prompt: p
+        }, n = await s.generateCompletion(
+          o.value,
+          l
+        );
+        r.value.push({
+          role: "assistant",
+          content: n.text,
+          modelInfo: {
+            totalTokens: n.usage.totalTokens
+          }
+        });
+      } catch (l) {
+        t.value = l instanceof Error ? l.message : "An unknown error occurred";
+      } finally {
+        i.value = !1;
+      }
+    }, K = async (p) => {
+      const l = g.value[p];
+      try {
+        const n = {
+          prompt: l.prompt
+        }, v = await s.generateCompletion(
+          o.value,
+          n
+        );
+        return Y(v.text, l.expectedResponse);
+      } catch (n) {
+        return {
+          passed: !1,
+          reason: `Error: ${n instanceof Error ? n.message : "An unknown error occurred"}`
+        };
+      }
+    }, F = async (p) => {
+      if (i.value || !o.value) return;
+      const l = g.value[p];
+      r.value = [], r.value.push({
+        role: "user",
+        content: `RUNNING TEST: ${l.name} (${C} iterations)`
+      }), i.value = !0, t.value = "";
+      try {
+        const n = {
+          passed: 0,
+          total: C,
+          runs: []
+        };
+        r.value.push({
+          role: "assistant",
+          content: `Running ${C} iterations of test "${l.name}"...`
+        });
+        for (let m = 0; m < C; m++) {
+          m > 0 && (r.value[r.value.length - 1].content += `
+Running iteration ${m + 1}/${C}...`);
+          const w = await K(p);
+          n.runs.push(w), w.passed && n.passed++;
+        }
+        const v = {
+          passed: n.passed >= $,
+          reason: n.passed >= $ ? void 0 : `Only ${n.passed}/${C} runs passed (need at least ${$})`
+        };
+        f.value[p] = v, S.value[p] = n, r.value[r.value.length - 1].content = `Test "${l.name}" completed: ${n.passed}/${C} runs passed.
+
+${v.passed ? "✓ OVERALL PASSED" : "✗ OVERALL FAILED"}
+
+Iteration Results:
+` + n.runs.map(
+          (m, w) => `Iteration ${w + 1}: ${m.passed ? "✓ PASSED" : "✗ FAILED"}${m.reason ? " - " + m.reason : ""}`
+        ).join(`
+`), r.value[r.value.length - 1].testResult = v;
+      } catch (n) {
+        t.value = n instanceof Error ? n.message : "An unknown error occurred", f.value[p] = {
+          passed: !1,
+          reason: `Error: ${t.value}`
+        };
+      } finally {
+        i.value = !1;
+      }
+    }, J = async () => {
+      if (!(i.value || !o.value)) {
+        L.value = !0, r.value = [], r.value.push({
+          role: "user",
+          content: "RUNNING ALL TESTS IN SEQUENCE (5 iterations each)"
+        });
+        try {
+          for (let n = 0; n < g.value.length; n++)
+            await F(n), n < g.value.length - 1 && await new Promise((v) => setTimeout(v, 500));
+          const p = Object.values(f.value).filter((n) => n == null ? void 0 : n.passed).length, l = Object.values(f.value).filter(
+            (n) => n && !n.passed
+          ).length;
+          r.value.push({
+            role: "user",
+            content: `ALL TESTS COMPLETED: ${p} passed, ${l} failed`
+          });
+        } catch (p) {
+          t.value = p instanceof Error ? p.message : "An unknown error occurred";
+        } finally {
+          L.value = !1;
+        }
+      }
+    };
+    return Z(() => {
+      E.value.length === 0 && (t.value = "No LLM connections found. Please add connections in the sidebar.");
+    }), {
+      messages: r,
+      userInput: I,
+      isLoading: i,
+      isRunningAll: L,
+      error: t,
+      selectedProvider: o,
+      availableProviders: E,
+      isProviderSelected: k,
+      messagesContainer: c,
+      getConnectionStatus: W,
+      sendPrompt: z,
+      scenarios: g,
+      runScenario: F,
+      scenarioResults: f,
+      testRunDetails: S,
+      runAllScenarios: J
+    };
+  }
+}), ce = { class: "debug-container" }, ue = { class: "llm-chat-container" }, pe = { class: "connection-controls" }, me = { class: "provider-selector" }, ve = ["value"], he = { key: 0 }, fe = {
+  key: 0,
+  class: "error-message"
+}, ye = {
+  class: "chat-messages",
+  ref: "messagesContainer"
+}, ge = { class: "message-header" }, Ce = {
+  key: 0,
+  class: "model-info"
+}, be = { class: "message-content" }, Ie = {
+  key: 0,
+  class: "failure-reason"
+}, Se = { class: "input-container" }, we = ["disabled"], Le = ["disabled"], Re = { class: "scenarios-container" }, Te = { class: "section-header" }, $e = { class: "header-controls" }, ke = ["disabled"], Ae = {
+  key: 0,
+  class: "pass-indicator text-small"
+}, Pe = { class: "scenarios-list" }, Me = ["onClick"], Ee = { class: "scenario-name" }, Ne = { class: "scenario-description" }, _e = {
+  key: 0,
+  class: "scenario-result-indicator"
+}, Ue = {
+  key: 0,
+  class: "pass-indicator"
+}, Ve = {
+  key: 1,
+  class: "fail-indicator"
+}, Oe = {
+  key: 1,
+  class: "test-run-details"
+};
+function Fe(e, s, r, I, i, L) {
+  return d(), u("div", ce, [
+    a("div", ue, [
+      s[6] || (s[6] = a("div", { class: "section-header" }, [
+        N(" LLM Validation "),
+        a("span", { class: "text-faint text-small" }, "Test that your LLM connection will deliver acceptable experience.")
+      ], -1)),
+      a("div", pe, [
+        a("div", me, [
+          s[5] || (s[5] = a("label", { for: "provider-select" }, "Provider:", -1)),
+          B(a("select", {
+            id: "provider-select",
+            "onUpdate:modelValue": s[0] || (s[0] = (t) => e.selectedProvider = t)
+          }, [
+            (d(!0), u(U, null, V(e.availableProviders, (t) => (d(), u("option", {
+              key: t,
+              value: t
+            }, [
+              N(h(t) + " ", 1),
+              e.getConnectionStatus(t) ? (d(), u("span", he, " (" + h(e.getConnectionStatus(t)) + ") ", 1)) : b("", !0)
+            ], 8, ve))), 128))
+          ], 512), [
+            [x, e.selectedProvider]
+          ]),
+          a("span", {
+            class: T(["status-indicator", e.getConnectionStatus(e.selectedProvider)])
+          }, null, 2)
+        ])
+      ]),
+      e.error ? (d(), u("div", fe, h(e.error), 1)) : b("", !0),
+      a("div", ye, [
+        (d(!0), u(U, null, V(e.messages, (t, c) => (d(), u("div", {
+          key: c,
+          class: T(["message", t.role])
+        }, [
+          a("div", ge, [
+            a("strong", null, h(t.role === "user" ? "You" : "AI"), 1),
+            t.role === "assistant" && t.modelInfo ? (d(), u("span", Ce, h(t.modelInfo.totalTokens) + " tokens ", 1)) : b("", !0)
+          ]),
+          a("div", be, [
+            a("pre", null, h(t.content), 1)
+          ]),
+          t.testResult ? (d(), u("div", {
+            key: 0,
+            class: T(["test-result", t.testResult.passed ? "passed" : "failed"])
+          }, [
+            N(" Test: " + h(t.testResult.passed ? "PASSED ✓" : "FAILED ✗") + " ", 1),
+            t.testResult.passed ? b("", !0) : (d(), u("div", Ie, h(t.testResult.reason), 1))
+          ], 2)) : b("", !0)
+        ], 2))), 128))
+      ], 512),
+      a("div", Se, [
+        B(a("textarea", {
+          "onUpdate:modelValue": s[1] || (s[1] = (t) => e.userInput = t),
+          onKeydown: s[2] || (s[2] = ee(te((...t) => e.sendPrompt && e.sendPrompt(...t), ["ctrl"]), ["enter"])),
+          placeholder: "Type your message here... (Ctrl+Enter to send)",
+          disabled: e.isLoading || !e.isProviderSelected
+        }, "        ", 40, we), [
+          [ne, e.userInput]
+        ]),
+        a("button", {
+          onClick: s[3] || (s[3] = (...t) => e.sendPrompt && e.sendPrompt(...t)),
+          disabled: e.isLoading || !e.userInput.trim() || !e.isProviderSelected
+        }, h(e.isLoading ? "Sending..." : "Send"), 9, Le)
+      ])
+    ]),
+    a("div", Re, [
+      a("div", Te, [
+        s[7] || (s[7] = N(" Test Scenarios ", -1)),
+        a("div", $e, [
+          a("button", {
+            onClick: s[4] || (s[4] = (...t) => e.runAllScenarios && e.runAllScenarios(...t)),
+            disabled: e.isLoading || !e.isProviderSelected,
+            class: "run-all-button"
+          }, h(e.isRunningAll ? "Running..." : "Run All Tests"), 9, ke),
+          Object.values(e.scenarioResults).length == e.scenarios.length && Object.values(e.scenarioResults).every((t) => t == null ? void 0 : t.passed) ? (d(), u("span", Ae, "✓ All passed, LLM integration should meet expectations!")) : b("", !0)
+        ])
+      ]),
+      a("div", Pe, [
+        (d(!0), u(U, null, V(e.scenarios, (t, c) => {
+          var f;
+          return d(), u("div", {
+            key: c,
+            class: T(["scenario-item", { passed: (f = e.scenarioResults[c]) == null ? void 0 : f.passed }]),
+            onClick: (S) => e.runScenario(c)
+          }, [
+            a("div", Ee, h(t.name), 1),
+            a("div", Ne, h(t.description), 1),
+            e.scenarioResults[c] ? (d(), u("div", _e, [
+              e.scenarioResults[c].passed ? (d(), u("span", Ue, "✓")) : (d(), u("span", Ve, "✗"))
+            ])) : b("", !0),
+            e.testRunDetails[c] ? (d(), u("div", Oe, h(e.testRunDetails[c].passed) + "/5 runs passed ", 1)) : b("", !0)
+          ], 10, Me);
+        }), 128))
+      ])
+    ])
+  ]);
+}
+const De = /* @__PURE__ */ Q(de, [["render", Fe], ["__scopeId", "data-v-b89d0ed5"]]), Be = q({
+  name: "LLMChatDebugComponent",
+  components: {
+    LLMChatSplitView: ie,
+    LLMValidationView: De,
+    DashboardImportSelector: ae
+  },
+  props: {
+    initialProvider: {
+      type: String,
+      default: ""
+    },
+    initialModel: {
+      type: String,
+      default: ""
+    },
+    initialTab: {
+      type: String,
+      default: ""
+    }
+  },
+  setup(e) {
+    const s = R("llmConnectionStore"), r = R("connectionStore"), I = R("queryExecutionService"), i = R("chatStore"), L = R("editorStore"), t = R("navigationStore"), c = y(
+      e.initialTab === "chat" || e.initialTab === "validation" ? e.initialTab : "chat"
+    ), f = y(null), S = re({
+      llmConnectionStore: s,
+      connectionStore: r,
+      queryExecutionService: I,
+      chatStore: i,
+      editorStore: L,
+      navigationStore: t
+    });
+    M(
+      () => e.initialTab,
+      (o) => {
+        (o === "chat" || o === "validation") && (c.value = o);
+      }
+    );
+    const C = async () => {
+      var g;
+      const o = ((g = i == null ? void 0 : i.activeChat) == null ? void 0 : g.llmConnectionName) || s.activeConnection;
+      if (o && s.getConnectionStatus(o) === "disabled")
+        try {
+          await s.resetConnection(o);
+        } catch (k) {
+          console.error("Failed to auto-connect LLM:", k);
+        }
+    }, $ = async () => {
+      if (!r || !(i != null && i.activeChat)) return;
+      const o = i.activeChat.dataConnectionName;
+      if (!o) return;
+      const g = r.connections[o];
+      if (!g) return;
+      if (r.connectionStateToStatus(g) === "disabled")
+        try {
+          await r.resetConnection(o);
+        } catch (k) {
+          console.error("Failed to auto-connect DB:", k);
+        }
+    };
+    return M(
+      () => c.value,
+      (o) => {
+        o === "chat" && (C(), $());
+      },
+      { immediate: !0 }
+    ), i && (M(
+      () => {
+        var o;
+        return (o = i == null ? void 0 : i.activeChat) == null ? void 0 : o.dataConnectionName;
+      },
+      (o) => {
+        c.value === "chat" && o && $();
+      }
+    ), M(
+      () => {
+        var o;
+        return (o = i == null ? void 0 : i.activeChat) == null ? void 0 : o.llmConnectionName;
+      },
+      (o) => {
+        c.value === "chat" && o && C();
+      }
+    )), {
+      activeView: c,
+      chatSplitView: f,
+      // Spread all chat composable returns
+      ...S
+    };
+  }
+}), je = { class: "llm-view-container" }, Ge = { class: "view-tabs" }, qe = {
+  key: 0,
+  class: "chat-view"
+}, Qe = ["disabled"], We = {
+  key: 0,
+  class: "mdi mdi-auto-fix"
+}, Ye = {
+  key: 1,
+  class: "spinner"
+}, He = { class: "chat-header-controls" }, ze = {
+  key: 1,
+  class: "connection-info"
+};
+function Ke(e, s, r, I, i, L) {
+  const t = O("dashboard-import-selector"), c = O("l-l-m-chat-split-view"), f = O("l-l-m-validation-view");
+  return d(), u("div", je, [
+    a("div", Ge, [
+      a("button", {
+        class: T(["view-tab", { active: e.activeView === "chat" }]),
+        onClick: s[0] || (s[0] = (S) => e.activeView = "chat"),
+        "data-testid": "llm-view-tab-chat"
+      }, " Chat ", 2),
+      a("button", {
+        class: T(["view-tab", { active: e.activeView === "validation" }]),
+        onClick: s[1] || (s[1] = (S) => e.activeView = "validation"),
+        "data-testid": "llm-view-tab-validation"
+      }, " Validation Tests ", 2)
+    ]),
+    e.activeView === "chat" ? (d(), u("div", qe, [
+      se(c, {
+        ref: "chatSplitView",
+        title: e.activeChatTitle,
+        editableTitle: !0,
+        placeholder: "Ask about your data... (Enter to send)",
+        systemPrompt: e.chatSystemPrompt,
+        connectionInfo: e.chatConnectionInfo,
+        availableImports: e.availableImportsForChat,
+        activeImports: e.activeImportsForChat,
+        symbols: e.chatSymbols,
+        initialMessages: e.activeChatMessages,
+        initialArtifacts: e.activeChatArtifacts,
+        initialActiveArtifactIndex: e.activeChatArtifactIndex,
+        externalLoading: e.isChatLoading,
+        activeToolName: e.activeToolName,
+        onSendMessage: e.handleChatMessageWithTools,
+        "onUpdate:messages": e.handleMessagesUpdate,
+        "onUpdate:artifacts": e.handleArtifactsUpdate,
+        "onUpdate:activeArtifactIndex": e.handleActiveArtifactUpdate,
+        onImportChange: e.handleImportChange,
+        onTitleUpdate: e.handleTitleUpdate
+      }, {
+        "header-prefix": G(() => [
+          a("button", {
+            class: T(["auto-name-btn", { "is-loading": e.isGeneratingName }]),
+            onClick: s[2] || (s[2] = (...S) => e.generateChatName && e.generateChatName(...S)),
+            disabled: e.isGeneratingName || e.activeChatMessages.length === 0,
+            title: "Auto-generate chat name",
+            "data-testid": "auto-name-chat-btn"
+          }, [
+            e.isGeneratingName ? (d(), u("span", Ye)) : (d(), u("i", We))
+          ], 10, Qe)
+        ]),
+        "header-actions": G(() => [
+          a("div", He, [
+            e.availableImportsForChat.length > 0 ? (d(), j(t, {
+              key: 0,
+              "available-imports": e.availableImportsForChat,
+              "active-imports": e.activeImportsForChat,
+              "onUpdate:imports": e.handleImportChange
+            }, null, 8, ["available-imports", "active-imports", "onUpdate:imports"])) : b("", !0),
+            e.chatConnectionInfo ? (d(), u("span", ze, h(e.chatConnectionInfo), 1)) : b("", !0)
+          ])
+        ]),
+        _: 1
+      }, 8, ["title", "systemPrompt", "connectionInfo", "availableImports", "activeImports", "symbols", "initialMessages", "initialArtifacts", "initialActiveArtifactIndex", "externalLoading", "activeToolName", "onSendMessage", "onUpdate:messages", "onUpdate:artifacts", "onUpdate:activeArtifactIndex", "onImportChange", "onTitleUpdate"])
+    ])) : (d(), j(f, {
+      key: 1,
+      initialProvider: e.initialProvider
+    }, null, 8, ["initialProvider"]))
+  ]);
+}
+const Ze = /* @__PURE__ */ Q(Be, [["render", Ke], ["__scopeId", "data-v-1e3d990a"]]);
+export {
+  Ze as default
+};

package/dist/Manager-CXJNoqU2.js

@@ -0,0 +1,4 @@
+import { _ as f } from "./main-oVvKtGNk.js";
+export {
+  f as default
+};