@burdenoff/microfe-botmanor 2026.813.1 → 2026.819.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/botlit/pages/DashboardPage.js +178 -254
  2. package/dist/botlit/pages/DashboardPage.js.map +1 -1
  3. package/dist/botlit/pages/SettingsPage.js +272 -603
  4. package/dist/botlit/pages/SettingsPage.js.map +1 -1
  5. package/package.json +1 -1
package/dist/botlit/pages/SettingsPage.js CHANGED
@@ -8,12 +8,11 @@ import { FormField as f, Input as p } from "../components/Input.js";
8
8
  import { toUnion as m } from "../utils/unions.js";
9
9
  import { useState as h } from "react";
10
10
  import { PagePurpose as g } from "@burdenoff/fe-libs/ui";
11
- import { Fragment as _, jsx as v, jsxs as y } from "react/jsx-runtime";
12
- import { Bell as b, Brain as x, Database as S, ExternalLink as C, Key as w, Link2 as T, Palette as E, Save as D, Shield as O } from "lucide-react";
13
- import { toast as k } from "sonner";
14
- import { useTheme as A } from "@burdenoff/fe-libs/shared/providers/shell";
11
+ import { jsx as _, jsxs as v } from "react/jsx-runtime";
12
+ import { Brain as y, ExternalLink as b, Key as x, Link2 as S, Save as C } from "lucide-react";
13
+ import { toast as w } from "sonner";
15
14
  //#region src/botlit/pages/SettingsPage.tsx
16
- var j = [
15
+ var T = [
17
16
  "OPENAI",
18
17
  "ANTHROPIC",
19
18
  "GOOGLE",
@@ -21,635 +20,305 @@ var j = [
21
20
  "AWS_BEDROCK",
22
21
  "CUSTOM"
23
22
  ];
24
- function M(e) {
25
- return m(e.toUpperCase(), j, "CUSTOM");
23
+ function E(e) {
24
+ return m(e.toUpperCase(), T, "CUSTOM");
26
25
  }
27
- var N = () => {
28
- let { data: m, refetch: j } = n(), { configureProvider: N, isConfiguring: P } = e(), { data: F } = t(), { mode: ee, setMode: I } = A(), [L, R] = h("providers"), [z, B] = h(""), [V, H] = h("openai"), [U, W] = h(null), [G, K] = h("apikey"), [q, J] = h(""), [Y, X] = h(""), [Z, Q] = h(""), [te, ne] = h("128000"), [re, ie] = h("4096"), [ae, oe] = h("2.5"), [$, se] = h("10"), [ce, le] = h("");
29
- return /* @__PURE__ */ v(i, {
26
+ var D = () => {
27
+ let { data: m, refetch: T } = n(), { configureProvider: D, isConfiguring: O } = e(), { data: k } = t(), [A, j] = h(""), [M, N] = h("openai"), [P, F] = h(null), [I, L] = h("apikey"), [R, z] = h("");
28
+ return /* @__PURE__ */ _(i, {
30
29
  title: "Settings",
31
30
  description: "Configure your Botlit workspace settings",
32
- children: /* @__PURE__ */ y("div", {
31
+ children: /* @__PURE__ */ v("div", {
33
32
  className: "space-y-6",
34
- children: [/* @__PURE__ */ v(g, {
35
- icon: /* @__PURE__ */ v(w, { size: 18 }),
36
- children: "Workspace-wide settings that affect every bot and agent you build. The most important is LLM Providers — connect at least one model provider (OpenAI, Anthropic, Google and others) so your agents have a brain to think with. From here you also manage models, notifications, security keys, storage retention and appearance."
37
- }), /* @__PURE__ */ y("div", {
38
- className: "grid grid-cols-12 gap-6",
39
- children: [/* @__PURE__ */ v("div", {
40
- className: "col-span-3",
41
- children: /* @__PURE__ */ v(a, { children: /* @__PURE__ */ v(o, {
42
- className: "p-2",
43
- children: [
44
- {
45
- id: "providers",
46
- label: "LLM Providers",
47
- icon: /* @__PURE__ */ v(w, { size: 16 })
48
- },
49
- {
50
- id: "notifications",
51
- label: "Notifications",
52
- icon: /* @__PURE__ */ v(b, { size: 16 })
53
- },
54
- {
55
- id: "security",
56
- label: "Security",
57
- icon: /* @__PURE__ */ v(O, { size: 16 })
58
- },
59
- {
60
- id: "storage",
61
- label: "Storage",
62
- icon: /* @__PURE__ */ v(S, { size: 16 })
63
- },
64
- {
65
- id: "appearance",
66
- label: "Appearance",
67
- icon: /* @__PURE__ */ v(E, { size: 16 })
68
- }
69
- ].map((e) => /* @__PURE__ */ y("button", {
70
- onClick: () => R(e.id),
71
- className: r("w-full flex items-center gap-3 px-4 py-3 rounded-lg text-left transition-colors", L === e.id ? "bg-action-primary-bg text-action-primary-text" : "hover:bg-accent"),
72
- children: [e.icon, /* @__PURE__ */ v("span", {
73
- className: "font-medium",
74
- children: e.label
75
- })]
76
- }, e.id))
77
- }) })
78
- }), /* @__PURE__ */ y("div", {
79
- className: "col-span-9 space-y-6",
80
- children: [
81
- L === "providers" && /* @__PURE__ */ y(_, { children: [
82
- /* @__PURE__ */ y(a, {
83
- treatment: "glass",
84
- glow: !0,
85
- children: [/* @__PURE__ */ y(c, { children: [/* @__PURE__ */ v(l, { children: "LLM Providers" }), /* @__PURE__ */ v(s, { children: "Configure API keys for AI model providers" })] }), /* @__PURE__ */ v(o, {
86
- className: "space-y-4",
87
- children: m?.map((e) => /* @__PURE__ */ y("div", {
88
- className: "flex items-center justify-between p-4 border border-border-subtle rounded-lg",
89
- children: [/* @__PURE__ */ y("div", {
90
- className: "flex items-center gap-4",
91
- children: [/* @__PURE__ */ v("div", {
92
- className: "p-2 bg-action-primary-bg/10 rounded-lg",
93
- children: e.connectionId ? /* @__PURE__ */ v(T, { className: "h-5 w-5 text-primary" }) : /* @__PURE__ */ v(w, { className: "h-5 w-5 text-primary" })
94
- }), /* @__PURE__ */ y("div", { children: [
95
- /* @__PURE__ */ v("p", {
96
- className: "font-medium",
97
- children: e.name
98
- }),
99
- /* @__PURE__ */ y("p", {
100
- className: "text-sm text-text-secondary",
101
- children: ["Type: ", e.type]
102
- }),
103
- e.connectionId && /* @__PURE__ */ v("p", {
104
- className: "text-xs text-text-secondary mt-0.5",
105
- children: "Connected via Integrations"
106
- }),
107
- !e.connectionId && e.credentialsHash && /* @__PURE__ */ v("p", {
108
- className: "text-xs text-text-secondary mt-0.5",
109
- children: "API key stored locally"
110
- })
111
- ] })]
112
- }), /* @__PURE__ */ y("div", {
113
- className: "flex items-center gap-3",
114
- children: [
115
- e.connectionId && /* @__PURE__ */ v(d, {
116
- variant: "default",
117
- children: "Integration"
118
- }),
119
- /* @__PURE__ */ v(d, {
120
- variant: e.isActive ? "success" : "secondary",
121
- children: e.isActive ? "Active" : "Inactive"
122
- }),
123
- /* @__PURE__ */ v(u, {
124
- variant: "outline",
125
- size: "sm",
126
- onClick: () => {
127
- W(e.id), H(e.type.toLowerCase()), B(""), J(e.connectionId || ""), K(e.connectionId ? "integration" : "apikey"), document.getElementById("provider-form")?.scrollIntoView({ behavior: "smooth" });
128
- },
129
- children: "Configure"
130
- })
131
- ]
132
- })]
133
- }, e.id))
134
- })]
135
- }),
136
- /* @__PURE__ */ y(a, { children: [/* @__PURE__ */ y(c, { children: [/* @__PURE__ */ v(l, { children: "LLM Models" }), /* @__PURE__ */ v(s, { children: "Registered models across your providers" })] }), /* @__PURE__ */ v(o, {
137
- className: "space-y-4",
138
- children: F && F.length > 0 ? F.map((e) => {
139
- let t = m?.find((t) => t.id === e.providerId)?.name;
140
- return /* @__PURE__ */ y("div", {
141
- className: "flex items-center justify-between p-4 border border-border-subtle rounded-lg",
142
- children: [/* @__PURE__ */ y("div", {
143
- className: "flex items-center gap-4",
144
- children: [/* @__PURE__ */ v("div", {
145
- className: "p-2 bg-purple-500/10 rounded-lg",
146
- children: /* @__PURE__ */ v(x, { className: "h-5 w-5 text-purple-500" })
147
- }), /* @__PURE__ */ y("div", { children: [
148
- /* @__PURE__ */ v("p", {
149
- className: "font-medium",
150
- children: e.name
151
- }),
152
- /* @__PURE__ */ y("p", {
153
- className: "text-sm text-text-secondary",
154
- children: [e.modelId, t && ` · ${t}`]
155
- }),
156
- /* @__PURE__ */ y("div", {
157
- className: "flex gap-3 mt-1 text-xs text-text-secondary",
158
- children: [
159
- e.contextWindow != null && /* @__PURE__ */ y("span", { children: [
160
- "Context: ",
161
- (e.contextWindow / 1e3).toFixed(0),
162
- "K"
163
- ] }),
164
- e.maxOutputTokens != null && /* @__PURE__ */ y("span", { children: [
165
- "Max out: ",
166
- (e.maxOutputTokens / 1e3).toFixed(0),
167
- "K"
168
- ] }),
169
- e.inputPricePerMToken != null && /* @__PURE__ */ y("span", { children: [
170
- "$",
171
- e.inputPricePerMToken,
172
- "/M in"
173
- ] }),
174
- e.outputPricePerMToken != null && /* @__PURE__ */ y("span", { children: [
175
- "$",
176
- e.outputPricePerMToken,
177
- "/M out"
178
- ] })
179
- ]
180
- })
181
- ] })]
182
- }), /* @__PURE__ */ v(d, {
183
- variant: e.isActive ? "success" : "secondary",
184
- children: e.isActive ? "Active" : "Inactive"
185
- })]
186
- }, e.id);
187
- }) : /* @__PURE__ */ v("p", {
188
- className: "text-sm text-text-secondary text-center py-4",
189
- children: "No models registered yet. Add a model below."
190
- })
191
- })] }),
192
- /* @__PURE__ */ y(a, {
193
- id: "provider-form",
194
- children: [/* @__PURE__ */ y(c, { children: [/* @__PURE__ */ v(l, { children: U ? "Update Provider" : "Add Provider" }), /* @__PURE__ */ v(s, { children: U ? "Update credentials for this provider" : "Configure a new LLM provider" })] }), /* @__PURE__ */ y(o, {
195
- className: "space-y-4",
196
- children: [
197
- /* @__PURE__ */ v(f, {
198
- label: "Provider",
199
- children: /* @__PURE__ */ y("select", {
200
- className: "flex h-10 w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm",
201
- value: V,
202
- onChange: (e) => H(e.target.value),
203
- children: [
204
- /* @__PURE__ */ v("option", {
205
- value: "openai",
206
- children: "OpenAI"
207
- }),
208
- /* @__PURE__ */ v("option", {
209
- value: "anthropic",
210
- children: "Anthropic"
211
- }),
212
- /* @__PURE__ */ v("option", {
213
- value: "google",
214
- children: "Google AI"
215
- }),
216
- /* @__PURE__ */ v("option", {
217
- value: "azure_openai",
218
- children: "Azure OpenAI"
219
- }),
220
- /* @__PURE__ */ v("option", {
221
- value: "aws_bedrock",
222
- children: "AWS Bedrock"
223
- }),
224
- /* @__PURE__ */ v("option", {
225
- value: "custom",
226
- children: "Custom"
227
- })
228
- ]
229
- })
230
- }),
231
- /* @__PURE__ */ v(f, {
232
- label: "Credential Method",
233
- children: /* @__PURE__ */ y("div", {
234
- className: "flex gap-3",
235
- children: [/* @__PURE__ */ y("label", {
236
- className: r("flex items-center gap-2 px-4 py-3 border rounded-lg cursor-pointer transition-colors flex-1", G === "integration" ? "border-primary bg-action-primary-bg/5" : "border-border-subtle hover:border-primary/50"),
237
- children: [/* @__PURE__ */ v("input", {
238
- type: "radio",
239
- name: "credentialMethod",
240
- value: "integration",
241
- checked: G === "integration",
242
- onChange: () => K("integration"),
243
- className: "h-4 w-4"
244
- }), /* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("p", {
245
- className: "font-medium text-sm",
246
- children: "Connect via Integrations"
247
- }), /* @__PURE__ */ v("p", {
248
- className: "text-xs text-text-secondary",
249
- children: "Managed credentials (recommended)"
250
- })] })]
251
- }), /* @__PURE__ */ y("label", {
252
- className: r("flex items-center gap-2 px-4 py-3 border rounded-lg cursor-pointer transition-colors flex-1", G === "apikey" ? "border-primary bg-action-primary-bg/5" : "border-border-subtle hover:border-primary/50"),
253
- children: [/* @__PURE__ */ v("input", {
254
- type: "radio",
255
- name: "credentialMethod",
256
- value: "apikey",
257
- checked: G === "apikey",
258
- onChange: () => K("apikey"),
259
- className: "h-4 w-4"
260
- }), /* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("p", {
261
- className: "font-medium text-sm",
262
- children: "Enter API Key"
263
- }), /* @__PURE__ */ v("p", {
264
- className: "text-xs text-text-secondary",
265
- children: "Paste key directly (legacy)"
266
- })] })]
267
- })]
268
- })
269
- }),
270
- G === "integration" && /* @__PURE__ */ y("div", {
271
- className: "space-y-3",
272
- children: [/* @__PURE__ */ v("div", {
273
- className: "p-4 bg-bg-sunken/50 border border-border-subtle rounded-lg",
274
- children: /* @__PURE__ */ y("div", {
275
- className: "flex items-start gap-3",
276
- children: [/* @__PURE__ */ v(T, { className: "h-5 w-5 text-primary mt-0.5 flex-shrink-0" }), /* @__PURE__ */ y("div", {
277
- className: "space-y-2 flex-1",
278
- children: [
279
- /* @__PURE__ */ v("p", {
280
- className: "text-sm font-medium",
281
- children: "Integration Connection"
282
- }),
283
- /* @__PURE__ */ v("p", {
284
- className: "text-xs text-text-secondary",
285
- children: "Create a connection in the Integrations module, then paste the Connection ID here. This stores your API key securely in the Integrations vault."
286
- }),
287
- /* @__PURE__ */ v("div", {
288
- className: "flex gap-2 mt-2",
289
- children: /* @__PURE__ */ y(u, {
290
- variant: "outline",
291
- size: "sm",
292
- onClick: () => {
293
- window.open("/integrations/connections", "_blank");
294
- },
295
- children: [/* @__PURE__ */ v(C, {
296
- size: 14,
297
- className: "mr-1.5"
298
- }), "Open Integrations"]
299
- })
300
- })
301
- ]
302
- })]
303
- })
304
- }), /* @__PURE__ */ v(f, {
305
- label: "Connection ID",
306
- children: /* @__PURE__ */ v(p, {
307
- placeholder: "Paste connection ID from Integrations...",
308
- value: q,
309
- onChange: (e) => J(e.target.value)
310
- })
311
- })]
312
- }),
313
- G === "apikey" && /* @__PURE__ */ v(f, {
314
- label: "API Key",
315
- children: /* @__PURE__ */ v(p, {
316
- type: "password",
317
- placeholder: "sk-...",
318
- value: z,
319
- onChange: (e) => B(e.target.value)
320
- })
321
- }),
322
- /* @__PURE__ */ y("div", {
323
- className: "flex gap-2",
324
- children: [/* @__PURE__ */ v(u, {
325
- leftIcon: /* @__PURE__ */ v(D, { size: 16 }),
326
- isLoading: P,
327
- disabled: G === "apikey" ? !z : !q,
328
- onClick: async () => {
329
- try {
330
- let e = V.charAt(0).toUpperCase() + V.slice(1), t = G === "integration" ? void 0 : z ? { apiKey: z } : void 0, n = G === "integration" ? q : void 0;
331
- U ? await N({
332
- name: e,
333
- type: M(V),
334
- connectionId: n,
335
- credentials: t
336
- }, U) : await N({
337
- name: e,
338
- type: M(V),
339
- connectionId: n,
340
- credentials: t
341
- }), B(""), J(""), W(null), await j();
342
- let r = V.charAt(0).toUpperCase() + V.slice(1);
343
- k.success(U ? `${r} provider updated successfully` : `${r} provider added successfully`);
344
- } catch (e) {
345
- let t = e instanceof Error ? e.message : "Failed to save provider";
346
- k.error(t);
347
- }
348
- },
349
- children: U ? "Update Provider" : "Save Provider"
350
- }), U && /* @__PURE__ */ v(u, {
351
- variant: "outline",
352
- onClick: () => {
353
- W(null), B(""), J(""), K("apikey"), H("openai");
354
- },
355
- children: "Cancel"
356
- })]
357
- })
358
- ]
359
- })]
360
- }),
361
- /* @__PURE__ */ y(a, { children: [/* @__PURE__ */ y(c, { children: [/* @__PURE__ */ v(l, { children: "Add Model" }), /* @__PURE__ */ v(s, { children: "Register a new LLM model for an existing provider" })] }), /* @__PURE__ */ y(o, {
362
- className: "space-y-4",
363
- children: [
364
- /* @__PURE__ */ v(f, {
365
- label: "Provider",
366
- children: /* @__PURE__ */ y("select", {
367
- className: "flex h-10 w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm",
368
- value: ce,
369
- onChange: (e) => le(e.target.value),
370
- children: [/* @__PURE__ */ v("option", {
371
- value: "",
372
- children: "Select a provider..."
373
- }), m?.map((e) => /* @__PURE__ */ v("option", {
374
- value: e.id,
375
- children: e.name
376
- }, e.id))]
377
- })
33
+ children: [
34
+ /* @__PURE__ */ _(g, {
35
+ icon: /* @__PURE__ */ _(x, { size: 18 }),
36
+ children: "Workspace-wide settings for LLM Providers — connect at least one model provider (OpenAI, Anthropic, Google and others) so your agents have a brain to think with."
37
+ }),
38
+ /* @__PURE__ */ v(a, {
39
+ treatment: "glass",
40
+ glow: !0,
41
+ children: [/* @__PURE__ */ v(c, { children: [/* @__PURE__ */ _(l, { children: "LLM Providers" }), /* @__PURE__ */ _(s, { children: "Configure API keys for AI model providers" })] }), /* @__PURE__ */ _(o, {
42
+ className: "space-y-4",
43
+ children: m?.map((e) => /* @__PURE__ */ v("div", {
44
+ className: "flex items-center justify-between p-4 border border-border-subtle rounded-lg",
45
+ children: [/* @__PURE__ */ v("div", {
46
+ className: "flex items-center gap-4",
47
+ children: [/* @__PURE__ */ _("div", {
48
+ className: "p-2 bg-action-primary-bg/10 rounded-lg",
49
+ children: e.connectionId ? /* @__PURE__ */ _(S, { className: "h-5 w-5 text-primary" }) : /* @__PURE__ */ _(x, { className: "h-5 w-5 text-primary" })
50
+ }), /* @__PURE__ */ v("div", { children: [
51
+ /* @__PURE__ */ _("p", {
52
+ className: "font-medium",
53
+ children: e.name
378
54
  }),
379
- /* @__PURE__ */ v(f, {
380
- label: "Model Name",
381
- children: /* @__PURE__ */ v(p, {
382
- placeholder: "e.g., GPT-4o",
383
- value: Y,
384
- onChange: (e) => X(e.target.value)
385
- })
55
+ /* @__PURE__ */ v("p", {
56
+ className: "text-sm text-text-secondary",
57
+ children: ["Type: ", e.type]
386
58
  }),
387
- /* @__PURE__ */ v(f, {
388
- label: "Model ID",
389
- children: /* @__PURE__ */ v(p, {
390
- placeholder: "e.g., gpt-4o",
391
- value: Z,
392
- onChange: (e) => Q(e.target.value)
393
- })
59
+ e.connectionId && /* @__PURE__ */ _("p", {
60
+ className: "text-xs text-text-secondary mt-0.5",
61
+ children: "Connected via Integrations"
394
62
  }),
395
- /* @__PURE__ */ y("div", {
396
- className: "grid grid-cols-2 gap-4",
397
- children: [/* @__PURE__ */ v(f, {
398
- label: "Context Window",
399
- children: /* @__PURE__ */ v(p, {
400
- type: "number",
401
- value: te,
402
- onChange: (e) => ne(e.target.value)
403
- })
404
- }), /* @__PURE__ */ v(f, {
405
- label: "Max Output Tokens",
406
- children: /* @__PURE__ */ v(p, {
407
- type: "number",
408
- value: re,
409
- onChange: (e) => ie(e.target.value)
410
- })
411
- })]
63
+ !e.connectionId && e.credentialsHash && /* @__PURE__ */ _("p", {
64
+ className: "text-xs text-text-secondary mt-0.5",
65
+ children: "API key stored locally"
66
+ })
67
+ ] })]
68
+ }), /* @__PURE__ */ v("div", {
69
+ className: "flex items-center gap-3",
70
+ children: [
71
+ e.connectionId && /* @__PURE__ */ _(d, {
72
+ variant: "default",
73
+ children: "Integration"
412
74
  }),
413
- /* @__PURE__ */ y("div", {
414
- className: "grid grid-cols-2 gap-4",
415
- children: [/* @__PURE__ */ v(f, {
416
- label: "Input Price / 1M tokens",
417
- children: /* @__PURE__ */ v(p, {
418
- type: "number",
419
- step: "0.01",
420
- value: ae,
421
- onChange: (e) => oe(e.target.value)
422
- })
423
- }), /* @__PURE__ */ v(f, {
424
- label: "Output Price / 1M tokens",
425
- children: /* @__PURE__ */ v(p, {
426
- type: "number",
427
- step: "0.01",
428
- value: $,
429
- onChange: (e) => se(e.target.value)
430
- })
431
- })]
75
+ /* @__PURE__ */ _(d, {
76
+ variant: e.isActive ? "success" : "secondary",
77
+ children: e.isActive ? "Active" : "Inactive"
432
78
  }),
433
- /* @__PURE__ */ v(u, {
434
- leftIcon: /* @__PURE__ */ v(D, { size: 16 }),
435
- disabled: !0,
436
- onClick: async () => {
437
- k.error("Model creation not yet implemented");
79
+ /* @__PURE__ */ _(u, {
80
+ variant: "outline",
81
+ size: "sm",
82
+ onClick: () => {
83
+ F(e.id), N(e.type.toLowerCase()), j(""), z(e.connectionId || ""), L(e.connectionId ? "integration" : "apikey"), document.getElementById("provider-form")?.scrollIntoView({ behavior: "smooth" });
438
84
  },
439
- children: "Add Model"
85
+ children: "Configure"
440
86
  })
441
87
  ]
442
- })] })
443
- ] }),
444
- L === "notifications" && /* @__PURE__ */ y(a, { children: [/* @__PURE__ */ y(c, { children: [/* @__PURE__ */ v(l, { children: "Notification Settings" }), /* @__PURE__ */ v(s, { children: "Configure how you receive notifications" })] }), /* @__PURE__ */ v(o, {
445
- className: "space-y-4",
446
- children: [
447
- {
448
- label: "Agent errors",
449
- description: "Get notified when an agent encounters an error"
450
- },
451
- {
452
- label: "High usage alerts",
453
- description: "Alerts when token usage exceeds thresholds"
454
- },
455
- {
456
- label: "Weekly reports",
457
- description: "Receive weekly usage summaries"
458
- },
459
- {
460
- label: "New conversation",
461
- description: "Notify when a new conversation starts"
462
- }
463
- ].map((e) => /* @__PURE__ */ y("label", {
464
- className: "flex items-center justify-between p-4 border border-border-subtle rounded-lg cursor-pointer",
465
- children: [/* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("p", {
466
- className: "font-medium",
467
- children: e.label
468
- }), /* @__PURE__ */ v("p", {
469
- className: "text-sm text-text-secondary",
470
- children: e.description
471
- })] }), /* @__PURE__ */ v("input", {
472
- type: "checkbox",
473
- className: "h-5 w-5 rounded",
474
- defaultChecked: !0
475
- })]
476
- }, e.label))
477
- })] }),
478
- L === "security" && /* @__PURE__ */ y(a, { children: [/* @__PURE__ */ y(c, { children: [/* @__PURE__ */ v(l, { children: "Security Settings" }), /* @__PURE__ */ v(s, { children: "Manage security and access controls" })] }), /* @__PURE__ */ y(o, {
479
- className: "space-y-4",
480
- children: [
481
- /* @__PURE__ */ v(f, {
482
- label: "API Key",
483
- children: /* @__PURE__ */ y("div", {
484
- className: "flex gap-2",
485
- children: [/* @__PURE__ */ v(p, {
486
- type: "password",
487
- value: "••••••••••••••••",
488
- readOnly: !0
489
- }), /* @__PURE__ */ v(u, {
490
- variant: "outline",
491
- children: "Regenerate"
492
- })]
493
- })
494
- }),
495
- /* @__PURE__ */ v(f, {
496
- label: "Webhook Secret",
497
- children: /* @__PURE__ */ y("div", {
498
- className: "flex gap-2",
499
- children: [/* @__PURE__ */ v(p, {
500
- type: "password",
501
- value: "••••••••••••••••",
502
- readOnly: !0
503
- }), /* @__PURE__ */ v(u, {
504
- variant: "outline",
505
- children: "Regenerate"
506
- })]
507
- })
508
- }),
509
- /* @__PURE__ */ v(f, {
510
- label: "Allowed Origins (CORS)",
511
- children: /* @__PURE__ */ v(p, { placeholder: "https://example.com" })
512
- })
513
- ]
514
- })] }),
515
- L === "storage" && /* @__PURE__ */ y(a, { children: [/* @__PURE__ */ y(c, { children: [/* @__PURE__ */ v(l, { children: "Storage Settings" }), /* @__PURE__ */ v(s, { children: "Configure data storage and retention" })] }), /* @__PURE__ */ y(o, {
516
- className: "space-y-4",
517
- children: [/* @__PURE__ */ y("div", {
518
- className: "grid grid-cols-3 gap-4",
519
- children: [
520
- /* @__PURE__ */ y("div", {
521
- className: "p-4 bg-bg-sunken rounded-lg text-center",
522
- children: [/* @__PURE__ */ v("p", {
523
- className: "text-2xl font-bold",
524
- children: "45.2 GB"
525
- }), /* @__PURE__ */ v("p", {
526
- className: "text-sm text-text-secondary",
527
- children: "Total Storage"
528
- })]
88
+ })]
89
+ }, e.id))
90
+ })]
91
+ }),
92
+ /* @__PURE__ */ v(a, { children: [/* @__PURE__ */ v(c, { children: [/* @__PURE__ */ _(l, { children: "LLM Models" }), /* @__PURE__ */ _(s, { children: "Registered models across your providers" })] }), /* @__PURE__ */ _(o, {
93
+ className: "space-y-4",
94
+ children: k && k.length > 0 ? k.map((e) => {
95
+ let t = m?.find((t) => t.id === e.providerId)?.name;
96
+ return /* @__PURE__ */ v("div", {
97
+ className: "flex items-center justify-between p-4 border border-border-subtle rounded-lg",
98
+ children: [/* @__PURE__ */ v("div", {
99
+ className: "flex items-center gap-4",
100
+ children: [/* @__PURE__ */ _("div", {
101
+ className: "p-2 bg-purple-500/10 rounded-lg",
102
+ children: /* @__PURE__ */ _(y, { className: "h-5 w-5 text-purple-500" })
103
+ }), /* @__PURE__ */ v("div", { children: [
104
+ /* @__PURE__ */ _("p", {
105
+ className: "font-medium",
106
+ children: e.name
529
107
  }),
530
- /* @__PURE__ */ y("div", {
531
- className: "p-4 bg-bg-sunken rounded-lg text-center",
532
- children: [/* @__PURE__ */ v("p", {
533
- className: "text-2xl font-bold",
534
- children: "12.8 GB"
535
- }), /* @__PURE__ */ v("p", {
536
- className: "text-sm text-text-secondary",
537
- children: "Conversations"
538
- })]
108
+ /* @__PURE__ */ v("p", {
109
+ className: "text-sm text-text-secondary",
110
+ children: [e.modelId, t && ` · ${t}`]
539
111
  }),
540
- /* @__PURE__ */ y("div", {
541
- className: "p-4 bg-bg-sunken rounded-lg text-center",
542
- children: [/* @__PURE__ */ v("p", {
543
- className: "text-2xl font-bold",
544
- children: "32.4 GB"
545
- }), /* @__PURE__ */ v("p", {
546
- className: "text-sm text-text-secondary",
547
- children: "Knowledge Bases"
548
- })]
112
+ /* @__PURE__ */ v("div", {
113
+ className: "flex gap-3 mt-1 text-xs text-text-secondary",
114
+ children: [
115
+ e.contextWindow != null && /* @__PURE__ */ v("span", { children: [
116
+ "Context: ",
117
+ (e.contextWindow / 1e3).toFixed(0),
118
+ "K"
119
+ ] }),
120
+ e.maxOutputTokens != null && /* @__PURE__ */ v("span", { children: [
121
+ "Max out: ",
122
+ (e.maxOutputTokens / 1e3).toFixed(0),
123
+ "K"
124
+ ] }),
125
+ e.inputPricePerMToken != null && /* @__PURE__ */ v("span", { children: [
126
+ "$",
127
+ e.inputPricePerMToken,
128
+ "/M in"
129
+ ] }),
130
+ e.outputPricePerMToken != null && /* @__PURE__ */ v("span", { children: [
131
+ "$",
132
+ e.outputPricePerMToken,
133
+ "/M out"
134
+ ] })
135
+ ]
549
136
  })
550
- ]
551
- }), /* @__PURE__ */ v(f, {
552
- label: "Conversation Retention",
553
- children: /* @__PURE__ */ y("select", {
137
+ ] })]
138
+ }), /* @__PURE__ */ _(d, {
139
+ variant: e.isActive ? "success" : "secondary",
140
+ children: e.isActive ? "Active" : "Inactive"
141
+ })]
142
+ }, e.id);
143
+ }) : /* @__PURE__ */ _("p", {
144
+ className: "text-sm text-text-secondary text-center py-4",
145
+ children: "No models registered yet."
146
+ })
147
+ })] }),
148
+ /* @__PURE__ */ v(a, {
149
+ id: "provider-form",
150
+ children: [/* @__PURE__ */ v(c, { children: [/* @__PURE__ */ _(l, { children: P ? "Update Provider" : "Add Provider" }), /* @__PURE__ */ _(s, { children: P ? "Update credentials for this provider" : "Configure a new LLM provider" })] }), /* @__PURE__ */ v(o, {
151
+ className: "space-y-4",
152
+ children: [
153
+ /* @__PURE__ */ _(f, {
154
+ label: "Provider",
155
+ children: /* @__PURE__ */ v("select", {
554
156
  className: "flex h-10 w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm",
157
+ value: M,
158
+ onChange: (e) => N(e.target.value),
555
159
  children: [
556
- /* @__PURE__ */ v("option", {
557
- value: "30",
558
- children: "30 days"
160
+ /* @__PURE__ */ _("option", {
161
+ value: "openai",
162
+ children: "OpenAI"
163
+ }),
164
+ /* @__PURE__ */ _("option", {
165
+ value: "anthropic",
166
+ children: "Anthropic"
559
167
  }),
560
- /* @__PURE__ */ v("option", {
561
- value: "90",
562
- children: "90 days"
168
+ /* @__PURE__ */ _("option", {
169
+ value: "google",
170
+ children: "Google AI"
563
171
  }),
564
- /* @__PURE__ */ v("option", {
565
- value: "180",
566
- children: "180 days"
172
+ /* @__PURE__ */ _("option", {
173
+ value: "azure_openai",
174
+ children: "Azure OpenAI"
567
175
  }),
568
- /* @__PURE__ */ v("option", {
569
- value: "365",
570
- children: "1 year"
176
+ /* @__PURE__ */ _("option", {
177
+ value: "aws_bedrock",
178
+ children: "AWS Bedrock"
571
179
  }),
572
- /* @__PURE__ */ v("option", {
573
- value: "forever",
574
- children: "Forever"
180
+ /* @__PURE__ */ _("option", {
181
+ value: "custom",
182
+ children: "Custom"
575
183
  })
576
184
  ]
577
185
  })
578
- })]
579
- })] }),
580
- L === "appearance" && /* @__PURE__ */ y(a, { children: [/* @__PURE__ */ y(c, { children: [/* @__PURE__ */ v(l, { children: "Appearance Settings" }), /* @__PURE__ */ v(s, { children: "Customize the look and feel" })] }), /* @__PURE__ */ y(o, {
581
- className: "space-y-4",
582
- children: [
583
- /* @__PURE__ */ v(f, {
584
- label: "Theme",
585
- children: /* @__PURE__ */ v("div", {
586
- className: "flex gap-4",
587
- children: [
588
- "light",
589
- "dark",
590
- "system"
591
- ].map((e) => /* @__PURE__ */ y("label", {
592
- className: "flex items-center gap-2 cursor-pointer",
593
- children: [/* @__PURE__ */ v("input", {
594
- type: "radio",
595
- name: "theme",
596
- value: e,
597
- checked: ee === e,
598
- onChange: () => I(e),
599
- className: "h-4 w-4"
600
- }), /* @__PURE__ */ v("span", {
601
- className: "capitalize",
602
- children: e
603
- })]
604
- }, e))
605
- })
606
- }),
607
- /* @__PURE__ */ v(f, {
608
- label: "Accent Color",
186
+ }),
187
+ /* @__PURE__ */ _(f, {
188
+ label: "Credential Method",
189
+ children: /* @__PURE__ */ v("div", {
190
+ className: "flex gap-3",
191
+ children: [/* @__PURE__ */ v("label", {
192
+ className: r("flex items-center gap-2 px-4 py-3 border rounded-lg cursor-pointer transition-colors flex-1", I === "integration" ? "border-primary bg-action-primary-bg/5" : "border-border-subtle hover:border-primary/50"),
193
+ children: [/* @__PURE__ */ _("input", {
194
+ type: "radio",
195
+ name: "credentialMethod",
196
+ value: "integration",
197
+ checked: I === "integration",
198
+ onChange: () => L("integration"),
199
+ className: "h-4 w-4"
200
+ }), /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("p", {
201
+ className: "font-medium text-sm",
202
+ children: "Connect via Integrations"
203
+ }), /* @__PURE__ */ _("p", {
204
+ className: "text-xs text-text-secondary",
205
+ children: "Managed credentials (recommended)"
206
+ })] })]
207
+ }), /* @__PURE__ */ v("label", {
208
+ className: r("flex items-center gap-2 px-4 py-3 border rounded-lg cursor-pointer transition-colors flex-1", I === "apikey" ? "border-primary bg-action-primary-bg/5" : "border-border-subtle hover:border-primary/50"),
209
+ children: [/* @__PURE__ */ _("input", {
210
+ type: "radio",
211
+ name: "credentialMethod",
212
+ value: "apikey",
213
+ checked: I === "apikey",
214
+ onChange: () => L("apikey"),
215
+ className: "h-4 w-4"
216
+ }), /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("p", {
217
+ className: "font-medium text-sm",
218
+ children: "Enter API Key"
219
+ }), /* @__PURE__ */ _("p", {
220
+ className: "text-xs text-text-secondary",
221
+ children: "Paste key directly (legacy)"
222
+ })] })]
223
+ })]
224
+ })
225
+ }),
226
+ I === "integration" && /* @__PURE__ */ v("div", {
227
+ className: "space-y-3",
228
+ children: [/* @__PURE__ */ _("div", {
229
+ className: "p-4 bg-bg-sunken/50 border border-border-subtle rounded-lg",
609
230
  children: /* @__PURE__ */ v("div", {
610
- className: "flex gap-2",
611
- children: [
612
- "#3b82f6",
613
- "#8b5cf6",
614
- "#22c55e",
615
- "#f59e0b",
616
- "#ef4444",
617
- "#ec4899"
618
- ].map((e) => /* @__PURE__ */ v("button", {
619
- className: "h-8 w-8 rounded-full border-2 border-transparent hover:border-foreground",
620
- style: { backgroundColor: e }
621
- }, e))
231
+ className: "flex items-start gap-3",
232
+ children: [/* @__PURE__ */ _(S, { className: "h-5 w-5 text-primary mt-0.5 flex-shrink-0" }), /* @__PURE__ */ v("div", {
233
+ className: "space-y-2 flex-1",
234
+ children: [
235
+ /* @__PURE__ */ _("p", {
236
+ className: "text-sm font-medium",
237
+ children: "Integration Connection"
238
+ }),
239
+ /* @__PURE__ */ _("p", {
240
+ className: "text-xs text-text-secondary",
241
+ children: "Create a connection in the Integrations module, then paste the Connection ID here. This stores your API key securely in the Integrations vault."
242
+ }),
243
+ /* @__PURE__ */ _("div", {
244
+ className: "flex gap-2 mt-2",
245
+ children: /* @__PURE__ */ v(u, {
246
+ variant: "outline",
247
+ size: "sm",
248
+ onClick: () => {
249
+ window.open("/integrations/connections", "_blank");
250
+ },
251
+ children: [/* @__PURE__ */ _(b, {
252
+ size: 14,
253
+ className: "mr-1.5"
254
+ }), "Open Integrations"]
255
+ })
256
+ })
257
+ ]
258
+ })]
622
259
  })
623
- }),
624
- /* @__PURE__ */ v(f, {
625
- label: "Font Size",
626
- children: /* @__PURE__ */ y("select", {
627
- className: "flex h-10 w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm",
628
- children: [
629
- /* @__PURE__ */ v("option", {
630
- value: "sm",
631
- children: "Small"
632
- }),
633
- /* @__PURE__ */ v("option", {
634
- value: "md",
635
- children: "Medium"
636
- }),
637
- /* @__PURE__ */ v("option", {
638
- value: "lg",
639
- children: "Large"
640
- })
641
- ]
260
+ }), /* @__PURE__ */ _(f, {
261
+ label: "Connection ID",
262
+ children: /* @__PURE__ */ _(p, {
263
+ placeholder: "Paste connection ID from Integrations...",
264
+ value: R,
265
+ onChange: (e) => z(e.target.value)
642
266
  })
267
+ })]
268
+ }),
269
+ I === "apikey" && /* @__PURE__ */ _(f, {
270
+ label: "API Key",
271
+ children: /* @__PURE__ */ _(p, {
272
+ type: "password",
273
+ placeholder: "sk-...",
274
+ value: A,
275
+ onChange: (e) => j(e.target.value)
643
276
  })
644
- ]
645
- })] })
646
- ]
647
- })]
648
- })]
277
+ }),
278
+ /* @__PURE__ */ v("div", {
279
+ className: "flex gap-2",
280
+ children: [/* @__PURE__ */ _(u, {
281
+ leftIcon: /* @__PURE__ */ _(C, { size: 16 }),
282
+ isLoading: O,
283
+ disabled: I === "apikey" ? !A : !R,
284
+ onClick: async () => {
285
+ try {
286
+ let e = M.charAt(0).toUpperCase() + M.slice(1), t = I === "integration" ? void 0 : A ? { apiKey: A } : void 0, n = I === "integration" ? R : void 0;
287
+ P ? await D({
288
+ name: e,
289
+ type: E(M),
290
+ connectionId: n,
291
+ credentials: t
292
+ }, P) : await D({
293
+ name: e,
294
+ type: E(M),
295
+ connectionId: n,
296
+ credentials: t
297
+ }), j(""), z(""), F(null), await T();
298
+ let r = M.charAt(0).toUpperCase() + M.slice(1);
299
+ w.success(P ? `${r} provider updated successfully` : `${r} provider added successfully`);
300
+ } catch (e) {
301
+ let t = e instanceof Error ? e.message : "Failed to save provider";
302
+ w.error(t);
303
+ }
304
+ },
305
+ children: P ? "Update Provider" : "Save Provider"
306
+ }), P && /* @__PURE__ */ _(u, {
307
+ variant: "outline",
308
+ onClick: () => {
309
+ F(null), j(""), z(""), L("apikey"), N("openai");
310
+ },
311
+ children: "Cancel"
312
+ })]
313
+ })
314
+ ]
315
+ })]
316
+ })
317
+ ]
649
318
  })
650
319
  });
651
320
  };
652
321
  //#endregion
653
- export { N as SettingsPage };
322
+ export { D as SettingsPage };
654
323
 
655
324
  //# sourceMappingURL=SettingsPage.js.map