@burdenoff/microfe-vibecontrols 2026.511.1

package/dist/components/ai/AIPlaygroundTab.js

@@ -0,0 +1,222 @@
+import { useTr as e } from "../../shared/hooks/useTr.js";
+import { LoadingState as t } from "../shared/LoadingState.js";
+import { ErrorState as n } from "../shared/ErrorState.js";
+import { EmptyState as r } from "../shared/EmptyState.js";
+import { Card as i } from "../shared/Card.js";
+import "../shared/index.js";
+import { fetchApiDescriptor as a } from "../../services/aiApi.js";
+import { useCallback as o, useEffect as s, useState as c } from "react";
+import { Check as l, Copy as u, Play as d, Terminal as f } from "lucide-react";
+import { getStoredAuthToken as p, getStoredWorkspaceToken as m } from "@burdenoff/fe-libs/shared/graphql";
+import { Fragment as h, jsx as g, jsxs as _ } from "react/jsx-runtime";
+//#region src/components/ai/AIPlaygroundTab.tsx
+function v({ agentId: v }) {
+	let y = e(), [b, x] = c([]), [S, C] = c(!0), [w, T] = c(null), [E, D] = c(null), [O, k] = c({}), [A, j] = c(!1), [M, N] = c(null), [P, F] = c(null), [I, L] = c(!1), R = o(async () => {
+		C(!0), T(null);
+		try {
+			let e = await a(v);
+			x(e), e.length > 0 && z(e[0]);
+		} catch (e) {
+			T(e instanceof Error ? e.message : "Failed to load API descriptor");
+		} finally {
+			C(!1);
+		}
+	}, [v]);
+	s(() => {
+		R();
+	}, [R]);
+	let z = (e) => {
+		D(e);
+		let t = {};
+		e.parameters?.forEach((e) => {
+			t[e.name] = "";
+		}), k(t), N(null), F(null);
+	}, B = async () => {
+		if (E) {
+			j(!0), N(null), F(null);
+			try {
+				let e = E.path, t = {};
+				for (let [n, r] of Object.entries(O)) e.includes(`:${n}`) ? e = e.replace(`:${n}`, encodeURIComponent(r)) : r && (t[n] = r);
+				let n = E.method.toUpperCase(), r = n === "POST" || n === "PATCH" || n === "PUT", i = p(), a = m(), o = new URLSearchParams(window.location.search).get("workspace") || "", s = await (await fetch("/workspaces/graphql", {
+					method: "POST",
+					headers: {
+						"Content-Type": "application/json",
+						...i ? { Authorization: `Bearer ${i}` } : {},
+						...a ? { "X-Workspace-Authorization": `Bearer ${a}` } : {},
+						...o ? { "x-workspace-id": o } : {}
+					},
+					body: JSON.stringify({
+						query: "mutation AgentAiMutate($agentId: ID!, $path: String!, $method: String!, $body: JSON) {\n            agentAiMutate(agentId: $agentId, path: $path, method: $method, body: $body) {\n              ok\n              status\n              data\n              text\n              error\n            }\n          }",
+						variables: {
+							agentId: v,
+							path: e,
+							method: n,
+							body: r && Object.keys(t).length > 0 ? t : null
+						}
+					})
+				})).json(), c = s.data?.agentAiMutate;
+				if (!c) throw Error(s.errors?.[0]?.message || "Request failed");
+				F(c.status), N(JSON.stringify(c.data ?? (c.text ? { text: c.text } : { error: c.error }), null, 2));
+			} catch (e) {
+				N(`Error: ${e instanceof Error ? e.message : "Request failed"}`), F(0);
+			} finally {
+				j(!1);
+			}
+		}
+	}, V = () => {
+		if (!E) return "";
+		let e = E.path, t = {};
+		for (let [n, r] of Object.entries(O)) e.includes(`:${n}`) ? e = e.replace(`:${n}`, encodeURIComponent(r || `{${n}}`)) : r && (t[n] = r);
+		let n = E.method.toUpperCase();
+		return `mutation AgentAiMutate {
+  agentAiMutate(
+    agentId: "${v}"
+    path: "${e}"
+    method: "${n}"
+    body: ${Object.keys(t).length > 0 ? JSON.stringify(t) : "null"}
+  ) {
+    ok
+    status
+    data
+    error
+  }
+}`;
+	};
+	return S ? /* @__PURE__ */ g(t, { message: y("vibecontrols.ai.playground.loading", "Loading API descriptor...") }) : w ? /* @__PURE__ */ g(n, {
+		title: y("vibecontrols.ai.playground.loadFailed", "Failed to load API"),
+		message: w,
+		onRetry: R
+	}) : b.length === 0 ? /* @__PURE__ */ g(r, {
+		icon: /* @__PURE__ */ g(f, { className: "w-8 h-8 text-text-secondary" }),
+		title: y("vibecontrols.ai.playground.noEndpoints", "No API endpoints"),
+		description: y("vibecontrols.ai.playground.noEndpointsDesc", "The agent does not expose any AI API endpoints")
+	}) : /* @__PURE__ */ _("div", {
+		className: "grid grid-cols-1 lg:grid-cols-2 gap-6",
+		children: [/* @__PURE__ */ _("div", {
+			className: "space-y-4",
+			children: [
+				/* @__PURE__ */ _(i, {
+					className: "p-4",
+					children: [
+						/* @__PURE__ */ g("h3", {
+							className: "font-semibold text-text-primary mb-3",
+							children: y("vibecontrols.ai.playground.endpoint", "Endpoint")
+						}),
+						/* @__PURE__ */ g("select", {
+							value: E?.id ?? "",
+							onChange: (e) => {
+								let t = b.find((t) => t.id === e.target.value);
+								t && z(t);
+							},
+							className: "w-full px-3 py-2 bg-bg-sunken border border-border-default rounded-md text-text-primary text-sm",
+							children: b.map((e) => /* @__PURE__ */ _("option", {
+								value: e.id,
+								children: [
+									e.method.toUpperCase(),
+									" ",
+									e.path,
+									" - ",
+									e.description
+								]
+							}, e.id))
+						}),
+						E?.description && /* @__PURE__ */ g("p", {
+							className: "mt-2 text-xs text-text-secondary",
+							children: E.description
+						})
+					]
+				}),
+				E?.parameters && E.parameters.length > 0 && /* @__PURE__ */ _(i, {
+					className: "p-4",
+					children: [/* @__PURE__ */ g("h3", {
+						className: "font-semibold text-text-primary mb-3",
+						children: y("vibecontrols.ai.playground.parameters", "Parameters")
+					}), /* @__PURE__ */ g("div", {
+						className: "space-y-3",
+						children: E.parameters.map((e) => /* @__PURE__ */ _("div", { children: [
+							/* @__PURE__ */ _("label", {
+								className: "flex items-center gap-1.5 text-sm font-medium text-text-primary mb-1",
+								children: [
+									e.name,
+									e.required && /* @__PURE__ */ g("span", {
+										className: "text-status-error-text text-xs",
+										children: "*"
+									}),
+									/* @__PURE__ */ _("span", {
+										className: "text-xs text-text-muted font-normal",
+										children: [
+											"(",
+											e.type,
+											")"
+										]
+									})
+								]
+							}),
+							e.description && /* @__PURE__ */ g("p", {
+								className: "text-xs text-text-secondary mb-1",
+								children: e.description
+							}),
+							/* @__PURE__ */ g("input", {
+								type: "text",
+								value: O[e.name] ?? "",
+								onChange: (t) => k((n) => ({
+									...n,
+									[e.name]: t.target.value
+								})),
+								className: "w-full px-3 py-2 bg-bg-sunken border border-border-default rounded-md text-text-primary text-sm font-mono focus:outline-none focus:border-border-strong",
+								placeholder: e.required ? "Required" : "Optional"
+							})
+						] }, e.name))
+					})]
+				}),
+				/* @__PURE__ */ _("button", {
+					onClick: B,
+					disabled: A,
+					className: "w-full flex items-center justify-center gap-2 px-4 py-2.5 bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors disabled:opacity-50 text-sm font-medium",
+					children: [/* @__PURE__ */ g(d, { className: "w-4 h-4" }), A ? y("vibecontrols.ai.playground.executing", "Executing...") : y("vibecontrols.ai.playground.execute", "Execute")]
+				}),
+				/* @__PURE__ */ _(i, {
+					className: "p-4",
+					children: [/* @__PURE__ */ _("div", {
+						className: "mb-2 flex flex-wrap items-center justify-between gap-2",
+						children: [/* @__PURE__ */ g("h3", {
+							className: "text-xs font-semibold text-text-secondary uppercase tracking-wide",
+							children: "cURL"
+						}), /* @__PURE__ */ g("button", {
+							onClick: () => {
+								navigator.clipboard.writeText(V()), L(!0), setTimeout(() => L(!1), 2e3);
+							},
+							className: "flex items-center gap-1 px-2 py-1 text-xs text-text-secondary hover:bg-bg-sunken rounded transition-colors",
+							children: I ? /* @__PURE__ */ _(h, { children: [/* @__PURE__ */ g(l, { className: "w-3 h-3 text-status-success-text" }), " Copied"] }) : /* @__PURE__ */ _(h, { children: [/* @__PURE__ */ g(u, { className: "w-3 h-3" }), " Copy"] })
+						})]
+					}), /* @__PURE__ */ g("pre", {
+						className: "text-xs text-text-primary bg-bg-sunken rounded p-3 overflow-x-auto whitespace-pre-wrap font-mono",
+						children: V()
+					})]
+				})
+			]
+		}), /* @__PURE__ */ g("div", { children: /* @__PURE__ */ _(i, {
+			className: "p-4 h-full",
+			children: [/* @__PURE__ */ _("div", {
+				className: "mb-3 flex flex-wrap items-center justify-between gap-2",
+				children: [/* @__PURE__ */ g("h3", {
+					className: "font-semibold text-text-primary",
+					children: y("vibecontrols.ai.playground.response", "Response")
+				}), P !== null && /* @__PURE__ */ g("span", {
+					className: `px-2 py-0.5 text-xs rounded font-mono ${P >= 200 && P < 300 ? "bg-status-success-bg text-status-success-text" : P >= 400 ? "bg-status-error-bg text-status-error-text" : "bg-status-warning-bg text-status-warning-text"}`,
+					children: P
+				})]
+			}), M === null ? /* @__PURE__ */ g("div", {
+				className: "flex items-center justify-center h-48 text-sm text-text-secondary",
+				children: y("vibecontrols.ai.playground.executeToSee", "Execute a request to see the response")
+			}) : /* @__PURE__ */ g("pre", {
+				className: "text-xs text-text-primary bg-bg-sunken rounded p-3 overflow-auto max-h-[60vh] whitespace-pre-wrap font-mono",
+				children: M
+			})]
+		}) })]
+	});
+}
+//#endregion
+export { v as AIPlaygroundTab };
+
+//# sourceMappingURL=AIPlaygroundTab.js.map

package/dist/components/ai/AIPlaygroundTab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AIPlaygroundTab.js","names":[],"sources":["../../../src/components/ai/AIPlaygroundTab.tsx"],"sourcesContent":["import { useState, useEffect, useCallback } from 'react';\nimport { Play, Copy, Check, Terminal } from 'lucide-react';\nimport { Card, LoadingState, ErrorState, EmptyState } from '@/components/shared';\nimport type { AIApiEndpoint } from '@/services/aiApi';\nimport { fetchApiDescriptor } from '@/services/aiApi';\nimport { getStoredAuthToken, getStoredWorkspaceToken } from '@burdenoff/fe-libs/shared/graphql';\nimport { useTr } from '../../shared/hooks/useTr';\n\ninterface AIPlaygroundTabProps {\n  agentId: string;\n}\n\nexport function AIPlaygroundTab({ agentId }: AIPlaygroundTabProps) {\n  const tr = useTr();\n  const [endpoints, setEndpoints] = useState<AIApiEndpoint[]>([]);\n  const [loading, setLoading] = useState(true);\n  const [error, setError] = useState<string | null>(null);\n  const [selectedEndpoint, setSelectedEndpoint] = useState<AIApiEndpoint | null>(null);\n  const [params, setParams] = useState<Record<string, string>>({});\n  const [executing, setExecuting] = useState(false);\n  const [response, setResponse] = useState<string | null>(null);\n  const [responseStatus, setResponseStatus] = useState<number | null>(null);\n  const [copied, setCopied] = useState(false);\n\n  const loadEndpoints = useCallback(async () => {\n    setLoading(true);\n    setError(null);\n    try {\n      const result = await fetchApiDescriptor(agentId);\n      setEndpoints(result);\n      if (result.length > 0) {\n        selectEndpoint(result[0]);\n      }\n    } catch (err) {\n      setError(err instanceof Error ? err.message : 'Failed to load API descriptor');\n    } finally {\n      setLoading(false);\n    }\n  }, [agentId]);\n\n  useEffect(() => {\n    loadEndpoints();\n  }, [loadEndpoints]);\n\n  const selectEndpoint = (ep: AIApiEndpoint) => {\n    setSelectedEndpoint(ep);\n    const newParams: Record<string, string> = {};\n    ep.parameters?.forEach((p) => {\n      newParams[p.name] = '';\n    });\n    setParams(newParams);\n    setResponse(null);\n    setResponseStatus(null);\n  };\n\n  const handleExecute = async () => {\n    if (!selectedEndpoint) return;\n    setExecuting(true);\n    setResponse(null);\n    setResponseStatus(null);\n    try {\n      // Build path with path params replaced\n      let path = selectedEndpoint.path;\n      const bodyParams: Record<string, string> = {};\n\n      for (const [key, value] of Object.entries(params)) {\n        if (path.includes(`:${key}`)) {\n          path = path.replace(`:${key}`, encodeURIComponent(value));\n        } else if (value) {\n          bodyParams[key] = value;\n        }\n      }\n\n      const method = selectedEndpoint.method.toUpperCase();\n      const hasBody = method === 'POST' || method === 'PATCH' || method === 'PUT';\n\n      const authToken = getStoredAuthToken();\n      const workspaceToken = getStoredWorkspaceToken();\n      const workspaceId = new URLSearchParams(window.location.search).get('workspace') || '';\n      const graphRes = await fetch('/workspaces/graphql', {\n        method: 'POST',\n        headers: {\n          'Content-Type': 'application/json',\n          ...(authToken ? { Authorization: `Bearer ${authToken}` } : {}),\n          ...(workspaceToken ? { 'X-Workspace-Authorization': `Bearer ${workspaceToken}` } : {}),\n          ...(workspaceId ? { 'x-workspace-id': workspaceId } : {}),\n        },\n        body: JSON.stringify({\n          query: `mutation AgentAiMutate($agentId: ID!, $path: String!, $method: String!, $body: JSON) {\n            agentAiMutate(agentId: $agentId, path: $path, method: $method, body: $body) {\n              ok\n              status\n              data\n              text\n              error\n            }\n          }`,\n          variables: {\n            agentId,\n            path,\n            method,\n            body: hasBody && Object.keys(bodyParams).length > 0 ? bodyParams : null,\n          },\n        }),\n      });\n\n      const graphJson = await graphRes.json();\n      const proxy = graphJson.data?.agentAiMutate;\n      if (!proxy) throw new Error(graphJson.errors?.[0]?.message || 'Request failed');\n\n      setResponseStatus(proxy.status);\n      setResponse(\n        JSON.stringify(\n          proxy.data ?? (proxy.text ? { text: proxy.text } : { error: proxy.error }),\n          null,\n          2\n        )\n      );\n    } catch (err) {\n      setResponse(`Error: ${err instanceof Error ? err.message : 'Request failed'}`);\n      setResponseStatus(0);\n    } finally {\n      setExecuting(false);\n    }\n  };\n\n  const getCurlCommand = (): string => {\n    if (!selectedEndpoint) return '';\n    let path = selectedEndpoint.path;\n    const bodyParams: Record<string, string> = {};\n\n    for (const [key, value] of Object.entries(params)) {\n      if (path.includes(`:${key}`)) {\n        path = path.replace(`:${key}`, encodeURIComponent(value || `{${key}}`));\n      } else if (value) {\n        bodyParams[key] = value;\n      }\n    }\n\n    const method = selectedEndpoint.method.toUpperCase();\n    return `mutation AgentAiMutate {\n  agentAiMutate(\n    agentId: \"${agentId}\"\n    path: \"${path}\"\n    method: \"${method}\"\n    body: ${Object.keys(bodyParams).length > 0 ? JSON.stringify(bodyParams) : 'null'}\n  ) {\n    ok\n    status\n    data\n    error\n  }\n}`;\n  };\n\n  const handleCopy = () => {\n    navigator.clipboard.writeText(getCurlCommand());\n    setCopied(true);\n    setTimeout(() => setCopied(false), 2000);\n  };\n\n  if (loading)\n    return (\n      <LoadingState\n        message={tr('vibecontrols.ai.playground.loading', 'Loading API descriptor...')}\n      />\n    );\n  if (error)\n    return (\n      <ErrorState\n        title={tr('vibecontrols.ai.playground.loadFailed', 'Failed to load API')}\n        message={error}\n        onRetry={loadEndpoints}\n      />\n    );\n  if (endpoints.length === 0) {\n    return (\n      <EmptyState\n        icon={<Terminal className=\"w-8 h-8 text-text-secondary\" />}\n        title={tr('vibecontrols.ai.playground.noEndpoints', 'No API endpoints')}\n        description={tr(\n          'vibecontrols.ai.playground.noEndpointsDesc',\n          'The agent does not expose any AI API endpoints'\n        )}\n      />\n    );\n  }\n\n  return (\n    <div className=\"grid grid-cols-1 lg:grid-cols-2 gap-6\">\n      {/* Left: Endpoint selection and params */}\n      <div className=\"space-y-4\">\n        <Card className=\"p-4\">\n          <h3 className=\"font-semibold text-text-primary mb-3\">\n            {tr('vibecontrols.ai.playground.endpoint', 'Endpoint')}\n          </h3>\n          <select\n            value={selectedEndpoint?.id ?? ''}\n            onChange={(e) => {\n              const ep = endpoints.find((ep) => ep.id === e.target.value);\n              if (ep) selectEndpoint(ep);\n            }}\n            className=\"w-full px-3 py-2 bg-bg-sunken border border-border-default rounded-md text-text-primary text-sm\"\n          >\n            {endpoints.map((ep) => (\n              <option key={ep.id} value={ep.id}>\n                {ep.method.toUpperCase()} {ep.path} - {ep.description}\n              </option>\n            ))}\n          </select>\n\n          {selectedEndpoint?.description && (\n            <p className=\"mt-2 text-xs text-text-secondary\">{selectedEndpoint.description}</p>\n          )}\n        </Card>\n\n        {/* Parameters */}\n        {selectedEndpoint?.parameters && selectedEndpoint.parameters.length > 0 && (\n          <Card className=\"p-4\">\n            <h3 className=\"font-semibold text-text-primary mb-3\">\n              {tr('vibecontrols.ai.playground.parameters', 'Parameters')}\n            </h3>\n            <div className=\"space-y-3\">\n              {selectedEndpoint.parameters.map((p) => (\n                <div key={p.name}>\n                  <label className=\"flex items-center gap-1.5 text-sm font-medium text-text-primary mb-1\">\n                    {p.name}\n                    {p.required && <span className=\"text-status-error-text text-xs\">*</span>}\n                    <span className=\"text-xs text-text-muted font-normal\">({p.type})</span>\n                  </label>\n                  {p.description && (\n                    <p className=\"text-xs text-text-secondary mb-1\">{p.description}</p>\n                  )}\n                  <input\n                    type=\"text\"\n                    value={params[p.name] ?? ''}\n                    onChange={(e) => setParams((prev) => ({ ...prev, [p.name]: e.target.value }))}\n                    className=\"w-full px-3 py-2 bg-bg-sunken border border-border-default rounded-md text-text-primary text-sm font-mono focus:outline-none focus:border-border-strong\"\n                    placeholder={p.required ? 'Required' : 'Optional'}\n                  />\n                </div>\n              ))}\n            </div>\n          </Card>\n        )}\n\n        <button\n          onClick={handleExecute}\n          disabled={executing}\n          className=\"w-full flex items-center justify-center gap-2 px-4 py-2.5 bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors disabled:opacity-50 text-sm font-medium\"\n        >\n          <Play className=\"w-4 h-4\" />\n          {executing\n            ? tr('vibecontrols.ai.playground.executing', 'Executing...')\n            : tr('vibecontrols.ai.playground.execute', 'Execute')}\n        </button>\n\n        {/* Curl Command */}\n        <Card className=\"p-4\">\n          <div className=\"mb-2 flex flex-wrap items-center justify-between gap-2\">\n            <h3 className=\"text-xs font-semibold text-text-secondary uppercase tracking-wide\">\n              cURL\n            </h3>\n            <button\n              onClick={handleCopy}\n              className=\"flex items-center gap-1 px-2 py-1 text-xs text-text-secondary hover:bg-bg-sunken rounded transition-colors\"\n            >\n              {copied ? (\n                <>\n                  <Check className=\"w-3 h-3 text-status-success-text\" /> Copied\n                </>\n              ) : (\n                <>\n                  <Copy className=\"w-3 h-3\" /> Copy\n                </>\n              )}\n            </button>\n          </div>\n          <pre className=\"text-xs text-text-primary bg-bg-sunken rounded p-3 overflow-x-auto whitespace-pre-wrap font-mono\">\n            {getCurlCommand()}\n          </pre>\n        </Card>\n      </div>\n\n      {/* Right: Response */}\n      <div>\n        <Card className=\"p-4 h-full\">\n          <div className=\"mb-3 flex flex-wrap items-center justify-between gap-2\">\n            <h3 className=\"font-semibold text-text-primary\">\n              {tr('vibecontrols.ai.playground.response', 'Response')}\n            </h3>\n            {responseStatus !== null && (\n              <span\n                className={`px-2 py-0.5 text-xs rounded font-mono ${\n                  responseStatus >= 200 && responseStatus < 300\n                    ? 'bg-status-success-bg text-status-success-text'\n                    : responseStatus >= 400\n                      ? 'bg-status-error-bg text-status-error-text'\n                      : 'bg-status-warning-bg text-status-warning-text'\n                }`}\n              >\n                {responseStatus}\n              </span>\n            )}\n          </div>\n          {response === null ? (\n            <div className=\"flex items-center justify-center h-48 text-sm text-text-secondary\">\n              {tr(\n                'vibecontrols.ai.playground.executeToSee',\n                'Execute a request to see the response'\n              )}\n            </div>\n          ) : (\n            <pre className=\"text-xs text-text-primary bg-bg-sunken rounded p-3 overflow-auto max-h-[60vh] whitespace-pre-wrap font-mono\">\n              {response}\n            </pre>\n          )}\n        </Card>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/components/ai/AIPromptsTab.d.ts

@@ -0,0 +1,6 @@
+interface AIPromptsTabProps {
+    agentId: string;
+}
+export declare function AIPromptsTab({ agentId }: AIPromptsTabProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=AIPromptsTab.d.ts.map

package/dist/components/ai/AIPromptsTab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AIPromptsTab.d.ts","sourceRoot":"","sources":["../../../src/components/ai/AIPromptsTab.tsx"],"names":[],"mappings":"AAeA,UAAU,iBAAiB;IACzB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,wBAAgB,YAAY,CAAC,EAAE,OAAO,EAAE,EAAE,iBAAiB,2CA6T1D"}

package/dist/components/ai/AIPromptsTab.js

@@ -0,0 +1,251 @@
+import { useTr as e } from "../../shared/hooks/useTr.js";
+import { LoadingState as t } from "../shared/LoadingState.js";
+import { ErrorState as n } from "../shared/ErrorState.js";
+import { EmptyState as r } from "../shared/EmptyState.js";
+import { Card as i } from "../shared/Card.js";
+import "../shared/index.js";
+import { fetchContexts as ee, fetchDispatchHistory as a, fetchSessions as o, fetchTemplates as s, recordTemplateUsage as c, renderTemplate as l, sendDispatch as u } from "../../services/aiApi.js";
+import { useCallback as d, useEffect as f, useState as p } from "react";
+import { Clock as te, FileText as m, Send as h, Wand2 as g } from "lucide-react";
+import { jsx as _, jsxs as v } from "react/jsx-runtime";
+//#region src/components/ai/AIPromptsTab.tsx
+function y({ agentId: y }) {
+	let b = e(), [x, S] = p(""), [C, w] = p([]), [T, E] = p(""), [D, O] = p(!1), [k, A] = p(null), [j, M] = p(!1), [N, P] = p(""), [F, I] = p(null), [L, R] = p({}), [z, B] = p(!1), [V, H] = p([]), [U, W] = p([]), [G, K] = p([]), [q, J] = p([]), [Y, X] = p(!0), [Z, Q] = p(null), $ = d(async () => {
+		X(!0), Q(null);
+		try {
+			let [e, t, n, r] = await Promise.all([
+				s(y),
+				ee(y),
+				o(y),
+				a(y, { limit: 20 })
+			]);
+			H(e), W(t), K(n), J(r);
+		} catch (e) {
+			Q(e instanceof Error ? e.message : "Failed to load data");
+		} finally {
+			X(!1);
+		}
+	}, [y]);
+	f(() => {
+		$();
+	}, [$]);
+	let ne = (e) => {
+		P(e);
+		let t = V.find((t) => t.id === e);
+		if (t?.variables) {
+			let e = {};
+			for (let n of Object.keys(t.variables)) e[n] = String(t.variables[n] ?? "");
+			R(e);
+		} else R({});
+	}, re = async () => {
+		if (N) {
+			B(!0);
+			try {
+				S((await l(y, N, L)).rendered), I(N), M(!1);
+			} catch (e) {
+				console.error("Failed to render template:", e);
+			} finally {
+				B(!1);
+			}
+		}
+	}, ie = (e) => {
+		w((t) => t.includes(e) ? t.filter((t) => t !== e) : [...t, e]);
+	};
+	return Y ? /* @__PURE__ */ _(t, { message: b("vibecontrols.ai.prompts.loading", "Loading prompts...") }) : Z ? /* @__PURE__ */ _(n, {
+		title: b("vibecontrols.ai.prompts.loadFailed", "Failed to load data"),
+		message: Z,
+		onRetry: $
+	}) : /* @__PURE__ */ v("div", {
+		className: "space-y-6",
+		children: [
+			k && /* @__PURE__ */ _("div", {
+				className: "bg-status-success-bg text-status-success-text px-4 py-2 rounded-md text-sm",
+				children: k
+			}),
+			/* @__PURE__ */ v("div", {
+				className: "grid grid-cols-1 lg:grid-cols-3 gap-6",
+				children: [/* @__PURE__ */ _("div", {
+					className: "lg:col-span-2 space-y-4",
+					children: /* @__PURE__ */ v(i, {
+						className: "p-4",
+						children: [
+							/* @__PURE__ */ v("div", {
+								className: "flex items-center justify-between mb-3",
+								children: [/* @__PURE__ */ _("h3", {
+									className: "font-semibold text-text-primary",
+									children: b("vibecontrols.ai.prompts.composePrompt", "Compose Prompt")
+								}), /* @__PURE__ */ v("button", {
+									onClick: () => M(!j),
+									className: "flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium text-action-primary-bg bg-action-primary-bg/10 rounded-md hover:bg-action-primary-bg/20 transition-colors",
+									children: [/* @__PURE__ */ _(g, { className: "w-3.5 h-3.5" }), b("vibecontrols.ai.prompts.generateFromTemplate", "Generate from Template")]
+								})]
+							}),
+							j && /* @__PURE__ */ v("div", {
+								className: "mb-4 p-3 bg-bg-sunken rounded-md space-y-3",
+								children: [
+									/* @__PURE__ */ v("select", {
+										value: N,
+										onChange: (e) => ne(e.target.value),
+										className: "w-full px-3 py-2 bg-bg-surface border border-border-default rounded-md text-text-primary text-sm",
+										children: [/* @__PURE__ */ _("option", {
+											value: "",
+											children: b("vibecontrols.ai.prompts.selectTemplate", "Select a template...")
+										}), V.map((e) => /* @__PURE__ */ _("option", {
+											value: e.id,
+											children: e.name
+										}, e.id))]
+									}),
+									Object.keys(L).length > 0 && /* @__PURE__ */ _("div", {
+										className: "space-y-2",
+										children: Object.entries(L).map(([e, t]) => /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
+											className: "block text-xs font-medium text-text-secondary mb-0.5",
+											children: e
+										}), /* @__PURE__ */ _("input", {
+											type: "text",
+											value: t,
+											onChange: (t) => R((n) => ({
+												...n,
+												[e]: t.target.value
+											})),
+											className: "w-full px-2 py-1.5 bg-bg-surface border border-border-default rounded text-sm text-text-primary focus:outline-none focus:border-border-strong"
+										})] }, e))
+									}),
+									/* @__PURE__ */ _("button", {
+										onClick: re,
+										disabled: z || !N,
+										className: "w-full px-3 py-2 text-sm bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors disabled:opacity-50",
+										children: z ? b("vibecontrols.ai.prompts.generating", "Generating...") : b("vibecontrols.ai.prompts.generate", "Generate")
+									})
+								]
+							}),
+							/* @__PURE__ */ _("textarea", {
+								value: x,
+								onChange: (e) => {
+									S(e.target.value), I(null);
+								},
+								rows: 8,
+								className: "w-full px-3 py-2 bg-bg-sunken border border-border-default rounded-md text-text-primary text-sm font-mono focus:outline-none focus:border-border-strong",
+								placeholder: b("vibecontrols.ai.prompts.promptPlaceholder", "Write your prompt here... (Markdown supported)")
+							}),
+							/* @__PURE__ */ v("div", {
+								className: "flex flex-col sm:flex-row items-stretch sm:items-end gap-3 mt-3",
+								children: [/* @__PURE__ */ v("div", {
+									className: "flex-1",
+									children: [/* @__PURE__ */ _("label", {
+										className: "block text-xs font-medium text-text-secondary mb-1",
+										children: b("vibecontrols.ai.prompts.targetSession", "Target Session")
+									}), /* @__PURE__ */ v("select", {
+										value: T,
+										onChange: (e) => E(e.target.value),
+										className: "w-full px-3 py-2 bg-bg-sunken border border-border-default rounded-md text-text-primary text-sm",
+										children: [/* @__PURE__ */ _("option", {
+											value: "",
+											children: b("vibecontrols.ai.prompts.selectSession", "Select session...")
+										}), G.filter((e) => e.status !== "terminated").map((e) => /* @__PURE__ */ v("option", {
+											value: e.id,
+											children: [
+												e.name,
+												" (",
+												e.status,
+												")"
+											]
+										}, e.id))]
+									})]
+								}), /* @__PURE__ */ v("button", {
+									onClick: async () => {
+										if (!(!x.trim() || !T)) {
+											O(!0), A(null);
+											try {
+												await u(y, {
+													prompt: x,
+													sessionId: T,
+													contextIds: C.length > 0 ? C : void 0
+												}), F && await c(y, F), A("Prompt dispatched successfully"), S(""), I(null), w([]), setTimeout(() => A(null), 3e3), J(await a(y, { limit: 20 }));
+											} catch (e) {
+												console.error("Failed to dispatch prompt:", e);
+											} finally {
+												O(!1);
+											}
+										}
+									},
+									disabled: D || !x.trim() || !T,
+									className: "flex items-center justify-center gap-2 px-4 py-2 bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors disabled:opacity-50 text-sm",
+									children: [/* @__PURE__ */ _(h, { className: "w-4 h-4" }), D ? b("vibecontrols.ai.prompts.sending", "Sending...") : b("vibecontrols.ai.prompts.sendToSession", "Send to Session")]
+								})]
+							})
+						]
+					})
+				}), /* @__PURE__ */ _("div", {
+					className: "space-y-4",
+					children: /* @__PURE__ */ v(i, {
+						className: "p-4",
+						children: [/* @__PURE__ */ _("h3", {
+							className: "font-semibold text-text-primary mb-3",
+							children: b("vibecontrols.ai.prompts.attachContexts", "Attach Contexts")
+						}), U.length === 0 ? /* @__PURE__ */ _("p", {
+							className: "text-sm text-text-secondary",
+							children: b("vibecontrols.ai.prompts.noContexts", "No contexts available")
+						}) : /* @__PURE__ */ _("div", {
+							className: "space-y-2 max-h-64 overflow-y-auto",
+							children: U.map((e) => /* @__PURE__ */ v("label", {
+								className: "flex items-start gap-2 p-2 rounded hover:bg-bg-sunken cursor-pointer",
+								children: [/* @__PURE__ */ _("input", {
+									type: "checkbox",
+									checked: C.includes(e.id),
+									onChange: () => ie(e.id),
+									className: "mt-0.5 rounded border-border-default"
+								}), /* @__PURE__ */ v("div", {
+									className: "min-w-0 flex-1",
+									children: [/* @__PURE__ */ _("div", {
+										className: "text-sm font-medium text-text-primary truncate",
+										children: e.name
+									}), /* @__PURE__ */ _("div", {
+										className: "text-xs text-text-secondary",
+										children: e.type
+									})]
+								})]
+							}, e.id))
+						})]
+					})
+				})]
+			}),
+			/* @__PURE__ */ v(i, {
+				className: "p-0",
+				children: [/* @__PURE__ */ v("div", {
+					className: "px-4 py-3 border-b border-border-default flex items-center gap-2",
+					children: [/* @__PURE__ */ _(te, { className: "w-4 h-4 text-text-secondary" }), /* @__PURE__ */ _("h3", {
+						className: "font-semibold text-text-primary",
+						children: b("vibecontrols.ai.prompts.dispatchHistory", "Dispatch History")
+					})]
+				}), /* @__PURE__ */ _("div", {
+					className: "divide-y divide-border-default",
+					children: q.length === 0 ? /* @__PURE__ */ _(r, {
+						icon: /* @__PURE__ */ _(m, { className: "w-6 h-6 text-text-secondary" }),
+						title: b("vibecontrols.ai.prompts.noDispatched", "No dispatched prompts"),
+						description: b("vibecontrols.ai.prompts.noDispatchedDesc", "Send a prompt to a session to see history here")
+					}) : q.map((e) => /* @__PURE__ */ v("div", {
+						className: "px-4 py-3",
+						children: [/* @__PURE__ */ _("div", {
+							className: "text-sm text-text-primary line-clamp-2",
+							children: e.prompt
+						}), /* @__PURE__ */ v("div", {
+							className: "mt-1 flex items-center gap-3 text-xs text-text-secondary",
+							children: [
+								/* @__PURE__ */ _("span", {
+									className: "font-medium",
+									children: e.status
+								}),
+								/* @__PURE__ */ v("span", { children: ["Session: ", e.sessionId ? `${e.sessionId.substring(0, 8)}...` : "—"] }),
+								e.createdAt && /* @__PURE__ */ _("span", { children: new Date(e.createdAt).toLocaleString() })
+							]
+						})]
+					}, e.id))
+				})]
+			})
+		]
+	});
+}
+//#endregion
+export { y as AIPromptsTab };
+
+//# sourceMappingURL=AIPromptsTab.js.map

package/dist/components/ai/AIPromptsTab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AIPromptsTab.js","names":[],"sources":["../../../src/components/ai/AIPromptsTab.tsx"],"sourcesContent":["import { useState, useEffect, useCallback } from 'react';\nimport { Send, FileText, Wand2, Clock } from 'lucide-react';\nimport { Card, LoadingState, ErrorState, EmptyState } from '@/components/shared';\nimport type { AITemplate, AIContext, AISession, AIDispatch } from '@/services/aiApi';\nimport {\n  fetchTemplates,\n  fetchContexts,\n  fetchSessions,\n  fetchDispatchHistory,\n  renderTemplate,\n  recordTemplateUsage,\n  sendDispatch,\n} from '@/services/aiApi';\nimport { useTr } from '../../shared/hooks/useTr';\n\ninterface AIPromptsTabProps {\n  agentId: string;\n}\n\nexport function AIPromptsTab({ agentId }: AIPromptsTabProps) {\n  const tr = useTr();\n  const [promptContent, setPromptContent] = useState('');\n  const [selectedContextIds, setSelectedContextIds] = useState<string[]>([]);\n  const [targetSessionId, setTargetSessionId] = useState('');\n  const [sending, setSending] = useState(false);\n  const [successMsg, setSuccessMsg] = useState<string | null>(null);\n\n  // Generate from template state\n  const [showTemplateGen, setShowTemplateGen] = useState(false);\n  const [selectedTemplateId, setSelectedTemplateId] = useState('');\n  const [sourceTemplateId, setSourceTemplateId] = useState<string | null>(null);\n  const [templateVars, setTemplateVars] = useState<Record<string, string>>({});\n  const [rendering, setRendering] = useState(false);\n\n  // Data\n  const [templates, setTemplates] = useState<AITemplate[]>([]);\n  const [contexts, setContexts] = useState<AIContext[]>([]);\n  const [sessions, setSessions] = useState<AISession[]>([]);\n  const [history, setHistory] = useState<AIDispatch[]>([]);\n  const [loading, setLoading] = useState(true);\n  const [error, setError] = useState<string | null>(null);\n\n  const loadData = useCallback(async () => {\n    setLoading(true);\n    setError(null);\n    try {\n      const [t, c, s, h] = await Promise.all([\n        fetchTemplates(agentId),\n        fetchContexts(agentId),\n        fetchSessions(agentId),\n        fetchDispatchHistory(agentId, { limit: 20 }),\n      ]);\n      setTemplates(t);\n      setContexts(c);\n      setSessions(s);\n      setHistory(h);\n    } catch (err) {\n      setError(err instanceof Error ? err.message : 'Failed to load data');\n    } finally {\n      setLoading(false);\n    }\n  }, [agentId]);\n\n  useEffect(() => {\n    loadData();\n  }, [loadData]);\n\n  const handleTemplateSelect = (templateId: string) => {\n    setSelectedTemplateId(templateId);\n    const template = templates.find((t) => t.id === templateId);\n    if (template?.variables) {\n      const vars: Record<string, string> = {};\n      for (const key of Object.keys(template.variables)) {\n        vars[key] = String(template.variables[key] ?? '');\n      }\n      setTemplateVars(vars);\n    } else {\n      setTemplateVars({});\n    }\n  };\n\n  const handleGenerateFromTemplate = async () => {\n    if (!selectedTemplateId) return;\n    setRendering(true);\n    try {\n      const result = await renderTemplate(agentId, selectedTemplateId, templateVars);\n      setPromptContent(result.rendered);\n      setSourceTemplateId(selectedTemplateId);\n      setShowTemplateGen(false);\n    } catch (err) {\n      console.error('Failed to render template:', err);\n    } finally {\n      setRendering(false);\n    }\n  };\n\n  const toggleContext = (contextId: string) => {\n    setSelectedContextIds((prev) =>\n      prev.includes(contextId) ? prev.filter((id) => id !== contextId) : [...prev, contextId]\n    );\n  };\n\n  const handleSendToSession = async () => {\n    if (!promptContent.trim() || !targetSessionId) return;\n    setSending(true);\n    setSuccessMsg(null);\n    try {\n      await sendDispatch(agentId, {\n        prompt: promptContent,\n        sessionId: targetSessionId,\n        contextIds: selectedContextIds.length > 0 ? selectedContextIds : undefined,\n      });\n      if (sourceTemplateId) {\n        await recordTemplateUsage(agentId, sourceTemplateId);\n      }\n      setSuccessMsg('Prompt dispatched successfully');\n      setPromptContent('');\n      setSourceTemplateId(null);\n      setSelectedContextIds([]);\n      setTimeout(() => setSuccessMsg(null), 3000);\n      // Refresh history\n      const h = await fetchDispatchHistory(agentId, { limit: 20 });\n      setHistory(h);\n    } catch (err) {\n      console.error('Failed to dispatch prompt:', err);\n    } finally {\n      setSending(false);\n    }\n  };\n\n  if (loading)\n    return <LoadingState message={tr('vibecontrols.ai.prompts.loading', 'Loading prompts...')} />;\n  if (error)\n    return (\n      <ErrorState\n        title={tr('vibecontrols.ai.prompts.loadFailed', 'Failed to load data')}\n        message={error}\n        onRetry={loadData}\n      />\n    );\n\n  return (\n    <div className=\"space-y-6\">\n      {successMsg && (\n        <div className=\"bg-status-success-bg text-status-success-text px-4 py-2 rounded-md text-sm\">\n          {successMsg}\n        </div>\n      )}\n\n      <div className=\"grid grid-cols-1 lg:grid-cols-3 gap-6\">\n        {/* Prompt Editor */}\n        <div className=\"lg:col-span-2 space-y-4\">\n          <Card className=\"p-4\">\n            <div className=\"flex items-center justify-between mb-3\">\n              <h3 className=\"font-semibold text-text-primary\">\n                {tr('vibecontrols.ai.prompts.composePrompt', 'Compose Prompt')}\n              </h3>\n              <button\n                onClick={() => setShowTemplateGen(!showTemplateGen)}\n                className=\"flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium text-action-primary-bg bg-action-primary-bg/10 rounded-md hover:bg-action-primary-bg/20 transition-colors\"\n              >\n                <Wand2 className=\"w-3.5 h-3.5\" />\n                {tr('vibecontrols.ai.prompts.generateFromTemplate', 'Generate from Template')}\n              </button>\n            </div>\n\n            {/* Template Generator */}\n            {showTemplateGen && (\n              <div className=\"mb-4 p-3 bg-bg-sunken rounded-md space-y-3\">\n                <select\n                  value={selectedTemplateId}\n                  onChange={(e) => handleTemplateSelect(e.target.value)}\n                  className=\"w-full px-3 py-2 bg-bg-surface border border-border-default rounded-md text-text-primary text-sm\"\n                >\n                  <option value=\"\">\n                    {tr('vibecontrols.ai.prompts.selectTemplate', 'Select a template...')}\n                  </option>\n                  {templates.map((t) => (\n                    <option key={t.id} value={t.id}>\n                      {t.name}\n                    </option>\n                  ))}\n                </select>\n                {Object.keys(templateVars).length > 0 && (\n                  <div className=\"space-y-2\">\n                    {Object.entries(templateVars).map(([key, val]) => (\n                      <div key={key}>\n                        <label className=\"block text-xs font-medium text-text-secondary mb-0.5\">\n                          {key}\n                        </label>\n                        <input\n                          type=\"text\"\n                          value={val}\n                          onChange={(e) =>\n                            setTemplateVars((prev) => ({ ...prev, [key]: e.target.value }))\n                          }\n                          className=\"w-full px-2 py-1.5 bg-bg-surface border border-border-default rounded text-sm text-text-primary focus:outline-none focus:border-border-strong\"\n                        />\n                      </div>\n                    ))}\n                  </div>\n                )}\n                <button\n                  onClick={handleGenerateFromTemplate}\n                  disabled={rendering || !selectedTemplateId}\n                  className=\"w-full px-3 py-2 text-sm bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors disabled:opacity-50\"\n                >\n                  {rendering\n                    ? tr('vibecontrols.ai.prompts.generating', 'Generating...')\n                    : tr('vibecontrols.ai.prompts.generate', 'Generate')}\n                </button>\n              </div>\n            )}\n\n            <textarea\n              value={promptContent}\n              onChange={(e) => {\n                setPromptContent(e.target.value);\n                setSourceTemplateId(null);\n              }}\n              rows={8}\n              className=\"w-full px-3 py-2 bg-bg-sunken border border-border-default rounded-md text-text-primary text-sm font-mono focus:outline-none focus:border-border-strong\"\n              placeholder={tr(\n                'vibecontrols.ai.prompts.promptPlaceholder',\n                'Write your prompt here... (Markdown supported)'\n              )}\n            />\n\n            {/* Session Target & Send */}\n            <div className=\"flex flex-col sm:flex-row items-stretch sm:items-end gap-3 mt-3\">\n              <div className=\"flex-1\">\n                <label className=\"block text-xs font-medium text-text-secondary mb-1\">\n                  {tr('vibecontrols.ai.prompts.targetSession', 'Target Session')}\n                </label>\n                <select\n                  value={targetSessionId}\n                  onChange={(e) => setTargetSessionId(e.target.value)}\n                  className=\"w-full px-3 py-2 bg-bg-sunken border border-border-default rounded-md text-text-primary text-sm\"\n                >\n                  <option value=\"\">\n                    {tr('vibecontrols.ai.prompts.selectSession', 'Select session...')}\n                  </option>\n                  {sessions\n                    .filter((s) => s.status !== 'terminated')\n                    .map((s) => (\n                      <option key={s.id} value={s.id}>\n                        {s.name} ({s.status})\n                      </option>\n                    ))}\n                </select>\n              </div>\n              <button\n                onClick={handleSendToSession}\n                disabled={sending || !promptContent.trim() || !targetSessionId}\n                className=\"flex items-center justify-center gap-2 px-4 py-2 bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors disabled:opacity-50 text-sm\"\n              >\n                <Send className=\"w-4 h-4\" />\n                {sending\n                  ? tr('vibecontrols.ai.prompts.sending', 'Sending...')\n                  : tr('vibecontrols.ai.prompts.sendToSession', 'Send to Session')}\n              </button>\n            </div>\n          </Card>\n        </div>\n\n        {/* Context Picker */}\n        <div className=\"space-y-4\">\n          <Card className=\"p-4\">\n            <h3 className=\"font-semibold text-text-primary mb-3\">\n              {tr('vibecontrols.ai.prompts.attachContexts', 'Attach Contexts')}\n            </h3>\n            {contexts.length === 0 ? (\n              <p className=\"text-sm text-text-secondary\">\n                {tr('vibecontrols.ai.prompts.noContexts', 'No contexts available')}\n              </p>\n            ) : (\n              <div className=\"space-y-2 max-h-64 overflow-y-auto\">\n                {contexts.map((ctx) => (\n                  <label\n                    key={ctx.id}\n                    className=\"flex items-start gap-2 p-2 rounded hover:bg-bg-sunken cursor-pointer\"\n                  >\n                    <input\n                      type=\"checkbox\"\n                      checked={selectedContextIds.includes(ctx.id)}\n                      onChange={() => toggleContext(ctx.id)}\n                      className=\"mt-0.5 rounded border-border-default\"\n                    />\n                    <div className=\"min-w-0 flex-1\">\n                      <div className=\"text-sm font-medium text-text-primary truncate\">\n                        {ctx.name}\n                      </div>\n                      <div className=\"text-xs text-text-secondary\">{ctx.type}</div>\n                    </div>\n                  </label>\n                ))}\n              </div>\n            )}\n          </Card>\n        </div>\n      </div>\n\n      {/* Dispatch History */}\n      <Card className=\"p-0\">\n        <div className=\"px-4 py-3 border-b border-border-default flex items-center gap-2\">\n          <Clock className=\"w-4 h-4 text-text-secondary\" />\n          <h3 className=\"font-semibold text-text-primary\">\n            {tr('vibecontrols.ai.prompts.dispatchHistory', 'Dispatch History')}\n          </h3>\n        </div>\n        <div className=\"divide-y divide-border-default\">\n          {history.length === 0 ? (\n            <EmptyState\n              icon={<FileText className=\"w-6 h-6 text-text-secondary\" />}\n              title={tr('vibecontrols.ai.prompts.noDispatched', 'No dispatched prompts')}\n              description={tr(\n                'vibecontrols.ai.prompts.noDispatchedDesc',\n                'Send a prompt to a session to see history here'\n              )}\n            />\n          ) : (\n            history.map((d) => (\n              <div key={d.id} className=\"px-4 py-3\">\n                <div className=\"text-sm text-text-primary line-clamp-2\">{d.prompt}</div>\n                <div className=\"mt-1 flex items-center gap-3 text-xs text-text-secondary\">\n                  <span className=\"font-medium\">{d.status}</span>\n                  <span>Session: {d.sessionId ? `${d.sessionId.substring(0, 8)}...` : '—'}</span>\n                  {d.createdAt && <span>{new Date(d.createdAt).toLocaleString()}</span>}\n                </div>\n              </div>\n            ))\n          )}\n        </div>\n      </Card>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/components/ai/AISessionsTab.d.ts

@@ -0,0 +1,7 @@
+interface AISessionsTabProps {
+    agentId: string;
+    onNavigateToSession?: (sessionId: string) => void;
+}
+export declare function AISessionsTab({ agentId, onNavigateToSession }: AISessionsTabProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=AISessionsTab.d.ts.map

package/dist/components/ai/AISessionsTab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AISessionsTab.d.ts","sourceRoot":"","sources":["../../../src/components/ai/AISessionsTab.tsx"],"names":[],"mappings":"AAOA,UAAU,kBAAkB;IAC1B,OAAO,EAAE,MAAM,CAAC;IAChB,mBAAmB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;CACnD;AAyBD,wBAAgB,aAAa,CAAC,EAAE,OAAO,EAAE,mBAAmB,EAAE,EAAE,kBAAkB,2CAyNjF"}