@trilogy-data/trilogy-studio-components 0.1.12 → 0.1.14

package/dist/{LLMConnectionList-DZbu1kGq.js → LLMConnectionList-ByLjIXLO.js}

@@ -1,19 +1,19 @@
-var Oe = Object.defineProperty;
-var Be = (t, e, o) => e in t ? Oe(t, e, { enumerable: !0, configurable: !0, writable: !0, value: o }) : t[e] = o;
-var ee = (t, e, o) => Be(t, typeof e != "symbol" ? e + "" : e, o);
-import { defineComponent as ae, ref as S, inject as Y, createElementBlock as l, createCommentVNode as A, openBlock as r, createElementVNode as s, withModifiers as k, withDirectives as N, vModelText as G, vModelSelect as Ee, vModelCheckbox as Pe, Fragment as le, computed as J, createBlock as W, withCtx as q, unref as xe, normalizeClass as me, toDisplayString as j, createTextVNode as ie, renderList as fe, resolveComponent as U, createVNode as O, Transition as be, onMounted as Ie, onUnmounted as Ye, normalizeStyle as Fe, watch as Ae, vModelDynamic as Ge, createStaticVNode as je } from "vue";
-import { K as _, a as z, T as Se, L as Ce, l as Ke, m as Qe, n as Ve, o as Re, S as Me, h as Le, e as De, A as _e, O as Ne, G as qe, p as He, q as We, u as ze, g as Xe } from "./main-Bjg9NFbT.js";
-function Je(t, e, o, i) {
+var Ye = Object.defineProperty;
+var Ge = (t, e, o) => e in t ? Ye(t, e, { enumerable: !0, configurable: !0, writable: !0, value: o }) : t[e] = o;
+var te = (t, e, o) => Ge(t, typeof e != "symbol" ? e + "" : e, o);
+import { defineComponent as ce, ref as C, inject as _, createElementBlock as u, createCommentVNode as M, openBlock as l, createElementVNode as s, withModifiers as R, withDirectives as D, vModelText as B, vModelSelect as Ce, vModelCheckbox as Me, Fragment as pe, computed as z, createBlock as W, withCtx as q, unref as Ke, normalizeClass as me, toDisplayString as F, renderList as we, resolveComponent as x, createVNode as G, Transition as ge, createTextVNode as be, onMounted as Le, watch as Pe, vModelDynamic as je, createStaticVNode as Qe } from "vue";
+import { K as L, a as Z, T as Ae, L as Re, z as Ve, f as De, A as He, B as _e, S as Ne, j as We, e as qe, F as Ue, O as Oe, G as xe, H as ze, I as Xe, u as Je, g as Ze } from "./main-C-6acy1R.js";
+function $e(t, e, o, i) {
   const c = [];
-  return Object.values(t).sort((a, d) => a.connected && !d.connected ? -1 : !a.connected && d.connected ? 1 : a.name.localeCompare(d.name)).forEach((a) => {
+  return Object.values(t).sort((a, p) => a.connected && !p.connected ? -1 : !a.connected && p.connected ? 1 : a.name.localeCompare(p.name)).forEach((a) => {
     if (a.deleted)
       return;
-    let d = a.databases ? a.databases : [];
+    let p = a.databases ? a.databases : [];
     c.push({
       id: a.name,
       name: a.name,
       indent: 0,
-      count: d.length,
+      count: p.length,
       type: "connection",
       searchPath: a.name,
       connection: a
@@ -105,90 +105,90 @@ function Je(t, e, o, i) {
       type: "error",
       searchPath: a.name,
       connection: a
-    }), d.forEach((T) => {
-      const m = `${a.name}${_}${T.name}`;
+    }), p.forEach((w) => {
+      const d = `${a.name}${L}${w.name}`;
       c.push({
-        id: m,
-        name: T.name,
+        id: d,
+        name: w.name,
         indent: 1,
-        count: T.schemas.length,
+        count: w.schemas.length,
         type: "database",
-        searchPath: `${T.name}`,
+        searchPath: `${w.name}`,
         connection: a
-      }), e[m] || (o[m] && c.push({
-        id: `${m}-loading`,
+      }), e[d] || (o[d] && c.push({
+        id: `${d}-loading`,
         name: "Loading...",
         indent: 1,
         count: 0,
         type: "loading",
-        searchPath: `${T.name}`,
+        searchPath: `${w.name}`,
         connection: a
-      }), T.schemas.forEach((R) => {
-        const P = `${m}${_}${R.name}`;
+      }), w.schemas.forEach((S) => {
+        const f = `${d}${L}${S.name}`;
         c.push({
-          id: P,
-          name: R.name,
+          id: f,
+          name: S.name,
           indent: 2,
-          count: R.tables.length,
+          count: S.tables.length,
           type: "schema",
-          searchPath: `${T.name}.${R.name}`,
+          searchPath: `${w.name}.${S.name}`,
           connection: a
-        }), e[P] || (o[P] && c.push({
-          id: `${P}-loading`,
+        }), e[f] || (o[f] && c.push({
+          id: `${f}-loading`,
           name: "Loading...",
           indent: 2,
           count: 0,
           type: "loading",
-          searchPath: `${T.name}.${R.name}`,
+          searchPath: `${w.name}.${S.name}`,
           connection: a
-        }), R.tables.forEach((g) => {
-          const h = `${m}${_}${R.name}${_}${g.name}`;
+        }), S.tables.forEach((N) => {
+          const A = `${d}${L}${S.name}${L}${N.name}`;
           c.push({
-            id: h,
-            name: g.name,
+            id: A,
+            name: N.name,
             indent: 3,
             count: 0,
             type: "table",
-            searchPath: `${T.name}.${R.name}.${g.name}`,
+            searchPath: `${w.name}.${S.name}.${N.name}`,
             connection: a,
-            object: g
+            object: N
           });
         }));
       }));
     }));
   }), c;
 }
-function Ze(t, e) {
+function et(t, e) {
   if (!e || e.trim() === "")
     return t;
   const o = e.toLowerCase().trim(), i = /* @__PURE__ */ new Set();
-  t.forEach((d) => {
-    (d.type === "view-queries" || d.searchPath.toLowerCase().includes(o)) && i.add(d.id);
+  t.forEach((p) => {
+    (p.type === "view-queries" || p.searchPath.toLowerCase().includes(o)) && i.add(p.id);
   });
   const c = /* @__PURE__ */ new Map();
-  for (let d = 0; d < t.length; d++) {
-    const T = t[d];
-    let m = null;
-    for (let R = d - 1; R >= 0; R--) {
-      const P = t[R];
-      if (P.indent < T.indent) {
-        m = P.id;
+  for (let p = 0; p < t.length; p++) {
+    const w = t[p];
+    let d = null;
+    for (let S = p - 1; S >= 0; S--) {
+      const f = t[S];
+      if (f.indent < w.indent) {
+        d = f.id;
         break;
       }
     }
-    m && (c.has(T.id) || c.set(T.id, /* @__PURE__ */ new Set()), c.get(T.id).add(m));
+    d && (c.has(w.id) || c.set(w.id, /* @__PURE__ */ new Set()), c.get(w.id).add(d));
   }
-  const y = new Set(i), a = (d) => {
-    const T = c.get(d);
-    if (T)
-      for (const m of T)
-        y.has(m) || (y.add(m), a(m));
+  const y = new Set(i), a = (p) => {
+    const w = c.get(p);
+    if (w)
+      for (const d of w)
+        y.has(d) || (y.add(d), a(d));
   };
-  return i.forEach((d) => {
-    a(d);
-  }), t.filter((d) => y.has(d.id));
+  return i.forEach((p) => {
+    a(p);
+  }), t.filter((p) => y.has(p.id));
 }
-const $e = ae({
+const tt = ce({
   name: "ConnectionCreator",
   props: {
     visible: {
@@ -207,7 +207,7 @@ const $e = ae({
     }
   },
   setup(t, { emit: e }) {
-    const o = S({
+    const o = C({
       name: "",
       type: "duckdb",
       options: {
@@ -219,7 +219,7 @@ const $e = ae({
         privateKey: "",
         saveCredential: !1
       }
-    }), i = Y("connectionStore"), c = Y("saveConnections"), y = Y("saveAll");
+    }), i = _("connectionStore"), c = _("saveConnections"), y = _("saveAll");
     if (!i || !c || !y)
       throw new Error("must inject connectionStore to ConnectionCreator");
     const a = i.connections;
@@ -246,40 +246,42 @@ const $e = ae({
       }
     };
   }
-}), et = {
+}), nt = {
   key: 0,
   class: "creator-container"
-}, tt = { class: "form-row" }, nt = { class: "form-row" }, ot = {
+}, ot = { class: "form-row" }, it = { class: "form-row" }, at = {
   key: 0,
   class: "form-row"
-}, it = {
+}, st = {
   key: 1,
   class: "form-row"
-}, at = {
+}, rt = {
   key: 2,
   class: "form-row"
-}, st = { class: "form-row" }, rt = { class: "form-row" }, lt = { class: "form-row" }, ct = { class: "button-row" };
-function ut(t, e, o, i, c, y) {
-  return t.visible ? (r(), l("div", et, [
+}, lt = { class: "form-row" }, ct = { class: "form-row" }, ut = { class: "form-row" }, dt = { class: "button-row" };
+function pt(t, e, o, i, c, y) {
+  return t.visible ? (l(), u("div", nt, [
     s("form", {
-      onSubmit: e[11] || (e[11] = k((...a) => t.submitConnectionCreation && t.submitConnectionCreation(...a), ["prevent"]))
+      onSubmit: e[11] || (e[11] = R((...a) => t.submitConnectionCreation && t.submitConnectionCreation(...a), ["prevent"]))
     }, [
-      s("div", tt, [
+      s("div", ot, [
         e[12] || (e[12] = s("label", { for: "connection-name" }, "Name", -1)),
-        N(s("input", {
+        D(s("input", {
           "data-testid": "connection-creator-name",
           type: "text",
           "onUpdate:modelValue": e[0] || (e[0] = (a) => t.connectionDetails.name = a),
+          class: "sidebar-control-input",
           id: "connection-name",
           required: ""
         }, null, 512), [
-          [G, t.connectionDetails.name]
+          [B, t.connectionDetails.name]
         ])
       ]),
-      s("div", nt, [
+      s("div", it, [
         e[14] || (e[14] = s("label", { for: "connection-type" }, "Type", -1)),
-        N(s("select", {
+        D(s("select", {
           "onUpdate:modelValue": e[1] || (e[1] = (a) => t.connectionDetails.type = a),
+          class: "sidebar-control-select",
           id: "connection-type",
           required: ""
         }, [...e[13] || (e[13] = [
@@ -287,98 +289,105 @@ function ut(t, e, o, i, c, y) {
           s("option", { value: "bigquery" }, "Bigquery Oauth", -1),
           s("option", { value: "snowflake" }, "Snowflake", -1)
         ])], 512), [
-          [Ee, t.connectionDetails.type]
+          [Ce, t.connectionDetails.type]
         ])
       ]),
-      t.connectionDetails.type === "motherduck" ? (r(), l("div", ot, [
+      t.connectionDetails.type === "motherduck" ? (l(), u("div", at, [
         e[15] || (e[15] = s("label", { for: "md-token" }, "MotherDuck Token", -1)),
-        N(s("input", {
+        D(s("input", {
           type: "password",
           "onUpdate:modelValue": e[2] || (e[2] = (a) => t.connectionDetails.options.mdToken = a),
+          class: "sidebar-control-input",
           id: "md-token",
           placeholder: "MotherDuck Token",
           required: ""
         }, null, 512), [
-          [G, t.connectionDetails.options.mdToken]
+          [B, t.connectionDetails.options.mdToken]
         ]),
         e[16] || (e[16] = s("label", { for: "save-credential" }, "Save Credential?", -1)),
-        N(s("input", {
+        D(s("input", {
           type: "checkbox",
           id: "save-credential",
           "onUpdate:modelValue": e[3] || (e[3] = (a) => t.connectionDetails.options.saveCredential = a),
           label: "Save Credential?"
         }, null, 512), [
-          [Pe, t.connectionDetails.options.saveCredential]
+          [Me, t.connectionDetails.options.saveCredential]
         ])
-      ])) : A("", !0),
-      t.connectionDetails.type === "bigquery" ? (r(), l("div", it, [
+      ])) : M("", !0),
+      t.connectionDetails.type === "bigquery" ? (l(), u("div", st, [
         e[17] || (e[17] = s("label", { for: "project-id" }, "BigQuery Project ID", -1)),
-        N(s("input", {
+        D(s("input", {
           type: "text",
           "onUpdate:modelValue": e[4] || (e[4] = (a) => t.connectionDetails.options.projectId = a),
+          class: "sidebar-control-input",
           id: "project-id",
           placeholder: "Billing Project ID",
           required: ""
         }, null, 512), [
-          [G, t.connectionDetails.options.projectId]
+          [B, t.connectionDetails.options.projectId]
         ])
-      ])) : A("", !0),
-      t.connectionDetails.type === "sqlserver" ? (r(), l("div", at, [
+      ])) : M("", !0),
+      t.connectionDetails.type === "sqlserver" ? (l(), u("div", rt, [
         e[18] || (e[18] = s("label", { for: "username" }, "Username", -1)),
-        N(s("input", {
+        D(s("input", {
           type: "text",
           "onUpdate:modelValue": e[5] || (e[5] = (a) => t.connectionDetails.options.username = a),
+          class: "sidebar-control-input",
           id: "username",
           required: ""
         }, null, 512), [
-          [G, t.connectionDetails.options.username]
+          [B, t.connectionDetails.options.username]
         ]),
         e[19] || (e[19] = s("label", { for: "password" }, "Password", -1)),
-        N(s("input", {
+        D(s("input", {
           type: "password",
           "onUpdate:modelValue": e[6] || (e[6] = (a) => t.connectionDetails.options.password = a),
+          class: "sidebar-control-input",
           id: "username",
           required: ""
         }, null, 512), [
-          [G, t.connectionDetails.options.password]
+          [B, t.connectionDetails.options.password]
         ])
-      ])) : A("", !0),
-      t.connectionDetails.type === "snowflake" ? (r(), l(le, { key: 3 }, [
-        s("div", st, [
+      ])) : M("", !0),
+      t.connectionDetails.type === "snowflake" ? (l(), u(pe, { key: 3 }, [
+        s("div", lt, [
           e[20] || (e[20] = s("label", { for: "account" }, "Account", -1)),
-          N(s("input", {
+          D(s("input", {
             type: "text",
             "onUpdate:modelValue": e[7] || (e[7] = (a) => t.connectionDetails.options.account = a),
+            class: "sidebar-control-input",
             id: "account",
             required: ""
           }, null, 512), [
-            [G, t.connectionDetails.options.account]
+            [B, t.connectionDetails.options.account]
           ])
         ]),
-        s("div", rt, [
+        s("div", ct, [
           e[21] || (e[21] = s("label", { for: "username" }, "Username", -1)),
-          N(s("input", {
+          D(s("input", {
             type: "text",
             "onUpdate:modelValue": e[8] || (e[8] = (a) => t.connectionDetails.options.username = a),
+            class: "sidebar-control-input",
             id: "username",
             required: ""
           }, null, 512), [
-            [G, t.connectionDetails.options.username]
+            [B, t.connectionDetails.options.username]
           ])
         ]),
-        s("div", lt, [
+        s("div", ut, [
           e[22] || (e[22] = s("label", { for: "privateKey" }, "Private Key", -1)),
-          N(s("input", {
+          D(s("input", {
             type: "password",
             "onUpdate:modelValue": e[9] || (e[9] = (a) => t.connectionDetails.options.privateKey = a),
+            class: "sidebar-control-input",
             id: "privateKey",
             required: ""
           }, null, 512), [
-            [G, t.connectionDetails.options.privateKey]
+            [B, t.connectionDetails.options.privateKey]
           ])
         ])
-      ], 64)) : A("", !0),
-      s("div", ct, [
+      ], 64)) : M("", !0),
+      s("div", dt, [
         e[23] || (e[23] = s("button", {
           "data-testid": "connection-creator-submit",
           type: "submit"
@@ -389,46 +398,47 @@ function ut(t, e, o, i, c, y) {
         }, "Cancel")
       ])
     ], 32)
-  ])) : A("", !0);
+  ])) : M("", !0);
 }
-const dt = /* @__PURE__ */ z($e, [["render", ut], ["__scopeId", "data-v-bd6e19a1"]]), pt = "data:image/png;base64,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", mt = {
+const mt = /* @__PURE__ */ Z(tt, [["render", pt], ["__scopeId", "data-v-891a9edb"]]), ht = "data:image/png;base64,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", yt = {
   key: 0,
   class: "mdi mdi-duck"
-}, ht = ["src"], yt = {
+}, gt = ["src"], ft = {
   key: 2,
   class: "mdi mdi-google"
-}, ft = {
+}, wt = {
   key: 3,
   class: "mdi mdi-google"
-}, gt = {
+}, bt = {
   key: 4,
   class: "mdi mdi-database"
-}, wt = /* @__PURE__ */ ae({
+}, Tt = /* @__PURE__ */ ce({
   __name: "ConnectionIcon",
   props: {
     connectionType: {}
   },
   setup(t) {
-    const e = t, o = J(() => ({
+    const e = t, o = z(() => ({
       duckdb: "DuckDB",
       motherduck: "MotherDuck",
       "bigquery-oauth": "BigQuery",
       snowflake: "Snowflake",
+      remote: "Remote Project",
       default: "Database Connection"
     })[e.connectionType || "default"] || e.connectionType || "");
-    return (i, c) => (r(), W(Se, { content: o.value }, {
+    return (i, c) => (l(), W(Ae, { content: o.value }, {
       default: q(() => [
-        t.connectionType === "duckdb" ? (r(), l("i", mt)) : t.connectionType === "motherduck" ? (r(), l("img", {
+        t.connectionType === "duckdb" ? (l(), u("i", yt)) : t.connectionType === "motherduck" ? (l(), u("img", {
           key: 1,
-          src: xe(pt),
+          src: Ke(ht),
           class: "motherduck-icon",
           alt: "MotherDuck"
-        }, null, 8, ht)) : t.connectionType === "bigquery-oauth" ? (r(), l("i", yt)) : t.connectionType === "bigquery" ? (r(), l("i", ft)) : (r(), l("i", gt))
+        }, null, 8, gt)) : t.connectionType === "bigquery-oauth" ? (l(), u("i", ft)) : t.connectionType === "bigquery" ? (l(), u("i", wt)) : (l(), u("i", bt))
       ]),
       _: 1
     }, 8, ["content"]));
   }
-}), Tt = /* @__PURE__ */ z(wt, [["__scopeId", "data-v-8b4a0eaf"]]), bt = /* @__PURE__ */ ae({
+}), vt = /* @__PURE__ */ Z(Tt, [["__scopeId", "data-v-d7a85282"]]), Et = "sidebar-icon-button", St = /* @__PURE__ */ ce({
   __name: "ConnectionRefresh",
   props: {
     connection: {},
@@ -439,24 +449,26 @@ const dt = /* @__PURE__ */ z($e, [["render", ut], ["__scopeId", "data-v-bd6e19a1
   setup(t, { emit: e }) {
     const o = t, i = e;
     let c;
-    if (o.type === "llm" ? c = Y("llmConnectionStore") : c = Y("connectionStore"), !c)
+    if (o.type === "llm" ? c = _("llmConnectionStore") : c = _("connectionStore"), !c)
       throw new Error("Connection store is not provided!");
-    const y = J(
-      () => o.connection.connected ? "mdi mdi-refresh" : "mdi mdi-connection"
-    ), a = async () => {
+    const y = z(
+      () => o.connection.connected ? "mdi mdi-refresh" : "mdi mdi-power-plug-outline"
+    ), a = z(
+      () => o.connection.connected ? `refresh-connection-${o.connection.name}` : `connect-connection-${o.connection.name}`
+    ), p = async () => {
       try {
         await c.resetConnection(o.connection.name), i("refresh", o.connection.name);
-      } catch (d) {
-        throw console.error("Refresh failed:", d), d;
+      } catch (w) {
+        throw console.error("Refresh failed:", w), w;
       }
     };
-    return (d, T) => (r(), W(Ce, {
-      class: "refresh-button",
-      action: a,
-      "data-testid": `refresh-connection-${t.connection.name}`,
+    return (w, d) => (l(), W(Re, {
+      class: me(["refresh-button", Et]),
+      action: p,
+      "data-testid": a.value,
       useDefaultStyle: !1,
-      testId: `refresh-connection-${t.connection.name}`,
-      onClick: T[0] || (T[0] = k(() => {
+      testId: a.value,
+      onClick: d[0] || (d[0] = R(() => {
       }, ["stop"]))
     }, {
       default: q(() => [
@@ -467,7 +479,7 @@ const dt = /* @__PURE__ */ z($e, [["render", ut], ["__scopeId", "data-v-bd6e19a1
       _: 1
     }, 8, ["data-testid", "testId"]));
   }
-}), Ue = /* @__PURE__ */ z(bt, [["__scopeId", "data-v-a2ead502"]]), vt = ae({
+}), Ct = /* @__PURE__ */ Z(St, [["__scopeId", "data-v-11056d75"]]), kt = ce({
   name: "FileUpload",
   props: {
     connection: {
@@ -476,31 +488,34 @@ const dt = /* @__PURE__ */ z($e, [["render", ut], ["__scopeId", "data-v-bd6e19a1
     }
   },
   setup(t) {
-    const e = S(!1), o = S(!1), i = S("Processing file..."), c = S(""), y = S(null), a = () => {
+    const e = C(!1), o = C(!1), i = C("Processing file..."), c = C(""), y = C(null), a = () => {
       e.value = !0;
-    }, d = () => {
+    }, p = () => {
       e.value = !1;
-    }, T = async (g) => {
-      const h = g.target;
-      h.files && h.files.length > 0 && await P(h.files[0]);
-    }, m = async (g) => {
-      var h;
-      if (e.value = !1, (h = g.dataTransfer) != null && h.files && g.dataTransfer.files.length > 0) {
-        const F = g.dataTransfer.files[0];
-        R(F) ? await P(F) : alert("Please drop a CSV, Parquet, or DuckDB file");
+    }, w = async (A) => {
+      const m = A.target;
+      m.files && m.files.length > 0 && await N(m.files[0]);
+    }, d = () => {
+      var A;
+      (A = y.value) == null || A.click();
+    }, S = async (A) => {
+      var m;
+      if (e.value = !1, (m = A.dataTransfer) != null && m.files && A.dataTransfer.files.length > 0) {
+        const Q = A.dataTransfer.files[0];
+        f(Q) ? await N(Q) : alert("Please drop a CSV, Parquet, or DuckDB file");
       }
-    }, R = (g) => g.type === "text/csv" || g.name.endsWith(".csv") || g.type === "application/octet-stream" || g.name.endsWith(".parquet") || g.name.endsWith(".db"), P = async (g) => {
+    }, f = (A) => A.type === "text/csv" || A.name.endsWith(".csv") || A.type === "application/octet-stream" || A.name.endsWith(".parquet") || A.name.endsWith(".db"), N = async (A) => {
       try {
-        o.value = !0, i.value = `Processing ${g.name}...`;
-        const h = await t.connection.importFile(g, (F) => {
-          i.value = F;
+        o.value = !0, i.value = `Processing ${A.name}...`;
+        const m = await t.connection.importFile(A, (Q) => {
+          i.value = Q;
         });
-        h.type === "database" ? c.value = `Successfully attached database ${h.name}` : c.value = `Successfully imported ${h.name}`, o.value = !1, setTimeout(() => {
+        m.type === "database" ? c.value = `Successfully attached database ${m.name}` : c.value = `Successfully imported ${m.name}`, o.value = !1, setTimeout(() => {
           c.value = "";
         }, 5e3), y.value && (y.value.value = "");
-      } catch (h) {
-        o.value = !1, console.error(`Error processing ${g.name}:`, h), alert(
-          `Error processing ${g.name}: ${h instanceof Error ? h.message : "Unknown error"}`
+      } catch (m) {
+        o.value = !1, console.error(`Error processing ${A.name}:`, m), alert(
+          `Error processing ${A.name}: ${m instanceof Error ? m.message : "Unknown error"}`
         );
       }
     };
@@ -510,129 +525,118 @@ const dt = /* @__PURE__ */ z($e, [["render", ut], ["__scopeId", "data-v-bd6e19a1
       loadingMessage: i,
       successMessage: c,
       fileInput: y,
+      openFilePicker: d,
       handleDragOver: a,
-      handleDragLeave: d,
-      handleDrop: m,
-      handleFileInput: T
+      handleDragLeave: p,
+      handleDrop: S,
+      handleFileInput: w
     };
   }
-}), Et = { class: "upload-area" }, St = {
-  key: 0,
-  class: "success-message"
-}, Ct = { key: 1 }, kt = { class: "truncate-text" }, At = { class: "file-input-label" }, It = {
-  key: 2,
-  class: "loading-container"
-};
-function Pt(t, e, o, i, c, y) {
-  return r(), l("div", {
-    class: me(["file-upload-container", { "drag-active": t.isDragging }]),
-    onDragover: e[1] || (e[1] = k((...a) => t.handleDragOver && t.handleDragOver(...a), ["prevent"])),
-    onDragleave: e[2] || (e[2] = k((...a) => t.handleDragLeave && t.handleDragLeave(...a), ["prevent"])),
-    onDrop: e[3] || (e[3] = k((...a) => t.handleDrop && t.handleDrop(...a), ["prevent"]))
+}), At = ["data-testid"], It = ["data-testid"], Pt = { class: "upload-copy truncate-text" }, Rt = {
+  key: 1,
+  class: "upload-row"
+}, Mt = ["data-testid"], Lt = { class: "upload-copy truncate-text" };
+function Dt(t, e, o, i, c, y) {
+  return l(), u("button", {
+    type: "button",
+    class: me(["file-upload-container", { "drag-active": t.isDragging, loading: t.isLoading }]),
+    "data-testid": `duckdb-importer-${t.connection.name}`,
+    onClick: e[1] || (e[1] = (...a) => t.openFilePicker && t.openFilePicker(...a)),
+    onDragover: e[2] || (e[2] = R((...a) => t.handleDragOver && t.handleDragOver(...a), ["prevent"])),
+    onDragleave: e[3] || (e[3] = R((...a) => t.handleDragLeave && t.handleDragLeave(...a), ["prevent"])),
+    onDrop: e[4] || (e[4] = R((...a) => t.handleDrop && t.handleDrop(...a), ["prevent"]))
   }, [
-    s("div", Et, [
-      t.successMessage && !t.isLoading ? (r(), l("div", St, [
-        s("span", null, j(t.successMessage), 1)
-      ])) : t.isLoading ? (r(), l("div", It, [
-        e[7] || (e[7] = s("span", { class: "spinner" }, null, -1)),
-        s("span", null, j(t.loadingMessage), 1)
-      ])) : (r(), l("div", Ct, [
-        s("div", kt, [
-          e[5] || (e[5] = ie(" Drag or", -1)),
-          s("label", At, [
-            e[4] || (e[4] = ie(" select ", -1)),
-            s("input", {
-              type: "file",
-              accept: ".csv,.parquet,.db",
-              onChange: e[0] || (e[0] = (...a) => t.handleFileInput && t.handleFileInput(...a)),
-              ref: "fileInput",
-              class: "hidden-input"
-            }, null, 544)
-          ]),
-          e[6] || (e[6] = ie(" CSV/Parquet or DuckDB DB ", -1))
-        ])
-      ]))
-    ])
-  ], 34);
+    s("input", {
+      type: "file",
+      accept: ".csv,.parquet,.db",
+      onChange: e[0] || (e[0] = (...a) => t.handleFileInput && t.handleFileInput(...a)),
+      ref: "fileInput",
+      class: "hidden-input"
+    }, null, 544),
+    t.successMessage && !t.isLoading ? (l(), u("div", {
+      key: 0,
+      class: "upload-row upload-success",
+      "data-testid": `duckdb-import-success-${t.connection.name}`
+    }, [
+      e[5] || (e[5] = s("i", { class: "mdi mdi-check-circle-outline upload-icon" }, null, -1)),
+      s("span", Pt, F(t.successMessage), 1)
+    ], 8, It)) : t.isLoading ? (l(), u("div", {
+      key: 2,
+      class: "upload-row loading-container",
+      "data-testid": `duckdb-import-loading-${t.connection.name}`
+    }, [
+      e[7] || (e[7] = s("span", { class: "spinner" }, null, -1)),
+      s("span", Lt, F(t.loadingMessage), 1)
+    ], 8, Mt)) : (l(), u("div", Rt, [...e[6] || (e[6] = [
+      s("i", { class: "mdi mdi-plus upload-icon" }, null, -1),
+      s("span", { class: "upload-copy" }, [
+        s("span", { class: "upload-label" }, "Import data..."),
+        s("span", { class: "upload-subtitle" }, "CSV, Parquet, DuckDB")
+      ], -1)
+    ])]))
+  ], 42, At);
 }
-const Rt = /* @__PURE__ */ z(vt, [["render", Pt], ["__scopeId", "data-v-d7832089"]]), Mt = { class: "model-anchor" }, Lt = {
+const _t = /* @__PURE__ */ Z(kt, [["render", Dt], ["__scopeId", "data-v-daeb30e9"]]), Nt = { class: "model-anchor" }, qt = { class: "model-trigger-text truncate-text" }, Ut = {
   key: 0,
   class: "model-form"
-}, Dt = ["value"], _t = /* @__PURE__ */ ae({
+}, Ot = ["onClick"], xt = /* @__PURE__ */ ce({
   __name: "ModelSelector",
   props: {
     connection: {}
   },
   setup(t) {
-    const e = t, o = Y("modelStore"), i = Y("connectionStore"), c = Y("saveConnections", () => {
-    }), y = S(!1), a = S(e.connection.model || ""), d = J(() => o ? Object.keys(o.models) : []), T = () => {
+    const e = t, o = _("modelStore"), i = _("connectionStore"), c = _("saveConnections", () => {
+    }), y = C(!1), a = z(() => o ? Object.keys(o.models) : []), p = () => {
       y.value = !y.value;
-    }, m = () => {
-      y.value = !1;
-    }, R = async () => {
-      if (a.value && i) {
-        let P = a.value;
-        P === "~new-model" && (P = e.connection.name, await (o == null ? void 0 : o.addModelConfig(
-          new Ke({
-            name: e.connection.name,
-            sources: [],
-            storage: "local",
-            description: ""
-          })
-        ))), i.connections[e.connection.name].model = P;
-      }
-      c(), y.value = !1;
+    }, w = async (d) => {
+      if (!i)
+        return;
+      let S = d;
+      S === "~new-model" && (S = e.connection.name, await (o == null ? void 0 : o.addModelConfig(
+        new Ve({
+          name: e.connection.name,
+          sources: [],
+          storage: "local",
+          description: ""
+        })
+      ))), i.connections[e.connection.name].model = S, await c(), y.value = !1;
     };
-    return (P, g) => (r(), l("div", Mt, [
+    return (d, S) => (l(), u("div", Nt, [
       s("button", {
-        class: "button truncate-text",
-        onClick: T
-      }, j(t.connection.model || "Set Model"), 1),
-      y.value ? (r(), l("div", Lt, [
-        s("form", {
-          onSubmit: k(R, ["prevent"])
-        }, [
-          N(s("select", {
-            "onUpdate:modelValue": g[0] || (g[0] = (h) => a.value = h),
-            class: "model-select",
-            required: ""
-          }, [
-            (r(!0), l(le, null, fe(d.value, (h) => (r(), l("option", {
-              key: h,
-              value: h,
-              class: "model-select-item"
-            }, j(h), 9, Dt))), 128)),
-            g[1] || (g[1] = s("option", {
-              key: "~new-model",
-              value: "~new-model",
-              class: "model-select-item"
-            }, " Create New Model ", -1))
-          ], 512), [
-            [Ee, a.value]
-          ]),
-          s("div", { class: "model-form-actions" }, [
-            g[2] || (g[2] = s("button", { type: "submit" }, "Submit", -1)),
-            s("button", {
-              type: "button",
-              onClick: m
-            }, "Close")
-          ])
-        ], 32)
-      ])) : A("", !0)
+        class: "model-trigger truncate-text",
+        type: "button",
+        onClick: p
+      }, [
+        s("span", qt, F(t.connection.model || "Set model"), 1),
+        S[1] || (S[1] = s("i", { class: "mdi mdi-chevron-down model-trigger-icon" }, null, -1))
+      ]),
+      y.value ? (l(), u("div", Ut, [
+        (l(!0), u(pe, null, we(a.value, (f) => (l(), u("button", {
+          key: f,
+          type: "button",
+          class: me(["model-option", { active: f === t.connection.model }]),
+          onClick: (N) => w(f)
+        }, F(f), 11, Ot))), 128)),
+        s("button", {
+          type: "button",
+          class: "model-option",
+          onClick: S[0] || (S[0] = (f) => w("~new-model"))
+        }, " Create New Model ")
+      ])) : M("", !0)
     ]));
   }
-}), Nt = /* @__PURE__ */ z(_t, [["__scopeId", "data-v-11ffb5f2"]]), qt = {
+}), Bt = /* @__PURE__ */ Z(xt, [["__scopeId", "data-v-fb7779b2"]]), Ft = {
   name: "ConnectionListItem",
   components: {
-    SidebarItem: Me,
-    ConnectionIcon: Tt,
-    ConnectionRefresh: Ue,
-    ConnectionStatusIcon: Re,
-    EditorCreatorIcon: Ve,
-    CreateEditorFromDatasourcePopup: Qe,
-    DuckDBImporter: Rt,
-    ModelSelector: Nt,
-    Tooltip: Se
+    SidebarItem: Ne,
+    ConnectionIcon: vt,
+    ConnectionStatusIcon: _e,
+    ConnectionRefresh: Ct,
+    CreateEditorFromDatasourcePopup: He,
+    DuckDBImporter: _t,
+    ModelSelector: Bt,
+    Tooltip: Ae,
+    SidebarOverflowMenu: De
   },
   props: {
     item: {
@@ -667,12 +671,15 @@ const Rt = /* @__PURE__ */ z(vt, [["render", Pt], ["__scopeId", "data-v-d7832089
     "toggleMobileMenu"
   ],
   setup(t, { emit: e }) {
-    var re, V, ge;
-    const o = Y("isMobile", !1), i = J(
+    var ae, ee, se;
+    const o = _("isMobile", !1), i = _("editorStore"), c = _("saveEditors"), y = _("setActiveScreen"), a = _("setActiveEditor");
+    if (!i || !c || !y || !a)
+      throw new Error("Editor store is not provided!");
+    const p = z(
       () => ["connection", "database", "schema"].includes(t.item.type)
-    ), c = J(
+    ), w = z(
       () => ["connection", "database", "schema", "table", "schema"].includes(t.item.type)
-    ), y = () => [
+    ), d = () => [
       "refresh-connection",
       "refresh-database",
       "refresh-schema",
@@ -685,140 +692,192 @@ const Rt = /* @__PURE__ */ z(vt, [["render", Pt], ["__scopeId", "data-v-d7832089
       "snowflake-account",
       "snowflake-username",
       "toggle-save-credential"
-    ].includes(t.item.type) ? "" : t.item.name, a = () => {
-      var M;
-      c.value && e("click", t.item.id, ((M = t.item.connection) == null ? void 0 : M.name) || "", t.item.type);
-    }, d = () => {
-      var M;
-      c.value && e("toggle", t.item.id, ((M = t.item.connection) == null ? void 0 : M.name) || "", t.item.type);
-    }, T = () => {
+    ].includes(t.item.type) ? "" : t.item.name, S = () => {
+      var E;
+      w.value && e("click", t.item.id, ((E = t.item.connection) == null ? void 0 : E.name) || "", t.item.type);
+    }, f = () => {
+      var E;
+      w.value && e("toggle", t.item.id, ((E = t.item.connection) == null ? void 0 : E.name) || "", t.item.type);
+    }, N = () => {
       e("toggleMobileMenu");
+    }, A = async (E) => {
+      try {
+        const ye = `new-editor-${Date.now()}`, Se = t.item.connection, Be = Se.storage === "remote", Fe = i.newEditor(
+          ye,
+          E === "trilogy" ? "preql" : "sql",
+          t.item.connection.name,
+          void 0,
+          Be ? {
+            storage: "remote",
+            remoteStoreId: Se.remoteStoreId || null,
+            remotePath: ye
+          } : void 0
+        );
+        await c(), a(Fe.id), y("editors");
+      } catch (re) {
+        console.error("Failed to create new editor:", re);
+      }
     }, m = () => {
-      var M, oe;
-      e("refresh", (M = t.item.connection) == null ? void 0 : M.name, ((oe = t.item.connection) == null ? void 0 : oe.name) || "", "connection");
-    }, R = () => {
-      var M;
-      e("refresh", t.item.id, ((M = t.item.connection) == null ? void 0 : M.name) || "", "database");
-    }, P = () => {
-      var M;
-      e("refresh", t.item.id, ((M = t.item.connection) == null ? void 0 : M.name) || "", "schema");
-    }, g = (M) => {
-      e("deleteConnection", M);
-    }, h = S(
+      var E, re;
+      e("refresh", (E = t.item.connection) == null ? void 0 : E.name, ((re = t.item.connection) == null ? void 0 : re.name) || "", "connection");
+    }, Q = () => {
+      var E;
+      e("refresh", t.item.id, ((E = t.item.connection) == null ? void 0 : E.name) || "", "database");
+    }, ue = () => {
+      var E;
+      e("refresh", t.item.id, ((E = t.item.connection) == null ? void 0 : E.name) || "", "schema");
+    }, le = (E) => {
+      e("deleteConnection", E);
+    }, g = z(() => {
+      if (t.item.type !== "connection")
+        return [];
+      const E = [];
+      return o && E.push({ id: "query-history", label: "Query history", icon: "mdi-history" }), E.push(
+        { id: "new-sql", label: "New SQL editor", icon: "mdi-file-document-plus-outline" },
+        {
+          id: "new-trilogy",
+          label: "New Trilogy editor",
+          icon: "mdi-file-document-plus-outline"
+        },
+        { id: "refresh", label: "Refresh connection", icon: "mdi-refresh" },
+        { id: "delete-separator", kind: "separator" },
+        { id: "delete", label: "Delete connection", icon: "mdi-trash-can-outline", danger: !0 }
+      ), E;
+    }), P = (E) => {
+      switch (E.id) {
+        case "query-history":
+          N();
+          break;
+        case "new-sql":
+          A("sql");
+          break;
+        case "new-trilogy":
+          A("trilogy");
+          break;
+        case "refresh":
+          m();
+          break;
+        case "delete":
+          le(t.item.connection);
+          break;
+      }
+    }, v = C(
       t.item.connection.projectId || ""
-    ), F = S(
+    ), b = C(
       t.item.connection.browsingProjectId || ""
-    ), w = S(t.item.connection.mdToken || ""), ce = S(
-      ((re = t.item.connection.config) == null ? void 0 : re.privateKey) || ""
-    ), ue = S(
-      ((V = t.item.connection.config) == null ? void 0 : V.account) || ""
-    ), f = S(
-      ((ge = t.item.connection.config) == null ? void 0 : ge.username) || ""
-    ), C = S(!1), v = S(!1), b = S(!1), I = S(!1), te = S(!1), Q = (M) => {
-      M.value = !0, setTimeout(() => {
-        M.value = !1;
+    ), k = C(t.item.connection.mdToken || ""), ne = C(
+      ((ae = t.item.connection.config) == null ? void 0 : ae.privateKey) || ""
+    ), X = C(
+      ((ee = t.item.connection.config) == null ? void 0 : ee.account) || ""
+    ), V = C(
+      ((se = t.item.connection.config) == null ? void 0 : se.username) || ""
+    ), J = C(!1), h = C(!1), r = C(!1), T = C(!1), U = C(!1), K = (E) => {
+      E.value = !0, setTimeout(() => {
+        E.value = !1;
       }, 1500);
-    }, K = (M, oe) => {
-      let we;
-      return (...de) => {
-        clearTimeout(we), we = setTimeout(() => M(...de), oe);
+    }, Y = (E, re) => {
+      let ye;
+      return (...Se) => {
+        clearTimeout(ye), ye = setTimeout(() => E(...Se), re);
       };
-    }, p = () => {
-      e("updateBigqueryProject", t.item.connection, h.value), Q(C);
-    }, D = () => {
-      e("updateBigqueryBrowsingProject", t.item.connection, F.value), Q(v);
-    }, u = () => {
-      e("updateSnowflakePrivateKey", t.item.connection, ce.value), Q(b);
-    }, E = () => {
-      e("updateSnowflakeAccount", t.item.connection, ue.value), Q(I);
-    }, x = () => {
-      e("updateSnowflakeUsername", t.item.connection, f.value), Q(te);
-    }, Z = K(p, 500), X = K(
-      D,
+    }, $ = () => {
+      e("updateBigqueryProject", t.item.connection, v.value), K(J);
+    }, oe = () => {
+      e("updateBigqueryBrowsingProject", t.item.connection, b.value), K(h);
+    }, O = () => {
+      e("updateSnowflakePrivateKey", t.item.connection, ne.value), K(r);
+    }, j = () => {
+      e("updateSnowflakeAccount", t.item.connection, X.value), K(T);
+    }, ie = () => {
+      e("updateSnowflakeUsername", t.item.connection, V.value), K(U);
+    }, de = Y($, 500), H = Y(
+      oe,
       500
-    ), $ = K(u, 500), ne = K(E, 500), B = K(x, 500);
+    ), Te = Y(O, 500), ve = Y(j, 500), Ee = Y(ie, 500);
     return {
       isMobile: o,
-      isExpandable: i,
-      getItemName: y,
-      handleItemClick: a,
-      handleToggle: d,
-      toggleMobileMenu: T,
+      isExpandable: p,
+      getItemName: d,
+      handleItemClick: S,
+      handleToggle: f,
+      toggleMobileMenu: N,
       handleRefreshConnectionClick: m,
-      handleRefreshDatabaseClick: R,
-      handleRefreshSchemaClick: P,
-      deleteConnection: g,
+      handleRefreshDatabaseClick: Q,
+      handleRefreshSchemaClick: ue,
+      deleteConnection: le,
+      contextMenuItems: g,
+      handleContextMenuItemClick: P,
       // Config variables
-      bigqueryProject: h,
-      bigqueryBrowsingProject: F,
-      mdToken: w,
-      snowflakePrivateKey: ce,
-      snowflakeAccount: ue,
-      snowflakeUsername: f,
+      bigqueryProject: v,
+      bigqueryBrowsingProject: b,
+      mdToken: k,
+      snowflakePrivateKey: ne,
+      snowflakeAccount: X,
+      snowflakeUsername: V,
       // Success indicators
-      showBillingSuccess: C,
-      showBrowsingSuccess: v,
-      showPrivateKeySuccess: b,
-      showAccountSuccess: I,
-      showUsernameSuccess: te,
+      showBillingSuccess: J,
+      showBrowsingSuccess: h,
+      showPrivateKeySuccess: r,
+      showAccountSuccess: T,
+      showUsernameSuccess: U,
       // Update functions
-      debouncedUpdateBigqueryProject: Z,
-      debouncedUpdateBigqueryBrowsingProject: X,
-      debouncedUpdateSnowflakePrivateKey: $,
-      debouncedUpdateSnowflakeAccount: ne,
-      debouncedUpdateSnowflakeUsername: B,
-      updateMotherDuckToken: (M, oe) => {
-        e("updateMotherDuckToken", M, oe);
+      debouncedUpdateBigqueryProject: de,
+      debouncedUpdateBigqueryBrowsingProject: H,
+      debouncedUpdateSnowflakePrivateKey: Te,
+      debouncedUpdateSnowflakeAccount: ve,
+      debouncedUpdateSnowflakeUsername: Ee,
+      updateMotherDuckToken: (E, re) => {
+        e("updateMotherDuckToken", E, re);
       },
-      toggleSaveCredential: (M) => {
-        e("toggleSaveCredential", M);
+      toggleSaveCredential: (E) => {
+        e("toggleSaveCredential", E);
       }
     };
   }
-}, Ut = {
+}, Yt = {
   key: 1,
   class: "mdi mdi-database node-icon"
-}, Ot = {
+}, Gt = {
   key: 2,
   class: "mdi mdi-folder-outline node-icon"
-}, Bt = {
+}, Kt = {
   key: 3,
   class: "mdi mdi-table node-icon"
-}, xt = {
+}, jt = {
   key: 4,
   class: "mdi mdi-alert-circle node-icon"
-}, Yt = {
+}, Qt = {
   key: 5,
   class: "mdi mdi-loading mdi-spin node-icon"
-}, Ft = {
+}, Vt = {
   key: 6,
   class: "mdi mdi-table-column node-icon"
-}, Gt = {
+}, Ht = {
   key: 0,
   class: "mdi mdi-check-circle success-icon"
-}, jt = {
+}, Wt = {
   key: 0,
   class: "mdi mdi-check-circle success-icon"
-}, Kt = {
+}, zt = {
   key: 0,
   class: "mdi mdi-check-circle success-icon"
-}, Qt = {
+}, Xt = {
   key: 0,
   class: "mdi mdi-check-circle success-icon"
-}, Vt = {
+}, Jt = {
   key: 0,
   class: "mdi mdi-check-circle success-icon"
-}, Ht = { class: "save-credential-toggle" }, Wt = ["checked"], zt = { key: 0 }, Xt = {
+}, Zt = { class: "save-credential-toggle sidebar-toggle-row" }, $t = ["checked"], en = { key: 0 }, tn = {
   key: 0,
   class: "connection-actions"
-}, Jt = {
+}, nn = {
   key: 1,
   class: "connection-actions"
-}, Zt = ["data-testid"];
-function $t(t, e, o, i, c, y) {
-  const a = U("connection-icon"), d = U("DuckDBImporter"), T = U("model-selector"), m = U("CreateEditorFromDatasourcePopup"), R = U("editor-creator-icon"), P = U("connection-refresh"), g = U("tooltip"), h = U("connection-status-icon"), F = U("sidebar-item");
-  return r(), l("div", null, [
-    O(F, {
+};
+function on(t, e, o, i, c, y) {
+  const a = x("connection-icon"), p = x("DuckDBImporter"), w = x("model-selector"), d = x("CreateEditorFromDatasourcePopup"), S = x("connection-refresh"), f = x("connection-status-icon"), N = x("sidebar-overflow-menu"), A = x("sidebar-item");
+  return l(), u("div", null, [
+    G(A, {
       "item-id": o.item.id,
       name: i.getItemName(),
       indent: o.item.indent,
@@ -830,285 +889,252 @@ function $t(t, e, o, i, c, y) {
       onToggle: i.handleToggle
     }, {
       icon: q(() => {
-        var w;
+        var m;
         return [
-          o.item.type === "connection" ? (r(), W(a, {
+          o.item.type === "connection" ? (l(), W(a, {
             key: 0,
-            "connection-type": (w = o.item.connection) == null ? void 0 : w.type
-          }, null, 8, ["connection-type"])) : o.item.type === "database" ? (r(), l("i", Ut)) : o.item.type === "schema" ? (r(), l("i", Ot)) : o.item.type === "table" ? (r(), l("i", Bt)) : o.item.type === "error" ? (r(), l("i", xt)) : o.item.type === "loading" ? (r(), l("i", Yt)) : o.item.type === "column" ? (r(), l("i", Ft)) : A("", !0)
+            "connection-type": (m = o.item.connection) == null ? void 0 : m.type
+          }, null, 8, ["connection-type"])) : o.item.type === "database" ? (l(), u("i", Yt)) : o.item.type === "schema" ? (l(), u("i", Gt)) : o.item.type === "table" ? (l(), u("i", Kt)) : o.item.type === "error" ? (l(), u("i", jt)) : o.item.type === "loading" ? (l(), u("i", Qt)) : o.item.type === "column" ? (l(), u("i", Vt)) : M("", !0)
         ];
       }),
       name: q(() => [
-        o.item.type === "refresh-connection" ? (r(), l("div", {
+        o.item.type === "refresh-connection" ? (l(), u("div", {
           key: 0,
           class: "refresh title-pad-left truncate-text sidebar-sub-item",
-          onClick: e[0] || (e[0] = (...w) => i.handleRefreshConnectionClick && i.handleRefreshConnectionClick(...w))
-        }, j(o.item.name), 1)) : o.item.type === "refresh-database" ? (r(), l("div", {
+          onClick: e[0] || (e[0] = (...m) => i.handleRefreshConnectionClick && i.handleRefreshConnectionClick(...m))
+        }, F(o.item.name), 1)) : o.item.type === "refresh-database" ? (l(), u("div", {
           key: 1,
           class: "refresh title-pad-left truncate-text sidebar-sub-item",
-          onClick: e[1] || (e[1] = (...w) => i.handleRefreshDatabaseClick && i.handleRefreshDatabaseClick(...w))
-        }, j(o.item.name), 1)) : o.item.type === "refresh-schema" ? (r(), l("div", {
+          onClick: e[1] || (e[1] = (...m) => i.handleRefreshDatabaseClick && i.handleRefreshDatabaseClick(...m))
+        }, F(o.item.name), 1)) : o.item.type === "refresh-schema" ? (l(), u("div", {
           key: 2,
           class: "refresh title-pad-left truncate-text sidebar-sub-item",
-          onClick: e[2] || (e[2] = (...w) => i.handleRefreshSchemaClick && i.handleRefreshSchemaClick(...w))
-        }, j(o.item.name), 1)) : o.item.type === "duckdb-upload" ? (r(), W(d, {
+          onClick: e[2] || (e[2] = (...m) => i.handleRefreshSchemaClick && i.handleRefreshSchemaClick(...m))
+        }, F(o.item.name), 1)) : o.item.type === "duckdb-upload" ? (l(), W(p, {
           key: 3,
           db: o.item.connection.db,
           connection: o.item.connection
-        }, null, 8, ["db", "connection"])) : o.item.type === "model" ? (r(), l("div", {
+        }, null, 8, ["db", "connection"])) : o.item.type === "model" ? (l(), u("div", {
           key: 4,
-          class: "bq-project-container",
-          onClick: e[3] || (e[3] = k(() => {
+          class: "connection-meta-row",
+          onClick: e[3] || (e[3] = R(() => {
           }, ["stop"]))
         }, [
-          e[29] || (e[29] = s("label", { class: "input-label" }, "Model", -1)),
-          O(T, {
+          e[26] || (e[26] = s("span", { class: "meta-label" }, "Model:", -1)),
+          G(w, {
             connection: o.item.connection
           }, null, 8, ["connection"])
-        ])) : o.item.type === "bigquery-project" ? (r(), l("div", {
+        ])) : o.item.type === "bigquery-project" ? (l(), u("div", {
           key: 5,
           class: "bq-project-container",
-          onClick: e[6] || (e[6] = k(() => {
+          onClick: e[6] || (e[6] = R(() => {
           }, ["stop"]))
         }, [
-          e[30] || (e[30] = s("label", { class: "input-label" }, "Billing", -1)),
+          e[27] || (e[27] = s("label", { class: "input-label" }, "Billing", -1)),
           s("span", null, [
-            O(be, { name: "fade" }, {
+            G(ge, { name: "fade" }, {
               default: q(() => [
-                i.showBillingSuccess ? (r(), l("i", Gt)) : A("", !0)
+                i.showBillingSuccess ? (l(), u("i", Ht)) : M("", !0)
               ]),
               _: 1
             }),
-            N(s("input", {
+            D(s("input", {
               type: "text",
-              "onUpdate:modelValue": e[4] || (e[4] = (w) => i.bigqueryProject = w),
+              "onUpdate:modelValue": e[4] || (e[4] = (m) => i.bigqueryProject = m),
               placeholder: "Billing Project",
-              class: "bq-project-input",
-              onInput: e[5] || (e[5] = (...w) => i.debouncedUpdateBigqueryProject && i.debouncedUpdateBigqueryProject(...w))
+              class: "bq-project-input sidebar-control-input",
+              onInput: e[5] || (e[5] = (...m) => i.debouncedUpdateBigqueryProject && i.debouncedUpdateBigqueryProject(...m))
             }, null, 544), [
-              [G, i.bigqueryProject]
+              [B, i.bigqueryProject]
             ])
           ])
-        ])) : o.item.type === "bigquery-browsing-project" ? (r(), l("div", {
+        ])) : o.item.type === "bigquery-browsing-project" ? (l(), u("div", {
           key: 6,
           class: "bq-project-container",
-          onClick: e[9] || (e[9] = k(() => {
+          onClick: e[9] || (e[9] = R(() => {
           }, ["stop"]))
         }, [
-          e[31] || (e[31] = s("label", { class: "input-label" }, "Browsing", -1)),
+          e[28] || (e[28] = s("label", { class: "input-label" }, "Browsing", -1)),
           s("span", null, [
-            O(be, { name: "fade" }, {
+            G(ge, { name: "fade" }, {
               default: q(() => [
-                i.showBrowsingSuccess ? (r(), l("i", jt)) : A("", !0)
+                i.showBrowsingSuccess ? (l(), u("i", Wt)) : M("", !0)
               ]),
               _: 1
             }),
-            N(s("input", {
+            D(s("input", {
               type: "text",
-              "onUpdate:modelValue": e[7] || (e[7] = (w) => i.bigqueryBrowsingProject = w),
+              "onUpdate:modelValue": e[7] || (e[7] = (m) => i.bigqueryBrowsingProject = m),
               placeholder: "Browsing Project",
-              class: "bq-project-input",
-              onInput: e[8] || (e[8] = (...w) => i.debouncedUpdateBigqueryBrowsingProject && i.debouncedUpdateBigqueryBrowsingProject(...w))
+              class: "bq-project-input sidebar-control-input",
+              onInput: e[8] || (e[8] = (...m) => i.debouncedUpdateBigqueryBrowsingProject && i.debouncedUpdateBigqueryBrowsingProject(...m))
             }, null, 544), [
-              [G, i.bigqueryBrowsingProject]
+              [B, i.bigqueryBrowsingProject]
             ])
           ])
-        ])) : o.item.type === "motherduck-token" ? (r(), l("div", {
+        ])) : o.item.type === "motherduck-token" ? (l(), u("div", {
           key: 7,
           class: "md-token-container",
-          onClick: e[12] || (e[12] = k(() => {
+          onClick: e[12] || (e[12] = R(() => {
           }, ["stop"]))
         }, [
           s("form", {
-            onSubmit: e[11] || (e[11] = k((w) => i.updateMotherDuckToken(o.item.connection, i.mdToken), ["prevent"]))
+            onSubmit: e[11] || (e[11] = R((m) => i.updateMotherDuckToken(o.item.connection, i.mdToken), ["prevent"]))
           }, [
-            e[32] || (e[32] = s("button", {
+            e[29] || (e[29] = s("button", {
               type: "submit",
-              class: "customize-button"
-            }, "Update Token", -1)),
-            N(s("input", {
+              class: "customize-button sidebar-control-button"
+            }, " Update Token ", -1)),
+            D(s("input", {
               type: "password",
-              "onUpdate:modelValue": e[10] || (e[10] = (w) => i.mdToken = w),
+              "onUpdate:modelValue": e[10] || (e[10] = (m) => i.mdToken = m),
               placeholder: "mdToken",
-              class: "connection-customize"
+              class: "connection-customize sidebar-control-input"
             }, null, 512), [
-              [G, i.mdToken]
+              [B, i.mdToken]
             ])
           ], 32)
-        ])) : o.item.type === "snowflake-private-key" ? (r(), l("div", {
+        ])) : o.item.type === "snowflake-private-key" ? (l(), u("div", {
           key: 8,
           class: "bq-project-container",
-          onClick: e[15] || (e[15] = k(() => {
+          onClick: e[15] || (e[15] = R(() => {
           }, ["stop"]))
         }, [
-          e[33] || (e[33] = s("label", { class: "input-label" }, "Private Key", -1)),
+          e[30] || (e[30] = s("label", { class: "input-label" }, "Private Key", -1)),
           s("span", null, [
-            O(be, { name: "fade" }, {
+            G(ge, { name: "fade" }, {
               default: q(() => [
-                i.showPrivateKeySuccess ? (r(), l("i", Kt)) : A("", !0)
+                i.showPrivateKeySuccess ? (l(), u("i", zt)) : M("", !0)
               ]),
               _: 1
             }),
-            N(s("input", {
+            D(s("input", {
               type: "password",
-              "onUpdate:modelValue": e[13] || (e[13] = (w) => i.snowflakePrivateKey = w),
+              "onUpdate:modelValue": e[13] || (e[13] = (m) => i.snowflakePrivateKey = m),
               placeholder: "Private Key",
-              class: "bq-project-input",
-              onInput: e[14] || (e[14] = (...w) => i.debouncedUpdateSnowflakePrivateKey && i.debouncedUpdateSnowflakePrivateKey(...w))
+              class: "bq-project-input sidebar-control-input",
+              onInput: e[14] || (e[14] = (...m) => i.debouncedUpdateSnowflakePrivateKey && i.debouncedUpdateSnowflakePrivateKey(...m))
             }, null, 544), [
-              [G, i.snowflakePrivateKey]
+              [B, i.snowflakePrivateKey]
             ])
           ])
-        ])) : o.item.type === "snowflake-account" ? (r(), l("div", {
+        ])) : o.item.type === "snowflake-account" ? (l(), u("div", {
           key: 9,
           class: "bq-project-container",
-          onClick: e[18] || (e[18] = k(() => {
+          onClick: e[18] || (e[18] = R(() => {
           }, ["stop"]))
         }, [
-          e[34] || (e[34] = s("label", { class: "input-label" }, "Account", -1)),
+          e[31] || (e[31] = s("label", { class: "input-label" }, "Account", -1)),
           s("span", null, [
-            O(be, { name: "fade" }, {
+            G(ge, { name: "fade" }, {
               default: q(() => [
-                i.showAccountSuccess ? (r(), l("i", Qt)) : A("", !0)
+                i.showAccountSuccess ? (l(), u("i", Xt)) : M("", !0)
               ]),
               _: 1
             }),
-            N(s("input", {
+            D(s("input", {
               type: "text",
-              "onUpdate:modelValue": e[16] || (e[16] = (w) => i.snowflakeAccount = w),
+              "onUpdate:modelValue": e[16] || (e[16] = (m) => i.snowflakeAccount = m),
               placeholder: "Account",
-              class: "bq-project-input",
-              onInput: e[17] || (e[17] = (...w) => i.debouncedUpdateSnowflakeAccount && i.debouncedUpdateSnowflakeAccount(...w))
+              class: "bq-project-input sidebar-control-input",
+              onInput: e[17] || (e[17] = (...m) => i.debouncedUpdateSnowflakeAccount && i.debouncedUpdateSnowflakeAccount(...m))
             }, null, 544), [
-              [G, i.snowflakeAccount]
+              [B, i.snowflakeAccount]
             ])
           ])
-        ])) : o.item.type === "snowflake-username" ? (r(), l("div", {
+        ])) : o.item.type === "snowflake-username" ? (l(), u("div", {
           key: 10,
           class: "bq-project-container",
-          onClick: e[21] || (e[21] = k(() => {
+          onClick: e[21] || (e[21] = R(() => {
           }, ["stop"]))
         }, [
-          e[35] || (e[35] = s("label", { class: "input-label" }, "Username", -1)),
+          e[32] || (e[32] = s("label", { class: "input-label" }, "Username", -1)),
           s("span", null, [
-            O(be, { name: "fade" }, {
+            G(ge, { name: "fade" }, {
               default: q(() => [
-                i.showUsernameSuccess ? (r(), l("i", Vt)) : A("", !0)
+                i.showUsernameSuccess ? (l(), u("i", Jt)) : M("", !0)
               ]),
               _: 1
             }),
-            N(s("input", {
+            D(s("input", {
               type: "text",
-              "onUpdate:modelValue": e[19] || (e[19] = (w) => i.snowflakeUsername = w),
+              "onUpdate:modelValue": e[19] || (e[19] = (m) => i.snowflakeUsername = m),
               placeholder: "Username",
-              class: "bq-project-input",
-              onInput: e[20] || (e[20] = (...w) => i.debouncedUpdateSnowflakeUsername && i.debouncedUpdateSnowflakeUsername(...w))
+              class: "bq-project-input sidebar-control-input",
+              onInput: e[20] || (e[20] = (...m) => i.debouncedUpdateSnowflakeUsername && i.debouncedUpdateSnowflakeUsername(...m))
             }, null, 544), [
-              [G, i.snowflakeUsername]
+              [B, i.snowflakeUsername]
             ])
           ])
-        ])) : o.item.type === "toggle-save-credential" ? (r(), l("div", {
+        ])) : o.item.type === "toggle-save-credential" ? (l(), u("div", {
           key: 11,
           class: "md-token-container",
-          onClick: e[23] || (e[23] = k(() => {
+          onClick: e[23] || (e[23] = R(() => {
           }, ["stop"]))
         }, [
-          s("label", Ht, [
+          s("label", Zt, [
             s("input", {
               type: "checkbox",
               checked: o.item.connection.saveCredential,
-              onChange: e[22] || (e[22] = (w) => i.toggleSaveCredential(o.item.connection))
-            }, null, 40, Wt),
-            e[36] || (e[36] = s("span", { class: "checkbox-label" }, "Save Credentials", -1))
+              onChange: e[22] || (e[22] = (m) => i.toggleSaveCredential(o.item.connection))
+            }, null, 40, $t),
+            e[33] || (e[33] = s("span", { class: "checkbox-label" }, "Save Credentials", -1))
           ])
-        ])) : (r(), l("span", {
+        ])) : (l(), u("span", {
           key: 12,
           class: me(["title-pad-left truncate-text", { "error-indicator": o.item.type === "error" }])
         }, [
-          ie(j(o.item.name) + " ", 1),
-          o.item.count !== void 0 && o.item.count > 0 ? (r(), l("span", zt, " (" + j(o.item.count) + ") ", 1)) : A("", !0),
-          o.item.type === "connection" ? (r(), l("span", {
+          be(F(o.item.name) + " ", 1),
+          o.item.count !== void 0 && o.item.count > 0 ? (l(), u("span", en, " (" + F(o.item.count) + ") ", 1)) : M("", !0),
+          o.item.type === "database" ? (l(), u("span", {
             key: 1,
             class: "hover-icon",
-            onClick: e[24] || (e[24] = k((...w) => i.handleRefreshConnectionClick && i.handleRefreshConnectionClick(...w), ["stop"]))
-          }, [...e[37] || (e[37] = [
+            onClick: e[24] || (e[24] = R((...m) => i.handleRefreshDatabaseClick && i.handleRefreshDatabaseClick(...m), ["stop"]))
+          }, [...e[34] || (e[34] = [
             s("i", { class: "mdi mdi-refresh" }, null, -1)
-          ])])) : A("", !0),
-          o.item.type === "database" ? (r(), l("span", {
+          ])])) : M("", !0),
+          o.item.type === "schema" ? (l(), u("span", {
             key: 2,
             class: "hover-icon",
-            onClick: e[25] || (e[25] = k((...w) => i.handleRefreshDatabaseClick && i.handleRefreshDatabaseClick(...w), ["stop"]))
-          }, [...e[38] || (e[38] = [
+            onClick: e[25] || (e[25] = R((...m) => i.handleRefreshSchemaClick && i.handleRefreshSchemaClick(...m), ["stop"]))
+          }, [...e[35] || (e[35] = [
             s("i", { class: "mdi mdi-refresh" }, null, -1)
-          ])])) : A("", !0),
-          o.item.type === "schema" ? (r(), l("span", {
-            key: 3,
-            class: "hover-icon",
-            onClick: e[26] || (e[26] = k((...w) => i.handleRefreshSchemaClick && i.handleRefreshSchemaClick(...w), ["stop"]))
-          }, [...e[39] || (e[39] = [
-            s("i", { class: "mdi mdi-refresh" }, null, -1)
-          ])])) : A("", !0)
+          ])])) : M("", !0)
         ], 2))
       ]),
-      "extra-content": q(() => [
-        o.item.type === "table" ? (r(), l("div", Xt, [
-          O(m, {
-            class: "hover-icon",
-            connection: o.item.connection,
-            table: o.item.object,
-            mode: "icon"
-          }, null, 8, ["connection", "table"])
-        ])) : o.item.type === "connection" ? (r(), l("div", Jt, [
-          i.isMobile ? (r(), l("i", {
-            key: 0,
-            "data-testid": `toggle-history-${o.item.connection.name}`,
-            class: "mdi mdi-history hover-icon",
-            title: "Query History",
-            onClick: e[27] || (e[27] = k((...w) => i.toggleMobileMenu && i.toggleMobileMenu(...w), ["stop"]))
-          }, null, 8, Zt)) : A("", !0),
-          O(R, {
-            class: "tacticle-button hover-icon",
-            connection: o.item.connection.name,
-            type: "sql",
-            title: "New SQL Editor",
-            "data-testid": o.testTag ? `new-sql-editor-${o.item.connection.name}-${o.testTag}` : `new-sql-editor-${o.item.connection.name}`
-          }, null, 8, ["connection", "data-testid"]),
-          O(R, {
-            class: "tacticle-button hover-icon",
-            connection: o.item.connection.name,
-            title: "New Trilogy Editor",
-            "data-testid": o.testTag ? `new-trilogy-editor-${o.item.connection.name}-${o.testTag}` : `new-trilogy-editor-${o.item.connection.name}`
-          }, null, 8, ["connection", "data-testid"]),
-          O(P, {
-            class: "tacticle-button hover-icon",
-            connection: o.item.connection,
-            "is-connected": o.item.connection.connected
-          }, null, 8, ["connection", "is-connected"]),
-          O(g, {
-            class: "tacticle-button hover-icon",
-            content: "Delete Connection",
-            position: "left"
-          }, {
-            default: q(() => [
-              s("span", {
-                class: "remove-btn",
-                onClick: e[28] || (e[28] = k((w) => i.deleteConnection(o.item.connection), ["stop"]))
-              }, [...e[40] || (e[40] = [
-                s("i", { class: "mdi mdi-trash-can-outline" }, null, -1)
-              ])])
-            ]),
-            _: 1
-          }),
-          O(h, {
-            connection: o.item.connection
-          }, null, 8, ["connection"])
-        ])) : A("", !0)
-      ]),
+      "extra-content": q(() => {
+        var m;
+        return [
+          o.item.type === "table" ? (l(), u("div", tn, [
+            G(d, {
+              class: "hover-icon",
+              connection: o.item.connection,
+              table: o.item.object,
+              mode: "icon"
+            }, null, 8, ["connection", "table"])
+          ])) : o.item.type === "connection" ? (l(), u("div", nn, [
+            (m = o.item.connection) != null && m.connected ? (l(), W(f, {
+              key: 1,
+              connection: o.item.connection
+            }, null, 8, ["connection"])) : (l(), W(S, {
+              key: 0,
+              connection: o.item.connection,
+              onRefresh: i.handleRefreshConnectionClick
+            }, null, 8, ["connection", "onRefresh"])),
+            G(N, {
+              items: i.contextMenuItems,
+              tooltip: "Connection actions",
+              "test-id-base": `connection-actions-${o.item.id}`,
+              onSelect: i.handleContextMenuItemClick
+            }, null, 8, ["items", "test-id-base", "onSelect"])
+          ])) : M("", !0)
+        ];
+      }),
       _: 1
     }, 8, ["item-id", "name", "indent", "is-selected", "is-collapsible", "is-collapsed", "itemType", "onClick", "onToggle"])
   ]);
 }
-const en = /* @__PURE__ */ z(qt, [["render", $t], ["__scopeId", "data-v-fce665fc"]]), tn = {
+const an = /* @__PURE__ */ Z(Ft, [["render", on], ["__scopeId", "data-v-36a1a62a"]]), sn = {
   name: "ConnectionList",
   props: {
     activeConnectionKey: {
@@ -1128,146 +1154,146 @@ const en = /* @__PURE__ */ z(qt, [["render", $t], ["__scopeId", "data-v-fce665fc
     };
   },
   setup(t, { emit: e }) {
-    const o = Y("connectionStore"), i = Y("saveConnections"), c = Y("modelStore"), y = Y("editorStore"), a = Y("isMobile", S(!1));
+    const o = _("connectionStore"), i = _("saveConnections"), c = _("modelStore"), y = _("editorStore"), a = _("isMobile", C(!1));
     if (!o || !i || !c || !y)
       throw new Error("Connection store is not provided!");
-    const d = S({}), T = S({}), m = S({}), R = S(!1), P = S(""), g = () => {
-      P.value = "";
-    }, h = (u, E) => {
-      u.type === "motherduck" && (u.setAttribute("mdToken", E), o.resetConnection(u.name));
-    }, F = async (u, E) => {
-      u.type === "snowflake" && (u.setPrivateKey(E), await i(), await o.resetConnection(u.name));
-    }, w = async (u, E) => {
-      u.type === "snowflake" && (u.setAccount(E), await i(), o.resetConnection(u.name));
-    }, ce = async (u, E) => {
-      u.type === "snowflake" && (u.setUsername(E), await i(), o.resetConnection(u.name));
-    }, ue = async (u, E) => {
-      u.type === "bigquery-oauth" && (u.setAttribute("projectId", E), await i(), o.resetConnection(u.name));
-    }, f = async (u, E) => {
-      u.type === "bigquery-oauth" && (u.setAttribute("browsingProjectId", E), await i(), u.databases = [], await u.getDatabases());
-    }, C = (u) => {
-      u.saveCredential = !u.saveCredential, o.resetConnection(u.name);
+    const p = C({}), w = C({}), d = C({}), S = C(!1), f = C(""), N = () => {
+      f.value = "";
+    }, A = (r, T) => {
+      r.type === "motherduck" && (r.setAttribute("mdToken", T), o.resetConnection(r.name));
+    }, m = async (r, T) => {
+      r.type === "snowflake" && (r.setPrivateKey(T), await i(), await o.resetConnection(r.name));
+    }, Q = async (r, T) => {
+      r.type === "snowflake" && (r.setAccount(T), await i(), o.resetConnection(r.name));
+    }, ue = async (r, T) => {
+      r.type === "snowflake" && (r.setUsername(T), await i(), o.resetConnection(r.name));
+    }, le = async (r, T) => {
+      r.type === "bigquery-oauth" && (r.setAttribute("projectId", T), await i(), o.resetConnection(r.name));
+    }, g = async (r, T) => {
+      r.type === "bigquery-oauth" && (r.setAttribute("browsingProjectId", T), await i(), r.databases = [], await r.getDatabases());
+    }, P = (r) => {
+      r.saveCredential = !r.saveCredential, o.resetConnection(r.name);
     }, v = () => {
       e("toggle-mobile-menu");
-    }, b = S({}), I = async (u, E, x) => {
-      var Z, X, $, ne;
+    }, b = C({}), k = async (r, T, U) => {
+      var K, Y, $, oe;
       try {
-        if (T.value[u] = !0, (Z = o.connections[E]) != null && Z.connected || await o.resetConnection(E), x === "connection") {
+        if (w.value[r] = !0, (K = o.connections[T]) != null && K.connected || await o.resetConnection(T), U === "connection") {
           console.log("getting databases");
-          let B = await o.connections[E].getDatabases();
-          for (let H of B) {
-            let se = `${E}${_}${H.name}`;
-            b.value[se] = !0;
+          let O = await o.connections[T].getDatabases();
+          for (let j of O) {
+            let ie = `${T}${L}${j.name}`;
+            b.value[ie] = !0;
           }
         }
-        if (x === "database") {
+        if (U === "database") {
           console.log("getting schemas");
-          let B = u.split(_)[1];
-          await o.connections[E].refreshDatabase(B);
+          let O = r.split(L)[1];
+          await o.connections[T].refreshDatabase(O);
         }
-        if (x === "schema") {
-          let B = u.split(_)[1], H = u.split(_)[2];
-          await o.connections[E].refreshSchema(B, H);
+        if (U === "schema") {
+          let O = r.split(L)[1], j = r.split(L)[2];
+          await o.connections[T].refreshSchema(O, j);
         }
-        if (x === "table") {
-          let B = u.split(_)[1], H = u.split(_)[2], se = u.split(_)[3], re = (ne = ($ = (X = o.connections[E].databases) == null ? void 0 : X.find((V) => V.name === B)) == null ? void 0 : $.schemas.find((V) => V.name === H)) == null ? void 0 : ne.tables.find((V) => V.name === se);
-          if (re) {
-            let V = await o.connections[E].getColumns(
-              B,
-              H,
-              se
+        if (U === "table") {
+          let O = r.split(L)[1], j = r.split(L)[2], ie = r.split(L)[3], de = (oe = ($ = (Y = o.connections[T].databases) == null ? void 0 : Y.find((H) => H.name === O)) == null ? void 0 : $.schemas.find((H) => H.name === j)) == null ? void 0 : oe.tables.find((H) => H.name === ie);
+          if (de) {
+            let H = await o.connections[T].getColumns(
+              O,
+              j,
+              ie
             );
-            re.columns = V;
+            de.columns = H;
           }
         }
-        delete m.value[u];
-      } catch (B) {
-        console.error(B), B instanceof Error ? m.value[u] = B.message : m.value[u] = "An error occurred";
+        delete d.value[r];
+      } catch (O) {
+        console.error(O), O instanceof Error ? d.value[r] = O.message : d.value[r] = "An error occurred";
       }
-      delete T.value[u];
-    }, te = async (u, E, x) => {
-      console.log("emitting connection key selected:", u), e("connection-key-selected", u);
-    }, Q = async (u, E, x) => {
-      var Z, X, $, ne, B, H, se, re, V, ge, M, oe, we;
-      if (x === "connection" && (b.value[u] === void 0 || b.value[u] === !0))
-        b.value[u] = !1, (((Z = o.connections[E].databases) == null ? void 0 : Z.length) === 0 || ((X = o.connections[E].databases) == null ? void 0 : X.length) === void 0) && await I(u, E, x);
-      else if (x === "database" && b.value[u] !== !1) {
-        b.value[u] = !1;
-        let de = u.split(_)[1], he = ($ = o.connections[E].databases) == null ? void 0 : $.find((pe) => pe.name === de);
-        he && ((ne = he.schemas) == null ? void 0 : ne.length) === 0 && await I(u, E, x);
-      } else if (x === "schema" && b.value[u] !== !1) {
-        b.value[u] = !1;
-        let de = u.split(_)[1], he = u.split(_)[2], pe = (se = (H = (B = o.connections[E].databases) == null ? void 0 : B.find((ye) => ye.name === de)) == null ? void 0 : H.schemas) == null ? void 0 : se.find((ye) => ye.name === he);
-        pe && ((re = pe.tables) == null ? void 0 : re.length) === 0 && await I(u, E, x);
-      } else if (x === "table" && b.value[u] !== !1) {
-        let de = u.split(_)[1], he = u.split(_)[3], pe = u.split(_)[2];
-        if (pe) {
-          let ye = await ((we = (oe = (M = (ge = (V = o.connections[E].databases) == null ? void 0 : V.find((Te) => Te.name === de)) == null ? void 0 : ge.schemas) == null ? void 0 : M.find((Te) => Te.name === pe)) == null ? void 0 : oe.tables) == null ? void 0 : we.find((Te) => Te.name === he));
-          if (ye && ye.columns.length === 0) {
-            await I(u, E, x);
+      delete w.value[r];
+    }, ne = async (r, T, U) => {
+      console.log("emitting connection key selected:", r), e("connection-key-selected", r);
+    }, X = async (r, T, U) => {
+      var K, Y, $, oe, O, j, ie, de, H, Te, ve, Ee, Ie;
+      if (U === "connection" && (b.value[r] === void 0 || b.value[r] === !0))
+        b.value[r] = !1, (((K = o.connections[T].databases) == null ? void 0 : K.length) === 0 || ((Y = o.connections[T].databases) == null ? void 0 : Y.length) === void 0) && await k(r, T, U);
+      else if (U === "database" && b.value[r] !== !1) {
+        b.value[r] = !1;
+        let he = r.split(L)[1], ae = ($ = o.connections[T].databases) == null ? void 0 : $.find((ee) => ee.name === he);
+        ae && ((oe = ae.schemas) == null ? void 0 : oe.length) === 0 && await k(r, T, U);
+      } else if (U === "schema" && b.value[r] !== !1) {
+        b.value[r] = !1;
+        let he = r.split(L)[1], ae = r.split(L)[2], ee = (ie = (j = (O = o.connections[T].databases) == null ? void 0 : O.find((se) => se.name === he)) == null ? void 0 : j.schemas) == null ? void 0 : ie.find((se) => se.name === ae);
+        ee && ((de = ee.tables) == null ? void 0 : de.length) === 0 && await k(r, T, U);
+      } else if (U === "table" && b.value[r] !== !1) {
+        let he = r.split(L)[1], ae = r.split(L)[3], ee = r.split(L)[2];
+        if (ee) {
+          let se = await ((Ie = (Ee = (ve = (Te = (H = o.connections[T].databases) == null ? void 0 : H.find((E) => E.name === he)) == null ? void 0 : Te.schemas) == null ? void 0 : ve.find((E) => E.name === ee)) == null ? void 0 : Ee.tables) == null ? void 0 : Ie.find((E) => E.name === ae));
+          if (se && se.columns.length === 0) {
+            await k(r, T, U);
             return;
           }
         }
-      } else b.value[u] === void 0 ? b.value[u] = !1 : b.value[u] = !b.value[u];
+      } else b.value[r] === void 0 ? b.value[r] = !1 : b.value[r] = !b.value[r];
     };
-    Object.values(o.connections).forEach((u) => {
-      var x;
-      let E = `${u.name}`;
-      b.value[E] = !0, (x = u.databases) == null || x.forEach((Z) => {
-        let X = `${E}${_}${Z.name}`;
-        b.value[X] = !0, Z.schemas.forEach(($) => {
-          let ne = `${X}${_}${$.name}`;
-          b.value[ne] = !0;
-          for (let B of $.tables) {
-            let H = `${X}${_}${B.schema}${_}${B.name}`;
-            b.value[H] = !0;
+    Object.values(o.connections).forEach((r) => {
+      var U;
+      let T = `${r.name}`;
+      b.value[T] = !0, (U = r.databases) == null || U.forEach((K) => {
+        let Y = `${T}${L}${K.name}`;
+        b.value[Y] = !0, K.schemas.forEach(($) => {
+          let oe = `${Y}${L}${$.name}`;
+          b.value[oe] = !0;
+          for (let O of $.tables) {
+            let j = `${Y}${L}${O.schema}${L}${O.name}`;
+            b.value[j] = !0;
           }
         });
       });
     });
-    const K = J(() => Je(
+    const V = z(() => $e(
       Object.values(o.connections),
       b.value,
-      T.value,
-      m.value
-    )), p = J(() => Ze(K.value, P.value));
+      w.value,
+      d.value
+    )), J = z(() => et(V.value, f.value));
     return {
       connectionStore: o,
       editorStore: y,
-      contentList: K,
-      filteredContentList: p,
-      toggleCollapse: Q,
-      handleItemClick: te,
+      contentList: V,
+      filteredContentList: J,
+      toggleCollapse: X,
+      handleItemClick: ne,
       toggleMobileMenu: v,
       collapsed: b,
       saveConnections: i,
       modelStore: c,
-      connectionModelVisible: d,
-      updateMotherDuckToken: h,
-      updateSnowflakePrivateKey: F,
-      updateSnowflakeAccount: w,
-      updateSnowflakeUsername: ce,
-      toggleSaveCredential: C,
-      updateBigqueryProject: ue,
-      updateBigqueryBrowsingProject: f,
-      refreshId: I,
-      rightSplit: (u) => {
-        const E = u.lastIndexOf(_);
-        return E !== -1 ? u.substring(0, E) : u;
+      connectionModelVisible: p,
+      updateMotherDuckToken: A,
+      updateSnowflakePrivateKey: m,
+      updateSnowflakeAccount: Q,
+      updateSnowflakeUsername: ue,
+      toggleSaveCredential: P,
+      updateBigqueryProject: le,
+      updateBigqueryBrowsingProject: g,
+      refreshId: k,
+      rightSplit: (r) => {
+        const T = r.lastIndexOf(L);
+        return T !== -1 ? r.substring(0, T) : r;
       },
-      creatorVisible: R,
+      creatorVisible: S,
       isMobile: a,
-      searchTerm: P,
-      clearSearch: g
+      searchTerm: f,
+      clearSearch: N
     };
   },
   components: {
-    SidebarList: De,
-    ConnectionCreatorInline: dt,
-    LoadingButton: Ce,
-    StatusIcon: Le,
-    Tooltip: Se,
-    ConnectionListItem: en
+    SidebarList: qe,
+    ConnectionCreatorInline: mt,
+    LoadingButton: Re,
+    StatusIcon: We,
+    Tooltip: Ae,
+    ConnectionListItem: an
   },
   methods: {
     resetConnection(t) {
@@ -1300,51 +1326,52 @@ const en = /* @__PURE__ */ z(qt, [["render", $t], ["__scopeId", "data-v-fce665fc
       return Object.keys(this.modelStore.models);
     }
   }
-}, nn = { class: "button-container" }, on = ["data-testid"], an = {
-  key: 0,
-  class: "mdi mdi-plus icon"
-}, sn = { class: "search-container" }, rn = ["data-testid"], ln = ["data-testid"], cn = { class: "confirmation-dialog" }, un = { class: "dialog-actions" };
-function dn(t, e, o, i, c, y) {
-  const a = U("connection-creator-inline"), d = U("connection-list-item"), T = U("sidebar-list");
-  return r(), W(T, { title: "Connections" }, {
-    actions: q(() => [
-      s("div", nn, [
+}, rn = { class: "connections-header" }, ln = ["data-testid"], cn = { class: "search-container" }, un = ["data-testid"], dn = ["data-testid"], pn = { class: "confirmation-dialog" }, mn = { class: "dialog-actions" };
+function hn(t, e, o, i, c, y) {
+  const a = x("connection-creator-inline"), p = x("connection-list-item"), w = x("sidebar-list");
+  return l(), W(w, { title: "Connections" }, {
+    header: q(() => [
+      s("div", rn, [
+        e[8] || (e[8] = s("h3", { class: "font-sans sidebar-header" }, "Connections", -1)),
         s("button", {
-          onClick: e[0] || (e[0] = (m) => i.creatorVisible = !i.creatorVisible),
+          class: "sidebar-control-button sidebar-header-action connections-new-btn",
+          onClick: e[0] || (e[0] = (d) => i.creatorVisible = !i.creatorVisible),
           "data-testid": o.testTag ? `connection-creator-add-${o.testTag}` : "connection-creator-add"
         }, [
-          i.creatorVisible ? (r(), l("i", an)) : A("", !0),
-          ie(" " + j(i.creatorVisible ? "Hide" : "New"), 1)
-        ], 8, on)
-      ]),
-      O(a, {
+          e[7] || (e[7] = s("i", { class: "mdi mdi-plus" }, null, -1)),
+          be(" " + F(i.creatorVisible ? "Close" : "New"), 1)
+        ], 8, ln)
+      ])
+    ]),
+    actions: q(() => [
+      G(a, {
         visible: i.creatorVisible,
-        onClose: e[1] || (e[1] = (m) => i.creatorVisible = !i.creatorVisible)
+        onClose: e[1] || (e[1] = (d) => i.creatorVisible = !i.creatorVisible)
       }, null, 8, ["visible"]),
-      s("div", sn, [
-        N(s("input", {
+      s("div", cn, [
+        D(s("input", {
           type: "text",
-          "onUpdate:modelValue": e[2] || (e[2] = (m) => i.searchTerm = m),
+          "onUpdate:modelValue": e[2] || (e[2] = (d) => i.searchTerm = d),
           placeholder: "Search objects...",
           class: "search-input",
           "data-testid": o.testTag ? `connection-search-${o.testTag}` : "connection-search"
-        }, null, 8, rn), [
-          [G, i.searchTerm]
+        }, null, 8, un), [
+          [B, i.searchTerm]
         ]),
-        i.searchTerm ? (r(), l("button", {
+        i.searchTerm ? (l(), u("button", {
           key: 0,
-          onClick: e[3] || (e[3] = (...m) => i.clearSearch && i.clearSearch(...m)),
-          class: "clear-search-btn",
+          onClick: e[3] || (e[3] = (...d) => i.clearSearch && i.clearSearch(...d)),
+          class: "clear-search-btn sidebar-icon-button",
           "data-testid": o.testTag ? `connection-search-clear-${o.testTag}` : "connection-search-clear"
-        }, " ✕ ", 8, ln)) : A("", !0)
+        }, " ✕ ", 8, dn)) : M("", !0)
       ])
     ]),
     default: q(() => [
-      (r(!0), l(le, null, fe(i.filteredContentList, (m) => (r(), W(d, {
-        key: m.id,
-        item: m,
-        "is-collapsed": i.collapsed[m.id],
-        isSelected: m.id === o.activeConnectionKey,
+      (l(!0), u(pe, null, we(i.filteredContentList, (d) => (l(), W(p, {
+        key: d.id,
+        item: d,
+        "is-collapsed": i.collapsed[d.id],
+        isSelected: d.id === o.activeConnectionKey,
         isMobile: i.isMobile,
         testTag: o.testTag,
         onToggle: i.toggleCollapse,
@@ -1360,56 +1387,56 @@ function dn(t, e, o, i, c, y) {
         onToggleMobileMenu: i.toggleMobileMenu,
         "delete-connection": y.deleteConnection
       }, null, 8, ["item", "is-collapsed", "isSelected", "isMobile", "testTag", "onToggle", "onClick", "onRefresh", "onUpdateMotherduckToken", "onUpdateBigqueryProject", "onUpdateBigqueryBrowsingProject", "onUpdateSnowflakePrivateKey", "onUpdateSnowflakeAccount", "onUpdateSnowflakeUsername", "onToggleSaveCredential", "onToggleMobileMenu", "delete-connection"]))), 128)),
-      c.showDeleteConfirmationState ? (r(), l("div", {
+      c.showDeleteConfirmationState ? (l(), u("div", {
         key: 0,
         class: "confirmation-overlay",
-        onClick: e[6] || (e[6] = k((...m) => y.cancelDelete && y.cancelDelete(...m), ["self"]))
+        onClick: e[6] || (e[6] = R((...d) => y.cancelDelete && y.cancelDelete(...d), ["self"]))
       }, [
-        s("div", cn, [
-          e[7] || (e[7] = s("h3", null, "Confirm Deletion", -1)),
-          e[8] || (e[8] = s("p", null, " Are you sure you want to delete this connection? All associated editors will be deleted. ", -1)),
-          s("div", un, [
+        s("div", pn, [
+          e[9] || (e[9] = s("h3", null, "Confirm Deletion", -1)),
+          e[10] || (e[10] = s("p", null, " Are you sure you want to delete this connection? All associated editors will be deleted. ", -1)),
+          s("div", mn, [
             s("button", {
               class: "cancel-btn",
-              onClick: e[4] || (e[4] = (...m) => y.cancelDelete && y.cancelDelete(...m))
+              onClick: e[4] || (e[4] = (...d) => y.cancelDelete && y.cancelDelete(...d))
             }, "Cancel"),
             s("button", {
               class: "confirm-btn",
-              onClick: e[5] || (e[5] = (...m) => y.confirmDelete && y.confirmDelete(...m))
+              onClick: e[5] || (e[5] = (...d) => y.confirmDelete && y.confirmDelete(...d))
             }, "Delete")
           ])
         ])
-      ])) : A("", !0)
+      ])) : M("", !0)
     ]),
     _: 1
   });
 }
-const So = /* @__PURE__ */ z(tn, [["render", dn], ["__scopeId", "data-v-e9246856"]]);
+const Eo = /* @__PURE__ */ Z(sn, [["render", hn], ["__scopeId", "data-v-d32fa84c"]]);
 class n {
   constructor(e, o, i = null, c = null) {
-    ee(this, "title");
-    ee(this, "content");
-    ee(this, "type");
-    ee(this, "data");
+    te(this, "title");
+    te(this, "content");
+    te(this, "type");
+    te(this, "data");
     this.title = e, this.content = o, this.type = i, this.data = c || {};
   }
 }
-class L {
+class I {
   constructor(e, o, i = void 0) {
-    ee(this, "title");
-    ee(this, "paragraphs");
-    ee(this, "displayName");
+    te(this, "title");
+    te(this, "paragraphs");
+    te(this, "displayName");
     this.title = e, this.paragraphs = o, this.displayName = i;
   }
 }
 class ke {
   constructor(e, o) {
-    ee(this, "title");
-    ee(this, "articles");
+    te(this, "title");
+    te(this, "articles");
     this.title = e, this.articles = o;
   }
 }
-const pn = new L(
+const yn = new I(
   "Dashboards",
   [
     new n(
@@ -1468,7 +1495,7 @@ const pn = new L(
     )
   ],
   "Dashboard Tutorial"
-), mn = new L(
+), gn = new I(
   "Model Tutorial",
   [
     new n(
@@ -1522,8 +1549,8 @@ order by
             "Make sure the state output is named state and you've ordered properly."
           ],
           validationFn: (t) => {
-            var e, o, i, c, y, a, d;
-            return ((e = t.data) == null ? void 0 : e.length) === 3 && ((i = (o = t.data) == null ? void 0 : o[0]) == null ? void 0 : i.state) === "CA" && ((y = (c = t.data) == null ? void 0 : c[1]) == null ? void 0 : y.state) === "NY" && ((d = (a = t.data) == null ? void 0 : a[2]) == null ? void 0 : d.state) === "TX";
+            var e, o, i, c, y, a, p;
+            return ((e = t.data) == null ? void 0 : e.length) === 3 && ((i = (o = t.data) == null ? void 0 : o[0]) == null ? void 0 : i.state) === "CA" && ((y = (c = t.data) == null ? void 0 : c[1]) == null ? void 0 : y.state) === "NY" && ((p = (a = t.data) == null ? void 0 : a[2]) == null ? void 0 : p.state) === "TX";
           }
         },
         {
@@ -1681,7 +1708,7 @@ select
     )
   ],
   "Model Tutorial"
-), hn = new L(
+), fn = new I(
   "Welcome",
   [
     new n(
@@ -1703,7 +1730,7 @@ select
     ),
     new n(
       "Purpose",
-      `Trilogy Studio has a built in model "store", containing a set of public models hosted on github. The demo model is one of those options. Let's get started! Search below for the demo-model, and click the import button to add it. You want to import it to a duckdb connection. Select new duckdb connection and name it demo-connection.`
+      `Trilogy Studio has a built in model "store", containing a set of public models hosted on github. The demo model is one of those options. Let's get started! Search below for the demo-model, and click the import button to add it. You want to import it to a duckdb connection. Select "New DuckDB" and keep the default connection name.`
     ),
     new n("Purpose", "<PLACEHOLDER>", "community-models"),
     new n("ModelList", "", "model-validator"),
@@ -1730,7 +1757,7 @@ select
     ),
     new n(
       "Purpose",
-      'Now that you have a connection and model set up, you can start querying in an editor. Editors are grouped by their storage, then by connection. `Local` represents local storage in your browser. [Other storage, like Github, will be available in the future] Your imported model will have populated some default editors, but lets start with a new one. Click the new button and create a Trilogy editor named "my-first-editor" associated with the demo connection.'
+      'Now that you have a connection and model set up, you can start querying in an editor. Editors are grouped by their storage, then by connection. `Local` represents local storage in your browser. [Other storage, like Github, will be available in the future] Your imported model will have populated some default editors, but let\'s start with a new one. In the sidebar, click the "..." menu next to the demo-model-connection to expand its options, then create a new Trilogy editor named "my-first-editor".'
     ),
     new n("Purpose", "", "editors"),
     new n("Purpose", "", "editor-validator"),
@@ -1802,7 +1829,7 @@ order by
     )
   ],
   "Welcome and Query Tutorial"
-), yn = new L("LLM Tutorial", [
+), wn = new I("LLM Tutorial", [
   new n(
     "Connections",
     "LLMs can optionally be used to enhance the studio experience. The LLM screen is accessible on the left-hand nav and provides some basic validation that your LLM will work. LLMs is not required, but we aim to make the best use of them when available."
@@ -1902,7 +1929,7 @@ auto state.population <- random(state)*10000;
     "LLMs operate on the imported concept context. Make sure you have a datasource selected on a dashboard, or add imports to an editor before typing your comment. Ctrl-shift-enter is the default LLM activation shortcut; typically you will highlight text and then run this.",
     "tip"
   )
-]), fn = new L("Functions", [
+]), bn = new I("Functions", [
   new n(
     "Trilogy Built-in Functions",
     "Trilogy provides a comprehensive set of built-in functions that closely map to standard SQL functions. These functions enable data transformation, aggregation, and manipulation within your queries. They are categorized into aggregate, date/time, string, numeric, collection, and utility functions."
@@ -2789,7 +2816,7 @@ auto state.population <- random(state)*10000;
       }
     }
   )
-]), gn = new L("Window Functions", [
+]), Tn = new I("Window Functions", [
   new n(
     "Trilogy Built-in Functions",
     "Window functions are a set of built-in functions in the Trilogy query language that allow you to perform calculations across a set of rows related to the current row. These functions are essential for data analysis, reporting, and complex aggregations."
@@ -2875,7 +2902,7 @@ auto state.population <- random(state)*10000;
       }
     }
   )
-]), wn = new L(
+]), vn = new I(
   "Modeling",
   // Article Title
   [
@@ -3105,8 +3132,8 @@ select pi * 2 as circumference_ratio;`,
     )
   ],
   "Modeling"
-), Tn = new ke("Trilogy Reference", [
-  new L("Overview/Goals", [
+), En = new ke("Trilogy Reference", [
+  new I("Overview/Goals", [
     new n(
       "Introduction",
       "Trilogy is a new, SQL-derived language that compiles to SQL. Trilogy Studio provides you with both native Trilogy and SQL editors, allowing you to query your data in a way that is more expressive and easier to maintain than traditional SQL."
@@ -3191,7 +3218,7 @@ ORDER BY
       "Explore the rest of the reference documentation for more details on how Trilogy works and explore these concepts in more detail."
     )
   ]),
-  new L("Code", [
+  new I("Code", [
     new n(
       "How Trilogy Works",
       `Studio and dependent code is open-source under the MIT license. The code is available on GitHub at the following locations:
@@ -3204,7 +3231,7 @@ ORDER BY
         `
     )
   ]),
-  new L("Querying Data", [
+  new I("Querying Data", [
     new n(
       "SELECT Without FROM, JOIN, or GROUP BY",
       "In Trilogy, you write queries without explicitly specifying tables, joins, or grouping."
@@ -3249,7 +3276,7 @@ LIMIT 10;`,
       "All concepts and outputs must be explicitly named, using AS to bind any transformation. The having clause and order clause can only reference fields in the select list, while the where clause can reference any field in the model."
     )
   ]),
-  new L("Syntax", [
+  new I("Syntax", [
     new n(
       "Basic SELECT Statement",
       "A Trilogy statement consists of one or more lines ending in a semicolon. Trilogy follows SQL syntax closely but removes redundant features like explicit joins and the FROM clause. A basic select could look like this:"
@@ -3338,7 +3365,7 @@ complete_for_clause?
       "code"
     )
   ]),
-  new L("Concepts", [
+  new I("Concepts", [
     new n(
       "What Are Concepts?",
       "Concepts are core semantic building blocks in Trilogy. They represent keys, properties, or metrics: Keys (unique identifiers), Properties (additional values), and Metrics (aggregatable values)."
@@ -3392,7 +3419,7 @@ metric product_count <-count(product.id); # the count of products`,
       "A metric can be created by an aggregation with a defined grain, ex: `metric product_count <-count(product_id) by store;`, in which case it behaves similar to a property. However, where conditions for a select will still be pushed inside these aggregates."
     )
   ]),
-  new L("Datasources and Joins", [
+  new I("Datasources and Joins", [
     new n(
       "Defining Datasources",
       "A table in a warehouse is defined as a dataset with each column bound to a concept. When datasources share a common key, trilogy can join between them. Not all joins are equal; some are 1-1, 1-many, or many-1. Trilogy handles these by looking at the grain of each datasource involved. If a join is on a key other than the grain of the sources, the output may need to be grouped up to avoid duplication. "
@@ -3419,12 +3446,39 @@ grain (customers.id)
 address warehouse.customers;`,
       "code"
     ),
+    new n(
+      "Partial Data",
+      "Sometimes partial data is all we need. For example, imagine a recent and archive table. When you query the last 7 days, and the last 30 are in recent - we can prune the archive."
+    ),
+    new n(
+      "Example",
+      `partial datasource recent_sales (
+  order_id: orders.id,
+  cu_id: customers.id,
+  revenue: orders.revenue,
+  date: orders.date
+)
+grain (orders.id)
+complete where orders.date > current_date - 30
+address warehouse.sales;
+
+partial datasource archive_sales (
+  order_id: orders.id,
+  cu_id: customers.id,
+  revenue: orders.revenue,
+  date: orders.date
+)
+grain (orders.id)
+complete where orders.date <= current_date - 30
+address warehouse.sales_archive;`,
+      "code"
+    ),
     new n(
       "Partial Keys",
-      'A query of the form `SELECT sum(orders.revenue), customer.name` would mean "get all customer names, and their total revenue". This would be resolved via a join through customer.id, with the order table being on the right side of the join, to ensure that all customers were returned regardless of if they placed an order.'
+      "A query of the form `where orders.date > current_date -7 can safely resolve to just our recent. This lets us efficiently prune and select relevant datasources."
     )
   ]),
-  new L("Grains and Aggregation", [
+  new I("Grains and Aggregation", [
     new n(
       "What Is a Grain?",
       "A grain represents the unique combination of keys. Tables and aggregations both have grains, which determine the minimum keys required to uniquely identify a row of data. For example, finding the total sales by customer id, anme, and address would be an aggregation to the grain of a customer id, no matter how many other customer properties are included. Properties of a key are implicitly dropped from any grain that includes that key, though a grain without the key associated with a property will include that property in the grain."
@@ -3442,9 +3496,9 @@ address warehouse.customers;`,
       "This query would aggregate revenue to the grain of order_date, as order year is a property of order date."
     )
   ]),
-  fn,
-  gn,
-  new L("Custom Functions", [
+  bn,
+  Tn,
+  new I("Custom Functions", [
     new n(
       "Defining Functions",
       "Custom functions can be used to extend the language with reusable code macros. Functions are defined using the def keyword and have a list of arguments and are mapped to an expression. Any argument alias will be locally scoped within the function, but external concepts can be referenced as well."
@@ -3482,9 +3536,9 @@ SELECT
       "code"
     )
   ]),
-  wn
-]), bn = new ke("Terms of Service", [
-  new L("Terms of Service", [
+  vn
+]), Sn = new ke("Terms of Service", [
+  new I("Terms of Service", [
     new n("Last Updated", "February 22, 2025"),
     new n(
       "Service Description",
@@ -3558,13 +3612,13 @@ SELECT
       "conclusion"
     )
   ])
-]), Co = [
+]), So = [
   new ke("Studio", [
-    hn,
-    pn,
-    mn,
+    fn,
     yn,
-    new L("Functionality", [
+    gn,
+    wn,
+    new I("Functionality", [
       new n(
         "Tip",
         "Trilogy Studio is a statically hosted website that uses a mix of precompiled scripts and dynamic imports for some connections to reduce bundle size."
@@ -3579,7 +3633,7 @@ SELECT
         "tip"
       )
     ]),
-    new L("Navigation", [
+    new I("Navigation", [
       new n(
         "Navigation",
         "On desktop, Trilogy Studio uses a left-hand navigation bar, a sidebar with context, and a main pane (which may be split) to present information. The sidebar is further split into sections; the first icons change the sidebar for the query editor, while the next section configures entirely new main screen experiences. Configuration/profile are accessible at the bottom. On mobile, Trilogy will instead use a top menu to access a navigation screen, and the main display will show only one particular field at a time."
@@ -3590,7 +3644,7 @@ SELECT
         "tip"
       )
     ]),
-    new L("Querying", [
+    new I("Querying", [
       new n(
         "Querying",
         "A core goal of Trilogy Studio is to enable seamless running of Trilogy against backends. Raw SQL is fully supported as well to help with debugging, diagnostics, and other development tasks."
@@ -3604,7 +3658,7 @@ SELECT
         "When running Trilogy queries, your command will first go to a backend server to be parsed/type-checked, then the output SQL will be returned to the editor to be run as a normal SQL query. SQL editors will submit directly to the configured connection without the first parsing pass."
       )
     ]),
-    new L("Connections", [
+    new I("Connections", [
       new n(
         "Connections",
         "Editors must be associated with a connection. A connection represents a particular underlying backend database resource. Many IDEs can share one connection, but only a single query can be executed on a connection at a single point in time. Connections are also associated with a model, which enables configuration of additional editors as semantic sources."
@@ -3615,34 +3669,34 @@ SELECT
       ),
       new n("ConnectionList", "", "connections")
     ]),
-    new L("DuckDB", [
+    new I("DuckDB", [
       new n(
         "DuckDB",
         "DuckDB is always available as an in-browser database using the DuckDB WASM integration. No authentication is required. DuckDB also natively supports csv uploads through a widget available on the connection view. Most community duckdb models will reference publically available CSV or parquet files."
       )
     ]),
-    new L("Bigquery", [
+    new I("Bigquery", [
       new n(
         "Connections",
         'Bigquery is supported through Oauth authentication as your identity. If you wish to use a service key file, please upvote this github issue: <a href="https://github.com/trilogy-data/trilogy-studio-core/issues/33" target="_blank">BQ Service Account Support</a>.'
       )
     ]),
-    new L("Snowflake", [
+    new I("Snowflake", [
       new n(
         "Connections",
         'Snowflake is supported with private key authentication. Read more at this link: <a href="https://docs.snowflake.com/en/user-guide/key-pair-auth" target="_blank">Snowflake Private Key Pairs</a>. You will need to provide the private key to connect after configuring your user with the public key portion. The rest of the authentication header can be derived from this. Remember to use caution of saving this key.'
       )
     ]),
-    new L("Scheduling", [
+    new I("Scheduling", [
       new n(
         "Scheduling",
         'Scheduling dashboards/scripts is a future feature. Please upvote this github issue: <a href="https://github.com/trilogy-data/trilogy-studio-core/issues/75" target="_blank">Scheduling</a>.'
       )
     ])
   ]),
-  Tn,
+  En,
   new ke("Privacy And Data", [
-    new L("Privacy Policy", [
+    new I("Privacy Policy", [
       new n("Last Updated", "February 22, 2025"),
       new n(
         "Introduction",
@@ -3709,7 +3763,7 @@ SELECT
         "conclusion"
       )
     ]),
-    new L("Stored Info", [
+    new I("Stored Info", [
       new n(
         "Local Data",
         "Trilogy Studio uses browser local storage for your editors and models. These do not leave your browser (except when a model is sent in to generate a query)."
@@ -3729,19 +3783,19 @@ SELECT
         "tip"
       )
     ]),
-    new L("Google", [
+    new I("Google", [
       new n(
         "Google Account",
         "Trilogy Studio uses Google OAuth to authenticate users when using a Google Bigquery connection. Trilogy Studio uses a token provided by Google to authenticate your account through the interactive sign-in flow. Trilogy Studio only requests scopes required for Bigquery read/write access, and the token never leaves your browser. This token is only used to communicate directly with BigQuery with the standard google javascript client library."
       )
     ]),
-    new L("Snowflake", [
+    new I("Snowflake", [
       new n(
         "Google Account",
         "Trilogy Studio supports private key authentication for Snowflake. You will need to provide the private key to connect after configuring your user with the public key portion in Snowflake directly. The rest of the authentication header can be derived from this."
       )
     ]),
-    new L("Telemetry Details", [
+    new I("Telemetry Details", [
       new n(
         "Telemetry",
         `<a href="https://www.goatcounter.com/">GoatCounter</a> is used to collect anonymized
@@ -3749,8 +3803,8 @@ SELECT
       )
     ])
   ]),
-  bn
-], vn = ae({
+  Sn
+], Cn = ce({
   name: "LLMProviderIcon",
   props: {
     providerType: {
@@ -3758,107 +3812,44 @@ SELECT
       required: !0
     }
   }
-}), En = { class: "provider-icon-container" }, Sn = {
+}), kn = { class: "provider-icon-container" }, An = {
   key: 0,
   class: "mdi mdi-alpha-c-circle",
   title: "Anthropic"
-}, Cn = {
+}, In = {
   key: 1,
   class: "mdi mdi-flash",
   title: "OpenAI"
-}, kn = {
+}, Pn = {
   key: 2,
   class: "mdi mdi-google",
   title: "Google"
-}, An = {
+}, Rn = {
   key: 3,
   class: "mdi mdi-robot",
   title: "OpenRouter"
-}, In = {
+}, Mn = {
   key: 4,
   class: "mdi mdi-history demo-icon",
   title: "Demo"
-}, Pn = {
+}, Ln = {
   key: 5,
   class: "mdi mdi-robot",
   title: "LLM Provider"
 };
-function Rn(t, e, o, i, c, y) {
-  return r(), l("div", En, [
-    t.providerType === "anthropic" ? (r(), l("i", Sn)) : t.providerType === "openai" ? (r(), l("i", Cn)) : t.providerType === "google" ? (r(), l("i", kn)) : t.providerType === "openrouter" ? (r(), l("i", An)) : t.providerType === "demo" ? (r(), l("i", In)) : (r(), l("i", Pn))
+function Dn(t, e, o, i, c, y) {
+  return l(), u("div", kn, [
+    t.providerType === "anthropic" ? (l(), u("i", An)) : t.providerType === "openai" ? (l(), u("i", In)) : t.providerType === "google" ? (l(), u("i", Pn)) : t.providerType === "openrouter" ? (l(), u("i", Rn)) : t.providerType === "demo" ? (l(), u("i", Mn)) : (l(), u("i", Ln))
   ]);
 }
-const Mn = /* @__PURE__ */ z(vn, [["render", Rn], ["__scopeId", "data-v-66f81112"]]), Ln = ae({
-  name: "ContextMenu",
-  props: {
-    items: {
-      type: Array,
-      required: !0
-    },
-    position: {
-      type: Object,
-      default: () => ({ x: 0, y: 0 })
-    },
-    isVisible: {
-      type: Boolean,
-      default: !1
-    },
-    id: {
-      type: String,
-      default: ""
-    }
-  },
-  emits: ["item-click", "close"],
-  setup(t, { emit: e }) {
-    const o = J(() => ({
-      left: `${t.position.x}px`,
-      top: `${t.position.y}px`
-    })), i = (y) => {
-      e("item-click", y), e("close");
-    }, c = (y) => {
-      t.isVisible && e("close");
-    };
-    return Ie(() => {
-      setTimeout(() => {
-        document.addEventListener("click", c);
-      }, 300);
-    }), Ye(() => {
-      document.removeEventListener("click", c);
-    }), {
-      positionStyle: o,
-      handleItemClick: i
-    };
-  }
-}), Dn = ["onClick"];
-function _n(t, e, o, i, c, y) {
-  return t.isVisible ? (r(), l("div", {
-    key: 0,
-    style: Fe(t.positionStyle),
-    class: "context-menu"
-  }, [
-    (r(!0), l(le, null, fe(t.items, (a) => (r(), l("div", {
-      key: a.id,
-      class: me(["context-menu-item", { danger: a.danger }]),
-      onClick: (d) => t.handleItemClick(a)
-    }, [
-      a.icon ? (r(), l("i", {
-        key: 0,
-        class: me(`mdi ${a.icon}`)
-      }, null, 2)) : A("", !0),
-      s("span", null, j(a.label), 1)
-    ], 10, Dn))), 128))
-  ], 4)) : A("", !0);
-}
-const Nn = /* @__PURE__ */ z(Ln, [["render", _n], ["__scopeId", "data-v-48938153"]]), qn = ae({
+const _n = /* @__PURE__ */ Z(Cn, [["render", Dn], ["__scopeId", "data-v-66f81112"]]), Nn = ce({
   name: "LLMConnectionListItem",
   components: {
-    SidebarItem: Me,
-    LLMProviderIcon: Mn,
-    ConnectionRefresh: Ue,
-    ConnectionStatusIcon: Re,
-    LoadingButton: Ce,
-    ContextMenu: Nn,
-    Tooltip: Se
+    SidebarItem: Ne,
+    LLMProviderIcon: _n,
+    ConnectionStatusIcon: _e,
+    Tooltip: Ae,
+    SidebarOverflowMenu: De
   },
   props: {
     item: {
@@ -3886,116 +3877,132 @@ const Nn = /* @__PURE__ */ z(Ln, [["render", _n], ["__scopeId", "data-v-48938153
     "deleteChat"
   ],
   setup(t, { emit: e }) {
-    const o = S(""), i = S(!1), c = S(""), y = S("");
-    Ie(() => {
-      var p, D, u;
-      t.item.type === "api-key" && ((p = t.item.connection) != null && p.getApiKey()) && (o.value = t.item.connection.getApiKey()), t.item.type === "model" && ((D = t.item.connection) != null && D.model) && (c.value = t.item.connection.model), t.item.type === "fast-model" && (y.value = ((u = t.item.connection) == null ? void 0 : u.fastModel) || "");
-    }), Ae(
+    const o = C(""), i = C(!1), c = C(""), y = C("");
+    let a = null;
+    Le(() => {
+      var h, r, T;
+      t.item.type === "api-key" && ((h = t.item.connection) != null && h.getApiKey()) && (o.value = t.item.connection.getApiKey()), t.item.type === "model" && ((r = t.item.connection) != null && r.model) && (c.value = t.item.connection.model), t.item.type === "fast-model" && (y.value = ((T = t.item.connection) == null ? void 0 : T.fastModel) || "");
+    }), Pe(
       // @ts-ignore
       () => {
-        var p;
-        return (p = t.item.connection) == null ? void 0 : p.apiKey;
+        var h;
+        return (h = t.item.connection) == null ? void 0 : h.apiKey;
       },
-      (p) => {
-        t.item.type === "api-key" && p && (o.value = p);
+      (h) => {
+        t.item.type === "api-key" && h && (o.value = h);
       }
-    ), Ae(
+    ), Pe(
       () => {
-        var p;
-        return (p = t.item.connection) == null ? void 0 : p.model;
+        var h;
+        return (h = t.item.connection) == null ? void 0 : h.model;
       },
-      (p) => {
-        t.item.type === "model" && p && (c.value = p);
+      (h) => {
+        t.item.type === "model" && h && (c.value = h);
       },
       { immediate: !0 }
-    ), Ae(
+    ), Pe(
       () => {
-        var p;
-        return (p = t.item.connection) == null ? void 0 : p.fastModel;
+        var h;
+        return (h = t.item.connection) == null ? void 0 : h.fastModel;
       },
-      (p) => {
-        t.item.type === "fast-model" && (y.value = p || "");
+      (h) => {
+        t.item.type === "fast-model" && (y.value = h || "");
       },
       { immediate: !0 }
     );
-    const a = S(!1), d = S({ x: 0, y: 0 }), T = J(() => {
-      const p = [];
-      return t.item.type === "connection" && p.push(
-        { id: "set-default", label: "Set as Default", icon: "mdi-star-outline" },
+    const p = z(() => {
+      var r;
+      const h = [];
+      return t.item.type === "connection" && ((r = t.item.connection) != null && r.isDefault || h.push({
+        id: "set-default",
+        label: "Set as default",
+        icon: "mdi-star-outline"
+      }), h.push(
         { id: "refresh", label: "Refresh Connection", icon: "mdi-refresh" },
-        { id: "delete", label: "Delete Connection", icon: "mdi-delete-outline", danger: !0 }
-      ), p;
-    }), m = (p) => {
-      t.item.type === "connection" && (d.value = {
-        x: p.clientX,
-        y: p.clientY
-      }, a.value = !0);
-    }, R = (p) => {
-      var D;
-      switch (p.id) {
+        { id: "delete-separator", kind: "separator" },
+        { id: "delete", label: "Delete connection", icon: "mdi-trash-can-outline", danger: !0 }
+      )), h;
+    }), w = (h) => {
+      var r;
+      switch (h.id) {
         case "delete":
-          v(t.item.id);
+          g(t.item.id);
           break;
         case "set-default":
-          C(t.item.id);
+          le(t.item.id);
           break;
         case "refresh":
-          e("refresh", t.item.id, ((D = t.item.connection) == null ? void 0 : D.name) || "", "connection");
+          e("refresh", t.item.id, ((r = t.item.connection) == null ? void 0 : r.name) || "", "connection");
           break;
       }
-    }, P = J(() => ["connection"].includes(t.item.type)), g = () => ["api-key", "model", "fast-model", "toggle-save-credential", "refresh-connection"].includes(
-      t.item.type
-    ) ? "" : t.item.name, h = () => {
-      (P.value || t.item.type === "open-chat" || t.item.type === "open-validation" || t.item.type === "new-chat" || t.item.type === "chat-item") && F(t.item.id);
-    }, F = (p) => {
-      var u;
-      const D = t.item.type === "chat-item" ? { chatId: t.item.chatId } : void 0;
-      e("toggle", p, ((u = t.item.connection) == null ? void 0 : u.name) || "", t.item.type, D);
-    }, w = (p) => {
-      var D;
-      p.stopPropagation(), e("refresh", t.item.id, ((D = t.item.connection) == null ? void 0 : D.name) || "", "connection");
-    }, ce = (p) => {
-      e("toggleSaveCredential", p);
-    }, ue = (p) => p instanceof _e ? "anthropic" : p instanceof Ne ? "openai" : p instanceof qe ? "google" : p.type || "unknown", f = (p) => p && p.connected === !0, C = (p) => {
-      var D;
-      e("setActive", p, ((D = t.item.connection) == null ? void 0 : D.name) || "", "connection");
-    }, v = (p) => {
-      var D;
-      e("deleteConnection", p, ((D = t.item.connection) == null ? void 0 : D.name) || "");
+    }, d = z(() => ["connection", "settings-group"].includes(t.item.type)), S = () => [
+      "api-key",
+      "model",
+      "fast-model",
+      "settings-group",
+      "toggle-save-credential",
+      "refresh-connection"
+    ].includes(t.item.type) ? "" : t.item.name, f = () => {
+      (d.value || t.item.type === "open-chat" || t.item.type === "open-validation" || t.item.type === "new-chat" || t.item.type === "chat-item") && N(t.item.id);
+    }, N = (h) => {
+      var T;
+      const r = t.item.type === "chat-item" ? { chatId: t.item.chatId } : void 0;
+      e("toggle", h, ((T = t.item.connection) == null ? void 0 : T.name) || "", t.item.type, r);
+    }, A = (h) => {
+      var r;
+      h.stopPropagation(), e("refresh", t.item.id, ((r = t.item.connection) == null ? void 0 : r.name) || "", "connection");
+    }, m = (h) => {
+      e("toggleSaveCredential", h);
+    }, Q = (h) => h instanceof Ue ? "anthropic" : h instanceof Oe ? "openai" : h instanceof xe ? "google" : h.type || "unknown", ue = (h) => h && h.connected === !0, le = (h) => {
+      var r;
+      e("setActive", h, ((r = t.item.connection) == null ? void 0 : r.name) || "", "connection");
+    }, g = (h) => {
+      var r;
+      e("deleteConnection", h, ((r = t.item.connection) == null ? void 0 : r.name) || "");
+    }, P = (h) => {
+      var r;
+      h && e("deleteChat", h, ((r = t.item.connection) == null ? void 0 : r.name) || "");
+    }, v = (h, r) => {
+      e("updateApiKey", h, r);
+    }, b = (h, r) => {
+      e("updateModel", h, r);
+    }, k = (h, r) => {
+      e("updateFastModel", h, r);
     };
     return {
       apiKeyInput: o,
       selectedModel: c,
       selectedFastModel: y,
-      isExpandable: P,
-      getItemName: g,
-      handleItemClick: h,
-      handleRefreshConnectionClick: w,
-      getProviderType: ue,
-      isConnected: f,
-      setAsActive: C,
-      updateApiKey: (p, D) => {
-        e("updateApiKey", p, D);
+      isExpandable: d,
+      getItemName: S,
+      handleItemClick: f,
+      handleRefreshConnectionClick: A,
+      getProviderType: Q,
+      isConnected: ue,
+      setAsActive: le,
+      updateApiKey: v,
+      updateModel: b,
+      updateFastModel: k,
+      handleApiKeyInput: () => {
+        t.item.type !== "api-key" || !t.item.connection || o.value !== (t.item.connection.getApiKey() || "") && (a && clearTimeout(a), a = setTimeout(() => {
+          v(t.item.connection, o.value);
+        }, 500));
       },
-      updateModel: (p, D) => {
-        e("updateModel", p, D);
+      handleModelChange: () => {
+        t.item.type !== "model" || !t.item.connection || !c.value || c.value === t.item.connection.model || b(t.item.connection, c.value);
       },
-      updateFastModel: (p, D) => {
-        e("updateFastModel", p, D);
-      },
-      toggleSaveCredential: ce,
-      deleteConnection: v,
-      deleteChat: (p) => {
-        var D;
-        p && e("deleteChat", p, ((D = t.item.connection) == null ? void 0 : D.name) || "");
+      handleFastModelChange: () => {
+        if (t.item.type !== "fast-model" || !t.item.connection)
+          return;
+        const h = y.value || null;
+        h !== (t.item.connection.fastModel || null) && k(t.item.connection, h);
       },
-      // Context menu
-      contextMenuVisible: a,
-      contextMenuPosition: d,
-      contextMenuItems: T,
-      showContextMenu: m,
-      handleContextMenuItemClick: R,
-      toggleCollapse: F,
+      toggleSaveCredential: m,
+      deleteConnection: g,
+      deleteChat: P,
+      contextMenuItems: p,
+      handleContextMenuItemClick: w,
+      toggleCollapse: N,
       // API key visibility
       showApiKey: i,
       toggleApiKeyVisibility: () => {
@@ -4003,38 +4010,38 @@ const Nn = /* @__PURE__ */ z(Ln, [["render", _n], ["__scopeId", "data-v-48938153
       }
     };
   }
-}), Un = {
+}), qn = {
   key: 1,
+  class: "mdi mdi-tune-vertical node-icon"
+}, Un = {
+  key: 2,
   class: "mdi mdi-alert-circle node-icon"
 }, On = {
-  key: 2,
-  class: "mdi mdi-chat-outline node-icon"
-}, Bn = {
   key: 3,
-  class: "mdi mdi-test-tube node-icon"
+  class: "mdi mdi-chat-outline node-icon"
 }, xn = {
   key: 4,
-  class: "mdi mdi-chat-plus-outline node-icon"
-}, Yn = {
+  class: "mdi mdi-test-tube node-icon"
+}, Bn = {
   key: 5,
-  class: "mdi mdi-chat node-icon"
+  class: "mdi mdi-chat-plus-outline node-icon"
 }, Fn = {
   key: 6,
+  class: "mdi mdi-chat node-icon"
+}, Yn = {
+  key: 7,
   class: "mdi mdi-folder-outline node-icon"
-}, Gn = { class: "api-key-input-wrapper" }, jn = ["type", "data-testid"], Kn = ["data-testid", "title"], Qn = ["data-testid"], Vn = ["data-testid"], Hn = ["value", "data-testid"], Wn = ["data-testid"], zn = ["data-testid"], Xn = ["value", "data-testid"], Jn = { class: "save-credential-toggle" }, Zn = ["checked"], $n = { key: 0 }, eo = {
+}, Gn = { class: "api-key-input-wrapper" }, Kn = ["type", "data-testid"], jn = ["data-testid", "title"], Qn = ["data-testid"], Vn = ["data-testid"], Hn = ["value", "data-testid"], Wn = ["data-testid"], zn = ["data-testid"], Xn = ["value", "data-testid"], Jn = { class: "save-credential-toggle sidebar-toggle-row" }, Zn = ["checked"], $n = { key: 0 }, eo = {
   key: 0,
-  class: "chat-actions"
+  class: "connection-actions chat-actions"
 }, to = {
   key: 1,
   class: "connection-actions"
-}, no = {
-  key: 0,
-  class: "mdi mdi-star loading-button is-active"
 };
-function oo(t, e, o, i, c, y) {
-  const a = U("context-menu"), d = U("LLMProviderIcon"), T = U("LoadingButton"), m = U("tooltip"), R = U("connection-refresh"), P = U("connection-status-icon"), g = U("sidebar-item");
-  return r(), l("div", null, [
-    O(g, {
+function no(t, e, o, i, c, y) {
+  const a = x("LLMProviderIcon"), p = x("tooltip"), w = x("connection-status-icon"), d = x("sidebar-overflow-menu"), S = x("sidebar-item");
+  return l(), u("div", null, [
+    G(S, {
       "item-id": t.item.id,
       name: t.getItemName(),
       indent: t.item.indent,
@@ -4043,237 +4050,176 @@ function oo(t, e, o, i, c, y) {
       "is-collapsed": t.isCollapsed,
       itemType: "llm-connection",
       onClick: t.handleItemClick,
-      onToggle: t.toggleCollapse,
-      onContextmenu: k(t.showContextMenu, ["prevent"])
+      onToggle: t.toggleCollapse
     }, {
       icon: q(() => [
-        t.item.type === "connection" ? (r(), W(d, {
+        t.item.type === "connection" ? (l(), W(a, {
           key: 0,
           "provider-type": t.getProviderType(t.item.connection)
-        }, null, 8, ["provider-type"])) : t.item.type === "error" ? (r(), l("i", Un)) : t.item.type === "open-chat" ? (r(), l("i", On)) : t.item.type === "open-validation" ? (r(), l("i", Bn)) : t.item.type === "new-chat" ? (r(), l("i", xn)) : t.item.type === "chat-item" ? (r(), l("i", Yn)) : t.item.type === "chats-header" ? (r(), l("i", Fn)) : A("", !0)
+        }, null, 8, ["provider-type"])) : t.item.type === "settings-group" ? (l(), u("i", qn)) : t.item.type === "error" ? (l(), u("i", Un)) : t.item.type === "open-chat" ? (l(), u("i", On)) : t.item.type === "open-validation" ? (l(), u("i", xn)) : t.item.type === "new-chat" ? (l(), u("i", Bn)) : t.item.type === "chat-item" ? (l(), u("i", Fn)) : t.item.type === "chats-header" ? (l(), u("i", Yn)) : M("", !0)
       ]),
       name: q(() => [
-        t.item.type === "refresh-connection" ? (r(), l("div", {
+        t.item.type === "refresh-connection" ? (l(), u("div", {
           key: 0,
           class: "refresh title-pad-left truncate-text sidebar-sub-item",
-          onClick: e[1] || (e[1] = (...h) => t.handleRefreshConnectionClick && t.handleRefreshConnectionClick(...h))
-        }, j(t.item.name), 1)) : t.item.type === "api-key" ? (r(), l("div", {
+          onClick: e[0] || (e[0] = (...f) => t.handleRefreshConnectionClick && t.handleRefreshConnectionClick(...f))
+        }, F(t.item.name), 1)) : t.item.type === "api-key" ? (l(), u("div", {
           key: 1,
           class: "api-key-container",
-          onClick: e[5] || (e[5] = k(() => {
+          onClick: e[5] || (e[5] = R(() => {
           }, ["stop"]))
         }, [
           s("form", {
-            onSubmit: e[4] || (e[4] = k((h) => t.updateApiKey(t.item.connection, t.apiKeyInput), ["prevent"]))
+            onSubmit: e[4] || (e[4] = R(() => {
+            }, ["prevent"]))
           }, [
-            e[17] || (e[17] = s("button", {
-              type: "submit",
-              class: "customize-button"
-            }, "Update API Key", -1)),
             s("div", Gn, [
-              N(s("input", {
+              D(s("input", {
                 type: t.showApiKey ? "text" : "password",
                 id: "api-key",
-                "onUpdate:modelValue": e[2] || (e[2] = (h) => t.apiKeyInput = h),
+                "onUpdate:modelValue": e[1] || (e[1] = (f) => t.apiKeyInput = f),
+                onInput: e[2] || (e[2] = (...f) => t.handleApiKeyInput && t.handleApiKeyInput(...f)),
                 placeholder: "API Key",
-                class: "connection-customize",
+                class: "connection-customize sidebar-control-input",
                 "data-testid": `api-key-input-${t.item.connection.name}`
-              }, null, 8, jn), [
-                [Ge, t.apiKeyInput]
+              }, null, 40, Kn), [
+                [je, t.apiKeyInput]
               ]),
               s("button", {
                 type: "button",
-                class: "visibility-toggle",
-                onClick: e[3] || (e[3] = (...h) => t.toggleApiKeyVisibility && t.toggleApiKeyVisibility(...h)),
+                class: "visibility-toggle sidebar-icon-button",
+                onClick: e[3] || (e[3] = (...f) => t.toggleApiKeyVisibility && t.toggleApiKeyVisibility(...f)),
                 "data-testid": `toggle-api-key-visibility-${t.item.connection.name}`,
                 title: t.showApiKey ? "Hide API Key" : "Show API Key"
               }, [
                 s("i", {
                   class: me(t.showApiKey ? "mdi mdi-eye-off" : "mdi mdi-eye")
                 }, null, 2)
-              ], 8, Kn)
+              ], 8, jn)
             ])
           ], 32)
-        ])) : t.item.type === "model" ? (r(), l("div", {
+        ])) : t.item.type === "model" ? (l(), u("div", {
           key: 2,
           class: "api-key-container",
-          onClick: e[8] || (e[8] = k(() => {
+          onClick: e[9] || (e[9] = R(() => {
           }, ["stop"]))
         }, [
           s("form", {
-            onSubmit: e[7] || (e[7] = k(() => {
+            onSubmit: e[8] || (e[8] = R(() => {
             }, ["prevent"])),
             "data-testid": `model-update-form-${t.item.connection.name}`
           }, [
-            O(T, {
-              action: () => t.updateModel(t.item.connection, t.selectedModel),
-              "use-default-style": !1,
-              class: "customize-button",
-              "data-testid": `update-model-${t.item.connection.name}`
-            }, {
-              default: q(() => [...e[18] || (e[18] = [
-                ie(" Update Model ", -1)
-              ])]),
-              _: 1
-            }, 8, ["action", "data-testid"]),
-            N(s("select", {
-              "onUpdate:modelValue": e[6] || (e[6] = (h) => t.selectedModel = h),
+            D(s("select", {
+              "onUpdate:modelValue": e[6] || (e[6] = (f) => t.selectedModel = f),
+              onChange: e[7] || (e[7] = (...f) => t.handleModelChange && t.handleModelChange(...f)),
               id: "connection-type",
               required: "",
-              class: "connection-customize",
+              class: "connection-customize sidebar-control-select",
               "data-testid": `model-select-${t.item.connection.name}`
             }, [
-              (r(!0), l(le, null, fe(t.item.connection.models, (h) => (r(), l("option", {
-                value: h,
-                key: h,
-                "data-testid": `model-option-${h}`
-              }, j(h), 9, Hn))), 128))
-            ], 8, Vn), [
-              [Ee, t.selectedModel]
+              (l(!0), u(pe, null, we(t.item.connection.models, (f) => (l(), u("option", {
+                value: f,
+                key: f,
+                "data-testid": `model-option-${f}`
+              }, F(f), 9, Hn))), 128))
+            ], 40, Vn), [
+              [Ce, t.selectedModel]
             ])
           ], 40, Qn)
-        ])) : t.item.type === "fast-model" ? (r(), l("div", {
+        ])) : t.item.type === "fast-model" ? (l(), u("div", {
           key: 3,
           class: "api-key-container",
-          onClick: e[11] || (e[11] = k(() => {
+          onClick: e[13] || (e[13] = R(() => {
           }, ["stop"]))
         }, [
           s("form", {
-            onSubmit: e[10] || (e[10] = k(() => {
+            onSubmit: e[12] || (e[12] = R(() => {
             }, ["prevent"])),
             "data-testid": `fast-model-update-form-${t.item.connection.name}`
           }, [
-            O(T, {
-              action: () => t.updateFastModel(t.item.connection, t.selectedFastModel || null),
-              "use-default-style": !1,
-              class: "customize-button",
-              "data-testid": `update-fast-model-${t.item.connection.name}`
-            }, {
-              default: q(() => [...e[19] || (e[19] = [
-                ie(" Update Fast Model ", -1)
-              ])]),
-              _: 1
-            }, 8, ["action", "data-testid"]),
-            N(s("select", {
-              "onUpdate:modelValue": e[9] || (e[9] = (h) => t.selectedFastModel = h),
-              class: "connection-customize",
+            D(s("select", {
+              "onUpdate:modelValue": e[10] || (e[10] = (f) => t.selectedFastModel = f),
+              onChange: e[11] || (e[11] = (...f) => t.handleFastModelChange && t.handleFastModelChange(...f)),
+              class: "connection-customize sidebar-control-select",
               "data-testid": `fast-model-select-${t.item.connection.name}`
             }, [
-              e[20] || (e[20] = s("option", {
+              e[17] || (e[17] = s("option", {
                 value: "",
                 "data-testid": "fast-model-option-none"
               }, "(Use primary model)", -1)),
-              (r(!0), l(le, null, fe(t.item.connection.models, (h) => (r(), l("option", {
-                value: h,
-                key: h,
-                "data-testid": `fast-model-option-${h}`
-              }, j(h), 9, Xn))), 128))
-            ], 8, zn), [
-              [Ee, t.selectedFastModel]
+              (l(!0), u(pe, null, we(t.item.connection.models, (f) => (l(), u("option", {
+                value: f,
+                key: f,
+                "data-testid": `fast-model-option-${f}`
+              }, F(f), 9, Xn))), 128))
+            ], 40, zn), [
+              [Ce, t.selectedFastModel]
             ])
           ], 40, Wn)
-        ])) : t.item.type === "toggle-save-credential" ? (r(), l("div", {
+        ])) : t.item.type === "toggle-save-credential" ? (l(), u("div", {
           key: 4,
           class: "md-token-container",
-          onClick: e[13] || (e[13] = k(() => {
+          onClick: e[15] || (e[15] = R(() => {
           }, ["stop"]))
         }, [
           s("label", Jn, [
             s("input", {
               type: "checkbox",
               checked: t.item.connection.saveCredential,
-              onChange: e[12] || (e[12] = (h) => t.toggleSaveCredential(t.item.connection))
+              onChange: e[14] || (e[14] = (f) => t.toggleSaveCredential(t.item.connection))
             }, null, 40, Zn),
-            e[21] || (e[21] = s("span", { class: "checkbox-label" }, "Save Credentials", -1))
+            e[18] || (e[18] = s("span", { class: "checkbox-label" }, "Save credentials", -1))
           ])
-        ])) : (r(), l("span", {
+        ])) : (l(), u("span", {
           key: 5,
           class: me(["title-pad-left truncate-text", { "error-indicator": t.item.type === "error" }])
         }, [
-          ie(j(t.item.name) + " ", 1),
-          t.item.count !== void 0 && t.item.count > 0 ? (r(), l("span", $n, " (" + j(t.item.count) + ") ", 1)) : A("", !0)
+          be(F(t.item.name) + " ", 1),
+          t.item.count !== void 0 && t.item.count > 0 ? (l(), u("span", $n, " (" + F(t.item.count) + ") ", 1)) : M("", !0)
         ], 2))
       ]),
       "extra-content": q(() => [
-        t.item.type === "chat-item" ? (r(), l("div", eo, [
-          O(m, {
+        t.item.type === "chat-item" ? (l(), u("div", eo, [
+          G(p, {
             class: "tactile-button",
             content: "Delete Chat",
             position: "left"
           }, {
             default: q(() => [
               s("span", {
-                class: "remove-btn hover-icon",
-                onClick: e[14] || (e[14] = k((h) => t.deleteChat(t.item.chatId), ["stop"]))
-              }, [...e[22] || (e[22] = [
+                class: "remove-btn hover-icon sidebar-icon-button danger",
+                onClick: e[16] || (e[16] = R((f) => t.deleteChat(t.item.chatId), ["stop"]))
+              }, [...e[19] || (e[19] = [
                 s("i", { class: "mdi mdi-trash-can-outline" }, null, -1)
               ])])
             ]),
             _: 1
           })
-        ])) : A("", !0),
-        t.item.type === "connection" ? (r(), l("div", to, [
-          t.item.connection && t.item.connection.isDefault ? (r(), l("i", no)) : (r(), W(T, {
-            key: 1,
-            class: "loading-button",
-            onClick: e[15] || (e[15] = k(() => {
-            }, ["stop"])),
-            action: () => t.setAsActive(t.item.id),
-            title: "Set as default"
-          }, {
-            default: q(() => [...e[23] || (e[23] = [
-              s("i", { class: "mdi mdi-star-outline" }, null, -1)
-            ])]),
-            _: 1
-          }, 8, ["action"])),
-          t.item.connection ? (r(), W(R, {
-            key: 2,
-            connection: t.item.connection,
-            type: "llm",
-            "is-connected": t.isConnected(t.item.connection),
-            "data-testid": `refresh-llm-connection-${t.item.connection.name}`
-          }, null, 8, ["connection", "is-connected", "data-testid"])) : A("", !0),
-          O(m, {
-            class: "tacticle-button",
-            content: "Delete Connection",
-            position: "left"
-          }, {
-            default: q(() => [
-              s("span", {
-                class: "remove-btn",
-                onClick: e[16] || (e[16] = k((h) => t.deleteConnection(t.item.id), ["stop"]))
-              }, [...e[24] || (e[24] = [
-                s("i", { class: "mdi mdi-trash-can-outline tactile-button" }, null, -1)
-              ])])
-            ]),
-            _: 1
-          }),
-          t.item.connection ? (r(), W(P, {
-            key: 3,
+        ])) : M("", !0),
+        t.item.type === "connection" ? (l(), u("div", to, [
+          t.item.connection ? (l(), W(w, {
+            key: 0,
             connection: t.item.connection
-          }, null, 8, ["connection"])) : A("", !0)
-        ])) : A("", !0)
-      ]),
-      default: q(() => [
-        O(a, {
-          items: t.contextMenuItems,
-          position: t.contextMenuPosition,
-          "is-visible": t.contextMenuVisible,
-          onItemClick: t.handleContextMenuItemClick,
-          onClose: e[0] || (e[0] = (h) => t.contextMenuVisible = !1)
-        }, null, 8, ["items", "position", "is-visible", "onItemClick"])
+          }, null, 8, ["connection"])) : M("", !0),
+          G(d, {
+            items: t.contextMenuItems,
+            tooltip: "Connection actions",
+            "test-id-base": `llm-connection-actions-${t.item.id}`,
+            onSelect: t.handleContextMenuItemClick
+          }, null, 8, ["items", "test-id-base", "onSelect"])
+        ])) : M("", !0)
       ]),
       _: 1
-    }, 8, ["item-id", "name", "indent", "is-selected", "is-collapsible", "is-collapsed", "onClick", "onToggle", "onContextmenu"])
+    }, 8, ["item-id", "name", "indent", "is-selected", "is-collapsible", "is-collapsed", "onClick", "onToggle"])
   ]);
 }
-const io = /* @__PURE__ */ z(qn, [["render", oo], ["__scopeId", "data-v-45d1389b"]]), ve = {
+const oo = /* @__PURE__ */ Z(Nn, [["render", no], ["__scopeId", "data-v-9af9356c"]]), fe = {
   openai: ["gpt-5.3", "gpt-5.2", "gpt-5.2-mini"],
   anthropic: ["claude-opus-4-6-20260514", "claude-opus-4-20250514", "claude-sonnet-4-20250514"],
   google: ["models/gemini-2.5-pro", "models/gemini-2.5-flash"],
   openrouter: ["anthropic/claude-sonnet-4", "openai/gpt-4o", "google/gemini-2.5-pro"],
   demo: ["deepseek/deepseek-v3.2"]
-}, ao = ae({
+}, io = ce({
   name: "LLMConnectionCreator",
   props: {
     visible: {
@@ -4292,10 +4238,10 @@ const io = /* @__PURE__ */ z(qn, [["render", oo], ["__scopeId", "data-v-45d1389b
     }
   },
   components: {
-    LoadingButton: Ce
+    LoadingButton: Re
   },
   setup(t, { emit: e }) {
-    const o = S({
+    const o = C({
       name: "",
       type: "demo",
       options: {
@@ -4303,7 +4249,7 @@ const io = /* @__PURE__ */ z(qn, [["render", oo], ["__scopeId", "data-v-45d1389b
         model: "deepseek/deepseek-v3.2",
         saveCredential: !1
       }
-    }), i = Y("llmConnectionStore");
+    }), i = _("llmConnectionStore");
     if (!i)
       throw new Error("must inject llmConnectionStore to LLMConnectionCreator");
     const c = i.connections, y = () => {
@@ -4312,37 +4258,37 @@ const io = /* @__PURE__ */ z(qn, [["render", oo], ["__scopeId", "data-v-45d1389b
         model: "",
         saveCredential: !1
       }, a("demo");
-    }, a = (m) => {
-      switch (m) {
+    }, a = (d) => {
+      switch (d) {
         case "openai":
-          o.value.options.model = Ne.getDefaultModel(
-            ve.openai
+          o.value.options.model = Oe.getDefaultModel(
+            fe.openai
           );
           break;
         case "anthropic":
-          o.value.options.model = _e.getDefaultModel(
-            ve.anthropic
+          o.value.options.model = Ue.getDefaultModel(
+            fe.anthropic
           );
           break;
         case "google":
-          o.value.options.model = qe.getDefaultModel(
-            ve.google
+          o.value.options.model = xe.getDefaultModel(
+            fe.google
           );
           break;
         case "demo":
-          o.value.options.model = We.getDefaultModel(ve.demo);
+          o.value.options.model = Xe.getDefaultModel(fe.demo);
           break;
         case "openrouter":
-          o.value.options.model = He.getDefaultModel(
-            ve.openrouter
+          o.value.options.model = ze.getDefaultModel(
+            fe.openrouter
           );
           break;
         default:
           o.value.options.model = "";
       }
-    }, d = async () => {
-      await T();
-    }, T = async () => {
+    }, p = async () => {
+      await w();
+    }, w = async () => {
       if (!o.value.name)
         throw new Error("Connection name is required");
       if (!o.value.type)
@@ -4359,8 +4305,8 @@ const io = /* @__PURE__ */ z(qn, [["render", oo], ["__scopeId", "data-v-45d1389b
       connectionDetails: o,
       connections: c,
       createConnection: y,
-      handleSubmitConnection: T,
-      submitConnectionCreation: d,
+      handleSubmitConnection: w,
+      submitConnectionCreation: p,
       updateDefaultModel: a
     };
   },
@@ -4371,94 +4317,97 @@ const io = /* @__PURE__ */ z(qn, [["render", oo], ["__scopeId", "data-v-45d1389b
       }
     }
   }
-}), so = {
+}), ao = {
   key: 0,
   class: "creator-container"
-}, ro = { class: "form-row" }, lo = { class: "form-row" }, co = {
+}, so = { class: "form-row" }, ro = { class: "form-row" }, lo = {
   key: 0,
   class: "form-row demo-info"
-}, uo = { class: "form-row" }, po = { class: "form-row" }, mo = { class: "button-row" };
-function ho(t, e, o, i, c, y) {
-  const a = U("loading-button");
-  return t.visible ? (r(), l("div", so, [
+}, co = { class: "form-row" }, uo = { class: "form-row" }, po = { class: "button-row" };
+function mo(t, e, o, i, c, y) {
+  const a = x("loading-button");
+  return t.visible ? (l(), u("div", ao, [
     s("form", {
-      onSubmit: e[5] || (e[5] = k((...d) => t.submitConnectionCreation && t.submitConnectionCreation(...d), ["prevent"]))
+      onSubmit: e[5] || (e[5] = R((...p) => t.submitConnectionCreation && t.submitConnectionCreation(...p), ["prevent"]))
     }, [
-      s("div", ro, [
+      s("div", so, [
         e[6] || (e[6] = s("label", { for: "llm-connection-name" }, "Name", -1)),
-        N(s("input", {
+        D(s("input", {
           type: "text",
-          "onUpdate:modelValue": e[0] || (e[0] = (d) => t.connectionDetails.name = d),
+          "onUpdate:modelValue": e[0] || (e[0] = (p) => t.connectionDetails.name = p),
+          class: "sidebar-control-input",
           id: "llm-connection-name",
           required: "",
           "data-testid": "llm-connection-creator-name",
           placeholder: "Connection Name"
         }, null, 512), [
-          [G, t.connectionDetails.name]
+          [B, t.connectionDetails.name]
         ])
       ]),
-      s("div", lo, [
+      s("div", ro, [
         e[8] || (e[8] = s("label", { for: "llm-provider-type" }, "Provider", -1)),
-        N(s("select", {
-          "onUpdate:modelValue": e[1] || (e[1] = (d) => t.connectionDetails.type = d),
+        D(s("select", {
+          "onUpdate:modelValue": e[1] || (e[1] = (p) => t.connectionDetails.type = p),
+          class: "sidebar-control-select",
           id: "llm-provider-type",
           required: "",
           "data-testid": "llm-connection-creator-type"
         }, [...e[7] || (e[7] = [
-          je('<option value="demo" data-testid="llm-connection-creator-demo" data-v-56d82681>Demo (Free Trial)</option><option value="openai" data-testid="llm-connection-creator-openai" data-v-56d82681>OpenAI</option><option value="anthropic" data-testid="llm-connection-creator-anthropic" data-v-56d82681> Anthropic </option><option value="google" data-testid="llm-connection-creator-google" data-v-56d82681>Google</option><option value="openrouter" data-testid="llm-connection-creator-openrouter" data-v-56d82681> OpenRouter </option>', 5)
+          Qe('<option value="demo" data-testid="llm-connection-creator-demo" data-v-bb0a7bcc>Demo (Free Trial)</option><option value="openai" data-testid="llm-connection-creator-openai" data-v-bb0a7bcc>OpenAI</option><option value="anthropic" data-testid="llm-connection-creator-anthropic" data-v-bb0a7bcc> Anthropic </option><option value="google" data-testid="llm-connection-creator-google" data-v-bb0a7bcc>Google</option><option value="openrouter" data-testid="llm-connection-creator-openrouter" data-v-bb0a7bcc> OpenRouter </option>', 5)
         ])], 512), [
-          [Ee, t.connectionDetails.type]
+          [Ce, t.connectionDetails.type]
         ])
       ]),
-      t.connectionDetails.type === "demo" ? (r(), l("div", co, [...e[9] || (e[9] = [
+      t.connectionDetails.type === "demo" ? (l(), u("div", lo, [...e[9] || (e[9] = [
         s("span", { class: "demo-label" }, "A limited free API key will be issued automatically.", -1)
-      ])])) : A("", !0),
-      t.connectionDetails.type !== "demo" ? (r(), l(le, { key: 1 }, [
-        s("div", uo, [
+      ])])) : M("", !0),
+      t.connectionDetails.type !== "demo" ? (l(), u(pe, { key: 1 }, [
+        s("div", co, [
           e[10] || (e[10] = s("label", { for: "llm-api-key" }, "API Key", -1)),
-          N(s("input", {
+          D(s("input", {
             type: "password",
-            "onUpdate:modelValue": e[2] || (e[2] = (d) => t.connectionDetails.options.apiKey = d),
+            "onUpdate:modelValue": e[2] || (e[2] = (p) => t.connectionDetails.options.apiKey = p),
+            class: "sidebar-control-input",
             id: "llm-api-key",
             placeholder: "API Key",
             required: "",
             "data-testid": "llm-connection-creator-api-key"
           }, null, 512), [
-            [G, t.connectionDetails.options.apiKey]
+            [B, t.connectionDetails.options.apiKey]
           ])
         ]),
-        s("div", po, [
+        s("div", uo, [
           e[11] || (e[11] = s("label", { for: "save-credential" }, "Save Credential?", -1)),
-          N(s("input", {
+          D(s("input", {
             type: "checkbox",
             id: "save-credential",
-            "onUpdate:modelValue": e[3] || (e[3] = (d) => t.connectionDetails.options.saveCredential = d),
+            "onUpdate:modelValue": e[3] || (e[3] = (p) => t.connectionDetails.options.saveCredential = p),
             "data-testid": "llm-connection-creator-save-credential"
           }, null, 512), [
-            [Pe, t.connectionDetails.options.saveCredential]
+            [Me, t.connectionDetails.options.saveCredential]
           ])
         ])
-      ], 64)) : A("", !0),
-      s("div", mo, [
-        O(a, {
+      ], 64)) : M("", !0),
+      s("div", po, [
+        G(a, {
           "data-testid": "llm-connection-creator-submit",
           action: t.handleSubmitConnection,
           class: "submit-button"
         }, {
           default: q(() => [...e[12] || (e[12] = [
-            ie(" Submit ", -1)
+            be(" Submit ", -1)
           ])]),
           _: 1
         }, 8, ["action"]),
         s("button", {
           type: "button",
-          onClick: e[4] || (e[4] = (d) => t.close())
+          onClick: e[4] || (e[4] = (p) => t.close())
         }, "Cancel")
       ])
     ], 32)
-  ])) : A("", !0);
+  ])) : M("", !0);
 }
-const yo = /* @__PURE__ */ z(ao, [["render", ho], ["__scopeId", "data-v-56d82681"]]), fo = {
+const ho = /* @__PURE__ */ Z(io, [["render", mo], ["__scopeId", "data-v-bb0a7bcc"]]), yo = {
   name: "LLMConnectionList",
   props: {
     activeLLMKey: {
@@ -4474,184 +4423,183 @@ const yo = /* @__PURE__ */ z(ao, [["render", ho], ["__scopeId", "data-v-56d82681
   },
   emits: ["llm-open-view", "create-new-chat", "open-chat"],
   setup(t, { emit: e }) {
-    const o = Y("llmConnectionStore"), i = Y("saveLLMConnections"), c = Y("chatStore", null);
+    const o = _("llmConnectionStore"), i = _("saveLLMConnections"), c = _("chatStore", null);
     if (!o || !i)
       throw new Error("LLM connection store is not provided!");
-    const y = ze(), a = S({}), d = S({}), T = S(!1), m = async (f, C) => {
-      C && (await o.connections[f.name].setApiKey(C), o.resetConnection(f.name), await i());
-    }, R = (f, C) => {
-      C && (o.connections[f.name].setModel(C), o.resetConnection(f.name), i());
-    }, P = (f, C) => {
-      o.connections[f.name].setFastModel(C), i();
-    }, g = S({}), h = async (f, C, v) => {
-      if (!o.connections[C]) {
-        d.value[f] = "Connection not found";
+    const y = Je(), a = C({}), p = C({}), w = C(!1), d = C({}), S = (g) => `${g}-settings`, f = async (g, P) => {
+      P && (await o.connections[g.name].setApiKey(P), o.resetConnection(g.name), await i());
+    }, N = (g, P) => {
+      P && (o.connections[g.name].setModel(P), o.resetConnection(g.name), i());
+    }, A = (g, P) => {
+      o.connections[g.name].setFastModel(P), i();
+    }, m = async (g, P, v) => {
+      if (!o.connections[P]) {
+        p.value[g] = "Connection not found";
         return;
       }
       try {
-        if (a.value[f] = !0, v === "connection") {
-          const b = o.connections[C];
+        if (a.value[g] = !0, v === "connection") {
+          const b = o.connections[P];
           b.testConnection && await b.testConnection();
         }
-        delete d.value[f];
+        delete p.value[g];
       } catch (b) {
-        b instanceof Error ? d.value[f] = b.message : d.value[f] = "An error occurred";
+        b instanceof Error ? p.value[g] = b.message : p.value[g] = "An error occurred";
       }
-      delete a.value[f];
-    }, F = async (f, C, v, b) => {
+      delete a.value[g];
+    }, Q = async (g, P, v, b) => {
       if (v === "new-chat") {
-        e("create-new-chat", C);
+        e("create-new-chat", P);
         return;
       }
       if (v === "chat-item") {
-        c && (b != null && b.chatId) && (c.setActiveChat(b.chatId), o.activeConnection = C), e("llm-open-view", C, "chat", b == null ? void 0 : b.chatId);
+        c && (b != null && b.chatId) && (c.setActiveChat(b.chatId), o.activeConnection = P), e("llm-open-view", P, "chat", b == null ? void 0 : b.chatId);
         return;
       }
       if (v === "open-chat") {
-        e("llm-open-view", C, "chat");
+        e("llm-open-view", P, "chat");
         return;
       }
       if (v === "open-validation") {
-        e("llm-open-view", C, "validation");
+        e("llm-open-view", P, "validation");
         return;
       }
-      if (v === "connection" && (g.value[f] === void 0 || g.value[f] === !0)) {
-        const I = o.connections[C];
-        if (!I) {
-          console.log(`Connection not found ${I}`);
+      if (v === "connection" && (d.value[g] === void 0 || d.value[g] === !0)) {
+        const k = o.connections[P];
+        if (!k) {
+          console.log(`Connection not found ${k}`);
           return;
         }
-        (!I.models || I.models.length === 0) && await h(f, C, "models");
+        (!k.models || k.models.length === 0) && await m(g, P, "models");
       }
-      g.value[f] === void 0 ? g.value[f] = !1 : g.value[f] = !g.value[f];
+      d.value[g] === void 0 ? d.value[g] = !1 : d.value[g] = !d.value[g];
     };
-    Object.entries(o.connections).forEach(([f, C]) => {
-      let v = f;
-      g.value[v] = !0;
-    }), Ie(() => {
-      const f = Xe("llm-key", "");
-      if (f) {
-        const C = f.split(_), v = C[0], b = C[1];
-        v && o.connections[v] && (g.value[v] = !1, o.activeConnection = v, b && c && c.setActiveChat(b));
-      }
+    Object.entries(o.connections).forEach(([g]) => {
+      d.value[g] = !0, d.value[S(g)] = !0;
+    }), Le(() => {
+      const g = Ze("llm-key", "");
+      if (!g)
+        return;
+      const P = g.split(L), v = P[0], b = P[1];
+      v && o.connections[v] && (d.value[v] = !1, o.activeConnection = v, b && c && c.setActiveChat(b));
     });
-    const w = J(() => {
-      const f = [];
+    const ue = z(() => {
+      const g = [];
       return Object.entries(o.connections).sort(
-        ([v, b], [I, te]) => {
-          const Q = b, K = te;
-          return Q.connected && !K.connected ? -1 : !Q.connected && K.connected ? 1 : v.localeCompare(I);
+        ([v, b], [k, ne]) => {
+          const X = b, V = ne;
+          return X.connected && !V.connected ? -1 : !X.connected && V.connected ? 1 : v.localeCompare(k);
         }
       ).forEach(([v, b]) => {
-        var Q;
-        const I = b, te = ((Q = I.availableModels) == null ? void 0 : Q.length) || 0;
-        if (!I.deleted && (f.push({
+        var V;
+        const k = b, ne = ((V = k.availableModels) == null ? void 0 : V.length) || 0;
+        if (k.deleted || (g.push({
           id: v,
           name: v,
           indent: 0,
-          count: te,
+          count: ne,
           type: "connection",
-          connection: I
-        }), g.value[v] === !1)) {
-          const K = c ? c.getConnectionChats(v) : [];
-          f.push({
-            id: `${v}-new-chat`,
-            name: "New Chat",
-            indent: 1,
-            count: K.length,
-            type: "new-chat",
-            connection: I
-          }), K.forEach((p) => {
-            f.push({
-              id: `${v}-chat-${p.id}`,
-              name: p.name,
-              indent: 2,
-              count: p.messages.length,
-              type: "chat-item",
-              connection: I,
-              chat: p,
-              chatId: p.id
-            });
-          }), f.push({
-            id: `${v}-open-validation`,
-            name: "Validation Tests",
-            indent: 1,
-            count: 0,
-            type: "open-validation",
-            connection: I
-          }), I.type !== "demo" && f.push({
-            id: `${v}-api-key`,
-            name: "API Key",
-            indent: 1,
-            count: 0,
-            type: "api-key",
-            connection: I
-          }), f.push({
-            id: `${v}-model`,
-            name: "Model",
-            indent: 1,
-            count: 0,
-            type: "model",
-            connection: I
-          }), f.push({
-            id: `${v}-fast-model`,
-            name: "Fast Model",
-            indent: 1,
-            count: 0,
-            type: "fast-model",
-            connection: I
-          }), I.type !== "demo" && f.push({
-            id: `${v}-toggle-save-credential`,
-            name: "Toggle Save Credential",
-            indent: 1,
-            count: 0,
-            type: "toggle-save-credential",
-            connection: I
-          }), a.value[v] && f.push({
-            id: `${v}-loading`,
-            name: "Loading...",
-            indent: 1,
-            count: 0,
-            type: "loading",
-            connection: I
-          }), d.value[v] && f.push({
-            id: `${v}-error`,
-            name: d.value[v],
-            indent: 1,
-            count: 0,
-            type: "error",
-            connection: I
+          connection: k
+        }), d.value[v] !== !1))
+          return;
+        const X = c ? c.getConnectionChats(v) : [];
+        g.push({
+          id: `${v}-new-chat`,
+          name: "New Chat",
+          indent: 1,
+          count: X.length,
+          type: "new-chat",
+          connection: k
+        }), X.forEach((J) => {
+          g.push({
+            id: `${v}-chat-${J.id}`,
+            name: J.name,
+            indent: 2,
+            count: J.messages.length,
+            type: "chat-item",
+            connection: k,
+            chat: J,
+            chatId: J.id
           });
-        }
-      }), f;
+        }), g.push({
+          id: `${v}-open-validation`,
+          name: "Validation Tests",
+          indent: 1,
+          count: 0,
+          type: "open-validation",
+          connection: k
+        }), g.push({
+          id: S(v),
+          name: "Settings",
+          indent: 1,
+          count: 0,
+          type: "settings-group",
+          connection: k
+        }), d.value[S(v)] === !1 && (k.type !== "demo" && g.push({
+          id: `${v}-api-key`,
+          name: "API Key",
+          indent: 2,
+          count: 0,
+          type: "api-key",
+          connection: k
+        }), g.push({
+          id: `${v}-model`,
+          name: "Model",
+          indent: 2,
+          count: 0,
+          type: "model",
+          connection: k
+        }), g.push({
+          id: `${v}-fast-model`,
+          name: "Fast Model",
+          indent: 2,
+          count: 0,
+          type: "fast-model",
+          connection: k
+        }), k.type !== "demo" && g.push({
+          id: `${v}-toggle-save-credential`,
+          name: "Toggle Save Credential",
+          indent: 2,
+          count: 0,
+          type: "toggle-save-credential",
+          connection: k
+        })), a.value[v] && g.push({
+          id: `${v}-loading`,
+          name: "Loading...",
+          indent: 1,
+          count: 0,
+          type: "loading",
+          connection: k
+        }), p.value[v] && g.push({
+          id: `${v}-error`,
+          name: p.value[v],
+          indent: 1,
+          count: 0,
+          type: "error",
+          connection: k
+        });
+      }), g;
     });
     return {
       llmConnectionStore: o,
       chatStore: c,
-      contentList: w,
-      toggleCollapse: F,
-      collapsed: g,
+      contentList: ue,
+      toggleCollapse: Q,
+      collapsed: d,
       saveConnections: i,
-      updateApiKey: m,
-      updateModel: R,
-      updateFastModel: P,
-      refreshId: h,
-      rightSplit: (f) => {
-        const C = f.lastIndexOf(_);
-        return C !== -1 ? f.substring(0, C) : f;
-      },
-      creatorVisible: T,
-      isItemSelected: (f) => f.type === "chat-item" && f.chatId && c ? f.chatId === c.activeChatId : f.type === "connection" ? f.id === o.activeConnection : !1,
+      updateApiKey: f,
+      updateModel: N,
+      updateFastModel: A,
+      refreshId: m,
+      creatorVisible: w,
+      isItemSelected: (g) => g.type === "chat-item" && g.chatId && c ? g.chatId === c.activeChatId : g.type === "connection" ? g.id === o.activeConnection : !1,
       screenNavigation: y
     };
   },
   components: {
-    SidebarList: De,
-    LLMConnectionListItem: io,
-    LLMConnectionCreator: yo,
-    LoadingButton: Ce,
-    StatusIcon: Le,
-    Tooltip: Se
+    SidebarList: qe,
+    LLMConnectionListItem: oo,
+    LLMConnectionCreator: ho
   },
   methods: {
     resetConnection(t) {
@@ -4664,7 +4612,7 @@ const yo = /* @__PURE__ */ z(ao, [["render", ho], ["__scopeId", "data-v-56d82681
     },
     deleteConnection(t, e) {
       confirm(`Are you sure you want to delete the connection "${e}"?`) && (this.chatStore && this.chatStore.getConnectionChats(e).forEach((i) => {
-        this.screenNavigation.closeTab(null, `${e}${_}${i.id}`), this.chatStore.removeChat(i.id);
+        this.screenNavigation.closeTab(null, `${e}${L}${i.id}`), this.chatStore.removeChat(i.id);
       }), this.screenNavigation.closeTab(null, e), this.llmConnectionStore.connections[e].delete(), this.llmConnectionStore.activeConnection === t && (this.llmConnectionStore.activeConnection = ""));
     },
     deleteChat(t, e) {
@@ -4679,28 +4627,35 @@ const yo = /* @__PURE__ */ z(ao, [["render", ho], ["__scopeId", "data-v-56d82681
       return Object.values(this.llmConnectionStore.connections);
     }
   }
-}, go = { class: "button-container" }, wo = ["data-testid"];
-function To(t, e, o, i, c, y) {
-  const a = U("LLMConnectionCreator"), d = U("LLMConnectionListItem"), T = U("sidebar-list");
-  return r(), W(T, { title: "LLM Connections" }, {
-    actions: q(() => [
+}, go = { class: "llm-header" }, fo = ["data-testid"];
+function wo(t, e, o, i, c, y) {
+  const a = x("LLMConnectionCreator"), p = x("LLMConnectionListItem"), w = x("sidebar-list");
+  return l(), W(w, { title: "AI & Agents" }, {
+    header: q(() => [
       s("div", go, [
+        e[3] || (e[3] = s("h3", { class: "font-sans sidebar-header" }, "AI & Agents", -1)),
         s("button", {
-          onClick: e[0] || (e[0] = (m) => i.creatorVisible = !i.creatorVisible),
+          class: "sidebar-control-button sidebar-header-action llm-new-button",
+          onClick: e[0] || (e[0] = (d) => i.creatorVisible = !i.creatorVisible),
           "data-testid": o.testTag ? `llm-connection-creator-add-${o.testTag}` : "llm-connection-creator-add"
-        }, j(i.creatorVisible ? "Hide" : "New"), 9, wo)
-      ]),
-      O(a, {
+        }, [
+          e[2] || (e[2] = s("i", { class: "mdi mdi-plus" }, null, -1)),
+          be(" " + F(i.creatorVisible ? "Close" : "New"), 1)
+        ], 8, fo)
+      ])
+    ]),
+    actions: q(() => [
+      G(a, {
         visible: i.creatorVisible,
-        onClose: e[1] || (e[1] = (m) => i.creatorVisible = !i.creatorVisible)
+        onClose: e[1] || (e[1] = (d) => i.creatorVisible = !i.creatorVisible)
       }, null, 8, ["visible"])
     ]),
     default: q(() => [
-      (r(!0), l(le, null, fe(i.contentList, (m) => (r(), W(d, {
-        key: m.id,
-        item: m,
-        "is-collapsed": i.collapsed[m.id],
-        isSelected: i.isItemSelected(m),
+      (l(!0), u(pe, null, we(i.contentList, (d) => (l(), W(p, {
+        key: d.id,
+        item: d,
+        "is-collapsed": i.collapsed[d.id],
+        isSelected: i.isItemSelected(d),
         onToggle: i.toggleCollapse,
         onRefresh: i.refreshId,
         onUpdateApiKey: i.updateApiKey,
@@ -4715,10 +4670,10 @@ function To(t, e, o, i, c, y) {
     _: 1
   });
 }
-const ko = /* @__PURE__ */ z(fo, [["render", To], ["__scopeId", "data-v-cd5d5232"]]);
+const Co = /* @__PURE__ */ Z(yo, [["render", wo], ["__scopeId", "data-v-be74feb0"]]);
 export {
-  So as C,
-  ko as L,
-  Tt as a,
-  Co as d
+  Eo as C,
+  Co as L,
+  vt as a,
+  So as d
 };