@wrongstack/webui 0.256.0 → 0.257.0
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.
- package/dist/assets/index-BCG7KsrQ.js +167 -0
- package/dist/assets/index-C19_lY6u.css +2 -0
- package/dist/assets/{vendor-XlX63RRU.js → vendor-BXyxPv8C.js} +1 -1
- package/dist/index.html +3 -3
- package/dist/index.js +1140 -790
- package/dist/index.js.map +1 -1
- package/package.json +5 -5
- package/dist/assets/index-DHok34Zp.js +0 -164
- package/dist/assets/index-DVRA0JCZ.css +0 -2
package/dist/index.js
CHANGED
|
@@ -888,6 +888,8 @@ var useUIStore = create4()(
|
|
|
888
888
|
dockSection: null,
|
|
889
889
|
fleetMonitorOpen: false,
|
|
890
890
|
agentsMonitorOpen: false,
|
|
891
|
+
inspectorOpen: false,
|
|
892
|
+
inspectorTab: "fleet",
|
|
891
893
|
selectActivity: (activity) => set({ activeActivity: activity }),
|
|
892
894
|
toggleSidebar: () => set((state) => ({ sidebarOpen: !state.sidebarOpen })),
|
|
893
895
|
setSidebarOpen: (open) => set({ sidebarOpen: open }),
|
|
@@ -935,20 +937,30 @@ var useUIStore = create4()(
|
|
|
935
937
|
setDockSection: (section) => set({ dockSection: section }),
|
|
936
938
|
toggleDockSection: (section) => set((s) => ({ dockSection: s.dockSection === section ? null : section })),
|
|
937
939
|
setFleetMonitorOpen: (open) => set({ fleetMonitorOpen: open }),
|
|
938
|
-
setAgentsMonitorOpen: (open) => set({ agentsMonitorOpen: open })
|
|
940
|
+
setAgentsMonitorOpen: (open) => set({ agentsMonitorOpen: open }),
|
|
941
|
+
setInspectorOpen: (open) => set({ inspectorOpen: open }),
|
|
942
|
+
setInspectorTab: (tab) => set({ inspectorTab: tab }),
|
|
943
|
+
toggleInspector: () => set((s) => ({ inspectorOpen: !s.inspectorOpen }))
|
|
939
944
|
}),
|
|
940
945
|
{
|
|
941
946
|
name: "wrongstack-ui",
|
|
942
|
-
version:
|
|
947
|
+
version: 2,
|
|
943
948
|
// v0 → v1: 'context'/'sessions' activities were removed and the
|
|
944
949
|
// sidebar width bounds changed — coerce persisted values so a stale
|
|
945
950
|
// localStorage entry can't select a panel that no longer exists.
|
|
946
|
-
|
|
951
|
+
// v1 → v2: the modal FleetDrawer/AgentsDrawer were replaced by a
|
|
952
|
+
// single docked InspectorPanel; drop the stale drawer booleans so
|
|
953
|
+
// they can't force the (removed) fields back into state.
|
|
954
|
+
migrate: (persisted, version) => {
|
|
947
955
|
const p = persisted ?? {};
|
|
948
956
|
p.activeActivity = coerceActivity(p.activeActivity);
|
|
949
957
|
if (typeof p.sidebarWidth === "number") {
|
|
950
958
|
p.sidebarWidth = Math.max(SIDEBAR_MIN_WIDTH, Math.min(SIDEBAR_MAX_WIDTH, p.sidebarWidth));
|
|
951
959
|
}
|
|
960
|
+
if (version < 2) {
|
|
961
|
+
delete p.fleetDrawerOpen;
|
|
962
|
+
delete p.agentsDrawerOpen;
|
|
963
|
+
}
|
|
952
964
|
return p;
|
|
953
965
|
},
|
|
954
966
|
partialize: (s) => ({
|
|
@@ -961,7 +973,9 @@ var useUIStore = create4()(
|
|
|
961
973
|
favoriteSessionIds: s.favoriteSessionIds,
|
|
962
974
|
sessionNicknames: s.sessionNicknames,
|
|
963
975
|
fileExplorerWidth: s.fileExplorerWidth,
|
|
964
|
-
refineEnabled: s.refineEnabled
|
|
976
|
+
refineEnabled: s.refineEnabled,
|
|
977
|
+
inspectorOpen: s.inspectorOpen,
|
|
978
|
+
inspectorTab: s.inspectorTab
|
|
965
979
|
})
|
|
966
980
|
}
|
|
967
981
|
)
|
|
@@ -2916,7 +2930,7 @@ function useWebSocket() {
|
|
|
2916
2930
|
}
|
|
2917
2931
|
|
|
2918
2932
|
// src/App.tsx
|
|
2919
|
-
import { useEffect as
|
|
2933
|
+
import { useEffect as useEffect45 } from "react";
|
|
2920
2934
|
|
|
2921
2935
|
// src/components/ActivityBar.tsx
|
|
2922
2936
|
import {
|
|
@@ -3105,8 +3119,16 @@ function ActivityBar() {
|
|
|
3105
3119
|
{
|
|
3106
3120
|
icon: /* @__PURE__ */ jsx3(LayoutGrid, { size: 16 }),
|
|
3107
3121
|
label: "Fleet Monitor (Ctrl+Shift+M)",
|
|
3108
|
-
active: useUIStore.getState().
|
|
3109
|
-
onClick: () =>
|
|
3122
|
+
active: useUIStore.getState().inspectorOpen && useUIStore.getState().inspectorTab === "fleet",
|
|
3123
|
+
onClick: () => {
|
|
3124
|
+
const ui = useUIStore.getState();
|
|
3125
|
+
if (ui.inspectorOpen && ui.inspectorTab === "fleet") {
|
|
3126
|
+
ui.setInspectorOpen(false);
|
|
3127
|
+
} else {
|
|
3128
|
+
ui.setInspectorTab("fleet");
|
|
3129
|
+
ui.setInspectorOpen(true);
|
|
3130
|
+
}
|
|
3131
|
+
}
|
|
3110
3132
|
}
|
|
3111
3133
|
),
|
|
3112
3134
|
/* @__PURE__ */ jsx3(
|
|
@@ -3114,8 +3136,16 @@ function ActivityBar() {
|
|
|
3114
3136
|
{
|
|
3115
3137
|
icon: /* @__PURE__ */ jsx3(ActivityIconSvg, { size: 16 }),
|
|
3116
3138
|
label: "Agents Monitor (Ctrl+Shift+A)",
|
|
3117
|
-
active: useUIStore.getState().
|
|
3118
|
-
onClick: () =>
|
|
3139
|
+
active: useUIStore.getState().inspectorOpen && useUIStore.getState().inspectorTab === "agents",
|
|
3140
|
+
onClick: () => {
|
|
3141
|
+
const ui = useUIStore.getState();
|
|
3142
|
+
if (ui.inspectorOpen && ui.inspectorTab === "agents") {
|
|
3143
|
+
ui.setInspectorOpen(false);
|
|
3144
|
+
} else {
|
|
3145
|
+
ui.setInspectorTab("agents");
|
|
3146
|
+
ui.setInspectorOpen(true);
|
|
3147
|
+
}
|
|
3148
|
+
}
|
|
3119
3149
|
}
|
|
3120
3150
|
)
|
|
3121
3151
|
] }),
|
|
@@ -5029,7 +5059,7 @@ import {
|
|
|
5029
5059
|
Terminal as Terminal4,
|
|
5030
5060
|
Zap as Zap5
|
|
5031
5061
|
} from "lucide-react";
|
|
5032
|
-
import { memo as memo5, useCallback as useCallback10, useEffect as
|
|
5062
|
+
import { memo as memo5, useCallback as useCallback10, useEffect as useEffect19, useMemo as useMemo7, useRef as useRef14, useState as useState25 } from "react";
|
|
5033
5063
|
import { VList } from "virtua";
|
|
5034
5064
|
|
|
5035
5065
|
// src/components/AutonomyPicker.tsx
|
|
@@ -7744,7 +7774,7 @@ import {
|
|
|
7744
7774
|
User,
|
|
7745
7775
|
XCircle as XCircle5
|
|
7746
7776
|
} from "lucide-react";
|
|
7747
|
-
import { memo as memo3, useState as
|
|
7777
|
+
import { memo as memo3, useState as useState19 } from "react";
|
|
7748
7778
|
import ReactMarkdown from "react-markdown";
|
|
7749
7779
|
import remarkGfm from "remark-gfm";
|
|
7750
7780
|
|
|
@@ -8096,10 +8126,11 @@ function JsonResult({
|
|
|
8096
8126
|
}
|
|
8097
8127
|
|
|
8098
8128
|
// src/components/NextStepsBar.tsx
|
|
8099
|
-
import { ArrowRight as ArrowRight2, Lightbulb, MousePointerClick } from "lucide-react";
|
|
8100
|
-
import {
|
|
8129
|
+
import { ArrowRight as ArrowRight2, Lightbulb, MousePointerClick, Timer as Timer2 } from "lucide-react";
|
|
8130
|
+
import { useEffect as useEffect14, useState as useState14 } from "react";
|
|
8101
8131
|
import { jsx as jsx23, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
8102
|
-
var NEXT_STEPS_RE = /💡\s*Next steps?\s*\n+((?:\d+\.\s
|
|
8132
|
+
var NEXT_STEPS_RE = /💡\s*Next steps?\s*\n+((?:\d+\.\s+.+(?:\s+auto="true")?\n?)+)/i;
|
|
8133
|
+
var ITEM_RE = /^(\d+)\.\s+(.+?)(?:\s+auto="true")?$/;
|
|
8103
8134
|
function parseNextSteps(content) {
|
|
8104
8135
|
const match = NEXT_STEPS_RE.exec(content);
|
|
8105
8136
|
if (!match?.[1]) return [];
|
|
@@ -8107,9 +8138,11 @@ function parseNextSteps(content) {
|
|
|
8107
8138
|
const lines = block.split("\n").filter(Boolean);
|
|
8108
8139
|
const steps = [];
|
|
8109
8140
|
for (const line of lines) {
|
|
8110
|
-
const m =
|
|
8141
|
+
const m = ITEM_RE.exec(line.trim());
|
|
8111
8142
|
if (m) {
|
|
8112
|
-
|
|
8143
|
+
const text = m[2].trim();
|
|
8144
|
+
const hasAuto = line.trim().endsWith('auto="true"');
|
|
8145
|
+
steps.push({ index: Number.parseInt(m[1], 10), text, auto: hasAuto });
|
|
8113
8146
|
}
|
|
8114
8147
|
}
|
|
8115
8148
|
return steps.slice(0, 6);
|
|
@@ -8125,42 +8158,100 @@ function fillInput(text) {
|
|
|
8125
8158
|
ta.dispatchEvent(new Event("input", { bubbles: true }));
|
|
8126
8159
|
ta.focus();
|
|
8127
8160
|
}
|
|
8161
|
+
function AutoCountdown({
|
|
8162
|
+
delayMs,
|
|
8163
|
+
onComplete
|
|
8164
|
+
}) {
|
|
8165
|
+
const [remaining, setRemaining] = useState14(Math.ceil(delayMs / 1e3));
|
|
8166
|
+
useEffect14(() => {
|
|
8167
|
+
if (remaining <= 0) {
|
|
8168
|
+
onComplete();
|
|
8169
|
+
return;
|
|
8170
|
+
}
|
|
8171
|
+
const timer = setTimeout(() => setRemaining((r) => r - 1), 1e3);
|
|
8172
|
+
return () => clearTimeout(timer);
|
|
8173
|
+
}, [remaining, onComplete]);
|
|
8174
|
+
return /* @__PURE__ */ jsxs21("span", { className: "flex items-center gap-1 text-xs text-primary font-medium", children: [
|
|
8175
|
+
/* @__PURE__ */ jsx23(Timer2, { className: "h-3 w-3" }),
|
|
8176
|
+
remaining,
|
|
8177
|
+
"s"
|
|
8178
|
+
] });
|
|
8179
|
+
}
|
|
8128
8180
|
function NextStepsBar({
|
|
8129
|
-
steps
|
|
8181
|
+
steps,
|
|
8182
|
+
yoloMode = false,
|
|
8183
|
+
autoMode = false,
|
|
8184
|
+
autoDelayMs = 3e4,
|
|
8185
|
+
onAutoSubmit
|
|
8130
8186
|
}) {
|
|
8131
8187
|
if (steps.length === 0) return null;
|
|
8188
|
+
const showAutoCountdown = yoloMode && autoMode;
|
|
8189
|
+
const autoStep = showAutoCountdown ? steps.find((s) => s.auto) : void 0;
|
|
8132
8190
|
return /* @__PURE__ */ jsxs21("div", { className: "mt-4 rounded-xl border border-primary/20 bg-primary/[0.03] overflow-hidden animate-message", children: [
|
|
8133
8191
|
/* @__PURE__ */ jsxs21("div", { className: "flex items-center gap-2 px-3.5 py-2 border-b border-primary/10 bg-primary/[0.04]", children: [
|
|
8134
8192
|
/* @__PURE__ */ jsx23("span", { className: "flex items-center justify-center w-5 h-5 rounded-md bg-primary/15 text-primary", children: /* @__PURE__ */ jsx23(Lightbulb, { className: "h-3 w-3" }) }),
|
|
8135
8193
|
/* @__PURE__ */ jsx23("span", { className: "text-xs font-semibold text-foreground/90", children: "Next steps" }),
|
|
8136
|
-
/* @__PURE__ */
|
|
8194
|
+
showAutoCountdown && autoStep ? /* @__PURE__ */ jsxs21("span", { className: "ml-auto flex items-center gap-1 text-xs text-primary", children: [
|
|
8195
|
+
/* @__PURE__ */ jsx23(Timer2, { className: "h-3 w-3" }),
|
|
8196
|
+
"auto-submitting in ",
|
|
8197
|
+
/* @__PURE__ */ jsx23(AutoCountdown, { delayMs: autoDelayMs, onComplete: () => onAutoSubmit?.(autoStep.text) })
|
|
8198
|
+
] }) : /* @__PURE__ */ jsx23("span", { className: "text-[10px] text-muted-foreground ml-auto", children: "click to fill input" })
|
|
8137
8199
|
] }),
|
|
8138
|
-
/* @__PURE__ */ jsx23("div", { className: "flex flex-col p-2 gap-1", children: steps.map((s) =>
|
|
8139
|
-
|
|
8140
|
-
|
|
8141
|
-
|
|
8142
|
-
|
|
8143
|
-
|
|
8144
|
-
|
|
8145
|
-
|
|
8146
|
-
|
|
8147
|
-
|
|
8148
|
-
|
|
8149
|
-
|
|
8150
|
-
|
|
8151
|
-
|
|
8152
|
-
|
|
8153
|
-
|
|
8200
|
+
/* @__PURE__ */ jsx23("div", { className: "flex flex-col p-2 gap-1", children: steps.map((s) => {
|
|
8201
|
+
const isAutoSelected = showAutoCountdown && s.auto;
|
|
8202
|
+
return /* @__PURE__ */ jsxs21(
|
|
8203
|
+
"button",
|
|
8204
|
+
{
|
|
8205
|
+
type: "button",
|
|
8206
|
+
onClick: () => fillInput(s.text),
|
|
8207
|
+
className: `group flex items-center gap-2.5 w-full text-left px-3 py-2 rounded-lg transition-all border ${isAutoSelected ? "bg-primary/10 border-primary/30 ring-1 ring-primary/20" : "border-transparent hover:bg-primary/[0.08] hover:shadow-sm hover:border-primary/20"}`,
|
|
8208
|
+
title: `Click to fill: ${s.text}`,
|
|
8209
|
+
children: [
|
|
8210
|
+
/* @__PURE__ */ jsx23(
|
|
8211
|
+
"span",
|
|
8212
|
+
{
|
|
8213
|
+
className: `flex items-center justify-center w-5 h-5 rounded-md text-[11px] font-mono font-semibold tabular-nums shrink-0 transition-colors ${isAutoSelected ? "bg-primary/30 text-primary" : "bg-muted/80 group-hover:bg-primary/20 text-muted-foreground group-hover:text-primary"}`,
|
|
8214
|
+
children: s.index
|
|
8215
|
+
}
|
|
8216
|
+
),
|
|
8217
|
+
/* @__PURE__ */ jsx23(
|
|
8218
|
+
ArrowRight2,
|
|
8219
|
+
{
|
|
8220
|
+
className: `h-3.5 w-3.5 shrink-0 transition-all ${isAutoSelected ? "text-primary" : "text-muted-foreground/60 group-hover:text-primary group-hover:translate-x-0.5"}`
|
|
8221
|
+
}
|
|
8222
|
+
),
|
|
8223
|
+
/* @__PURE__ */ jsx23(
|
|
8224
|
+
"span",
|
|
8225
|
+
{
|
|
8226
|
+
className: `text-sm leading-snug flex-1 min-w-0 transition-colors ${isAutoSelected ? "text-foreground font-medium" : "text-foreground/80 group-hover:text-foreground"}`,
|
|
8227
|
+
children: s.text
|
|
8228
|
+
}
|
|
8229
|
+
),
|
|
8230
|
+
s.auto && /* @__PURE__ */ jsxs21("span", { className: "flex items-center gap-1 text-[10px] text-primary/70", children: [
|
|
8231
|
+
/* @__PURE__ */ jsx23(Timer2, { className: "h-3 w-3" }),
|
|
8232
|
+
"auto"
|
|
8233
|
+
] }),
|
|
8234
|
+
/* @__PURE__ */ jsx23(
|
|
8235
|
+
MousePointerClick,
|
|
8236
|
+
{
|
|
8237
|
+
className: `h-3.5 w-3.5 shrink-0 transition-all ${isAutoSelected ? "opacity-100 text-primary/60" : "opacity-0 group-hover:opacity-100 text-primary/60"}`
|
|
8238
|
+
}
|
|
8239
|
+
)
|
|
8240
|
+
]
|
|
8241
|
+
},
|
|
8242
|
+
s.index
|
|
8243
|
+
);
|
|
8244
|
+
}) })
|
|
8154
8245
|
] });
|
|
8155
8246
|
}
|
|
8156
8247
|
|
|
8157
8248
|
// src/components/MessageBubble/CopyButton.tsx
|
|
8158
8249
|
import { Copy as Copy3, Check as Check4 } from "lucide-react";
|
|
8159
|
-
import { useState as
|
|
8250
|
+
import { useState as useState16 } from "react";
|
|
8160
8251
|
|
|
8161
8252
|
// src/components/MessageBubble/utils.tsx
|
|
8162
8253
|
import { Check as Check3, Copy as Copy2, FileCode2 } from "lucide-react";
|
|
8163
|
-
import { useCallback as useCallback8, useMemo as
|
|
8254
|
+
import { useCallback as useCallback8, useMemo as useMemo5, useState as useState15 } from "react";
|
|
8164
8255
|
import rehypeHighlight from "rehype-highlight";
|
|
8165
8256
|
import { jsx as jsx24, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
8166
8257
|
async function copyToClipboard(text) {
|
|
@@ -8212,7 +8303,7 @@ function formatToolDuration(ms) {
|
|
|
8212
8303
|
}
|
|
8213
8304
|
var rehypePlugins = [rehypeHighlight];
|
|
8214
8305
|
function CodeCopyButton({ text }) {
|
|
8215
|
-
const [copied, setCopied] =
|
|
8306
|
+
const [copied, setCopied] = useState15(false);
|
|
8216
8307
|
const handleCopy = useCallback8(async () => {
|
|
8217
8308
|
const ok = await copyToClipboard(text);
|
|
8218
8309
|
if (ok) {
|
|
@@ -8239,6 +8330,34 @@ function CodeCopyButton({ text }) {
|
|
|
8239
8330
|
);
|
|
8240
8331
|
}
|
|
8241
8332
|
var markdownComponents = {
|
|
8333
|
+
next_steps({ children }) {
|
|
8334
|
+
const rawText = typeof children === "string" ? children : "";
|
|
8335
|
+
const steps = parseNextSteps(rawText);
|
|
8336
|
+
if (steps.length === 0) return null;
|
|
8337
|
+
return /* @__PURE__ */ jsxs22("div", { className: "mt-4 rounded-xl border border-primary/20 bg-primary/[0.03] overflow-hidden animate-message", children: [
|
|
8338
|
+
/* @__PURE__ */ jsxs22("div", { className: "flex items-center gap-2 px-3.5 py-2 border-b border-primary/10 bg-primary/[0.04]", children: [
|
|
8339
|
+
/* @__PURE__ */ jsx24("span", { className: "flex items-center justify-center w-5 h-5 rounded-md bg-primary/15 text-primary text-xs", children: "\u{1F4A1}" }),
|
|
8340
|
+
/* @__PURE__ */ jsx24("span", { className: "text-xs font-semibold text-foreground/90", children: "Next steps" }),
|
|
8341
|
+
/* @__PURE__ */ jsx24("span", { className: "text-[10px] text-muted-foreground ml-auto", children: "click to fill input" })
|
|
8342
|
+
] }),
|
|
8343
|
+
/* @__PURE__ */ jsx24("div", { className: "flex flex-col p-2 gap-1", children: steps.map((s) => /* @__PURE__ */ jsxs22(
|
|
8344
|
+
"button",
|
|
8345
|
+
{
|
|
8346
|
+
type: "button",
|
|
8347
|
+
onClick: () => fillInput(s.text),
|
|
8348
|
+
className: "group flex items-center gap-2.5 w-full text-left px-3 py-2 rounded-lg transition-all\n hover:bg-primary/[0.08] hover:shadow-sm\n border border-transparent hover:border-primary/20 cursor-pointer",
|
|
8349
|
+
title: `Click to fill: ${s.text}`,
|
|
8350
|
+
children: [
|
|
8351
|
+
/* @__PURE__ */ jsx24("span", { className: "flex items-center justify-center w-5 h-5 rounded-md bg-muted/80 group-hover:bg-primary/20\n text-[11px] font-mono font-semibold tabular-nums shrink-0\n text-muted-foreground group-hover:text-primary transition-colors", children: s.index }),
|
|
8352
|
+
/* @__PURE__ */ jsx24("span", { className: "h-3.5 w-3.5 text-muted-foreground/60 group-hover:text-primary group-hover:translate-x-0.5 transition-all shrink-0 text-xs", children: "\u2192" }),
|
|
8353
|
+
/* @__PURE__ */ jsx24("span", { className: "text-sm leading-snug text-foreground/80 group-hover:text-foreground transition-colors flex-1 min-w-0", children: s.text }),
|
|
8354
|
+
/* @__PURE__ */ jsx24("span", { className: "opacity-0 group-hover:opacity-100 text-primary/60 transition-all shrink-0 text-xs", children: "\u2197" })
|
|
8355
|
+
]
|
|
8356
|
+
},
|
|
8357
|
+
s.index
|
|
8358
|
+
)) })
|
|
8359
|
+
] });
|
|
8360
|
+
},
|
|
8242
8361
|
code({
|
|
8243
8362
|
inline,
|
|
8244
8363
|
className,
|
|
@@ -8248,12 +8367,12 @@ var markdownComponents = {
|
|
|
8248
8367
|
const match = /language-(\w+)/.exec(className ?? "");
|
|
8249
8368
|
const codeText = String(children ?? "").replace(/\n$/, "");
|
|
8250
8369
|
if (inline || !match) {
|
|
8251
|
-
return /* @__PURE__ */ jsx24("code", { className: cn("rounded
|
|
8370
|
+
return /* @__PURE__ */ jsx24("code", { className: cn("rounded border border-border/60 px-1.5 py-0.5 text-[0.85em] font-mono", className), ...props, children });
|
|
8252
8371
|
}
|
|
8253
|
-
const lines =
|
|
8372
|
+
const lines = useMemo5(() => codeText.split("\n"), [codeText]);
|
|
8254
8373
|
const hasLineNumbers = lines.length > 1;
|
|
8255
|
-
return /* @__PURE__ */ jsxs22("div", { className: "not-prose relative my-3 rounded-lg border
|
|
8256
|
-
/* @__PURE__ */ jsxs22("div", { className: "flex items-center justify-between px-3 py-1 border-b
|
|
8374
|
+
return /* @__PURE__ */ jsxs22("div", { className: "not-prose relative my-3 rounded-lg border border-border overflow-hidden group/codeblock", children: [
|
|
8375
|
+
/* @__PURE__ */ jsxs22("div", { className: "flex items-center justify-between px-3 py-1 border-b border-border text-xs", children: [
|
|
8257
8376
|
/* @__PURE__ */ jsxs22("div", { className: "flex items-center gap-2", children: [
|
|
8258
8377
|
/* @__PURE__ */ jsx24(FileCode2, { className: "h-3 w-3 text-muted-foreground" }),
|
|
8259
8378
|
/* @__PURE__ */ jsx24("span", { className: "font-mono text-muted-foreground font-medium", children: match[1] }),
|
|
@@ -8270,13 +8389,13 @@ var markdownComponents = {
|
|
|
8270
8389
|
"pre",
|
|
8271
8390
|
{
|
|
8272
8391
|
"aria-hidden": true,
|
|
8273
|
-
className: "text-xs font-mono leading-[1.55] py-3 pl-3 pr-2 text-muted-foreground/40 select-none border-r border-border/30
|
|
8392
|
+
className: "text-xs font-mono leading-[1.55] py-3 pl-3 pr-2 text-muted-foreground/40 select-none border-r border-border/30 tabular-nums text-right shrink-0",
|
|
8274
8393
|
children: lines.map((_, i) => /* @__PURE__ */ jsx24("div", { children: i + 1 }, i))
|
|
8275
8394
|
}
|
|
8276
8395
|
),
|
|
8277
8396
|
/* @__PURE__ */ jsx24("pre", { className: "overflow-x-auto py-3 px-3 text-xs leading-[1.55] font-mono flex-1", children: /* @__PURE__ */ jsx24("code", { className: cn("hljs", className), ...props, children }) })
|
|
8278
8397
|
] }) : /* @__PURE__ */ jsx24("pre", { className: "overflow-x-auto p-3 text-xs leading-relaxed font-mono max-h-[40rem]", children: /* @__PURE__ */ jsx24("code", { className: cn("hljs", className), ...props, children }) }),
|
|
8279
|
-
/* @__PURE__ */ jsx24("div", { className: "pointer-events-none absolute bottom-8 left-0 right-0 h-8 bg-gradient-to-t from-
|
|
8398
|
+
/* @__PURE__ */ jsx24("div", { className: "pointer-events-none absolute bottom-8 left-0 right-0 h-8 bg-gradient-to-t from-black/10 to-transparent opacity-0 group-hover/codeblock:opacity-100 transition-opacity" })
|
|
8280
8399
|
] });
|
|
8281
8400
|
}
|
|
8282
8401
|
};
|
|
@@ -8288,7 +8407,7 @@ function CopyButton({
|
|
|
8288
8407
|
className,
|
|
8289
8408
|
label = "Copy"
|
|
8290
8409
|
}) {
|
|
8291
|
-
const [copied, setCopied] =
|
|
8410
|
+
const [copied, setCopied] = useState16(false);
|
|
8292
8411
|
return /* @__PURE__ */ jsx25(
|
|
8293
8412
|
"button",
|
|
8294
8413
|
{
|
|
@@ -8319,7 +8438,7 @@ function CopyButton({
|
|
|
8319
8438
|
|
|
8320
8439
|
// src/components/MessageBubble/ErrorBody.tsx
|
|
8321
8440
|
import { expectDefined as expectDefined10 } from "@wrongstack/core";
|
|
8322
|
-
import { useState as
|
|
8441
|
+
import { useState as useState17 } from "react";
|
|
8323
8442
|
import { jsx as jsx26, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
8324
8443
|
function detectStackBoundary(text) {
|
|
8325
8444
|
const lines = text.split("\n");
|
|
@@ -8333,7 +8452,7 @@ function detectStackBoundary(text) {
|
|
|
8333
8452
|
}
|
|
8334
8453
|
function ErrorBodyWithStack({ text }) {
|
|
8335
8454
|
const idx = detectStackBoundary(text);
|
|
8336
|
-
const [open, setOpen] =
|
|
8455
|
+
const [open, setOpen] = useState17(false);
|
|
8337
8456
|
if (idx === -1) {
|
|
8338
8457
|
return /* @__PURE__ */ jsx26("pre", { className: "whitespace-pre-wrap break-words font-mono text-xs leading-relaxed", children: text });
|
|
8339
8458
|
}
|
|
@@ -8366,10 +8485,10 @@ function ErrorBodyWithStack({ text }) {
|
|
|
8366
8485
|
}
|
|
8367
8486
|
|
|
8368
8487
|
// src/components/MessageBubble/ToolInputView.tsx
|
|
8369
|
-
import { useState as
|
|
8488
|
+
import { useState as useState18 } from "react";
|
|
8370
8489
|
import { jsx as jsx27, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
8371
8490
|
function ToolInputView({ input }) {
|
|
8372
|
-
const [openKeys, setOpenKeys] =
|
|
8491
|
+
const [openKeys, setOpenKeys] = useState18({});
|
|
8373
8492
|
if (input === null || input === void 0 || typeof input !== "object" || Array.isArray(input)) {
|
|
8374
8493
|
return /* @__PURE__ */ jsx27("pre", { className: "whitespace-pre-wrap break-all text-xs font-mono", children: JSON.stringify(input, null, 2) });
|
|
8375
8494
|
}
|
|
@@ -8432,10 +8551,10 @@ var MessageBubble = memo3(function MessageBubble2({
|
|
|
8432
8551
|
isFirst = false,
|
|
8433
8552
|
isContinuation = false
|
|
8434
8553
|
}) {
|
|
8435
|
-
const [expandedTools, setExpandedTools] =
|
|
8436
|
-
const [editing, setEditing] =
|
|
8437
|
-
const [editValue, setEditValue] =
|
|
8438
|
-
const [showRaw, setShowRaw] =
|
|
8554
|
+
const [expandedTools, setExpandedTools] = useState19({});
|
|
8555
|
+
const [editing, setEditing] = useState19(false);
|
|
8556
|
+
const [editValue, setEditValue] = useState19("");
|
|
8557
|
+
const [showRaw, setShowRaw] = useState19(false);
|
|
8439
8558
|
const isUser = message.role === "user";
|
|
8440
8559
|
const isTool = message.role === "tool";
|
|
8441
8560
|
void message.role;
|
|
@@ -8451,6 +8570,14 @@ var MessageBubble = memo3(function MessageBubble2({
|
|
|
8451
8570
|
const inputCost = useSessionStore((s) => s.inputCost);
|
|
8452
8571
|
const outputCost = useSessionStore((s) => s.outputCost);
|
|
8453
8572
|
const cacheReadCost = useSessionStore((s) => s.cacheReadCost);
|
|
8573
|
+
const localPrefs = useLocalPrefs();
|
|
8574
|
+
const { autonomy, yolo } = localPrefs;
|
|
8575
|
+
const handleAutoSubmit = (text) => {
|
|
8576
|
+
addMessage({ role: "user", content: text });
|
|
8577
|
+
setLoading(true);
|
|
8578
|
+
const client2 = getWSClient(wsUrl);
|
|
8579
|
+
client2.sendMessage(text);
|
|
8580
|
+
};
|
|
8454
8581
|
const isLatestAssistant = (() => {
|
|
8455
8582
|
if (message.role !== "assistant" || isLoading) return false;
|
|
8456
8583
|
const all = useChatStore.getState().messages;
|
|
@@ -8623,7 +8750,16 @@ var MessageBubble = memo3(function MessageBubble2({
|
|
|
8623
8750
|
isLatestAssistant && message.content && (() => {
|
|
8624
8751
|
const steps = parseNextSteps(message.content);
|
|
8625
8752
|
if (steps.length === 0) return null;
|
|
8626
|
-
return /* @__PURE__ */ jsx28(
|
|
8753
|
+
return /* @__PURE__ */ jsx28(
|
|
8754
|
+
NextStepsBar,
|
|
8755
|
+
{
|
|
8756
|
+
steps,
|
|
8757
|
+
yoloMode: yolo,
|
|
8758
|
+
autoMode: autonomy === "auto",
|
|
8759
|
+
autoDelayMs: localPrefs.autonomyDelayMs,
|
|
8760
|
+
onAutoSubmit: handleAutoSubmit
|
|
8761
|
+
}
|
|
8762
|
+
);
|
|
8627
8763
|
})(),
|
|
8628
8764
|
/* @__PURE__ */ jsxs26("div", { className: cn("flex items-center gap-2 px-1", isUser ? "flex-row-reverse" : "flex-row"), children: [
|
|
8629
8765
|
/* @__PURE__ */ jsx28("span", { className: "text-xs text-muted-foreground/50", children: new Date(message.timestamp).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }) }),
|
|
@@ -8700,18 +8836,18 @@ var MessageBubble = memo3(function MessageBubble2({
|
|
|
8700
8836
|
|
|
8701
8837
|
// src/components/ModePicker.tsx
|
|
8702
8838
|
import { Check as Check5, ChevronDown as ChevronDown6 } from "lucide-react";
|
|
8703
|
-
import { useEffect as
|
|
8839
|
+
import { useEffect as useEffect15, useRef as useRef11, useState as useState20 } from "react";
|
|
8704
8840
|
import { jsx as jsx29, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
8705
8841
|
function ModePicker() {
|
|
8706
8842
|
const mode = useSessionStore((s) => s.mode);
|
|
8707
8843
|
const modes = useSessionStore((s) => s.modes);
|
|
8708
8844
|
const { listModes, switchMode } = useWebSocket();
|
|
8709
|
-
const [open, setOpen] =
|
|
8845
|
+
const [open, setOpen] = useState20(false);
|
|
8710
8846
|
const rootRef = useRef11(null);
|
|
8711
|
-
|
|
8847
|
+
useEffect15(() => {
|
|
8712
8848
|
if (open) listModes();
|
|
8713
8849
|
}, [open, listModes]);
|
|
8714
|
-
|
|
8850
|
+
useEffect15(() => {
|
|
8715
8851
|
if (!open) return;
|
|
8716
8852
|
const onClick = (e) => {
|
|
8717
8853
|
if (!rootRef.current?.contains(e.target)) setOpen(false);
|
|
@@ -8783,18 +8919,18 @@ function ModePicker() {
|
|
|
8783
8919
|
|
|
8784
8920
|
// src/components/ProcessMonitor.tsx
|
|
8785
8921
|
import { Shield, Square as Square3, Terminal as Terminal2, X as X6 } from "lucide-react";
|
|
8786
|
-
import { useCallback as useCallback9, useEffect as
|
|
8922
|
+
import { useCallback as useCallback9, useEffect as useEffect16, useRef as useRef12, useState as useState21 } from "react";
|
|
8787
8923
|
import { jsx as jsx30, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
8788
8924
|
function ProcessMonitor({
|
|
8789
8925
|
open,
|
|
8790
8926
|
onClose,
|
|
8791
8927
|
className
|
|
8792
8928
|
}) {
|
|
8793
|
-
const [processes, setProcesses] =
|
|
8929
|
+
const [processes, setProcesses] = useState21([]);
|
|
8794
8930
|
const ws = useWebSocket();
|
|
8795
8931
|
const offRef = useRef12(null);
|
|
8796
8932
|
const pollRef = useRef12(null);
|
|
8797
|
-
|
|
8933
|
+
useEffect16(() => {
|
|
8798
8934
|
if (!open || !ws.client?.isConnected) return;
|
|
8799
8935
|
ws.client.send?.({ type: "process.list" });
|
|
8800
8936
|
offRef.current = ws.client.on?.("process.list", (msg) => {
|
|
@@ -8941,8 +9077,12 @@ function ProcessMonitor({
|
|
|
8941
9077
|
|
|
8942
9078
|
// src/components/SearchOverlay.tsx
|
|
8943
9079
|
import { ArrowDown as ArrowDown2, ArrowUp as ArrowUp2, Search as Search2, X as X7 } from "lucide-react";
|
|
8944
|
-
import { useEffect as
|
|
9080
|
+
import { useEffect as useEffect17, useMemo as useMemo6, useRef as useRef13, useState as useState22 } from "react";
|
|
8945
9081
|
import { jsx as jsx31, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
9082
|
+
var HIGHLIGHT_STYLES = `
|
|
9083
|
+
::highlight(chat-search) { background-color: hsl(var(--primary) / 0.3); color: inherit; }
|
|
9084
|
+
::highlight(chat-search-active) { background-color: hsl(var(--primary) / 0.85); color: hsl(var(--primary-foreground)); }
|
|
9085
|
+
`;
|
|
8946
9086
|
function SearchOverlay() {
|
|
8947
9087
|
const open = useUIStore((s) => s.searchOpen);
|
|
8948
9088
|
const setOpen = useUIStore((s) => s.setSearchOpen);
|
|
@@ -8951,12 +9091,20 @@ function SearchOverlay() {
|
|
|
8951
9091
|
const messages = useChatStore((s) => s.messages);
|
|
8952
9092
|
const requestScrollToMessage = useUIStore((s) => s.requestScrollToMessage);
|
|
8953
9093
|
const inputRef = useRef13(null);
|
|
8954
|
-
const [activeHit, setActiveHit] =
|
|
8955
|
-
const [repaintNonce, setRepaintNonce] =
|
|
8956
|
-
|
|
9094
|
+
const [activeHit, setActiveHit] = useState22(0);
|
|
9095
|
+
const [repaintNonce, setRepaintNonce] = useState22(0);
|
|
9096
|
+
useEffect17(() => {
|
|
8957
9097
|
if (open) requestAnimationFrame(() => inputRef.current?.focus());
|
|
8958
9098
|
}, [open]);
|
|
8959
|
-
|
|
9099
|
+
useEffect17(() => {
|
|
9100
|
+
const style = document.createElement("style");
|
|
9101
|
+
style.textContent = HIGHLIGHT_STYLES;
|
|
9102
|
+
document.head.appendChild(style);
|
|
9103
|
+
return () => {
|
|
9104
|
+
document.head.removeChild(style);
|
|
9105
|
+
};
|
|
9106
|
+
}, []);
|
|
9107
|
+
const hits = useMemo6(() => {
|
|
8960
9108
|
const q = query.trim().toLowerCase();
|
|
8961
9109
|
if (!q) return [];
|
|
8962
9110
|
return messages.filter((m) => {
|
|
@@ -8966,10 +9114,10 @@ function SearchOverlay() {
|
|
|
8966
9114
|
return m.content.toLowerCase().includes(q);
|
|
8967
9115
|
}).map((m) => m.id);
|
|
8968
9116
|
}, [messages, query]);
|
|
8969
|
-
|
|
9117
|
+
useEffect17(() => {
|
|
8970
9118
|
if (activeHit >= hits.length) setActiveHit(0);
|
|
8971
9119
|
}, [hits, activeHit]);
|
|
8972
|
-
|
|
9120
|
+
useEffect17(() => {
|
|
8973
9121
|
const win = window;
|
|
8974
9122
|
const highlights = win.CSS?.highlights;
|
|
8975
9123
|
const HighlightCtor = win.Highlight;
|
|
@@ -9023,7 +9171,7 @@ function SearchOverlay() {
|
|
|
9023
9171
|
}
|
|
9024
9172
|
return clear;
|
|
9025
9173
|
}, [query, hits, activeHit, open, repaintNonce]);
|
|
9026
|
-
|
|
9174
|
+
useEffect17(() => {
|
|
9027
9175
|
const id = hits[activeHit];
|
|
9028
9176
|
if (!id) return;
|
|
9029
9177
|
requestScrollToMessage(id);
|
|
@@ -9109,7 +9257,7 @@ function SearchOverlay() {
|
|
|
9109
9257
|
// src/components/ToolGroup.tsx
|
|
9110
9258
|
import { expectDefined as expectDefined12 } from "@wrongstack/core";
|
|
9111
9259
|
import { CheckCircle2 as CheckCircle26, ChevronDown as ChevronDown7, ChevronRight as ChevronRight5, Loader2 as Loader22, Terminal as Terminal3, XCircle as XCircle6 } from "lucide-react";
|
|
9112
|
-
import { memo as memo4, useState as
|
|
9260
|
+
import { memo as memo4, useState as useState23 } from "react";
|
|
9113
9261
|
import { jsx as jsx32, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
9114
9262
|
function formatDuration2(ms) {
|
|
9115
9263
|
if (ms < 1e3) return `${ms}ms`;
|
|
@@ -9123,7 +9271,7 @@ var ToolGroup = memo4(function ToolGroup2({
|
|
|
9123
9271
|
defaultOpen = false,
|
|
9124
9272
|
isContinuation = false
|
|
9125
9273
|
}) {
|
|
9126
|
-
const [open, setOpen] =
|
|
9274
|
+
const [open, setOpen] = useState23(defaultOpen);
|
|
9127
9275
|
if (tools.length === 1) {
|
|
9128
9276
|
return /* @__PURE__ */ jsx32(MessageBubble, { message: expectDefined12(tools[0]), isFirst: true, isContinuation });
|
|
9129
9277
|
}
|
|
@@ -9182,7 +9330,7 @@ import {
|
|
|
9182
9330
|
Sparkles as Sparkles4,
|
|
9183
9331
|
Zap as Zap4
|
|
9184
9332
|
} from "lucide-react";
|
|
9185
|
-
import { useEffect as
|
|
9333
|
+
import { useEffect as useEffect18, useState as useState24 } from "react";
|
|
9186
9334
|
import { Fragment as Fragment8, jsx as jsx33, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
9187
9335
|
var CARDS = [
|
|
9188
9336
|
{
|
|
@@ -9257,8 +9405,8 @@ function WelcomeScreen() {
|
|
|
9257
9405
|
const wsConnected = useConfigStore((s) => s.wsConnected);
|
|
9258
9406
|
const wsUrl = useConfigStore((s) => s.wsUrl);
|
|
9259
9407
|
const setCurrentView = useUIStore((s) => s.setCurrentView);
|
|
9260
|
-
const [savedCount, setSavedCount] =
|
|
9261
|
-
|
|
9408
|
+
const [savedCount, setSavedCount] = useState24(void 0);
|
|
9409
|
+
useEffect18(() => {
|
|
9262
9410
|
if (!wsConnected) return;
|
|
9263
9411
|
const client2 = getWSClient(wsUrl);
|
|
9264
9412
|
const off = client2.on("providers.saved", (msg) => {
|
|
@@ -9274,7 +9422,7 @@ function WelcomeScreen() {
|
|
|
9274
9422
|
const recentPrompts = promptHistory.slice(0, 6);
|
|
9275
9423
|
const { listSessions, resumeSession } = useWebSocket();
|
|
9276
9424
|
const historyEntries = useHistoryStore((s) => s.entries);
|
|
9277
|
-
|
|
9425
|
+
useEffect18(() => {
|
|
9278
9426
|
if (wsConnected && historyEntries.length === 0) listSessions(10);
|
|
9279
9427
|
}, [wsConnected]);
|
|
9280
9428
|
const sessionNicknames = useUIStore((s) => s.sessionNicknames);
|
|
@@ -9518,12 +9666,12 @@ function ChatView() {
|
|
|
9518
9666
|
const nickname = useUIStore((s) => sessionId ? s.sessionNicknames[sessionId] : void 0);
|
|
9519
9667
|
const setSessionNickname = useUIStore((s) => s.setSessionNickname);
|
|
9520
9668
|
const sessionTitle = session?.title;
|
|
9521
|
-
const [renamingTitle, setRenamingTitle] =
|
|
9522
|
-
const [titleDraft, setTitleDraft] =
|
|
9669
|
+
const [renamingTitle, setRenamingTitle] = useState25(false);
|
|
9670
|
+
const [titleDraft, setTitleDraft] = useState25("");
|
|
9523
9671
|
const historyEntries = useHistoryStore((s) => s.entries);
|
|
9524
|
-
const [switcherOpen, setSwitcherOpen] =
|
|
9672
|
+
const [switcherOpen, setSwitcherOpen] = useState25(false);
|
|
9525
9673
|
const switcherRef = useRef14(null);
|
|
9526
|
-
|
|
9674
|
+
useEffect19(() => {
|
|
9527
9675
|
if (!switcherOpen) return;
|
|
9528
9676
|
const onClick = (e) => {
|
|
9529
9677
|
if (!switcherRef.current?.contains(e.target)) setSwitcherOpen(false);
|
|
@@ -9540,10 +9688,10 @@ function ChatView() {
|
|
|
9540
9688
|
}, [switcherOpen]);
|
|
9541
9689
|
const { provider, model } = useConfigStore();
|
|
9542
9690
|
const vlistRef = useRef14(null);
|
|
9543
|
-
const rows =
|
|
9691
|
+
const rows = useMemo7(() => buildChatRows(messages), [messages]);
|
|
9544
9692
|
const childCountRef = useRef14(0);
|
|
9545
9693
|
childCountRef.current = rows.length + 1;
|
|
9546
|
-
const rowIndexById =
|
|
9694
|
+
const rowIndexById = useMemo7(() => {
|
|
9547
9695
|
const map = /* @__PURE__ */ new Map();
|
|
9548
9696
|
rows.forEach((row, i) => {
|
|
9549
9697
|
if (row.kind === "user") map.set(row.message.id, i);
|
|
@@ -9563,19 +9711,19 @@ function ChatView() {
|
|
|
9563
9711
|
const ws = getWSClient();
|
|
9564
9712
|
ws?.send?.({ type: "autonomy.switch", payload: { mode } });
|
|
9565
9713
|
}, []);
|
|
9566
|
-
const [processOpen, setProcessOpen] =
|
|
9567
|
-
const [checkpointOpen, setCheckpointOpen] =
|
|
9568
|
-
const [breakdownOpen, setBreakdownOpen] =
|
|
9569
|
-
|
|
9714
|
+
const [processOpen, setProcessOpen] = useState25(false);
|
|
9715
|
+
const [checkpointOpen, setCheckpointOpen] = useState25(false);
|
|
9716
|
+
const [breakdownOpen, setBreakdownOpen] = useState25(false);
|
|
9717
|
+
useEffect19(() => {
|
|
9570
9718
|
const handler = () => setBreakdownOpen(true);
|
|
9571
9719
|
document.addEventListener("open:context-breakdown", handler);
|
|
9572
9720
|
return () => document.removeEventListener("open:context-breakdown", handler);
|
|
9573
9721
|
}, []);
|
|
9574
9722
|
const ctxPct = maxContext > 0 && lastInputTokens > 0 ? Math.round(lastInputTokens / maxContext * 100) : 0;
|
|
9575
9723
|
const ctxTone = ctxPct >= 85 ? "bg-red-500/15 text-red-600 dark:text-red-400" : ctxPct >= 70 ? "bg-amber-500/15 text-amber-600 dark:text-amber-400" : "bg-muted text-muted-foreground";
|
|
9576
|
-
const [pinnedToBottom, setPinnedToBottom] =
|
|
9577
|
-
const [unreadCount, setUnreadCount] =
|
|
9578
|
-
const [scrolledDeep, setScrolledDeep] =
|
|
9724
|
+
const [pinnedToBottom, setPinnedToBottom] = useState25(true);
|
|
9725
|
+
const [unreadCount, setUnreadCount] = useState25(0);
|
|
9726
|
+
const [scrolledDeep, setScrolledDeep] = useState25(false);
|
|
9579
9727
|
const lastSeenCount = useRef14(messages.length);
|
|
9580
9728
|
const handleScroll = useCallback10(() => {
|
|
9581
9729
|
const h = vlistRef.current;
|
|
@@ -9589,7 +9737,7 @@ function ChatView() {
|
|
|
9589
9737
|
}
|
|
9590
9738
|
setScrolledDeep(h.scrollOffset > h.viewportSize && h.scrollSize > h.viewportSize * 2.5);
|
|
9591
9739
|
}, []);
|
|
9592
|
-
|
|
9740
|
+
useEffect19(() => {
|
|
9593
9741
|
const h = vlistRef.current;
|
|
9594
9742
|
if (!h) return;
|
|
9595
9743
|
if (pinnedToBottom) {
|
|
@@ -9600,7 +9748,7 @@ function ChatView() {
|
|
|
9600
9748
|
if (delta > 0) setUnreadCount(delta);
|
|
9601
9749
|
}
|
|
9602
9750
|
}, [messages, pinnedToBottom]);
|
|
9603
|
-
|
|
9751
|
+
useEffect19(() => {
|
|
9604
9752
|
setPinnedToBottom(true);
|
|
9605
9753
|
setUnreadCount(0);
|
|
9606
9754
|
lastSeenCount.current = useChatStore.getState().messages.length;
|
|
@@ -9608,7 +9756,7 @@ function ChatView() {
|
|
|
9608
9756
|
vlistRef.current?.scrollToIndex(childCountRef.current - 1, { align: "end" });
|
|
9609
9757
|
});
|
|
9610
9758
|
}, [sessionId]);
|
|
9611
|
-
|
|
9759
|
+
useEffect19(() => {
|
|
9612
9760
|
if (!scrollTarget) return;
|
|
9613
9761
|
const idx = rowIndexById.get(scrollTarget.id);
|
|
9614
9762
|
if (idx === void 0) return;
|
|
@@ -9623,14 +9771,14 @@ function ChatView() {
|
|
|
9623
9771
|
const scrollToTop = useCallback10(() => {
|
|
9624
9772
|
vlistRef.current?.scrollToIndex(0, { align: "start", smooth: true });
|
|
9625
9773
|
}, []);
|
|
9626
|
-
const [runStartedAt, setRunStartedAt] =
|
|
9627
|
-
const [nowTick, setNowTick] =
|
|
9774
|
+
const [runStartedAt, setRunStartedAt] = useState25(null);
|
|
9775
|
+
const [nowTick, setNowTick] = useState25(() => Date.now());
|
|
9628
9776
|
const streamAnchor = useRef14(null);
|
|
9629
|
-
|
|
9777
|
+
useEffect19(() => {
|
|
9630
9778
|
if (isLoading && runStartedAt === null) setRunStartedAt(Date.now());
|
|
9631
9779
|
if (!isLoading && runStartedAt !== null) setRunStartedAt(null);
|
|
9632
9780
|
}, [isLoading, runStartedAt]);
|
|
9633
|
-
|
|
9781
|
+
useEffect19(() => {
|
|
9634
9782
|
if (!isLoading) return;
|
|
9635
9783
|
const t = setInterval(() => setNowTick(Date.now()), 500);
|
|
9636
9784
|
return () => clearInterval(t);
|
|
@@ -10062,7 +10210,7 @@ function ChatView() {
|
|
|
10062
10210
|
|
|
10063
10211
|
// src/components/CodeEditor.tsx
|
|
10064
10212
|
import { X as X8, Circle as Circle3 } from "lucide-react";
|
|
10065
|
-
import { useCallback as useCallback11, useEffect as
|
|
10213
|
+
import { useCallback as useCallback11, useEffect as useEffect20, useMemo as useMemo8, useRef as useRef15 } from "react";
|
|
10066
10214
|
import Editor, { loader } from "@monaco-editor/react";
|
|
10067
10215
|
import * as monaco2 from "monaco-editor";
|
|
10068
10216
|
|
|
@@ -10509,13 +10657,13 @@ function CodeEditor() {
|
|
|
10509
10657
|
const updateContent = useFileStore((s) => s.updateContent);
|
|
10510
10658
|
const { theme: appTheme } = useTheme();
|
|
10511
10659
|
const editorRef = useRef15(null);
|
|
10512
|
-
const activeFile =
|
|
10660
|
+
const activeFile = useMemo8(
|
|
10513
10661
|
() => openFiles.find((f) => f.path === activeFilePath) ?? null,
|
|
10514
10662
|
[openFiles, activeFilePath]
|
|
10515
10663
|
);
|
|
10516
10664
|
const language = activeFilePath ? getLanguage(activeFilePath) : "plaintext";
|
|
10517
10665
|
const monacoTheme = getMonacoTheme();
|
|
10518
|
-
|
|
10666
|
+
useEffect20(() => {
|
|
10519
10667
|
const resolved = getMonacoTheme();
|
|
10520
10668
|
monaco2.editor.setTheme(resolved);
|
|
10521
10669
|
}, [appTheme]);
|
|
@@ -10531,7 +10679,7 @@ function CodeEditor() {
|
|
|
10531
10679
|
},
|
|
10532
10680
|
[activeFilePath, updateContent]
|
|
10533
10681
|
);
|
|
10534
|
-
|
|
10682
|
+
useEffect20(() => {
|
|
10535
10683
|
const onKeyDown = (e) => {
|
|
10536
10684
|
const mod = e.ctrlKey || e.metaKey;
|
|
10537
10685
|
const tag = e.target?.tagName?.toLowerCase();
|
|
@@ -10597,7 +10745,7 @@ function CodeEditor() {
|
|
|
10597
10745
|
|
|
10598
10746
|
// src/components/ConfirmDialog.tsx
|
|
10599
10747
|
import { AlertTriangle as AlertTriangle3, FileEdit, Globe as Globe2, ShieldAlert, Terminal as Terminal5, Wrench as Wrench5 } from "lucide-react";
|
|
10600
|
-
import { useEffect as
|
|
10748
|
+
import { useEffect as useEffect21, useRef as useRef16 } from "react";
|
|
10601
10749
|
|
|
10602
10750
|
// src/components/ui/dialog.tsx
|
|
10603
10751
|
import * as DialogPrimitive from "@radix-ui/react-dialog";
|
|
@@ -10733,7 +10881,7 @@ function ConfirmDialog() {
|
|
|
10733
10881
|
}
|
|
10734
10882
|
hideConfirm();
|
|
10735
10883
|
};
|
|
10736
|
-
|
|
10884
|
+
useEffect21(() => {
|
|
10737
10885
|
if (!showConfirmDialog) return;
|
|
10738
10886
|
const onKey = (e) => {
|
|
10739
10887
|
const target = e.target;
|
|
@@ -10857,7 +11005,7 @@ function ConfirmDialog() {
|
|
|
10857
11005
|
}
|
|
10858
11006
|
|
|
10859
11007
|
// src/components/ConfirmModal.tsx
|
|
10860
|
-
import { useEffect as
|
|
11008
|
+
import { useEffect as useEffect22 } from "react";
|
|
10861
11009
|
import { create as create15 } from "zustand";
|
|
10862
11010
|
import { jsx as jsx39, jsxs as jsxs37 } from "react/jsx-runtime";
|
|
10863
11011
|
var useConfirmModalStore = create15()((set, get) => ({
|
|
@@ -10879,7 +11027,7 @@ function confirmModal(options) {
|
|
|
10879
11027
|
function ConfirmModalHost() {
|
|
10880
11028
|
const request = useConfirmModalStore((s) => s.request);
|
|
10881
11029
|
const settle = useConfirmModalStore((s) => s.settle);
|
|
10882
|
-
|
|
11030
|
+
useEffect22(() => {
|
|
10883
11031
|
if (!request) return;
|
|
10884
11032
|
const onKey = (e) => {
|
|
10885
11033
|
if (e.key === "Enter") {
|
|
@@ -10922,19 +11070,19 @@ function ConfirmModalHost() {
|
|
|
10922
11070
|
|
|
10923
11071
|
// src/components/ConnectionBanner.tsx
|
|
10924
11072
|
import { Loader2 as Loader23, RotateCcw as RotateCcw4, WifiOff, X as X10 } from "lucide-react";
|
|
10925
|
-
import { useEffect as
|
|
11073
|
+
import { useEffect as useEffect23, useState as useState26 } from "react";
|
|
10926
11074
|
import { jsx as jsx40, jsxs as jsxs38 } from "react/jsx-runtime";
|
|
10927
11075
|
function ConnectionBanner() {
|
|
10928
11076
|
const wsStatus = useConfigStore((s) => s.wsStatus);
|
|
10929
11077
|
const wsUrl = useConfigStore((s) => s.wsUrl);
|
|
10930
|
-
const [dismissed, setDismissed] =
|
|
10931
|
-
const [now, setNow] =
|
|
10932
|
-
|
|
11078
|
+
const [dismissed, setDismissed] = useState26(false);
|
|
11079
|
+
const [now, setNow] = useState26(Date.now());
|
|
11080
|
+
useEffect23(() => {
|
|
10933
11081
|
if (wsStatus.state !== "reconnecting") return;
|
|
10934
11082
|
const id = setInterval(() => setNow(Date.now()), 500);
|
|
10935
11083
|
return () => clearInterval(id);
|
|
10936
11084
|
}, [wsStatus.state]);
|
|
10937
|
-
|
|
11085
|
+
useEffect23(() => {
|
|
10938
11086
|
if (wsStatus.state === "open") setDismissed(false);
|
|
10939
11087
|
}, [wsStatus.state]);
|
|
10940
11088
|
if (wsStatus.state === "open" || wsStatus.state === "connecting") return null;
|
|
@@ -11026,7 +11174,7 @@ var ErrorBoundary = class extends Component {
|
|
|
11026
11174
|
|
|
11027
11175
|
// src/components/QuickModelSwitcher.tsx
|
|
11028
11176
|
import { ArrowRight as ArrowRight4, Cpu as Cpu6, Search as Search4 } from "lucide-react";
|
|
11029
|
-
import { useEffect as
|
|
11177
|
+
import { useEffect as useEffect24, useMemo as useMemo9, useRef as useRef17, useState as useState27 } from "react";
|
|
11030
11178
|
|
|
11031
11179
|
// src/components/QuickModelSwitcher.filter.ts
|
|
11032
11180
|
function buildModelCandidates(saved, modelsByProvider, query, currentProvider, currentModel) {
|
|
@@ -11058,17 +11206,17 @@ import { jsx as jsx42, jsxs as jsxs40 } from "react/jsx-runtime";
|
|
|
11058
11206
|
function QuickModelSwitcher() {
|
|
11059
11207
|
const open = useUIStore((s) => s.modelSwitcherOpen);
|
|
11060
11208
|
const setOpen = useUIStore((s) => s.setModelSwitcherOpen);
|
|
11061
|
-
const [query, setQuery] =
|
|
11062
|
-
const [selected, setSelected] =
|
|
11063
|
-
const [saved, setSaved] =
|
|
11064
|
-
const [modelsByProvider, setModelsByProvider] =
|
|
11209
|
+
const [query, setQuery] = useState27("");
|
|
11210
|
+
const [selected, setSelected] = useState27(0);
|
|
11211
|
+
const [saved, setSaved] = useState27([]);
|
|
11212
|
+
const [modelsByProvider, setModelsByProvider] = useState27({});
|
|
11065
11213
|
const inputRef = useRef17(null);
|
|
11066
11214
|
const wsUrl = useConfigStore((s) => s.wsUrl);
|
|
11067
11215
|
const currentProvider = useConfigStore((s) => s.provider);
|
|
11068
11216
|
const currentModel = useConfigStore((s) => s.model);
|
|
11069
11217
|
const paletteOpen = useUIStore((s) => s.paletteOpen);
|
|
11070
11218
|
const { listSavedProviders, listProviderModels, switchModel } = useWebSocket();
|
|
11071
|
-
|
|
11219
|
+
useEffect24(() => {
|
|
11072
11220
|
const onKey = (e) => {
|
|
11073
11221
|
const mod = e.ctrlKey || e.metaKey;
|
|
11074
11222
|
if (mod && e.key.toLowerCase() === "m" && !e.shiftKey && !e.altKey) {
|
|
@@ -11085,7 +11233,7 @@ function QuickModelSwitcher() {
|
|
|
11085
11233
|
window.addEventListener("keydown", onKey);
|
|
11086
11234
|
return () => window.removeEventListener("keydown", onKey);
|
|
11087
11235
|
}, [open, paletteOpen]);
|
|
11088
|
-
|
|
11236
|
+
useEffect24(() => {
|
|
11089
11237
|
const client2 = getWSClient(wsUrl);
|
|
11090
11238
|
const offSaved = client2.on("providers.saved", (msg) => {
|
|
11091
11239
|
const p = msg.payload;
|
|
@@ -11100,14 +11248,14 @@ function QuickModelSwitcher() {
|
|
|
11100
11248
|
offModels();
|
|
11101
11249
|
};
|
|
11102
11250
|
}, [wsUrl]);
|
|
11103
|
-
|
|
11251
|
+
useEffect24(() => {
|
|
11104
11252
|
if (!open) return;
|
|
11105
11253
|
setQuery("");
|
|
11106
11254
|
setSelected(0);
|
|
11107
11255
|
listSavedProviders();
|
|
11108
11256
|
requestAnimationFrame(() => inputRef.current?.focus());
|
|
11109
11257
|
}, [open, listSavedProviders]);
|
|
11110
|
-
|
|
11258
|
+
useEffect24(() => {
|
|
11111
11259
|
if (!open) return;
|
|
11112
11260
|
for (const sp of saved) {
|
|
11113
11261
|
if (!modelsByProvider[sp.id]) {
|
|
@@ -11115,7 +11263,7 @@ function QuickModelSwitcher() {
|
|
|
11115
11263
|
}
|
|
11116
11264
|
}
|
|
11117
11265
|
}, [open, saved, modelsByProvider, listProviderModels]);
|
|
11118
|
-
const candidates =
|
|
11266
|
+
const candidates = useMemo9(
|
|
11119
11267
|
() => buildModelCandidates(
|
|
11120
11268
|
saved,
|
|
11121
11269
|
modelsByProvider,
|
|
@@ -11125,7 +11273,7 @@ function QuickModelSwitcher() {
|
|
|
11125
11273
|
),
|
|
11126
11274
|
[saved, modelsByProvider, query, currentProvider, currentModel]
|
|
11127
11275
|
);
|
|
11128
|
-
|
|
11276
|
+
useEffect24(() => {
|
|
11129
11277
|
if (selected >= candidates.length) setSelected(0);
|
|
11130
11278
|
}, [candidates.length, selected]);
|
|
11131
11279
|
const commit = (idx) => {
|
|
@@ -11238,7 +11386,7 @@ import {
|
|
|
11238
11386
|
X as X11,
|
|
11239
11387
|
Zap as Zap6
|
|
11240
11388
|
} from "lucide-react";
|
|
11241
|
-
import { useState as
|
|
11389
|
+
import { useState as useState29, useEffect as useEffect25, useCallback as useCallback13 } from "react";
|
|
11242
11390
|
|
|
11243
11391
|
// src/components/ui/input.tsx
|
|
11244
11392
|
import * as React3 from "react";
|
|
@@ -11467,7 +11615,7 @@ import {
|
|
|
11467
11615
|
Plus,
|
|
11468
11616
|
Trash2 as Trash22
|
|
11469
11617
|
} from "lucide-react";
|
|
11470
|
-
import { useState as
|
|
11618
|
+
import { useState as useState28, useCallback as useCallback12 } from "react";
|
|
11471
11619
|
import { Fragment as Fragment10, jsx as jsx48, jsxs as jsxs44 } from "react/jsx-runtime";
|
|
11472
11620
|
var PROVIDER_FAMILIES = ["anthropic", "openai", "google", "openai-compatible"];
|
|
11473
11621
|
function ProviderSection({
|
|
@@ -11487,15 +11635,15 @@ function ProviderSection({
|
|
|
11487
11635
|
catalogQuery,
|
|
11488
11636
|
setCatalogQuery
|
|
11489
11637
|
}) {
|
|
11490
|
-
const [showAddKeyForm, setShowAddKeyForm] =
|
|
11491
|
-
const [newKeyLabel, setNewKeyLabel] =
|
|
11492
|
-
const [newKeyValue, setNewKeyValue] =
|
|
11493
|
-
const [showNewKeyValue, setShowNewKeyValue] =
|
|
11494
|
-
const [showAddProviderForm, setShowAddProviderForm] =
|
|
11495
|
-
const [newProviderId, setNewProviderId] =
|
|
11496
|
-
const [newProviderFamily, setNewProviderFamily] =
|
|
11497
|
-
const [newProviderBaseUrl, setNewProviderBaseUrl] =
|
|
11498
|
-
const [newProviderApiKey, setNewProviderApiKey] =
|
|
11638
|
+
const [showAddKeyForm, setShowAddKeyForm] = useState28(null);
|
|
11639
|
+
const [newKeyLabel, setNewKeyLabel] = useState28("");
|
|
11640
|
+
const [newKeyValue, setNewKeyValue] = useState28("");
|
|
11641
|
+
const [showNewKeyValue, setShowNewKeyValue] = useState28(false);
|
|
11642
|
+
const [showAddProviderForm, setShowAddProviderForm] = useState28(false);
|
|
11643
|
+
const [newProviderId, setNewProviderId] = useState28("");
|
|
11644
|
+
const [newProviderFamily, setNewProviderFamily] = useState28("openai-compatible");
|
|
11645
|
+
const [newProviderBaseUrl, setNewProviderBaseUrl] = useState28("");
|
|
11646
|
+
const [newProviderApiKey, setNewProviderApiKey] = useState28("");
|
|
11499
11647
|
const handleAddKey = useCallback12(
|
|
11500
11648
|
(providerId) => {
|
|
11501
11649
|
if (!newKeyLabel.trim() || !newKeyValue.trim()) return;
|
|
@@ -11879,16 +12027,16 @@ function SettingsPanel() {
|
|
|
11879
12027
|
},
|
|
11880
12028
|
[localPrefs, updatePrefs]
|
|
11881
12029
|
);
|
|
11882
|
-
const [catalogProviders, setCatalogProviders] =
|
|
11883
|
-
const [catalogModels, setCatalogModels] =
|
|
11884
|
-
const [savedProviders, setSavedProviders] =
|
|
11885
|
-
const [isLoadingCatalog, setIsLoadingCatalog] =
|
|
11886
|
-
const [isLoadingModels, setIsLoadingModels] =
|
|
11887
|
-
const [isLoadingSaved, setIsLoadingSaved] =
|
|
11888
|
-
const [providerTab, setProviderTab] =
|
|
11889
|
-
const [catalogQuery, setCatalogQuery] =
|
|
12030
|
+
const [catalogProviders, setCatalogProviders] = useState29([]);
|
|
12031
|
+
const [catalogModels, setCatalogModels] = useState29({});
|
|
12032
|
+
const [savedProviders, setSavedProviders] = useState29([]);
|
|
12033
|
+
const [isLoadingCatalog, setIsLoadingCatalog] = useState29(false);
|
|
12034
|
+
const [isLoadingModels, setIsLoadingModels] = useState29(false);
|
|
12035
|
+
const [isLoadingSaved, setIsLoadingSaved] = useState29(false);
|
|
12036
|
+
const [providerTab, setProviderTab] = useState29("catalog");
|
|
12037
|
+
const [catalogQuery, setCatalogQuery] = useState29("");
|
|
11890
12038
|
const currentCatalogProvider = catalogProviders.find((p) => p.id === provider);
|
|
11891
|
-
|
|
12039
|
+
useEffect25(() => {
|
|
11892
12040
|
const handleProviderCatalog = (msg) => {
|
|
11893
12041
|
if (msg.type === "provider.catalog") {
|
|
11894
12042
|
const payload = msg.payload;
|
|
@@ -12447,7 +12595,7 @@ import {
|
|
|
12447
12595
|
Network as Network2,
|
|
12448
12596
|
Zap as Zap7
|
|
12449
12597
|
} from "lucide-react";
|
|
12450
|
-
import { useCallback as useCallback14, useEffect as
|
|
12598
|
+
import { useCallback as useCallback14, useEffect as useEffect26, useState as useState30 } from "react";
|
|
12451
12599
|
import { jsx as jsx51, jsxs as jsxs47 } from "react/jsx-runtime";
|
|
12452
12600
|
function ProviderCard({
|
|
12453
12601
|
provider,
|
|
@@ -12532,9 +12680,9 @@ function ApiKeyInput({
|
|
|
12532
12680
|
providerId,
|
|
12533
12681
|
onSave
|
|
12534
12682
|
}) {
|
|
12535
|
-
const [key, setKey] =
|
|
12536
|
-
const [label, setLabel] =
|
|
12537
|
-
const [isLoading, setIsLoading] =
|
|
12683
|
+
const [key, setKey] = useState30("");
|
|
12684
|
+
const [label, setLabel] = useState30("default");
|
|
12685
|
+
const [isLoading, setIsLoading] = useState30(false);
|
|
12538
12686
|
const handleSave = async () => {
|
|
12539
12687
|
if (!key.trim()) return;
|
|
12540
12688
|
setIsLoading(true);
|
|
@@ -12588,15 +12736,15 @@ function SetupScreen() {
|
|
|
12588
12736
|
const { setCurrentView } = useUIStore();
|
|
12589
12737
|
const { provider, model, setProvider, setModel, wsConnected, wsUrl } = useConfigStore();
|
|
12590
12738
|
const ws = useWebSocket();
|
|
12591
|
-
const [step, setStep] =
|
|
12592
|
-
const [catalogProviders, setCatalogProviders] =
|
|
12593
|
-
const [catalogModels, setCatalogModels] =
|
|
12594
|
-
const [savedProviders, setSavedProviders] =
|
|
12595
|
-
const [isLoadingCatalog, setIsLoadingCatalog] =
|
|
12596
|
-
const [isLoadingModels, setIsLoadingModels] =
|
|
12597
|
-
const [selectedProvider, setSelectedProvider] =
|
|
12598
|
-
const [selectedModel, setSelectedModel] =
|
|
12599
|
-
|
|
12739
|
+
const [step, setStep] = useState30("provider");
|
|
12740
|
+
const [catalogProviders, setCatalogProviders] = useState30([]);
|
|
12741
|
+
const [catalogModels, setCatalogModels] = useState30({});
|
|
12742
|
+
const [savedProviders, setSavedProviders] = useState30([]);
|
|
12743
|
+
const [isLoadingCatalog, setIsLoadingCatalog] = useState30(false);
|
|
12744
|
+
const [isLoadingModels, setIsLoadingModels] = useState30(false);
|
|
12745
|
+
const [selectedProvider, setSelectedProvider] = useState30(null);
|
|
12746
|
+
const [selectedModel, setSelectedModel] = useState30(null);
|
|
12747
|
+
useEffect26(() => {
|
|
12600
12748
|
if (!wsConnected) return;
|
|
12601
12749
|
const wsClient = getWSClient(wsUrl);
|
|
12602
12750
|
const off1 = wsClient.on("provider.catalog", (msg) => {
|
|
@@ -12638,7 +12786,7 @@ function SetupScreen() {
|
|
|
12638
12786
|
off3?.();
|
|
12639
12787
|
};
|
|
12640
12788
|
}, [wsConnected, wsUrl, provider, model]);
|
|
12641
|
-
|
|
12789
|
+
useEffect26(() => {
|
|
12642
12790
|
if (!selectedProvider || !wsConnected) return;
|
|
12643
12791
|
const wsClient = getWSClient(wsUrl);
|
|
12644
12792
|
if (!catalogModels[selectedProvider]) {
|
|
@@ -12844,7 +12992,7 @@ function SetupScreen() {
|
|
|
12844
12992
|
|
|
12845
12993
|
// src/components/SessionsDashboard.tsx
|
|
12846
12994
|
import { Clock as Clock9, Cpu as Cpu10, FolderGit2, Wifi, WifiOff as WifiOff2, Loader2 as Loader27 } from "lucide-react";
|
|
12847
|
-
import { useCallback as useCallback15, useEffect as
|
|
12995
|
+
import { useCallback as useCallback15, useEffect as useEffect27, useState as useState31 } from "react";
|
|
12848
12996
|
import { jsx as jsx52, jsxs as jsxs48 } from "react/jsx-runtime";
|
|
12849
12997
|
function agentIcon(status) {
|
|
12850
12998
|
switch (status) {
|
|
@@ -12907,9 +13055,9 @@ function fmtTimeAgo(iso) {
|
|
|
12907
13055
|
return `${Math.floor(min / 60)}h ago`;
|
|
12908
13056
|
}
|
|
12909
13057
|
function SessionsDashboard() {
|
|
12910
|
-
const [sessions, setSessions] =
|
|
12911
|
-
const [loading, setLoading] =
|
|
12912
|
-
const [error, setError] =
|
|
13058
|
+
const [sessions, setSessions] = useState31([]);
|
|
13059
|
+
const [loading, setLoading] = useState31(true);
|
|
13060
|
+
const [error, setError] = useState31(null);
|
|
12913
13061
|
const fetchSessions = useCallback15(async () => {
|
|
12914
13062
|
try {
|
|
12915
13063
|
const res = await fetch("/api/sessions");
|
|
@@ -12930,7 +13078,7 @@ function SessionsDashboard() {
|
|
|
12930
13078
|
setLoading(false);
|
|
12931
13079
|
}
|
|
12932
13080
|
}, []);
|
|
12933
|
-
|
|
13081
|
+
useEffect27(() => {
|
|
12934
13082
|
void fetchSessions();
|
|
12935
13083
|
const t = setInterval(fetchSessions, 5e3);
|
|
12936
13084
|
return () => clearInterval(t);
|
|
@@ -13023,7 +13171,7 @@ function SessionsDashboard() {
|
|
|
13023
13171
|
|
|
13024
13172
|
// src/components/ShortcutsOverlay.tsx
|
|
13025
13173
|
import { Keyboard as Keyboard3, X as X12 } from "lucide-react";
|
|
13026
|
-
import { useEffect as
|
|
13174
|
+
import { useEffect as useEffect28 } from "react";
|
|
13027
13175
|
import { jsx as jsx53, jsxs as jsxs49 } from "react/jsx-runtime";
|
|
13028
13176
|
var SHORTCUTS = [
|
|
13029
13177
|
{
|
|
@@ -13085,7 +13233,7 @@ var SHORTCUTS = [
|
|
|
13085
13233
|
function ShortcutsOverlay() {
|
|
13086
13234
|
const open = useUIStore((s) => s.shortcutsOpen);
|
|
13087
13235
|
const setOpen = useUIStore((s) => s.setShortcutsOpen);
|
|
13088
|
-
|
|
13236
|
+
useEffect28(() => {
|
|
13089
13237
|
const onKey = (e) => {
|
|
13090
13238
|
const target = e.target;
|
|
13091
13239
|
const tag = target?.tagName?.toLowerCase();
|
|
@@ -13179,7 +13327,7 @@ import {
|
|
|
13179
13327
|
ReactFlowProvider
|
|
13180
13328
|
} from "@xyflow/react";
|
|
13181
13329
|
import "@xyflow/react/dist/style.css";
|
|
13182
|
-
import { useCallback as useCallback16, useEffect as
|
|
13330
|
+
import { useCallback as useCallback16, useEffect as useEffect29, useState as useState32 } from "react";
|
|
13183
13331
|
import {
|
|
13184
13332
|
Bot as Bot8,
|
|
13185
13333
|
Cpu as Cpu11,
|
|
@@ -13525,8 +13673,8 @@ function AgentFlowCanvas({ containerRef }) {
|
|
|
13525
13673
|
const counters = useVizStore((s) => s.counters);
|
|
13526
13674
|
const [nodes, setNodes, onNodesChange] = useNodesState([]);
|
|
13527
13675
|
const [edges, setEdges, onEdgesChange] = useEdgesState([]);
|
|
13528
|
-
const [selectedNode, setSelectedNode] =
|
|
13529
|
-
|
|
13676
|
+
const [selectedNode, setSelectedNode] = useState32(null);
|
|
13677
|
+
useEffect29(() => {
|
|
13530
13678
|
const rfNodes = [];
|
|
13531
13679
|
const rfEdges = [];
|
|
13532
13680
|
rfNodes.push({
|
|
@@ -13700,7 +13848,7 @@ function AgentFlowCanvas({ containerRef }) {
|
|
|
13700
13848
|
setEdges(rfEdges);
|
|
13701
13849
|
setTimeout(() => fitView({ padding: 0.2, duration: 300 }), 50);
|
|
13702
13850
|
}, [session, projectName, iteration, fleetAgents, cost, lastInputTokens, maxContext, setNodes, setEdges, fitView]);
|
|
13703
|
-
|
|
13851
|
+
useEffect29(() => {
|
|
13704
13852
|
if (vizEvents.length === 0) return;
|
|
13705
13853
|
const latestEvent = vizEvents[0];
|
|
13706
13854
|
if (!latestEvent) return;
|
|
@@ -13906,7 +14054,7 @@ function AgentFlowCanvasWithProvider(props) {
|
|
|
13906
14054
|
|
|
13907
14055
|
// src/components/SidePanel/index.tsx
|
|
13908
14056
|
import { PanelLeftClose } from "lucide-react";
|
|
13909
|
-
import { useEffect as
|
|
14057
|
+
import { useEffect as useEffect36 } from "react";
|
|
13910
14058
|
|
|
13911
14059
|
// src/components/FileExplorer.tsx
|
|
13912
14060
|
import {
|
|
@@ -13927,7 +14075,7 @@ import {
|
|
|
13927
14075
|
Loader2 as Loader28,
|
|
13928
14076
|
Minimize2
|
|
13929
14077
|
} from "lucide-react";
|
|
13930
|
-
import { useCallback as useCallback17, useEffect as
|
|
14078
|
+
import { useCallback as useCallback17, useEffect as useEffect30, useMemo as useMemo11, useRef as useRef19, useState as useState33 } from "react";
|
|
13931
14079
|
import { jsx as jsx56, jsxs as jsxs51 } from "react/jsx-runtime";
|
|
13932
14080
|
var EXT_ICONS = {
|
|
13933
14081
|
// ── Code ──
|
|
@@ -14048,10 +14196,10 @@ function TreeNodeItem({
|
|
|
14048
14196
|
onSelect,
|
|
14049
14197
|
onOpen
|
|
14050
14198
|
}) {
|
|
14051
|
-
const [expanded, setExpanded] =
|
|
14199
|
+
const [expanded, setExpanded] = useState33(depth < 1);
|
|
14052
14200
|
const activeFilePath = useFileStore((s) => s.activeFilePath);
|
|
14053
14201
|
const isActive = node.type === "file" && node.path === activeFilePath;
|
|
14054
|
-
|
|
14202
|
+
useEffect30(() => {
|
|
14055
14203
|
if (forceExpand !== null) setExpanded(forceExpand);
|
|
14056
14204
|
}, [forceExpand]);
|
|
14057
14205
|
if (node.type === "directory") {
|
|
@@ -14153,7 +14301,7 @@ function FileExplorer() {
|
|
|
14153
14301
|
const segments = cwd.replace(/\\/g, "/").split("/").filter(Boolean);
|
|
14154
14302
|
return (segments[segments.length - 1] ?? "") === projectName;
|
|
14155
14303
|
})();
|
|
14156
|
-
const breadcrumbs =
|
|
14304
|
+
const breadcrumbs = useMemo11(() => {
|
|
14157
14305
|
if (!cwd || !projectName) return [];
|
|
14158
14306
|
const norm = cwd.replace(/\\/g, "/");
|
|
14159
14307
|
const segments = norm.split("/").filter(Boolean);
|
|
@@ -14180,7 +14328,7 @@ function FileExplorer() {
|
|
|
14180
14328
|
}));
|
|
14181
14329
|
}, [cwd, projectName]);
|
|
14182
14330
|
const bcRef = useRef19(null);
|
|
14183
|
-
|
|
14331
|
+
useEffect30(() => {
|
|
14184
14332
|
const el = bcRef.current;
|
|
14185
14333
|
if (el && breadcrumbs.length > 1) {
|
|
14186
14334
|
el.scrollLeft = el.scrollWidth;
|
|
@@ -14189,8 +14337,8 @@ function FileExplorer() {
|
|
|
14189
14337
|
const handleBreadcrumbClick = useCallback17((crumbPath) => {
|
|
14190
14338
|
getWSClient().send({ type: "working_dir.set", payload: { path: crumbPath } });
|
|
14191
14339
|
}, []);
|
|
14192
|
-
const [contextMenu, setContextMenu] =
|
|
14193
|
-
|
|
14340
|
+
const [contextMenu, setContextMenu] = useState33(null);
|
|
14341
|
+
useEffect30(() => {
|
|
14194
14342
|
if (!contextMenu) return;
|
|
14195
14343
|
const close = () => setContextMenu(null);
|
|
14196
14344
|
const onKey = (e) => {
|
|
@@ -14231,9 +14379,9 @@ function FileExplorer() {
|
|
|
14231
14379
|
const parent = norm.split("/").slice(0, -1).join("/") || norm;
|
|
14232
14380
|
getWSClient().send({ type: "working_dir.set", payload: { path: parent } });
|
|
14233
14381
|
}, [cwd]);
|
|
14234
|
-
const [showSpinner, setShowSpinner] =
|
|
14382
|
+
const [showSpinner, setShowSpinner] = useState33(false);
|
|
14235
14383
|
const spinnerTimer = useRef19(null);
|
|
14236
|
-
|
|
14384
|
+
useEffect30(() => {
|
|
14237
14385
|
if (treeLoading) {
|
|
14238
14386
|
spinnerTimer.current = setTimeout(() => setShowSpinner(true), 150);
|
|
14239
14387
|
} else {
|
|
@@ -14244,9 +14392,9 @@ function FileExplorer() {
|
|
|
14244
14392
|
if (spinnerTimer.current) clearTimeout(spinnerTimer.current);
|
|
14245
14393
|
};
|
|
14246
14394
|
}, [treeLoading]);
|
|
14247
|
-
const [selectedPath, setSelectedPath] =
|
|
14248
|
-
const [globalExpand, setGlobalExpand] =
|
|
14249
|
-
const dirCount =
|
|
14395
|
+
const [selectedPath, setSelectedPath] = useState33(null);
|
|
14396
|
+
const [globalExpand, setGlobalExpand] = useState33(null);
|
|
14397
|
+
const dirCount = useMemo11(() => {
|
|
14250
14398
|
let count = 0;
|
|
14251
14399
|
const walk = (nodes) => {
|
|
14252
14400
|
for (const n of nodes) {
|
|
@@ -14257,7 +14405,7 @@ function FileExplorer() {
|
|
|
14257
14405
|
walk(tree);
|
|
14258
14406
|
return count;
|
|
14259
14407
|
}, [tree]);
|
|
14260
|
-
const cwdStats =
|
|
14408
|
+
const cwdStats = useMemo11(() => {
|
|
14261
14409
|
let files = 0;
|
|
14262
14410
|
let dirs = 0;
|
|
14263
14411
|
for (const n of tree) {
|
|
@@ -14298,7 +14446,7 @@ function FileExplorer() {
|
|
|
14298
14446
|
);
|
|
14299
14447
|
setSelectedPath(null);
|
|
14300
14448
|
}, []);
|
|
14301
|
-
|
|
14449
|
+
useEffect30(() => {
|
|
14302
14450
|
if (activeFilePath) setSelectedPath(null);
|
|
14303
14451
|
}, [activeFilePath]);
|
|
14304
14452
|
if (showSpinner) {
|
|
@@ -14512,7 +14660,7 @@ import {
|
|
|
14512
14660
|
UserCheck,
|
|
14513
14661
|
Trash2 as Trash23
|
|
14514
14662
|
} from "lucide-react";
|
|
14515
|
-
import { useEffect as
|
|
14663
|
+
import { useEffect as useEffect31, useState as useState34 } from "react";
|
|
14516
14664
|
import { jsx as jsx57, jsxs as jsxs52 } from "react/jsx-runtime";
|
|
14517
14665
|
var TYPE_ICONS = {
|
|
14518
14666
|
note: FileText5,
|
|
@@ -14536,12 +14684,12 @@ function fmtTime(iso) {
|
|
|
14536
14684
|
function MailboxPanel({ className }) {
|
|
14537
14685
|
const messages = useMailboxStore((s) => s.messages);
|
|
14538
14686
|
const agents = useMailboxStore((s) => s.agents);
|
|
14539
|
-
const [collapsed, setCollapsed] =
|
|
14540
|
-
const [deleting, setDeleting] =
|
|
14687
|
+
const [collapsed, setCollapsed] = useState34(false);
|
|
14688
|
+
const [deleting, setDeleting] = useState34(false);
|
|
14541
14689
|
const { client: client2 } = useWebSocket();
|
|
14542
|
-
const [ready, setReady] =
|
|
14543
|
-
|
|
14544
|
-
|
|
14690
|
+
const [ready, setReady] = useState34(client2.status.state === "open");
|
|
14691
|
+
useEffect31(() => client2.onStatus((s) => setReady(s.state === "open")), [client2]);
|
|
14692
|
+
useEffect31(() => {
|
|
14545
14693
|
if (!ready) return;
|
|
14546
14694
|
client2.send({ type: "mailbox.messages", payload: { limit: 30 } });
|
|
14547
14695
|
client2.send({ type: "mailbox.agents", payload: {} });
|
|
@@ -14560,7 +14708,7 @@ function MailboxPanel({ className }) {
|
|
|
14560
14708
|
setDeleting(true);
|
|
14561
14709
|
client2.send({ type: "mailbox.clear" });
|
|
14562
14710
|
}
|
|
14563
|
-
|
|
14711
|
+
useEffect31(() => {
|
|
14564
14712
|
if (deleting && messages.length === 0) setDeleting(false);
|
|
14565
14713
|
}, [deleting, messages.length]);
|
|
14566
14714
|
return /* @__PURE__ */ jsxs52("div", { className: cn("rounded-lg border border-border bg-card/60 backdrop-blur-sm", className), children: [
|
|
@@ -14669,22 +14817,22 @@ function MailboxPanel({ className }) {
|
|
|
14669
14817
|
|
|
14670
14818
|
// src/components/ProjectsPanel.tsx
|
|
14671
14819
|
import { ExternalLink, Folder as Folder3, FolderPlus, History as History3, Loader2 as Loader29 } from "lucide-react";
|
|
14672
|
-
import { useCallback as useCallback18, useEffect as
|
|
14820
|
+
import { useCallback as useCallback18, useEffect as useEffect32, useRef as useRef20, useState as useState35 } from "react";
|
|
14673
14821
|
import { jsx as jsx58, jsxs as jsxs53 } from "react/jsx-runtime";
|
|
14674
14822
|
function ProjectsPanel({ fullView }) {
|
|
14675
|
-
const [projects, setProjects] =
|
|
14676
|
-
const [loading, setLoading] =
|
|
14677
|
-
const [adding, setAdding] =
|
|
14678
|
-
const [folderPath, setFolderPath] =
|
|
14679
|
-
const [projectName, setProjectName] =
|
|
14680
|
-
const [dialogOpen, setDialogOpen] =
|
|
14823
|
+
const [projects, setProjects] = useState35([]);
|
|
14824
|
+
const [loading, setLoading] = useState35(true);
|
|
14825
|
+
const [adding, setAdding] = useState35(false);
|
|
14826
|
+
const [folderPath, setFolderPath] = useState35("");
|
|
14827
|
+
const [projectName, setProjectName] = useState35("");
|
|
14828
|
+
const [dialogOpen, setDialogOpen] = useState35(false);
|
|
14681
14829
|
const projectNameRef = useRef20(null);
|
|
14682
|
-
const [confirmSwitch, setConfirmSwitch] =
|
|
14830
|
+
const [confirmSwitch, setConfirmSwitch] = useState35({ open: false, project: null, agentCount: 0 });
|
|
14683
14831
|
const fetchProjects = useCallback18(() => {
|
|
14684
14832
|
const ws = getWSClient();
|
|
14685
14833
|
ws.send({ type: "projects.list" });
|
|
14686
14834
|
}, []);
|
|
14687
|
-
|
|
14835
|
+
useEffect32(() => {
|
|
14688
14836
|
setLoading(true);
|
|
14689
14837
|
const ws = getWSClient();
|
|
14690
14838
|
const offList = ws.on("projects.list", (msg) => {
|
|
@@ -14958,11 +15106,11 @@ function ProjectsPanel({ fullView }) {
|
|
|
14958
15106
|
|
|
14959
15107
|
// src/components/SidePanel/AgentsPanel.tsx
|
|
14960
15108
|
import { Bot as Bot10, LayoutGrid as LayoutGrid2, Wrench as Wrench8 } from "lucide-react";
|
|
14961
|
-
import { useMemo as
|
|
15109
|
+
import { useMemo as useMemo13, useState as useState37 } from "react";
|
|
14962
15110
|
|
|
14963
15111
|
// src/components/FleetPanel.tsx
|
|
14964
15112
|
import { Bot as Bot9, Check as Check7, ChevronDown as ChevronDown9, ChevronRight as ChevronRight8, Clock as Clock11, Copy as Copy4, Cpu as Cpu12, Crown, Wrench as Wrench7, X as X14, Zap as Zap9 } from "lucide-react";
|
|
14965
|
-
import { useCallback as useCallback19, useMemo as
|
|
15113
|
+
import { useCallback as useCallback19, useMemo as useMemo12, useState as useState36 } from "react";
|
|
14966
15114
|
|
|
14967
15115
|
// src/components/ui/sparkline.tsx
|
|
14968
15116
|
import { jsx as jsx59 } from "react/jsx-runtime";
|
|
@@ -15038,7 +15186,7 @@ function AgentDetail({
|
|
|
15038
15186
|
const active = agent.status === "running";
|
|
15039
15187
|
const tool = agent.currentTool ?? agent.lastTool;
|
|
15040
15188
|
const elapsed = Date.now() - agent.startedAt;
|
|
15041
|
-
const [copied, setCopied] =
|
|
15189
|
+
const [copied, setCopied] = useState36(false);
|
|
15042
15190
|
const leaderId = useFleetStore((s) => s.leaderId);
|
|
15043
15191
|
const isLeader = agent.id === leaderId;
|
|
15044
15192
|
const handleCopy = useCallback19(async (text) => {
|
|
@@ -15339,9 +15487,9 @@ function FleetPanel({
|
|
|
15339
15487
|
className
|
|
15340
15488
|
}) {
|
|
15341
15489
|
const agents = useFleetStore((s) => s.agents);
|
|
15342
|
-
const [collapsed, setCollapsed] =
|
|
15343
|
-
const [selectedId, setSelectedId] =
|
|
15344
|
-
const list =
|
|
15490
|
+
const [collapsed, setCollapsed] = useState36(true);
|
|
15491
|
+
const [selectedId, setSelectedId] = useState36(null);
|
|
15492
|
+
const list = useMemo12(() => {
|
|
15345
15493
|
const arr = Array.from(agents.values());
|
|
15346
15494
|
arr.sort((x, y) => {
|
|
15347
15495
|
const xa = x.status === "running" ? 0 : 1;
|
|
@@ -15454,8 +15602,8 @@ function AgentRow2({ agent, onClick }) {
|
|
|
15454
15602
|
function AgentsPanel() {
|
|
15455
15603
|
const fleetAgents = useFleetStore((s) => s.agents);
|
|
15456
15604
|
const setCurrentView = useUIStore((s) => s.setCurrentView);
|
|
15457
|
-
const [selectedAgentId, setSelectedAgentId] =
|
|
15458
|
-
const fleetList =
|
|
15605
|
+
const [selectedAgentId, setSelectedAgentId] = useState37(null);
|
|
15606
|
+
const fleetList = useMemo13(() => {
|
|
15459
15607
|
const arr = Array.from(fleetAgents.values());
|
|
15460
15608
|
arr.sort((x, y) => {
|
|
15461
15609
|
const xa = x.status === "running" ? 0 : 1;
|
|
@@ -15502,7 +15650,7 @@ function AgentsPanel() {
|
|
|
15502
15650
|
|
|
15503
15651
|
// src/components/SidePanel/HistoryPanel.tsx
|
|
15504
15652
|
import { LayoutGrid as LayoutGrid3 } from "lucide-react";
|
|
15505
|
-
import { useEffect as
|
|
15653
|
+
import { useEffect as useEffect34, useState as useState39 } from "react";
|
|
15506
15654
|
|
|
15507
15655
|
// src/components/SidePanel/SessionList.tsx
|
|
15508
15656
|
import {
|
|
@@ -15514,7 +15662,7 @@ import {
|
|
|
15514
15662
|
Trash2 as Trash24,
|
|
15515
15663
|
X as X15
|
|
15516
15664
|
} from "lucide-react";
|
|
15517
|
-
import { useCallback as useCallback20, useEffect as
|
|
15665
|
+
import { useCallback as useCallback20, useEffect as useEffect33, useMemo as useMemo14, useState as useState38 } from "react";
|
|
15518
15666
|
import { Fragment as Fragment15, jsx as jsx62, jsxs as jsxs56 } from "react/jsx-runtime";
|
|
15519
15667
|
var formatRelative = (iso) => {
|
|
15520
15668
|
const ts = Date.parse(iso);
|
|
@@ -15545,10 +15693,10 @@ function SessionList({
|
|
|
15545
15693
|
const toggleFavoriteSession = useUIStore((s) => s.toggleFavoriteSession);
|
|
15546
15694
|
const sessionNicknames = useUIStore((s) => s.sessionNicknames);
|
|
15547
15695
|
const setSessionNickname = useUIStore((s) => s.setSessionNickname);
|
|
15548
|
-
const [renamingId, setRenamingId] =
|
|
15549
|
-
const [renameDraft, setRenameDraft] =
|
|
15550
|
-
const [resumingId, setResumingId] =
|
|
15551
|
-
|
|
15696
|
+
const [renamingId, setRenamingId] = useState38(null);
|
|
15697
|
+
const [renameDraft, setRenameDraft] = useState38("");
|
|
15698
|
+
const [resumingId, setResumingId] = useState38(null);
|
|
15699
|
+
useEffect33(() => {
|
|
15552
15700
|
if (resumingId && historyEntries.some((e) => e.id === resumingId && e.isCurrent)) {
|
|
15553
15701
|
setResumingId(null);
|
|
15554
15702
|
}
|
|
@@ -15561,7 +15709,7 @@ function SessionList({
|
|
|
15561
15709
|
},
|
|
15562
15710
|
[resumeSession]
|
|
15563
15711
|
);
|
|
15564
|
-
const emptySessionIds =
|
|
15712
|
+
const emptySessionIds = useMemo14(
|
|
15565
15713
|
() => getEmptySessionIds(historyEntries),
|
|
15566
15714
|
[historyEntries]
|
|
15567
15715
|
);
|
|
@@ -15775,8 +15923,8 @@ function HistoryPanel() {
|
|
|
15775
15923
|
const { listSessions, resumeSession, deleteSession } = useWebSocket();
|
|
15776
15924
|
const setCurrentView = useUIStore((s) => s.setCurrentView);
|
|
15777
15925
|
const activeSessionId = useSessionStore((s) => s.session?.id);
|
|
15778
|
-
const [query, setQuery] =
|
|
15779
|
-
|
|
15926
|
+
const [query, setQuery] = useState39("");
|
|
15927
|
+
useEffect34(() => {
|
|
15780
15928
|
void activeSessionId;
|
|
15781
15929
|
if (wsConnected) listSessions(50);
|
|
15782
15930
|
}, [wsConnected, activeSessionId, listSessions]);
|
|
@@ -15827,7 +15975,7 @@ import {
|
|
|
15827
15975
|
Wifi as Wifi2,
|
|
15828
15976
|
WifiOff as WifiOff3
|
|
15829
15977
|
} from "lucide-react";
|
|
15830
|
-
import { useCallback as useCallback21, useEffect as
|
|
15978
|
+
import { useCallback as useCallback21, useEffect as useEffect35, useMemo as useMemo15, useState as useState40 } from "react";
|
|
15831
15979
|
import { jsx as jsx64, jsxs as jsxs58 } from "react/jsx-runtime";
|
|
15832
15980
|
function fmtCost4(v) {
|
|
15833
15981
|
if (v <= 0) return "$0.000";
|
|
@@ -15954,15 +16102,15 @@ function SessionPanel() {
|
|
|
15954
16102
|
},
|
|
15955
16103
|
[localPrefs, updatePrefs]
|
|
15956
16104
|
);
|
|
15957
|
-
const [breakdownOpen, setBreakdownOpen] =
|
|
16105
|
+
const [breakdownOpen, setBreakdownOpen] = useState40(false);
|
|
15958
16106
|
const startedAt = session?.startedAt ?? null;
|
|
15959
|
-
const [now, setNow] =
|
|
15960
|
-
|
|
16107
|
+
const [now, setNow] = useState40(() => Date.now());
|
|
16108
|
+
useEffect35(() => {
|
|
15961
16109
|
if (!startedAt) return;
|
|
15962
16110
|
const t = setInterval(() => setNow(Date.now()), 1e3);
|
|
15963
16111
|
return () => clearInterval(t);
|
|
15964
16112
|
}, [startedAt]);
|
|
15965
|
-
const runningAgents =
|
|
16113
|
+
const runningAgents = useMemo15(
|
|
15966
16114
|
() => Array.from(fleetAgents.values()).filter((a) => a.status === "running").length,
|
|
15967
16115
|
[fleetAgents]
|
|
15968
16116
|
);
|
|
@@ -16331,7 +16479,7 @@ function SidePanel() {
|
|
|
16331
16479
|
const setSidebarWidth = useUIStore((s) => s.setSidebarWidth);
|
|
16332
16480
|
const wsConnected = useConfigStore((s) => s.wsConnected);
|
|
16333
16481
|
const { client: client2 } = useWebSocket();
|
|
16334
|
-
|
|
16482
|
+
useEffect36(() => {
|
|
16335
16483
|
if (activeActivity !== "files" || !wsConnected) return;
|
|
16336
16484
|
useFileStore.getState().setTreeLoading(true);
|
|
16337
16485
|
const cwd = useSessionStore.getState().cwd;
|
|
@@ -16398,22 +16546,22 @@ function SidePanel() {
|
|
|
16398
16546
|
|
|
16399
16547
|
// src/components/WorkspaceDock.tsx
|
|
16400
16548
|
import { Bot as Bot11, GitBranch as GitBranch3, ListTodo as ListTodo2, Maximize2 as Maximize22, Rocket as Rocket4, Target as Target3, Users as Users3 } from "lucide-react";
|
|
16401
|
-
import { useCallback as useCallback26, useEffect as
|
|
16549
|
+
import { useCallback as useCallback26, useEffect as useEffect42, useMemo as useMemo16, useRef as useRef24, useState as useState47 } from "react";
|
|
16402
16550
|
|
|
16403
16551
|
// src/components/CollabPanel.tsx
|
|
16404
16552
|
import { Eye as Eye2, LogIn, LogOut, MessageSquareWarning, Pause as Pause5, Play as Play6, Users as Users2 } from "lucide-react";
|
|
16405
|
-
import { useEffect as
|
|
16553
|
+
import { useEffect as useEffect37, useState as useState41 } from "react";
|
|
16406
16554
|
import { jsx as jsx66, jsxs as jsxs60 } from "react/jsx-runtime";
|
|
16407
16555
|
function CollabPanel({ sessionId, className }) {
|
|
16408
|
-
const [participants, setParticipants] =
|
|
16409
|
-
const [joined, setJoined] =
|
|
16410
|
-
const [joinedRole, setJoinedRole] =
|
|
16411
|
-
const [error, setError] =
|
|
16412
|
-
const [openAnnotationCount, setOpenAnnotationCount] =
|
|
16413
|
-
const [paused, setPaused] =
|
|
16556
|
+
const [participants, setParticipants] = useState41([]);
|
|
16557
|
+
const [joined, setJoined] = useState41(false);
|
|
16558
|
+
const [joinedRole, setJoinedRole] = useState41(null);
|
|
16559
|
+
const [error, setError] = useState41(null);
|
|
16560
|
+
const [openAnnotationCount, setOpenAnnotationCount] = useState41(0);
|
|
16561
|
+
const [paused, setPaused] = useState41(false);
|
|
16414
16562
|
const wsUrl = useConfigStore((s) => s.wsUrl);
|
|
16415
16563
|
const client2 = getWSClient(wsUrl);
|
|
16416
|
-
|
|
16564
|
+
useEffect37(() => {
|
|
16417
16565
|
const offs = [];
|
|
16418
16566
|
offs.push(
|
|
16419
16567
|
client2.on("collab.state", (msg) => {
|
|
@@ -16701,7 +16849,7 @@ import {
|
|
|
16701
16849
|
TrendingUp,
|
|
16702
16850
|
Minus
|
|
16703
16851
|
} from "lucide-react";
|
|
16704
|
-
import { useEffect as
|
|
16852
|
+
import { useEffect as useEffect38, useState as useState42 } from "react";
|
|
16705
16853
|
import { jsx as jsx67, jsxs as jsxs61 } from "react/jsx-runtime";
|
|
16706
16854
|
var TREND_ICON = {
|
|
16707
16855
|
up: /* @__PURE__ */ jsx67(TrendingUp, { className: "h-3.5 w-3.5 text-emerald-500" }),
|
|
@@ -16736,8 +16884,8 @@ var STATE_CONFIG = {
|
|
|
16736
16884
|
}
|
|
16737
16885
|
};
|
|
16738
16886
|
function GoalPanel({ goal, className }) {
|
|
16739
|
-
const [collapsed, setCollapsed] =
|
|
16740
|
-
|
|
16887
|
+
const [collapsed, setCollapsed] = useState42(false);
|
|
16888
|
+
useEffect38(() => {
|
|
16741
16889
|
const ws = getWSClient();
|
|
16742
16890
|
ws?.send?.({ type: "goal.get" });
|
|
16743
16891
|
const timer = setInterval(() => {
|
|
@@ -16745,7 +16893,7 @@ function GoalPanel({ goal, className }) {
|
|
|
16745
16893
|
}, 1e4);
|
|
16746
16894
|
return () => clearInterval(timer);
|
|
16747
16895
|
}, []);
|
|
16748
|
-
|
|
16896
|
+
useEffect38(() => {
|
|
16749
16897
|
if (!goal || goal.goalState === "completed" || goal.goalState === "failed" || goal.goalState === "abandoned") {
|
|
16750
16898
|
setCollapsed(true);
|
|
16751
16899
|
}
|
|
@@ -16865,11 +17013,11 @@ function GoalPanel({ goal, className }) {
|
|
|
16865
17013
|
}
|
|
16866
17014
|
|
|
16867
17015
|
// src/components/WorkDashboard.tsx
|
|
16868
|
-
import { useState as
|
|
17016
|
+
import { useState as useState46 } from "react";
|
|
16869
17017
|
|
|
16870
17018
|
// src/components/TodosPanel.tsx
|
|
16871
17019
|
import { CheckCircle2 as CheckCircle214, Circle as Circle7, Clock as Clock13, Trash2 as Trash25 } from "lucide-react";
|
|
16872
|
-
import { useCallback as useCallback23, useEffect as
|
|
17020
|
+
import { useCallback as useCallback23, useEffect as useEffect39, useRef as useRef21, useState as useState43 } from "react";
|
|
16873
17021
|
import { jsx as jsx68, jsxs as jsxs62 } from "react/jsx-runtime";
|
|
16874
17022
|
var STATUS_ORDER = {
|
|
16875
17023
|
in_progress: 0,
|
|
@@ -16877,11 +17025,11 @@ var STATUS_ORDER = {
|
|
|
16877
17025
|
completed: 2
|
|
16878
17026
|
};
|
|
16879
17027
|
function TodosPanel() {
|
|
16880
|
-
const [todos, setTodos] =
|
|
16881
|
-
const [collapsedSections, setCollapsedSections] =
|
|
17028
|
+
const [todos, setTodos] = useState43([]);
|
|
17029
|
+
const [collapsedSections, setCollapsedSections] = useState43(/* @__PURE__ */ new Set());
|
|
16882
17030
|
const ws = getWSClient();
|
|
16883
17031
|
const offRef = useRef21(null);
|
|
16884
|
-
|
|
17032
|
+
useEffect39(() => {
|
|
16885
17033
|
ws.send({ type: "todos.get" });
|
|
16886
17034
|
offRef.current = ws.on("todos.updated", (msg) => {
|
|
16887
17035
|
const payload = msg?.payload;
|
|
@@ -17014,7 +17162,7 @@ function TodosPanel() {
|
|
|
17014
17162
|
|
|
17015
17163
|
// src/components/TasksPanel.tsx
|
|
17016
17164
|
import { CheckCircle2 as CheckCircle215, Circle as Circle8, Clock as Clock14, Pause as Pause6, XCircle as XCircle8, RotateCcw as RotateCcw5 } from "lucide-react";
|
|
17017
|
-
import { useCallback as useCallback24, useEffect as
|
|
17165
|
+
import { useCallback as useCallback24, useEffect as useEffect40, useRef as useRef22, useState as useState44 } from "react";
|
|
17018
17166
|
import { jsx as jsx69, jsxs as jsxs63 } from "react/jsx-runtime";
|
|
17019
17167
|
var STATUS_CONFIG2 = {
|
|
17020
17168
|
pending: { icon: /* @__PURE__ */ jsx69(Circle8, { className: "w-3.5 h-3.5" }), label: "Pending", color: "text-muted-foreground/50" },
|
|
@@ -17039,11 +17187,11 @@ var TYPE_ICON = {
|
|
|
17039
17187
|
chore: "\u{1F527}"
|
|
17040
17188
|
};
|
|
17041
17189
|
function TasksPanel() {
|
|
17042
|
-
const [tasks, setTasks] =
|
|
17043
|
-
const [collapsed, setCollapsed] =
|
|
17190
|
+
const [tasks, setTasks] = useState44([]);
|
|
17191
|
+
const [collapsed, setCollapsed] = useState44(/* @__PURE__ */ new Set());
|
|
17044
17192
|
const ws = getWSClient();
|
|
17045
17193
|
const offRef = useRef22(null);
|
|
17046
|
-
|
|
17194
|
+
useEffect40(() => {
|
|
17047
17195
|
ws.getTasks();
|
|
17048
17196
|
offRef.current = ws.on("tasks.updated", (msg) => {
|
|
17049
17197
|
const payload = msg?.payload;
|
|
@@ -17183,7 +17331,7 @@ function TasksPanel() {
|
|
|
17183
17331
|
|
|
17184
17332
|
// src/components/PlanPanel.tsx
|
|
17185
17333
|
import { CheckCircle2 as CheckCircle216, Circle as Circle9, Clock as Clock15 } from "lucide-react";
|
|
17186
|
-
import { useCallback as useCallback25, useEffect as
|
|
17334
|
+
import { useCallback as useCallback25, useEffect as useEffect41, useRef as useRef23, useState as useState45 } from "react";
|
|
17187
17335
|
import { jsx as jsx70, jsxs as jsxs64 } from "react/jsx-runtime";
|
|
17188
17336
|
var STATUS_CONFIG3 = {
|
|
17189
17337
|
open: { icon: /* @__PURE__ */ jsx70(Circle9, { className: "w-3.5 h-3.5" }), label: "Open", color: "text-muted-foreground/50" },
|
|
@@ -17191,11 +17339,11 @@ var STATUS_CONFIG3 = {
|
|
|
17191
17339
|
done: { icon: /* @__PURE__ */ jsx70(CheckCircle216, { className: "w-3.5 h-3.5" }), label: "Done", color: "text-emerald-500" }
|
|
17192
17340
|
};
|
|
17193
17341
|
function PlanPanel() {
|
|
17194
|
-
const [items, setItems] =
|
|
17195
|
-
const [collapsed, setCollapsed] =
|
|
17342
|
+
const [items, setItems] = useState45([]);
|
|
17343
|
+
const [collapsed, setCollapsed] = useState45(/* @__PURE__ */ new Set());
|
|
17196
17344
|
const ws = getWSClient();
|
|
17197
17345
|
const offRef = useRef23(null);
|
|
17198
|
-
|
|
17346
|
+
useEffect41(() => {
|
|
17199
17347
|
ws.getPlan();
|
|
17200
17348
|
offRef.current = ws.on("plan.updated", (msg) => {
|
|
17201
17349
|
const payload = msg?.payload;
|
|
@@ -17329,7 +17477,7 @@ var TABS = [
|
|
|
17329
17477
|
{ id: "plan", label: "Plan", icon: "\u{1F5FA}\uFE0F" }
|
|
17330
17478
|
];
|
|
17331
17479
|
function WorkDashboard() {
|
|
17332
|
-
const [activeTab, setActiveTab] =
|
|
17480
|
+
const [activeTab, setActiveTab] = useState46("todos");
|
|
17333
17481
|
return /* @__PURE__ */ jsxs65("div", { className: "rounded-lg border border-border bg-card/50 backdrop-blur-sm overflow-hidden", children: [
|
|
17334
17482
|
/* @__PURE__ */ jsx71("div", { className: "flex border-b border-border/50 bg-muted/30", children: TABS.map((tab) => /* @__PURE__ */ jsxs65(
|
|
17335
17483
|
"button",
|
|
@@ -17429,9 +17577,9 @@ function WorkspaceDock({ sessionId }) {
|
|
|
17429
17577
|
() => toggleAutoPhaseAutonomous(!autoPhase.autonomous),
|
|
17430
17578
|
[toggleAutoPhaseAutonomous, autoPhase.autonomous]
|
|
17431
17579
|
);
|
|
17432
|
-
const [worktreeView, setWorktreeView] =
|
|
17580
|
+
const [worktreeView, setWorktreeView] = useState47("graph");
|
|
17433
17581
|
const fleetTotal = fleetAgents.size;
|
|
17434
|
-
const fleetRunning =
|
|
17582
|
+
const fleetRunning = useMemo16(
|
|
17435
17583
|
() => Array.from(fleetAgents.values()).filter((a) => a.status === "running").length,
|
|
17436
17584
|
[fleetAgents]
|
|
17437
17585
|
);
|
|
@@ -17439,7 +17587,7 @@ function WorkspaceDock({ sessionId }) {
|
|
|
17439
17587
|
const todosActive = todos.some((t) => t.status === "in_progress");
|
|
17440
17588
|
const phasesActive = autoPhase.phases.length > 0;
|
|
17441
17589
|
const prevPhaseCount = useRef24(autoPhase.phases.length);
|
|
17442
|
-
|
|
17590
|
+
useEffect42(() => {
|
|
17443
17591
|
const ui = useUIStore.getState();
|
|
17444
17592
|
if (prevPhaseCount.current === 0 && autoPhase.phases.length > 0 && ui.dockSection === null) {
|
|
17445
17593
|
ui.setDockSection("autophase");
|
|
@@ -17580,285 +17728,33 @@ function WorkspaceDock({ sessionId }) {
|
|
|
17580
17728
|
] });
|
|
17581
17729
|
}
|
|
17582
17730
|
|
|
17583
|
-
// src/components/
|
|
17584
|
-
import {
|
|
17585
|
-
|
|
17731
|
+
// src/components/FleetMonitor.tsx
|
|
17732
|
+
import {
|
|
17733
|
+
Activity as Activity5,
|
|
17734
|
+
ArrowRight as ArrowRight6,
|
|
17735
|
+
Bot as Bot12,
|
|
17736
|
+
ChevronRight as ChevronRight11,
|
|
17737
|
+
Clock as Clock16,
|
|
17738
|
+
Cpu as Cpu14,
|
|
17739
|
+
Crown as Crown2,
|
|
17740
|
+
Database as Database4,
|
|
17741
|
+
DollarSign as DollarSign2,
|
|
17742
|
+
FolderOpen as FolderOpen5,
|
|
17743
|
+
Loader2 as Loader211,
|
|
17744
|
+
Timer as Timer3,
|
|
17745
|
+
Users as Users4,
|
|
17746
|
+
Wrench as Wrench9,
|
|
17747
|
+
XCircle as XCircle9,
|
|
17748
|
+
Zap as Zap10
|
|
17749
|
+
} from "lucide-react";
|
|
17750
|
+
import { useCallback as useCallback27, useEffect as useEffect43, useMemo as useMemo17, useState as useState48 } from "react";
|
|
17751
|
+
|
|
17752
|
+
// src/components/ui/dropdown-menu.tsx
|
|
17753
|
+
import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
|
|
17754
|
+
import { Check as Check8, ChevronRight as ChevronRight10, Circle as Circle10 } from "lucide-react";
|
|
17755
|
+
import * as React6 from "react";
|
|
17586
17756
|
import { jsx as jsx73, jsxs as jsxs67 } from "react/jsx-runtime";
|
|
17587
|
-
|
|
17588
|
-
if (v <= 0) return "$0";
|
|
17589
|
-
if (v >= 0.01) return `$${v.toFixed(3)}`;
|
|
17590
|
-
return `$${v.toFixed(5)}`.replace(/0+$/, "").replace(/\.$/, "");
|
|
17591
|
-
}
|
|
17592
|
-
function fmtDuration3(ms) {
|
|
17593
|
-
const sec = Math.floor(ms / 1e3);
|
|
17594
|
-
if (sec < 60) return `${sec}s`;
|
|
17595
|
-
const min = Math.floor(sec / 60);
|
|
17596
|
-
return `${min}m ${sec % 60}s`;
|
|
17597
|
-
}
|
|
17598
|
-
var STATUS_META5 = {
|
|
17599
|
-
running: { led: "bg-[hsl(var(--success))]", label: "running", pulse: true, badge: "bg-[hsl(var(--success))]/15 text-[hsl(var(--success))]" },
|
|
17600
|
-
completed: { led: "bg-[hsl(var(--success))]", label: "done", pulse: false, badge: "bg-muted text-muted-foreground" },
|
|
17601
|
-
failed: { led: "bg-destructive", label: "failed", pulse: false, badge: "bg-destructive/15 text-destructive" },
|
|
17602
|
-
timeout: { led: "bg-[hsl(var(--warning))]", label: "timeout", pulse: false, badge: "bg-amber-500/15 text-amber-500" },
|
|
17603
|
-
stopped: { led: "bg-muted-foreground", label: "stopped", pulse: false, badge: "bg-muted text-muted-foreground" }
|
|
17604
|
-
};
|
|
17605
|
-
function AgentCard2({ agent, isLeader }) {
|
|
17606
|
-
const meta2 = STATUS_META5[agent.status];
|
|
17607
|
-
const active = agent.status === "running";
|
|
17608
|
-
const elapsed = Date.now() - agent.startedAt;
|
|
17609
|
-
const toolLogSlice = agent.toolLog.slice(0, 8);
|
|
17610
|
-
const last8Tools = [...toolLogSlice].reverse();
|
|
17611
|
-
return /* @__PURE__ */ jsxs67("div", { className: cn(
|
|
17612
|
-
"rounded-xl border p-4 space-y-3",
|
|
17613
|
-
active ? "border-primary/20 bg-primary/[0.02]" : "border-border bg-card",
|
|
17614
|
-
isLeader && "ring-2 ring-amber-500/30"
|
|
17615
|
-
), children: [
|
|
17616
|
-
/* @__PURE__ */ jsxs67("div", { className: "flex items-start justify-between", children: [
|
|
17617
|
-
/* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-2", children: [
|
|
17618
|
-
/* @__PURE__ */ jsx73("span", { className: cn("led", meta2.led, meta2.pulse && "led-pulse", "mt-0.5") }),
|
|
17619
|
-
/* @__PURE__ */ jsxs67("div", { children: [
|
|
17620
|
-
/* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-1.5", children: [
|
|
17621
|
-
/* @__PURE__ */ jsx73("span", { className: "text-sm font-semibold", children: agent.name }),
|
|
17622
|
-
isLeader && /* @__PURE__ */ jsx73(Crown2, { className: "h-3.5 w-3.5 text-amber-500", "aria-label": "leader" }),
|
|
17623
|
-
agent.extensions > 0 && /* @__PURE__ */ jsxs67("span", { className: "inline-flex items-center gap-0.5 px-1.5 py-0.5 rounded-full bg-amber-500/15 text-[10px] text-amber-600 dark:text-amber-400 font-medium", children: [
|
|
17624
|
-
/* @__PURE__ */ jsx73(Zap10, { className: "h-2.5 w-2.5" }),
|
|
17625
|
-
"\xD7",
|
|
17626
|
-
agent.extensions
|
|
17627
|
-
] })
|
|
17628
|
-
] }),
|
|
17629
|
-
/* @__PURE__ */ jsx73("span", { className: cn("inline-block mt-0.5 px-1.5 py-0.5 rounded text-[10px] font-medium", meta2.badge), children: meta2.label })
|
|
17630
|
-
] })
|
|
17631
|
-
] }),
|
|
17632
|
-
/* @__PURE__ */ jsx73("div", { className: "flex items-center gap-1 text-[10px] text-muted-foreground", children: isLeader && /* @__PURE__ */ jsx73("span", { className: "text-[9px] bg-amber-500/15 text-amber-600 dark:text-amber-400 px-1.5 py-0.5 rounded", children: "LEADER" }) })
|
|
17633
|
-
] }),
|
|
17634
|
-
agent.description && /* @__PURE__ */ jsx73("p", { className: "text-xs text-muted-foreground leading-relaxed line-clamp-2", children: agent.description }),
|
|
17635
|
-
agent.budgetWarning && /* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-2 px-3 py-2 rounded-lg bg-amber-500/10 border border-amber-500/20 text-xs", children: [
|
|
17636
|
-
/* @__PURE__ */ jsx73(Zap10, { className: "h-3.5 w-3.5 text-amber-500 shrink-0" }),
|
|
17637
|
-
/* @__PURE__ */ jsxs67("span", { className: "text-amber-600 dark:text-amber-400", children: [
|
|
17638
|
-
"\u26A1 hitting ",
|
|
17639
|
-
/* @__PURE__ */ jsx73("strong", { children: agent.budgetWarning.kind }),
|
|
17640
|
-
" limit (",
|
|
17641
|
-
agent.budgetWarning.used,
|
|
17642
|
-
"/",
|
|
17643
|
-
agent.budgetWarning.limit,
|
|
17644
|
-
") \u2014 extending"
|
|
17645
|
-
] })
|
|
17646
|
-
] }),
|
|
17647
|
-
agent.failureReason && /* @__PURE__ */ jsx73("div", { className: "flex items-center gap-2 px-3 py-2 rounded-lg bg-destructive/10 border border-destructive/20 text-xs", children: /* @__PURE__ */ jsxs67("span", { className: "text-destructive font-medium", children: [
|
|
17648
|
-
"\u2717 ",
|
|
17649
|
-
agent.failureReason
|
|
17650
|
-
] }) }),
|
|
17651
|
-
/* @__PURE__ */ jsxs67("div", { className: "grid grid-cols-4 gap-2", children: [
|
|
17652
|
-
/* @__PURE__ */ jsxs67("div", { className: "rounded-lg border bg-muted/30 px-2 py-1.5 text-center", children: [
|
|
17653
|
-
/* @__PURE__ */ jsx73("div", { className: "text-[10px] text-muted-foreground", children: "Iters" }),
|
|
17654
|
-
/* @__PURE__ */ jsx73("div", { className: "text-xs font-mono font-semibold tabular-nums", children: agent.iteration })
|
|
17655
|
-
] }),
|
|
17656
|
-
/* @__PURE__ */ jsxs67("div", { className: "rounded-lg border bg-muted/30 px-2 py-1.5 text-center", children: [
|
|
17657
|
-
/* @__PURE__ */ jsx73("div", { className: "text-[10px] text-muted-foreground", children: "Tools" }),
|
|
17658
|
-
/* @__PURE__ */ jsx73("div", { className: "text-xs font-mono font-semibold tabular-nums", children: agent.toolCalls })
|
|
17659
|
-
] }),
|
|
17660
|
-
/* @__PURE__ */ jsxs67("div", { className: "rounded-lg border bg-muted/30 px-2 py-1.5 text-center", children: [
|
|
17661
|
-
/* @__PURE__ */ jsx73("div", { className: "text-[10px] text-muted-foreground", children: "Cost" }),
|
|
17662
|
-
/* @__PURE__ */ jsx73("div", { className: "text-xs font-mono font-semibold tabular-nums", children: fmtCost5(agent.costUsd) })
|
|
17663
|
-
] }),
|
|
17664
|
-
/* @__PURE__ */ jsxs67("div", { className: "rounded-lg border bg-muted/30 px-2 py-1.5 text-center", children: [
|
|
17665
|
-
/* @__PURE__ */ jsx73("div", { className: "text-[10px] text-muted-foreground", children: "Elapsed" }),
|
|
17666
|
-
/* @__PURE__ */ jsx73("div", { className: "text-xs font-mono font-semibold tabular-nums", children: fmtDuration3(elapsed) })
|
|
17667
|
-
] })
|
|
17668
|
-
] }),
|
|
17669
|
-
/* @__PURE__ */ jsxs67("div", { className: "space-y-1.5", children: [
|
|
17670
|
-
/* @__PURE__ */ jsxs67("div", { className: "flex items-center justify-between", children: [
|
|
17671
|
-
/* @__PURE__ */ jsx73("span", { className: "text-[10px] text-muted-foreground", children: "Activity (12 bins)" }),
|
|
17672
|
-
/* @__PURE__ */ jsx73(SparklineChart, { bins: agent.sparklineBins, className: "font-mono text-[9px]" })
|
|
17673
|
-
] }),
|
|
17674
|
-
/* @__PURE__ */ jsx73(ContextBar, { pct: agent.ctxPct, tokens: agent.ctxTokens, maxTokens: agent.maxContext })
|
|
17675
|
-
] }),
|
|
17676
|
-
(agent.provider || agent.model) && /* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-1.5 text-[10px] text-muted-foreground", children: [
|
|
17677
|
-
/* @__PURE__ */ jsx73(Cpu14, { className: "h-3 w-3" }),
|
|
17678
|
-
/* @__PURE__ */ jsxs67("span", { className: "font-mono", children: [
|
|
17679
|
-
agent.provider ?? "?",
|
|
17680
|
-
"/",
|
|
17681
|
-
agent.model ?? "?"
|
|
17682
|
-
] })
|
|
17683
|
-
] }),
|
|
17684
|
-
(agent.currentTool || agent.lastTool) && /* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-1.5 text-[10px] text-muted-foreground", children: [
|
|
17685
|
-
/* @__PURE__ */ jsx73(Wrench9, { className: cn("h-3 w-3", active && "animate-pulse text-primary") }),
|
|
17686
|
-
/* @__PURE__ */ jsx73("span", { className: "font-mono", children: agent.currentTool ?? agent.lastTool }),
|
|
17687
|
-
active && /* @__PURE__ */ jsx73(Loader211, { className: "h-3 w-3 animate-spin" })
|
|
17688
|
-
] }),
|
|
17689
|
-
agent.partialText && active && /* @__PURE__ */ jsxs67("div", { className: "rounded-lg border bg-muted/30 p-2", children: [
|
|
17690
|
-
/* @__PURE__ */ jsx73("div", { className: "text-[9px] text-muted-foreground uppercase tracking-wider mb-1", children: "Streaming output" }),
|
|
17691
|
-
/* @__PURE__ */ jsx73("pre", { className: "text-[10px] font-mono text-foreground/80 whitespace-pre-wrap line-clamp-3 leading-relaxed", children: agent.partialText })
|
|
17692
|
-
] }),
|
|
17693
|
-
last8Tools.length > 0 && /* @__PURE__ */ jsxs67("div", { className: "space-y-1", children: [
|
|
17694
|
-
/* @__PURE__ */ jsx73("div", { className: "text-[9px] text-muted-foreground uppercase tracking-wider", children: "Recent tools" }),
|
|
17695
|
-
/* @__PURE__ */ jsx73("div", { className: "space-y-0.5", children: last8Tools.map((tool, i) => /* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-2 text-[10px] font-mono", children: [
|
|
17696
|
-
/* @__PURE__ */ jsx73("span", { className: cn("shrink-0", tool.ok ? "text-[hsl(var(--success))]" : "text-destructive"), children: tool.ok ? "\u2713" : "\u2717" }),
|
|
17697
|
-
/* @__PURE__ */ jsx73("span", { className: "text-muted-foreground truncate", children: tool.name }),
|
|
17698
|
-
/* @__PURE__ */ jsx73("span", { className: "ml-auto tabular-nums text-muted-foreground shrink-0", children: tool.durationMs >= 1e3 ? `${(tool.durationMs / 1e3).toFixed(1)}s` : `${tool.durationMs}ms` })
|
|
17699
|
-
] }, i)) })
|
|
17700
|
-
] }),
|
|
17701
|
-
agent.finalText && !active && /* @__PURE__ */ jsxs67("div", { className: "rounded-lg border bg-muted/30 p-2", children: [
|
|
17702
|
-
/* @__PURE__ */ jsx73("div", { className: "text-[9px] text-muted-foreground uppercase tracking-wider mb-1", children: "Final output" }),
|
|
17703
|
-
/* @__PURE__ */ jsx73("pre", { className: "text-[10px] font-mono text-foreground/80 whitespace-pre-wrap line-clamp-4 leading-relaxed", children: agent.finalText })
|
|
17704
|
-
] })
|
|
17705
|
-
] });
|
|
17706
|
-
}
|
|
17707
|
-
function AgentsMonitor({ onClose }) {
|
|
17708
|
-
const fleetAgents = useFleetStore((s) => s.agents);
|
|
17709
|
-
const leaderId = useFleetStore((s) => s.leaderId);
|
|
17710
|
-
const [selectedIdx, setSelectedIdx] = useState47(0);
|
|
17711
|
-
const fleetList = useMemo18(() => {
|
|
17712
|
-
const arr = Array.from(fleetAgents.values());
|
|
17713
|
-
arr.sort((x, y) => {
|
|
17714
|
-
if (x.id === leaderId) return -1;
|
|
17715
|
-
if (y.id === leaderId) return 1;
|
|
17716
|
-
const xa = x.status === "running" ? 0 : 1;
|
|
17717
|
-
const ya = y.status === "running" ? 0 : 1;
|
|
17718
|
-
if (xa !== ya) return xa - ya;
|
|
17719
|
-
return x.startedAt - y.startedAt;
|
|
17720
|
-
});
|
|
17721
|
-
return arr;
|
|
17722
|
-
}, [fleetAgents, leaderId]);
|
|
17723
|
-
const handleKeyDown = useCallback27(
|
|
17724
|
-
(e) => {
|
|
17725
|
-
if (e.key === "Escape") {
|
|
17726
|
-
onClose();
|
|
17727
|
-
return;
|
|
17728
|
-
}
|
|
17729
|
-
if (e.key === "ArrowDown") {
|
|
17730
|
-
e.preventDefault();
|
|
17731
|
-
setSelectedIdx((i) => Math.min(i + 1, fleetList.length - 1));
|
|
17732
|
-
return;
|
|
17733
|
-
}
|
|
17734
|
-
if (e.key === "ArrowUp") {
|
|
17735
|
-
e.preventDefault();
|
|
17736
|
-
setSelectedIdx((i) => Math.max(i - 1, 0));
|
|
17737
|
-
return;
|
|
17738
|
-
}
|
|
17739
|
-
},
|
|
17740
|
-
[fleetList.length, onClose]
|
|
17741
|
-
);
|
|
17742
|
-
useEffect42(() => {
|
|
17743
|
-
const handleGlobal = (e) => {
|
|
17744
|
-
if (e.key === "Escape") onClose();
|
|
17745
|
-
};
|
|
17746
|
-
window.addEventListener("keydown", handleGlobal);
|
|
17747
|
-
return () => window.removeEventListener("keydown", handleGlobal);
|
|
17748
|
-
}, [onClose]);
|
|
17749
|
-
const selectedAgent = fleetList[selectedIdx] ?? null;
|
|
17750
|
-
return /* @__PURE__ */ jsxs67(
|
|
17751
|
-
"div",
|
|
17752
|
-
{
|
|
17753
|
-
className: "fixed inset-0 z-50 flex flex-col bg-background/95 backdrop-blur-md",
|
|
17754
|
-
onKeyDown: handleKeyDown,
|
|
17755
|
-
tabIndex: -1,
|
|
17756
|
-
children: [
|
|
17757
|
-
/* @__PURE__ */ jsxs67("div", { className: "flex items-center justify-between px-4 py-3 border-b bg-card/80 backdrop-blur shrink-0", children: [
|
|
17758
|
-
/* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-3", children: [
|
|
17759
|
-
/* @__PURE__ */ jsx73(Bot12, { className: "h-5 w-5 text-primary" }),
|
|
17760
|
-
/* @__PURE__ */ jsx73("h2", { className: "text-sm font-semibold", children: "Agents Monitor" }),
|
|
17761
|
-
/* @__PURE__ */ jsxs67("span", { className: "text-xs text-muted-foreground", children: [
|
|
17762
|
-
fleetList.length,
|
|
17763
|
-
" total"
|
|
17764
|
-
] })
|
|
17765
|
-
] }),
|
|
17766
|
-
/* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-2", children: [
|
|
17767
|
-
/* @__PURE__ */ jsx73(
|
|
17768
|
-
"button",
|
|
17769
|
-
{
|
|
17770
|
-
type: "button",
|
|
17771
|
-
onClick: () => setSelectedIdx((i) => Math.max(i - 1, 0)),
|
|
17772
|
-
className: "p-1.5 rounded-md hover:bg-muted transition-colors disabled:opacity-30",
|
|
17773
|
-
disabled: selectedIdx === 0,
|
|
17774
|
-
"aria-label": "Previous agent",
|
|
17775
|
-
children: /* @__PURE__ */ jsx73(ChevronLeft, { className: "h-4 w-4" })
|
|
17776
|
-
}
|
|
17777
|
-
),
|
|
17778
|
-
/* @__PURE__ */ jsx73("span", { className: "text-xs tabular-nums text-muted-foreground font-mono", children: fleetList.length > 0 ? `${selectedIdx + 1}/${fleetList.length}` : "0/0" }),
|
|
17779
|
-
/* @__PURE__ */ jsx73(
|
|
17780
|
-
"button",
|
|
17781
|
-
{
|
|
17782
|
-
type: "button",
|
|
17783
|
-
onClick: () => setSelectedIdx((i) => Math.min(i + 1, fleetList.length - 1)),
|
|
17784
|
-
className: "p-1.5 rounded-md hover:bg-muted transition-colors disabled:opacity-30",
|
|
17785
|
-
disabled: selectedIdx >= fleetList.length - 1,
|
|
17786
|
-
"aria-label": "Next agent",
|
|
17787
|
-
children: /* @__PURE__ */ jsx73(ChevronRight10, { className: "h-4 w-4" })
|
|
17788
|
-
}
|
|
17789
|
-
),
|
|
17790
|
-
/* @__PURE__ */ jsx73(
|
|
17791
|
-
"button",
|
|
17792
|
-
{
|
|
17793
|
-
type: "button",
|
|
17794
|
-
onClick: onClose,
|
|
17795
|
-
className: "p-1.5 rounded-md hover:bg-muted transition-colors ml-2",
|
|
17796
|
-
"aria-label": "Close agents monitor",
|
|
17797
|
-
children: /* @__PURE__ */ jsx73(X16, { className: "h-4 w-4" })
|
|
17798
|
-
}
|
|
17799
|
-
)
|
|
17800
|
-
] })
|
|
17801
|
-
] }),
|
|
17802
|
-
/* @__PURE__ */ jsx73("div", { className: "flex-1 overflow-y-auto p-4", children: fleetList.length === 0 ? /* @__PURE__ */ jsxs67("div", { className: "flex flex-col items-center justify-center h-full text-muted-foreground", children: [
|
|
17803
|
-
/* @__PURE__ */ jsx73(Bot12, { className: "h-12 w-12 mb-3 opacity-20" }),
|
|
17804
|
-
/* @__PURE__ */ jsx73("p", { className: "text-sm font-medium", children: "No agents active" })
|
|
17805
|
-
] }) : selectedAgent ? /* @__PURE__ */ jsx73("div", { className: "max-w-2xl mx-auto", children: /* @__PURE__ */ jsx73(AgentCard2, { agent: selectedAgent, isLeader: selectedAgent.id === leaderId }) }) : null }),
|
|
17806
|
-
fleetList.length > 0 && /* @__PURE__ */ jsxs67("div", { className: "border-t bg-card/80 backdrop-blur shrink-0", children: [
|
|
17807
|
-
/* @__PURE__ */ jsx73("div", { className: "px-4 py-2 flex items-center gap-2 overflow-x-auto", children: fleetList.map((agent, i) => /* @__PURE__ */ jsxs67(
|
|
17808
|
-
"button",
|
|
17809
|
-
{
|
|
17810
|
-
type: "button",
|
|
17811
|
-
onClick: () => setSelectedIdx(i),
|
|
17812
|
-
className: cn(
|
|
17813
|
-
"shrink-0 flex items-center gap-1.5 px-2 py-1 rounded-md text-[10px] transition-colors",
|
|
17814
|
-
i === selectedIdx ? "bg-primary/15 text-primary ring-1 ring-primary/40" : "hover:bg-accent text-muted-foreground"
|
|
17815
|
-
),
|
|
17816
|
-
children: [
|
|
17817
|
-
/* @__PURE__ */ jsx73("span", { className: cn("led", STATUS_META5[agent.status].led, STATUS_META5[agent.status].pulse && "led-pulse", "shrink-0") }),
|
|
17818
|
-
/* @__PURE__ */ jsx73("span", { children: agent.name }),
|
|
17819
|
-
agent.id === leaderId && /* @__PURE__ */ jsx73(Crown2, { className: "h-2.5 w-2.5 text-amber-500 shrink-0" })
|
|
17820
|
-
]
|
|
17821
|
-
},
|
|
17822
|
-
agent.id
|
|
17823
|
-
)) }),
|
|
17824
|
-
/* @__PURE__ */ jsxs67("div", { className: "px-4 py-1.5 border-t text-[10px] text-muted-foreground flex items-center gap-4", children: [
|
|
17825
|
-
/* @__PURE__ */ jsx73("span", { children: "\u2190\u2192 page" }),
|
|
17826
|
-
/* @__PURE__ */ jsx73("span", { children: "\u2191\u2193 navigate list" }),
|
|
17827
|
-
/* @__PURE__ */ jsx73("span", { children: "Esc close" })
|
|
17828
|
-
] })
|
|
17829
|
-
] })
|
|
17830
|
-
]
|
|
17831
|
-
}
|
|
17832
|
-
);
|
|
17833
|
-
}
|
|
17834
|
-
|
|
17835
|
-
// src/components/FleetMonitor.tsx
|
|
17836
|
-
import {
|
|
17837
|
-
Activity as Activity5,
|
|
17838
|
-
ArrowRight as ArrowRight6,
|
|
17839
|
-
Bot as Bot13,
|
|
17840
|
-
ChevronRight as ChevronRight12,
|
|
17841
|
-
Clock as Clock17,
|
|
17842
|
-
Cpu as Cpu15,
|
|
17843
|
-
Crown as Crown3,
|
|
17844
|
-
Database as Database4,
|
|
17845
|
-
DollarSign as DollarSign3,
|
|
17846
|
-
FolderOpen as FolderOpen5,
|
|
17847
|
-
Loader2 as Loader212,
|
|
17848
|
-
Timer as Timer2,
|
|
17849
|
-
Users as Users4,
|
|
17850
|
-
Wrench as Wrench10,
|
|
17851
|
-
XCircle as XCircle9,
|
|
17852
|
-
Zap as Zap11
|
|
17853
|
-
} from "lucide-react";
|
|
17854
|
-
import { useCallback as useCallback28, useEffect as useEffect43, useMemo as useMemo19, useState as useState48 } from "react";
|
|
17855
|
-
|
|
17856
|
-
// src/components/ui/dropdown-menu.tsx
|
|
17857
|
-
import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
|
|
17858
|
-
import { Check as Check8, ChevronRight as ChevronRight11, Circle as Circle10 } from "lucide-react";
|
|
17859
|
-
import * as React6 from "react";
|
|
17860
|
-
import { jsx as jsx74, jsxs as jsxs68 } from "react/jsx-runtime";
|
|
17861
|
-
var DropdownMenuSubTrigger = React6.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs68(
|
|
17757
|
+
var DropdownMenuSubTrigger = React6.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs67(
|
|
17862
17758
|
DropdownMenuPrimitive.SubTrigger,
|
|
17863
17759
|
{
|
|
17864
17760
|
ref,
|
|
@@ -17870,12 +17766,12 @@ var DropdownMenuSubTrigger = React6.forwardRef(({ className, inset, children, ..
|
|
|
17870
17766
|
...props,
|
|
17871
17767
|
children: [
|
|
17872
17768
|
children,
|
|
17873
|
-
/* @__PURE__ */
|
|
17769
|
+
/* @__PURE__ */ jsx73(ChevronRight10, { className: "ml-auto h-4 w-4" })
|
|
17874
17770
|
]
|
|
17875
17771
|
}
|
|
17876
17772
|
));
|
|
17877
17773
|
DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
|
|
17878
|
-
var DropdownMenuSubContent = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
|
|
17774
|
+
var DropdownMenuSubContent = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx73(
|
|
17879
17775
|
DropdownMenuPrimitive.SubContent,
|
|
17880
17776
|
{
|
|
17881
17777
|
ref,
|
|
@@ -17887,7 +17783,7 @@ var DropdownMenuSubContent = React6.forwardRef(({ className, ...props }, ref) =>
|
|
|
17887
17783
|
}
|
|
17888
17784
|
));
|
|
17889
17785
|
DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
|
|
17890
|
-
var DropdownMenuContent = React6.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */
|
|
17786
|
+
var DropdownMenuContent = React6.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx73(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx73(
|
|
17891
17787
|
DropdownMenuPrimitive.Content,
|
|
17892
17788
|
{
|
|
17893
17789
|
ref,
|
|
@@ -17900,7 +17796,7 @@ var DropdownMenuContent = React6.forwardRef(({ className, sideOffset = 4, ...pro
|
|
|
17900
17796
|
}
|
|
17901
17797
|
) }));
|
|
17902
17798
|
DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
|
|
17903
|
-
var DropdownMenuItem = React6.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */
|
|
17799
|
+
var DropdownMenuItem = React6.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx73(
|
|
17904
17800
|
DropdownMenuPrimitive.Item,
|
|
17905
17801
|
{
|
|
17906
17802
|
ref,
|
|
@@ -17913,7 +17809,7 @@ var DropdownMenuItem = React6.forwardRef(({ className, inset, ...props }, ref) =
|
|
|
17913
17809
|
}
|
|
17914
17810
|
));
|
|
17915
17811
|
DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
|
|
17916
|
-
var DropdownMenuCheckboxItem = React6.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */
|
|
17812
|
+
var DropdownMenuCheckboxItem = React6.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs67(
|
|
17917
17813
|
DropdownMenuPrimitive.CheckboxItem,
|
|
17918
17814
|
{
|
|
17919
17815
|
ref,
|
|
@@ -17924,13 +17820,13 @@ var DropdownMenuCheckboxItem = React6.forwardRef(({ className, children, checked
|
|
|
17924
17820
|
checked,
|
|
17925
17821
|
...props,
|
|
17926
17822
|
children: [
|
|
17927
|
-
/* @__PURE__ */
|
|
17823
|
+
/* @__PURE__ */ jsx73("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx73(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx73(Check8, { className: "h-4 w-4" }) }) }),
|
|
17928
17824
|
children
|
|
17929
17825
|
]
|
|
17930
17826
|
}
|
|
17931
17827
|
));
|
|
17932
17828
|
DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
|
|
17933
|
-
var DropdownMenuRadioItem = React6.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */
|
|
17829
|
+
var DropdownMenuRadioItem = React6.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs67(
|
|
17934
17830
|
DropdownMenuPrimitive.RadioItem,
|
|
17935
17831
|
{
|
|
17936
17832
|
ref,
|
|
@@ -17940,13 +17836,13 @@ var DropdownMenuRadioItem = React6.forwardRef(({ className, children, ...props }
|
|
|
17940
17836
|
),
|
|
17941
17837
|
...props,
|
|
17942
17838
|
children: [
|
|
17943
|
-
/* @__PURE__ */
|
|
17839
|
+
/* @__PURE__ */ jsx73("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx73(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx73(Circle10, { className: "h-2 w-2 fill-current" }) }) }),
|
|
17944
17840
|
children
|
|
17945
17841
|
]
|
|
17946
17842
|
}
|
|
17947
17843
|
));
|
|
17948
17844
|
DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
|
|
17949
|
-
var DropdownMenuLabel = React6.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */
|
|
17845
|
+
var DropdownMenuLabel = React6.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx73(
|
|
17950
17846
|
DropdownMenuPrimitive.Label,
|
|
17951
17847
|
{
|
|
17952
17848
|
ref,
|
|
@@ -17955,7 +17851,7 @@ var DropdownMenuLabel = React6.forwardRef(({ className, inset, ...props }, ref)
|
|
|
17955
17851
|
}
|
|
17956
17852
|
));
|
|
17957
17853
|
DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
|
|
17958
|
-
var DropdownMenuSeparator = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
|
|
17854
|
+
var DropdownMenuSeparator = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx73(
|
|
17959
17855
|
DropdownMenuPrimitive.Separator,
|
|
17960
17856
|
{
|
|
17961
17857
|
ref,
|
|
@@ -17965,12 +17861,12 @@ var DropdownMenuSeparator = React6.forwardRef(({ className, ...props }, ref) =>
|
|
|
17965
17861
|
));
|
|
17966
17862
|
DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
|
|
17967
17863
|
var DropdownMenuShortcut = ({ className, ...props }) => {
|
|
17968
|
-
return /* @__PURE__ */
|
|
17864
|
+
return /* @__PURE__ */ jsx73("span", { className: cn("ml-auto text-xs tracking-widest opacity-60", className), ...props });
|
|
17969
17865
|
};
|
|
17970
17866
|
DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
|
|
17971
17867
|
|
|
17972
17868
|
// src/components/ui/concurrency-gauge.tsx
|
|
17973
|
-
import { jsx as
|
|
17869
|
+
import { jsx as jsx74, jsxs as jsxs68 } from "react/jsx-runtime";
|
|
17974
17870
|
function ConcurrencyGauge({
|
|
17975
17871
|
current,
|
|
17976
17872
|
max,
|
|
@@ -17981,14 +17877,14 @@ function ConcurrencyGauge({
|
|
|
17981
17877
|
const empty = Math.max(0, max - filled);
|
|
17982
17878
|
const pct = max > 0 ? filled / max * 100 : 0;
|
|
17983
17879
|
const barColor = pct >= 90 ? "text-destructive" : pct >= 70 ? "text-[hsl(var(--warning))]" : "text-[hsl(var(--success))]";
|
|
17984
|
-
return /* @__PURE__ */
|
|
17985
|
-
/* @__PURE__ */
|
|
17880
|
+
return /* @__PURE__ */ jsxs68("span", { className, title: `Fleet concurrency: ${current}/${max}`, children: [
|
|
17881
|
+
/* @__PURE__ */ jsxs68("span", { "aria-hidden": "true", className: "font-mono text-[10px] tracking-tight", children: [
|
|
17986
17882
|
"[",
|
|
17987
|
-
/* @__PURE__ */
|
|
17988
|
-
/* @__PURE__ */
|
|
17883
|
+
/* @__PURE__ */ jsx74("span", { className: barColor, children: "\u2588".repeat(filled) }),
|
|
17884
|
+
/* @__PURE__ */ jsx74("span", { className: "text-[hsl(var(--muted))]", children: "\u2591".repeat(empty) }),
|
|
17989
17885
|
"]"
|
|
17990
17886
|
] }),
|
|
17991
|
-
showLabel && /* @__PURE__ */
|
|
17887
|
+
showLabel && /* @__PURE__ */ jsxs68("span", { className: "ml-1.5 tabular-nums text-[10px] text-muted-foreground font-mono", children: [
|
|
17992
17888
|
current,
|
|
17993
17889
|
"/",
|
|
17994
17890
|
max
|
|
@@ -17997,7 +17893,7 @@ function ConcurrencyGauge({
|
|
|
17997
17893
|
}
|
|
17998
17894
|
|
|
17999
17895
|
// src/components/ui/event-timeline.tsx
|
|
18000
|
-
import { jsx as
|
|
17896
|
+
import { jsx as jsx75, jsxs as jsxs69 } from "react/jsx-runtime";
|
|
18001
17897
|
function relTime(ts) {
|
|
18002
17898
|
const delta = Date.now() - ts;
|
|
18003
17899
|
if (delta < 5e3) return "just now";
|
|
@@ -18018,18 +17914,18 @@ var KIND_ICONS = {
|
|
|
18018
17914
|
function EventTimeline({ events, max = 20, className }) {
|
|
18019
17915
|
const visible = events.slice(0, max);
|
|
18020
17916
|
if (visible.length === 0) {
|
|
18021
|
-
return /* @__PURE__ */
|
|
17917
|
+
return /* @__PURE__ */ jsx75("div", { className: `py-4 text-center text-xs text-muted-foreground ${className ?? ""}`, children: "No events yet." });
|
|
18022
17918
|
}
|
|
18023
|
-
return /* @__PURE__ */
|
|
17919
|
+
return /* @__PURE__ */ jsx75("div", { className: `space-y-0.5 overflow-y-auto max-h-48 ${className ?? ""}`, children: visible.map((ev) => /* @__PURE__ */ jsxs69(
|
|
18024
17920
|
"div",
|
|
18025
17921
|
{
|
|
18026
17922
|
className: "flex items-start gap-2 text-[10px] leading-tight py-0.5 px-1 rounded hover:bg-accent/50 transition-colors",
|
|
18027
17923
|
children: [
|
|
18028
|
-
/* @__PURE__ */
|
|
18029
|
-
/* @__PURE__ */
|
|
18030
|
-
/* @__PURE__ */
|
|
18031
|
-
ev.value !== void 0 && ev.kind === "tool_executed" && /* @__PURE__ */
|
|
18032
|
-
ev.value !== void 0 && ev.kind === "ctx_pct" && /* @__PURE__ */
|
|
17924
|
+
/* @__PURE__ */ jsx75("span", { className: "shrink-0 w-5 text-center", "aria-hidden": "true", children: KIND_ICONS[ev.kind] ?? "\xB7" }),
|
|
17925
|
+
/* @__PURE__ */ jsx75("span", { className: "shrink-0 w-12 text-right text-muted-foreground font-mono tabular-nums", children: relTime(ev.timestamp) }),
|
|
17926
|
+
/* @__PURE__ */ jsx75("span", { className: "truncate text-foreground/90", children: ev.message }),
|
|
17927
|
+
ev.value !== void 0 && ev.kind === "tool_executed" && /* @__PURE__ */ jsx75("span", { className: "ml-auto shrink-0 tabular-nums text-muted-foreground font-mono", children: ev.value >= 1e3 ? `${(ev.value / 1e3).toFixed(1)}s` : `${ev.value}ms` }),
|
|
17928
|
+
ev.value !== void 0 && ev.kind === "ctx_pct" && /* @__PURE__ */ jsxs69("span", { className: "ml-auto shrink-0 tabular-nums text-muted-foreground font-mono", children: [
|
|
18033
17929
|
ev.value,
|
|
18034
17930
|
"%"
|
|
18035
17931
|
] })
|
|
@@ -18040,8 +17936,8 @@ function EventTimeline({ events, max = 20, className }) {
|
|
|
18040
17936
|
}
|
|
18041
17937
|
|
|
18042
17938
|
// src/components/FleetMonitor.tsx
|
|
18043
|
-
import { Fragment as Fragment16, jsx as
|
|
18044
|
-
function
|
|
17939
|
+
import { Fragment as Fragment16, jsx as jsx76, jsxs as jsxs70 } from "react/jsx-runtime";
|
|
17940
|
+
function fmtCost5(v) {
|
|
18045
17941
|
if (v <= 0) return "$0";
|
|
18046
17942
|
if (v >= 0.01) return `$${v.toFixed(3)}`;
|
|
18047
17943
|
return `$${v.toFixed(5)}`.replace(/0+$/, "").replace(/\.$/, "");
|
|
@@ -18059,7 +17955,7 @@ function fmtElapsed3(ms) {
|
|
|
18059
17955
|
if (m > 0) return `${m}m ${s % 60}s`;
|
|
18060
17956
|
return `${s}s`;
|
|
18061
17957
|
}
|
|
18062
|
-
var
|
|
17958
|
+
var STATUS_META5 = {
|
|
18063
17959
|
running: { led: "bg-emerald-500", label: "running", pulse: true, color: "text-emerald-500" },
|
|
18064
17960
|
completed: { led: "bg-emerald-500", label: "done", pulse: false, color: "text-emerald-500" },
|
|
18065
17961
|
failed: { led: "bg-destructive", label: "failed", pulse: false, color: "text-destructive" },
|
|
@@ -18072,9 +17968,9 @@ function FleetAgentDetailPanel({
|
|
|
18072
17968
|
}) {
|
|
18073
17969
|
const [copied, setCopied] = useState48(false);
|
|
18074
17970
|
const [showFullToolLog, setShowFullToolLog] = useState48(false);
|
|
18075
|
-
const meta2 =
|
|
17971
|
+
const meta2 = STATUS_META5[agent.status];
|
|
18076
17972
|
const active = agent.status === "running";
|
|
18077
|
-
const handleCopy =
|
|
17973
|
+
const handleCopy = useCallback27(async (text) => {
|
|
18078
17974
|
try {
|
|
18079
17975
|
await navigator.clipboard.writeText(text);
|
|
18080
17976
|
setCopied(true);
|
|
@@ -18084,110 +17980,110 @@ function FleetAgentDetailPanel({
|
|
|
18084
17980
|
}, []);
|
|
18085
17981
|
const totalToolDuration = agent.toolLog.reduce((sum, t) => sum + t.durationMs, 0);
|
|
18086
17982
|
const avgToolDuration = agent.toolLog.length > 0 ? Math.round(totalToolDuration / agent.toolLog.length) : 0;
|
|
18087
|
-
const uniqueTools =
|
|
17983
|
+
const uniqueTools = useMemo17(() => {
|
|
18088
17984
|
const tools = /* @__PURE__ */ new Set();
|
|
18089
17985
|
agent.toolLog.forEach((t) => tools.add(t.name));
|
|
18090
17986
|
return tools.size;
|
|
18091
17987
|
}, [agent.toolLog]);
|
|
18092
17988
|
const outputText = agent.partialText || agent.finalText || void 0;
|
|
18093
17989
|
const isStream = !agent.finalText && !!agent.partialText;
|
|
18094
|
-
return /* @__PURE__ */
|
|
18095
|
-
/* @__PURE__ */
|
|
18096
|
-
/* @__PURE__ */
|
|
18097
|
-
/* @__PURE__ */
|
|
18098
|
-
/* @__PURE__ */
|
|
18099
|
-
/* @__PURE__ */
|
|
18100
|
-
/* @__PURE__ */
|
|
18101
|
-
/* @__PURE__ */
|
|
18102
|
-
/* @__PURE__ */
|
|
17990
|
+
return /* @__PURE__ */ jsxs70("div", { className: "h-full flex flex-col", children: [
|
|
17991
|
+
/* @__PURE__ */ jsxs70("div", { className: "shrink-0 border-b bg-card p-4 space-y-3", children: [
|
|
17992
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center justify-between", children: [
|
|
17993
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-3", children: [
|
|
17994
|
+
/* @__PURE__ */ jsx76("div", { className: "flex items-center justify-center w-10 h-10 rounded-lg bg-primary/10", children: /* @__PURE__ */ jsx76(Bot12, { className: "h-5 w-5 text-primary" }) }),
|
|
17995
|
+
/* @__PURE__ */ jsxs70("div", { children: [
|
|
17996
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-2", children: [
|
|
17997
|
+
/* @__PURE__ */ jsx76("span", { className: "text-base font-semibold", children: agent.name }),
|
|
17998
|
+
/* @__PURE__ */ jsx76("span", { className: cn(
|
|
18103
17999
|
"px-2 py-0.5 rounded text-[10px] font-medium uppercase tracking-wider",
|
|
18104
18000
|
agent.status === "running" ? "bg-emerald-500/15 text-emerald-600 dark:text-emerald-400" : agent.status === "failed" || agent.status === "timeout" ? "bg-destructive/15 text-destructive" : "bg-muted text-muted-foreground"
|
|
18105
18001
|
), children: meta2.label })
|
|
18106
18002
|
] }),
|
|
18107
|
-
/* @__PURE__ */
|
|
18003
|
+
/* @__PURE__ */ jsxs70("span", { className: "text-[10px] text-muted-foreground font-mono", children: [
|
|
18108
18004
|
"session: ",
|
|
18109
18005
|
agent.sessionId?.slice(0, 12),
|
|
18110
18006
|
"\u2026"
|
|
18111
18007
|
] })
|
|
18112
18008
|
] })
|
|
18113
18009
|
] }),
|
|
18114
|
-
/* @__PURE__ */
|
|
18115
|
-
active && /* @__PURE__ */
|
|
18116
|
-
/* @__PURE__ */
|
|
18117
|
-
/* @__PURE__ */
|
|
18010
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-2 text-[11px] text-muted-foreground", children: [
|
|
18011
|
+
active && /* @__PURE__ */ jsxs70("span", { className: "flex items-center gap-1.5", children: [
|
|
18012
|
+
/* @__PURE__ */ jsx76(Timer3, { className: "h-3.5 w-3.5" }),
|
|
18013
|
+
/* @__PURE__ */ jsx76("span", { className: "tabular-nums font-mono", children: fmtElapsed3(Math.max(0, now - agent.startedAt)) })
|
|
18118
18014
|
] }),
|
|
18119
|
-
/* @__PURE__ */
|
|
18015
|
+
/* @__PURE__ */ jsx76("span", { className: cn("led", meta2.led, active && "led-pulse") })
|
|
18120
18016
|
] })
|
|
18121
18017
|
] }),
|
|
18122
|
-
/* @__PURE__ */
|
|
18123
|
-
/* @__PURE__ */
|
|
18124
|
-
/* @__PURE__ */
|
|
18125
|
-
agent.budgetWarning && /* @__PURE__ */
|
|
18126
|
-
/* @__PURE__ */
|
|
18018
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-3 px-3 py-2 rounded-lg bg-muted/30", children: [
|
|
18019
|
+
/* @__PURE__ */ jsx76("span", { className: "text-[10px] text-muted-foreground uppercase tracking-wider", children: "Activity" }),
|
|
18020
|
+
/* @__PURE__ */ jsx76(SparklineChart, { bins: agent.sparklineBins, className: "font-mono text-[9px]" }),
|
|
18021
|
+
agent.budgetWarning && /* @__PURE__ */ jsxs70("span", { className: "ml-auto flex items-center gap-1 text-[10px] text-amber-500", children: [
|
|
18022
|
+
/* @__PURE__ */ jsx76(Zap10, { className: "h-3 w-3" }),
|
|
18127
18023
|
"budget warning"
|
|
18128
18024
|
] })
|
|
18129
18025
|
] }),
|
|
18130
|
-
agent.description && /* @__PURE__ */
|
|
18131
|
-
/* @__PURE__ */
|
|
18132
|
-
/* @__PURE__ */
|
|
18026
|
+
agent.description && /* @__PURE__ */ jsxs70("div", { className: "px-3 py-2 rounded-lg bg-muted/20 border border-border/50", children: [
|
|
18027
|
+
/* @__PURE__ */ jsx76("span", { className: "text-[9px] text-muted-foreground uppercase tracking-wider", children: "Current Task" }),
|
|
18028
|
+
/* @__PURE__ */ jsx76("p", { className: "text-xs mt-1 text-foreground/80", children: agent.description })
|
|
18133
18029
|
] })
|
|
18134
18030
|
] }),
|
|
18135
|
-
/* @__PURE__ */
|
|
18136
|
-
/* @__PURE__ */
|
|
18137
|
-
/* @__PURE__ */
|
|
18138
|
-
/* @__PURE__ */
|
|
18139
|
-
/* @__PURE__ */
|
|
18031
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex-1 overflow-y-auto p-4 space-y-4", children: [
|
|
18032
|
+
/* @__PURE__ */ jsxs70("div", { className: "grid grid-cols-2 gap-3", children: [
|
|
18033
|
+
/* @__PURE__ */ jsxs70("div", { className: "rounded-lg border bg-card p-3", children: [
|
|
18034
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-2 text-[9px] text-muted-foreground uppercase tracking-wider mb-2", children: [
|
|
18035
|
+
/* @__PURE__ */ jsx76(Cpu14, { className: "h-3 w-3" }),
|
|
18140
18036
|
" Provider / Model"
|
|
18141
18037
|
] }),
|
|
18142
|
-
/* @__PURE__ */
|
|
18038
|
+
/* @__PURE__ */ jsxs70("div", { className: "text-sm font-mono font-medium", children: [
|
|
18143
18039
|
agent.provider ?? "?",
|
|
18144
18040
|
"/",
|
|
18145
18041
|
agent.model ?? "?"
|
|
18146
18042
|
] })
|
|
18147
18043
|
] }),
|
|
18148
|
-
/* @__PURE__ */
|
|
18149
|
-
/* @__PURE__ */
|
|
18150
|
-
/* @__PURE__ */
|
|
18044
|
+
/* @__PURE__ */ jsxs70("div", { className: "rounded-lg border bg-card p-3", children: [
|
|
18045
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-2 text-[9px] text-muted-foreground uppercase tracking-wider mb-2", children: [
|
|
18046
|
+
/* @__PURE__ */ jsx76(Activity5, { className: "h-3 w-3" }),
|
|
18151
18047
|
" Performance"
|
|
18152
18048
|
] }),
|
|
18153
|
-
/* @__PURE__ */
|
|
18154
|
-
/* @__PURE__ */
|
|
18155
|
-
/* @__PURE__ */
|
|
18156
|
-
/* @__PURE__ */
|
|
18049
|
+
/* @__PURE__ */ jsxs70("div", { className: "space-y-1", children: [
|
|
18050
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex justify-between text-[11px]", children: [
|
|
18051
|
+
/* @__PURE__ */ jsx76("span", { className: "text-muted-foreground", children: "Iterations" }),
|
|
18052
|
+
/* @__PURE__ */ jsx76("span", { className: "font-mono font-medium", children: agent.iteration })
|
|
18157
18053
|
] }),
|
|
18158
|
-
/* @__PURE__ */
|
|
18159
|
-
/* @__PURE__ */
|
|
18160
|
-
/* @__PURE__ */
|
|
18054
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex justify-between text-[11px]", children: [
|
|
18055
|
+
/* @__PURE__ */ jsx76("span", { className: "text-muted-foreground", children: "Tool Calls" }),
|
|
18056
|
+
/* @__PURE__ */ jsx76("span", { className: "font-mono font-medium", children: agent.toolCalls })
|
|
18161
18057
|
] }),
|
|
18162
|
-
/* @__PURE__ */
|
|
18163
|
-
/* @__PURE__ */
|
|
18164
|
-
/* @__PURE__ */
|
|
18058
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex justify-between text-[11px]", children: [
|
|
18059
|
+
/* @__PURE__ */ jsx76("span", { className: "text-muted-foreground", children: "Unique Tools" }),
|
|
18060
|
+
/* @__PURE__ */ jsx76("span", { className: "font-mono font-medium", children: uniqueTools })
|
|
18165
18061
|
] })
|
|
18166
18062
|
] })
|
|
18167
18063
|
] }),
|
|
18168
|
-
/* @__PURE__ */
|
|
18169
|
-
/* @__PURE__ */
|
|
18170
|
-
/* @__PURE__ */
|
|
18064
|
+
/* @__PURE__ */ jsxs70("div", { className: "rounded-lg border bg-card p-3", children: [
|
|
18065
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-2 text-[9px] text-muted-foreground uppercase tracking-wider mb-2", children: [
|
|
18066
|
+
/* @__PURE__ */ jsx76(DollarSign2, { className: "h-3 w-3" }),
|
|
18171
18067
|
" Cost"
|
|
18172
18068
|
] }),
|
|
18173
|
-
/* @__PURE__ */
|
|
18174
|
-
/* @__PURE__ */
|
|
18069
|
+
/* @__PURE__ */ jsx76("div", { className: "text-lg font-mono font-bold text-emerald-500", children: fmtCost5(agent.costUsd) }),
|
|
18070
|
+
/* @__PURE__ */ jsxs70("div", { className: "text-[10px] text-muted-foreground mt-1", children: [
|
|
18175
18071
|
"avg ",
|
|
18176
18072
|
avgToolDuration,
|
|
18177
18073
|
"ms per tool"
|
|
18178
18074
|
] })
|
|
18179
18075
|
] }),
|
|
18180
|
-
/* @__PURE__ */
|
|
18181
|
-
/* @__PURE__ */
|
|
18182
|
-
/* @__PURE__ */
|
|
18076
|
+
/* @__PURE__ */ jsxs70("div", { className: "rounded-lg border bg-card p-3", children: [
|
|
18077
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-2 text-[9px] text-muted-foreground uppercase tracking-wider mb-2", children: [
|
|
18078
|
+
/* @__PURE__ */ jsx76(Database4, { className: "h-3 w-3" }),
|
|
18183
18079
|
" Context"
|
|
18184
18080
|
] }),
|
|
18185
|
-
/* @__PURE__ */
|
|
18186
|
-
/* @__PURE__ */
|
|
18187
|
-
/* @__PURE__ */
|
|
18188
|
-
/* @__PURE__ */
|
|
18081
|
+
/* @__PURE__ */ jsxs70("div", { className: "space-y-2", children: [
|
|
18082
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex justify-between text-[11px]", children: [
|
|
18083
|
+
/* @__PURE__ */ jsx76("span", { className: "text-muted-foreground", children: "Tokens" }),
|
|
18084
|
+
/* @__PURE__ */ jsx76("span", { className: "font-mono font-medium", children: fmtTok3(agent.ctxTokens) })
|
|
18189
18085
|
] }),
|
|
18190
|
-
/* @__PURE__ */
|
|
18086
|
+
/* @__PURE__ */ jsx76("div", { className: "h-2 w-full rounded-full bg-muted overflow-hidden", children: /* @__PURE__ */ jsx76(
|
|
18191
18087
|
"div",
|
|
18192
18088
|
{
|
|
18193
18089
|
className: cn(
|
|
@@ -18197,34 +18093,34 @@ function FleetAgentDetailPanel({
|
|
|
18197
18093
|
style: { width: `${Math.min(200, agent.ctxPct)}%` }
|
|
18198
18094
|
}
|
|
18199
18095
|
) }),
|
|
18200
|
-
/* @__PURE__ */
|
|
18096
|
+
/* @__PURE__ */ jsxs70("span", { className: "text-[10px] text-muted-foreground tabular-nums font-mono", children: [
|
|
18201
18097
|
agent.ctxPct,
|
|
18202
18098
|
"% used"
|
|
18203
18099
|
] })
|
|
18204
18100
|
] })
|
|
18205
18101
|
] })
|
|
18206
18102
|
] }),
|
|
18207
|
-
agent.currentTool && /* @__PURE__ */
|
|
18103
|
+
agent.currentTool && /* @__PURE__ */ jsxs70("div", { className: cn(
|
|
18208
18104
|
"rounded-lg border px-4 py-3 flex items-center gap-3",
|
|
18209
18105
|
active ? "border-primary/30 bg-primary/[0.04]" : "border-border bg-muted/30"
|
|
18210
18106
|
), children: [
|
|
18211
|
-
/* @__PURE__ */
|
|
18212
|
-
/* @__PURE__ */
|
|
18213
|
-
active ? /* @__PURE__ */
|
|
18214
|
-
/* @__PURE__ */
|
|
18107
|
+
/* @__PURE__ */ jsx76(Wrench9, { className: cn("h-4 w-4", active ? "text-primary animate-pulse" : "text-muted-foreground") }),
|
|
18108
|
+
/* @__PURE__ */ jsx76("span", { className: "text-sm font-mono font-medium", children: agent.currentTool }),
|
|
18109
|
+
active ? /* @__PURE__ */ jsxs70("span", { className: "ml-auto flex items-center gap-1.5 text-[10px] text-primary", children: [
|
|
18110
|
+
/* @__PURE__ */ jsx76(Loader211, { className: "h-3 w-3 animate-spin" }),
|
|
18215
18111
|
" running\u2026"
|
|
18216
|
-
] }) : /* @__PURE__ */
|
|
18112
|
+
] }) : /* @__PURE__ */ jsx76("span", { className: "ml-auto text-[10px] text-muted-foreground", children: "completed" })
|
|
18217
18113
|
] }),
|
|
18218
|
-
outputText ? /* @__PURE__ */
|
|
18219
|
-
/* @__PURE__ */
|
|
18220
|
-
/* @__PURE__ */
|
|
18221
|
-
/* @__PURE__ */
|
|
18114
|
+
outputText ? /* @__PURE__ */ jsxs70("div", { className: "rounded-lg border bg-card", children: [
|
|
18115
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center justify-between px-4 py-2 border-b bg-muted/30", children: [
|
|
18116
|
+
/* @__PURE__ */ jsx76("span", { className: "text-[10px] font-semibold text-muted-foreground uppercase tracking-wider flex items-center gap-2", children: isStream ? /* @__PURE__ */ jsxs70(Fragment16, { children: [
|
|
18117
|
+
/* @__PURE__ */ jsx76("span", { className: "w-2 h-2 rounded-full bg-blue-500 animate-pulse" }),
|
|
18222
18118
|
"Live Output"
|
|
18223
|
-
] }) : /* @__PURE__ */
|
|
18224
|
-
/* @__PURE__ */
|
|
18119
|
+
] }) : /* @__PURE__ */ jsxs70(Fragment16, { children: [
|
|
18120
|
+
/* @__PURE__ */ jsx76(FolderOpen5, { className: "h-3 w-3" }),
|
|
18225
18121
|
"Final Output"
|
|
18226
18122
|
] }) }),
|
|
18227
|
-
/* @__PURE__ */
|
|
18123
|
+
/* @__PURE__ */ jsx76(
|
|
18228
18124
|
"button",
|
|
18229
18125
|
{
|
|
18230
18126
|
type: "button",
|
|
@@ -18234,16 +18130,16 @@ function FleetAgentDetailPanel({
|
|
|
18234
18130
|
}
|
|
18235
18131
|
)
|
|
18236
18132
|
] }),
|
|
18237
|
-
/* @__PURE__ */
|
|
18238
|
-
] }) : active ? /* @__PURE__ */
|
|
18239
|
-
/* @__PURE__ */
|
|
18240
|
-
/* @__PURE__ */
|
|
18133
|
+
/* @__PURE__ */ jsx76("pre", { className: "p-4 text-xs whitespace-pre-wrap font-mono text-foreground/80 leading-relaxed max-h-64 overflow-y-auto", children: outputText })
|
|
18134
|
+
] }) : active ? /* @__PURE__ */ jsxs70("div", { className: "rounded-lg border border-dashed border-border p-6 text-center", children: [
|
|
18135
|
+
/* @__PURE__ */ jsx76(Loader211, { className: "h-6 w-6 mx-auto mb-2 text-muted-foreground/50 animate-spin" }),
|
|
18136
|
+
/* @__PURE__ */ jsx76("span", { className: "text-xs text-muted-foreground", children: "Waiting for output\u2026" })
|
|
18241
18137
|
] }) : null,
|
|
18242
|
-
agent.budgetWarning && /* @__PURE__ */
|
|
18243
|
-
/* @__PURE__ */
|
|
18244
|
-
/* @__PURE__ */
|
|
18245
|
-
/* @__PURE__ */
|
|
18246
|
-
/* @__PURE__ */
|
|
18138
|
+
agent.budgetWarning && /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-3 px-4 py-3 rounded-lg bg-amber-500/10 border border-amber-500/20", children: [
|
|
18139
|
+
/* @__PURE__ */ jsx76(Zap10, { className: "h-5 w-5 text-amber-500 shrink-0" }),
|
|
18140
|
+
/* @__PURE__ */ jsxs70("div", { children: [
|
|
18141
|
+
/* @__PURE__ */ jsx76("span", { className: "text-sm font-medium text-amber-600 dark:text-amber-400", children: "\u26A1 Budget Warning" }),
|
|
18142
|
+
/* @__PURE__ */ jsxs70("p", { className: "text-[11px] text-amber-600/80 dark:text-amber-400/80 mt-0.5", children: [
|
|
18247
18143
|
"Hitting ",
|
|
18248
18144
|
agent.budgetWarning.kind,
|
|
18249
18145
|
" limit (",
|
|
@@ -18254,15 +18150,15 @@ function FleetAgentDetailPanel({
|
|
|
18254
18150
|
] })
|
|
18255
18151
|
] })
|
|
18256
18152
|
] }),
|
|
18257
|
-
agent.extensions > 0 && /* @__PURE__ */
|
|
18258
|
-
/* @__PURE__ */
|
|
18259
|
-
/* @__PURE__ */
|
|
18260
|
-
/* @__PURE__ */
|
|
18153
|
+
agent.extensions > 0 && /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-3 px-4 py-3 rounded-lg bg-amber-500/10 border border-amber-500/20", children: [
|
|
18154
|
+
/* @__PURE__ */ jsx76(Zap10, { className: "h-5 w-5 text-amber-500 shrink-0" }),
|
|
18155
|
+
/* @__PURE__ */ jsxs70("div", { children: [
|
|
18156
|
+
/* @__PURE__ */ jsxs70("span", { className: "text-sm font-medium", children: [
|
|
18261
18157
|
agent.extensions,
|
|
18262
18158
|
" Budget Extension",
|
|
18263
18159
|
agent.extensions === 1 ? "" : "s"
|
|
18264
18160
|
] }),
|
|
18265
|
-
/* @__PURE__ */
|
|
18161
|
+
/* @__PURE__ */ jsxs70("p", { className: "text-[11px] text-muted-foreground mt-0.5", children: [
|
|
18266
18162
|
"Agent extended its budget ",
|
|
18267
18163
|
agent.extensions,
|
|
18268
18164
|
" time",
|
|
@@ -18271,39 +18167,39 @@ function FleetAgentDetailPanel({
|
|
|
18271
18167
|
] })
|
|
18272
18168
|
] })
|
|
18273
18169
|
] }),
|
|
18274
|
-
agent.error && /* @__PURE__ */
|
|
18275
|
-
/* @__PURE__ */
|
|
18276
|
-
/* @__PURE__ */
|
|
18277
|
-
/* @__PURE__ */
|
|
18170
|
+
agent.error && /* @__PURE__ */ jsxs70("div", { className: "rounded-lg border border-destructive/30 bg-destructive/5 p-4", children: [
|
|
18171
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-2 mb-2", children: [
|
|
18172
|
+
/* @__PURE__ */ jsx76(XCircle9, { className: "h-4 w-4 text-destructive" }),
|
|
18173
|
+
/* @__PURE__ */ jsx76("span", { className: "text-[10px] font-semibold text-destructive uppercase tracking-wider", children: "Error" })
|
|
18278
18174
|
] }),
|
|
18279
|
-
/* @__PURE__ */
|
|
18175
|
+
/* @__PURE__ */ jsx76("p", { className: "text-sm text-destructive/90", children: agent.error.message })
|
|
18280
18176
|
] }),
|
|
18281
|
-
agent.failureReason && /* @__PURE__ */
|
|
18282
|
-
/* @__PURE__ */
|
|
18283
|
-
/* @__PURE__ */
|
|
18284
|
-
/* @__PURE__ */
|
|
18177
|
+
agent.failureReason && /* @__PURE__ */ jsxs70("div", { className: "rounded-lg border border-destructive/30 bg-destructive/5 p-4", children: [
|
|
18178
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-2 mb-2", children: [
|
|
18179
|
+
/* @__PURE__ */ jsx76(XCircle9, { className: "h-4 w-4 text-destructive" }),
|
|
18180
|
+
/* @__PURE__ */ jsx76("span", { className: "text-[10px] font-semibold text-destructive uppercase tracking-wider", children: "Failure Reason" })
|
|
18285
18181
|
] }),
|
|
18286
|
-
/* @__PURE__ */
|
|
18182
|
+
/* @__PURE__ */ jsx76("p", { className: "text-sm text-destructive/90", children: agent.failureReason })
|
|
18287
18183
|
] }),
|
|
18288
|
-
agent.toolLog.length > 0 && /* @__PURE__ */
|
|
18289
|
-
/* @__PURE__ */
|
|
18184
|
+
agent.toolLog.length > 0 && /* @__PURE__ */ jsxs70("div", { className: "rounded-lg border bg-card", children: [
|
|
18185
|
+
/* @__PURE__ */ jsxs70(
|
|
18290
18186
|
"button",
|
|
18291
18187
|
{
|
|
18292
18188
|
type: "button",
|
|
18293
18189
|
onClick: () => setShowFullToolLog(!showFullToolLog),
|
|
18294
18190
|
className: "w-full flex items-center justify-between px-4 py-2 border-b bg-muted/30 hover:bg-muted/50 transition-colors",
|
|
18295
18191
|
children: [
|
|
18296
|
-
/* @__PURE__ */
|
|
18297
|
-
/* @__PURE__ */
|
|
18192
|
+
/* @__PURE__ */ jsxs70("span", { className: "text-[10px] font-semibold text-muted-foreground uppercase tracking-wider flex items-center gap-2", children: [
|
|
18193
|
+
/* @__PURE__ */ jsx76(Wrench9, { className: "h-3 w-3" }),
|
|
18298
18194
|
"Tool Log (",
|
|
18299
18195
|
agent.toolLog.length,
|
|
18300
18196
|
" calls)"
|
|
18301
18197
|
] }),
|
|
18302
|
-
/* @__PURE__ */
|
|
18198
|
+
/* @__PURE__ */ jsx76(ChevronRight11, { className: cn("h-4 w-4 text-muted-foreground transition-transform", showFullToolLog && "rotate-90") })
|
|
18303
18199
|
]
|
|
18304
18200
|
}
|
|
18305
18201
|
),
|
|
18306
|
-
/* @__PURE__ */
|
|
18202
|
+
/* @__PURE__ */ jsx76("div", { className: cn("overflow-hidden transition-all", showFullToolLog ? "max-h-[500px]" : "max-h-48"), children: /* @__PURE__ */ jsx76("div", { className: "p-2 space-y-0.5", children: agent.toolLog.map((tl, i) => /* @__PURE__ */ jsxs70(
|
|
18307
18203
|
"div",
|
|
18308
18204
|
{
|
|
18309
18205
|
className: cn(
|
|
@@ -18311,11 +18207,11 @@ function FleetAgentDetailPanel({
|
|
|
18311
18207
|
tl.ok ? "bg-muted/30 hover:bg-muted/50" : "bg-destructive/5 border border-destructive/20"
|
|
18312
18208
|
),
|
|
18313
18209
|
children: [
|
|
18314
|
-
/* @__PURE__ */
|
|
18315
|
-
/* @__PURE__ */
|
|
18316
|
-
/* @__PURE__ */
|
|
18317
|
-
!tl.ok && /* @__PURE__ */
|
|
18318
|
-
/* @__PURE__ */
|
|
18210
|
+
/* @__PURE__ */ jsx76("span", { className: cn("led shrink-0", tl.ok ? "bg-emerald-500" : "bg-destructive") }),
|
|
18211
|
+
/* @__PURE__ */ jsx76("span", { className: cn("font-mono font-medium w-20 shrink-0", tl.ok ? "text-foreground" : "text-destructive"), children: tl.name }),
|
|
18212
|
+
/* @__PURE__ */ jsx76("span", { className: "text-muted-foreground tabular-nums text-[10px]", children: tl.durationMs >= 1e3 ? `${(tl.durationMs / 1e3).toFixed(2)}s` : `${tl.durationMs}ms` }),
|
|
18213
|
+
!tl.ok && /* @__PURE__ */ jsx76("span", { className: "ml-auto text-[10px] text-destructive font-medium", children: "Failed" }),
|
|
18214
|
+
/* @__PURE__ */ jsx76("span", { className: "ml-auto text-[9px] text-muted-foreground tabular-nums", children: new Date(tl.at).toLocaleTimeString() })
|
|
18319
18215
|
]
|
|
18320
18216
|
},
|
|
18321
18217
|
`${tl.name}-${tl.at}-${i}`
|
|
@@ -18330,9 +18226,9 @@ function FleetAgentRow({
|
|
|
18330
18226
|
isLeader,
|
|
18331
18227
|
onClick
|
|
18332
18228
|
}) {
|
|
18333
|
-
const meta2 =
|
|
18229
|
+
const meta2 = STATUS_META5[agent.status];
|
|
18334
18230
|
const active = agent.status === "running";
|
|
18335
|
-
return /* @__PURE__ */
|
|
18231
|
+
return /* @__PURE__ */ jsxs70(
|
|
18336
18232
|
"button",
|
|
18337
18233
|
{
|
|
18338
18234
|
type: "button",
|
|
@@ -18343,27 +18239,27 @@ function FleetAgentRow({
|
|
|
18343
18239
|
active && !isSelected && "bg-muted/30"
|
|
18344
18240
|
),
|
|
18345
18241
|
children: [
|
|
18346
|
-
/* @__PURE__ */
|
|
18347
|
-
/* @__PURE__ */
|
|
18348
|
-
/* @__PURE__ */
|
|
18349
|
-
isLeader && /* @__PURE__ */
|
|
18242
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-1 min-w-0", children: [
|
|
18243
|
+
/* @__PURE__ */ jsx76("span", { className: cn("led shrink-0", meta2.led, meta2.pulse && "led-pulse") }),
|
|
18244
|
+
/* @__PURE__ */ jsx76("span", { className: "truncate font-medium", children: agent.name }),
|
|
18245
|
+
isLeader && /* @__PURE__ */ jsx76(Crown2, { className: "h-3 w-3 shrink-0 text-amber-500", "aria-label": "leader" })
|
|
18350
18246
|
] }),
|
|
18351
|
-
/* @__PURE__ */
|
|
18352
|
-
/* @__PURE__ */
|
|
18353
|
-
/* @__PURE__ */
|
|
18354
|
-
agent.budgetWarning && /* @__PURE__ */
|
|
18247
|
+
/* @__PURE__ */ jsx76("span", { className: cn("text-[10px] tabular-nums", active ? "text-emerald-500" : "text-muted-foreground"), children: meta2.label }),
|
|
18248
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-1 min-w-0", children: [
|
|
18249
|
+
/* @__PURE__ */ jsx76(SparklineChart, { bins: agent.sparklineBins, className: "font-mono text-[9px]" }),
|
|
18250
|
+
agent.budgetWarning && /* @__PURE__ */ jsx76("span", { title: `\u26A1 hitting ${agent.budgetWarning.kind} limit (${agent.budgetWarning.used}/${agent.budgetWarning.limit})`, children: /* @__PURE__ */ jsx76(Zap10, { className: "h-3 w-3 shrink-0 text-amber-500", "aria-label": "budget warning" }) })
|
|
18355
18251
|
] }),
|
|
18356
|
-
/* @__PURE__ */
|
|
18252
|
+
/* @__PURE__ */ jsxs70("span", { className: "tabular-nums text-muted-foreground text-[10px]", children: [
|
|
18357
18253
|
agent.iteration,
|
|
18358
18254
|
"it"
|
|
18359
18255
|
] }),
|
|
18360
|
-
/* @__PURE__ */
|
|
18256
|
+
/* @__PURE__ */ jsxs70("span", { className: "tabular-nums text-muted-foreground text-[10px]", children: [
|
|
18361
18257
|
agent.toolCalls,
|
|
18362
18258
|
"tc"
|
|
18363
18259
|
] }),
|
|
18364
|
-
/* @__PURE__ */
|
|
18365
|
-
/* @__PURE__ */
|
|
18366
|
-
/* @__PURE__ */
|
|
18260
|
+
/* @__PURE__ */ jsx76("span", { className: "tabular-nums font-mono text-[10px]", children: fmtCost5(agent.costUsd) }),
|
|
18261
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex flex-col gap-0.5 min-w-0", children: [
|
|
18262
|
+
/* @__PURE__ */ jsx76("div", { className: "h-1.5 w-full rounded-full bg-muted overflow-hidden", children: /* @__PURE__ */ jsx76(
|
|
18367
18263
|
"div",
|
|
18368
18264
|
{
|
|
18369
18265
|
className: cn(
|
|
@@ -18373,10 +18269,10 @@ function FleetAgentRow({
|
|
|
18373
18269
|
style: { width: `${Math.min(200, agent.ctxPct)}%` }
|
|
18374
18270
|
}
|
|
18375
18271
|
) }),
|
|
18376
|
-
/* @__PURE__ */
|
|
18272
|
+
/* @__PURE__ */ jsx76("span", { className: "text-[9px] tabular-nums text-muted-foreground font-mono leading-none", children: agent.maxContext > 0 ? `${agent.ctxPct}%` : "\u2014" })
|
|
18377
18273
|
] }),
|
|
18378
|
-
/* @__PURE__ */
|
|
18379
|
-
/* @__PURE__ */
|
|
18274
|
+
/* @__PURE__ */ jsx76("span", { className: "tabular-nums text-[10px] text-muted-foreground", children: agent.extensions > 0 ? `\u26A1\xD7${agent.extensions}` : "\u2014" }),
|
|
18275
|
+
/* @__PURE__ */ jsx76("span", { className: "text-[9px] text-destructive truncate", title: agent.failureReason, children: agent.failureReason ?? "" })
|
|
18380
18276
|
]
|
|
18381
18277
|
}
|
|
18382
18278
|
);
|
|
@@ -18399,7 +18295,7 @@ function FleetMonitor({
|
|
|
18399
18295
|
const t = setInterval(() => setNowTick(Date.now()), 1e3);
|
|
18400
18296
|
return () => clearInterval(t);
|
|
18401
18297
|
}, []);
|
|
18402
|
-
const fleetList =
|
|
18298
|
+
const fleetList = useMemo17(() => {
|
|
18403
18299
|
const arr = Array.from(fleetAgents.values());
|
|
18404
18300
|
arr.sort((x, y) => {
|
|
18405
18301
|
if (x.id === leaderId) return -1;
|
|
@@ -18411,13 +18307,13 @@ function FleetMonitor({
|
|
|
18411
18307
|
});
|
|
18412
18308
|
return arr;
|
|
18413
18309
|
}, [fleetAgents, leaderId]);
|
|
18414
|
-
const totalCost =
|
|
18310
|
+
const totalCost = useMemo17(
|
|
18415
18311
|
() => Array.from(fleetAgents.values()).reduce((sum, a) => sum + a.costUsd, 0),
|
|
18416
18312
|
[fleetAgents]
|
|
18417
18313
|
);
|
|
18418
18314
|
const runningCount = fleetList.filter((a) => a.status === "running").length;
|
|
18419
18315
|
const selectedAgent = selectedIdx !== null ? fleetList[selectedIdx] : null;
|
|
18420
|
-
const handleKeyDown =
|
|
18316
|
+
const handleKeyDown = useCallback27(
|
|
18421
18317
|
(e) => {
|
|
18422
18318
|
if (e.key === "Escape") {
|
|
18423
18319
|
if (selectedIdx !== null) {
|
|
@@ -18451,30 +18347,30 @@ function FleetMonitor({
|
|
|
18451
18347
|
return () => window.removeEventListener("keydown", handleGlobal);
|
|
18452
18348
|
}, [onClose]);
|
|
18453
18349
|
const containerClass = isOverlay ? "fixed inset-0 z-50 flex flex-col bg-background/95 backdrop-blur-md" : "flex flex-col h-full";
|
|
18454
|
-
return /* @__PURE__ */
|
|
18350
|
+
return /* @__PURE__ */ jsxs70(
|
|
18455
18351
|
"div",
|
|
18456
18352
|
{
|
|
18457
18353
|
className: containerClass,
|
|
18458
18354
|
onKeyDown: handleKeyDown,
|
|
18459
18355
|
tabIndex: -1,
|
|
18460
18356
|
children: [
|
|
18461
|
-
/* @__PURE__ */
|
|
18462
|
-
/* @__PURE__ */
|
|
18463
|
-
/* @__PURE__ */
|
|
18464
|
-
/* @__PURE__ */
|
|
18357
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center justify-between px-4 py-3 border-b bg-card/80 backdrop-blur shrink-0", children: [
|
|
18358
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-3", children: [
|
|
18359
|
+
/* @__PURE__ */ jsx76(Bot12, { className: "h-5 w-5 text-primary" }),
|
|
18360
|
+
/* @__PURE__ */ jsxs70("h2", { className: "text-sm font-semibold flex items-center gap-2", children: [
|
|
18465
18361
|
"FLEET MONITOR",
|
|
18466
|
-
runningCount > 0 && /* @__PURE__ */
|
|
18467
|
-
/* @__PURE__ */
|
|
18362
|
+
runningCount > 0 && /* @__PURE__ */ jsxs70("span", { className: "flex items-center gap-1 text-[11px] text-emerald-500 font-normal", children: [
|
|
18363
|
+
/* @__PURE__ */ jsx76("span", { className: "led led-pulse bg-emerald-500" }),
|
|
18468
18364
|
runningCount,
|
|
18469
18365
|
" running"
|
|
18470
18366
|
] })
|
|
18471
18367
|
] }),
|
|
18472
|
-
/* @__PURE__ */
|
|
18473
|
-
/* @__PURE__ */
|
|
18368
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-2 text-xs text-muted-foreground", children: [
|
|
18369
|
+
/* @__PURE__ */ jsxs70("span", { children: [
|
|
18474
18370
|
fleetList.length,
|
|
18475
18371
|
" total agents"
|
|
18476
18372
|
] }),
|
|
18477
|
-
/* @__PURE__ */
|
|
18373
|
+
/* @__PURE__ */ jsx76(
|
|
18478
18374
|
ConcurrencyGauge,
|
|
18479
18375
|
{
|
|
18480
18376
|
current: fleetConcurrency,
|
|
@@ -18484,49 +18380,49 @@ function FleetMonitor({
|
|
|
18484
18380
|
)
|
|
18485
18381
|
] })
|
|
18486
18382
|
] }),
|
|
18487
|
-
/* @__PURE__ */
|
|
18488
|
-
/* @__PURE__ */
|
|
18383
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-3", children: [
|
|
18384
|
+
/* @__PURE__ */ jsxs70("span", { className: "text-xs text-muted-foreground tabular-nums font-mono", children: [
|
|
18489
18385
|
"\u2193",
|
|
18490
18386
|
fmtTok3(fleetTokensIn),
|
|
18491
18387
|
" \u2191",
|
|
18492
18388
|
fmtTok3(fleetTokensOut),
|
|
18493
18389
|
" \xB7 ",
|
|
18494
|
-
|
|
18390
|
+
fmtCost5(totalCost)
|
|
18495
18391
|
] }),
|
|
18496
|
-
/* @__PURE__ */
|
|
18497
|
-
isOverlay && onClose && /* @__PURE__ */
|
|
18392
|
+
/* @__PURE__ */ jsx76("span", { className: "text-xs text-muted-foreground tabular-nums font-mono", children: leaderId ? `\u{1F451} ${fleetAgents.get(leaderId)?.name ?? leaderId}` : "no leader" }),
|
|
18393
|
+
isOverlay && onClose && /* @__PURE__ */ jsx76(
|
|
18498
18394
|
"button",
|
|
18499
18395
|
{
|
|
18500
18396
|
type: "button",
|
|
18501
18397
|
onClick: onClose,
|
|
18502
18398
|
className: "p-1.5 rounded-md hover:bg-muted transition-colors",
|
|
18503
18399
|
"aria-label": "Close fleet monitor",
|
|
18504
|
-
children: /* @__PURE__ */
|
|
18400
|
+
children: /* @__PURE__ */ jsx76(XCircle9, { className: "h-4 w-4" })
|
|
18505
18401
|
}
|
|
18506
18402
|
)
|
|
18507
18403
|
] })
|
|
18508
18404
|
] }),
|
|
18509
|
-
/* @__PURE__ */
|
|
18510
|
-
/* @__PURE__ */
|
|
18405
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex-1 flex overflow-hidden", children: [
|
|
18406
|
+
/* @__PURE__ */ jsxs70("div", { className: cn(
|
|
18511
18407
|
"flex flex-col border-r transition-all duration-200",
|
|
18512
18408
|
selectedAgent ? "w-[500px] shrink-0" : "w-full"
|
|
18513
18409
|
), children: [
|
|
18514
|
-
/* @__PURE__ */
|
|
18515
|
-
/* @__PURE__ */
|
|
18516
|
-
/* @__PURE__ */
|
|
18517
|
-
/* @__PURE__ */
|
|
18518
|
-
/* @__PURE__ */
|
|
18519
|
-
/* @__PURE__ */
|
|
18520
|
-
/* @__PURE__ */
|
|
18521
|
-
/* @__PURE__ */
|
|
18522
|
-
/* @__PURE__ */
|
|
18523
|
-
/* @__PURE__ */
|
|
18410
|
+
/* @__PURE__ */ jsx76("div", { className: "border-b bg-card/80 px-3 py-2", children: /* @__PURE__ */ jsxs70("div", { className: "grid grid-cols-[140px_60px_1fr_60px_60px_60px_60px_50px_50px] gap-x-2 text-[9px] uppercase tracking-wider text-muted-foreground font-medium", children: [
|
|
18411
|
+
/* @__PURE__ */ jsx76("span", { children: "Name" }),
|
|
18412
|
+
/* @__PURE__ */ jsx76("span", { children: "Status" }),
|
|
18413
|
+
/* @__PURE__ */ jsx76("span", { children: "Activity" }),
|
|
18414
|
+
/* @__PURE__ */ jsx76("span", { children: "Iters" }),
|
|
18415
|
+
/* @__PURE__ */ jsx76("span", { children: "Tools" }),
|
|
18416
|
+
/* @__PURE__ */ jsx76("span", { children: "Cost" }),
|
|
18417
|
+
/* @__PURE__ */ jsx76("span", { children: "CTX" }),
|
|
18418
|
+
/* @__PURE__ */ jsx76("span", { children: "Ext" }),
|
|
18419
|
+
/* @__PURE__ */ jsx76("span", { children: "Reason" })
|
|
18524
18420
|
] }) }),
|
|
18525
|
-
/* @__PURE__ */
|
|
18526
|
-
/* @__PURE__ */
|
|
18527
|
-
/* @__PURE__ */
|
|
18528
|
-
/* @__PURE__ */
|
|
18529
|
-
] }) : /* @__PURE__ */
|
|
18421
|
+
/* @__PURE__ */ jsx76("div", { className: "flex-1 overflow-y-auto", children: fleetList.length === 0 ? /* @__PURE__ */ jsxs70("div", { className: "flex flex-col items-center justify-center h-full text-muted-foreground", children: [
|
|
18422
|
+
/* @__PURE__ */ jsx76(Users4, { className: "h-12 w-12 mb-3 opacity-20" }),
|
|
18423
|
+
/* @__PURE__ */ jsx76("p", { className: "text-sm font-medium", children: "No agents active" }),
|
|
18424
|
+
/* @__PURE__ */ jsx76("p", { className: "text-xs mt-1", children: "Agents appear here when the fleet is active." })
|
|
18425
|
+
] }) : /* @__PURE__ */ jsx76("div", { className: "p-2 space-y-0.5", children: fleetList.map((agent, i) => /* @__PURE__ */ jsx76(
|
|
18530
18426
|
FleetAgentRow,
|
|
18531
18427
|
{
|
|
18532
18428
|
agent,
|
|
@@ -18536,25 +18432,25 @@ function FleetMonitor({
|
|
|
18536
18432
|
},
|
|
18537
18433
|
agent.id
|
|
18538
18434
|
)) }) }),
|
|
18539
|
-
/* @__PURE__ */
|
|
18540
|
-
/* @__PURE__ */
|
|
18541
|
-
/* @__PURE__ */
|
|
18435
|
+
/* @__PURE__ */ jsxs70("div", { className: "border-t bg-card/80 shrink-0", children: [
|
|
18436
|
+
/* @__PURE__ */ jsx76("div", { className: "px-4 py-2 border-b", children: /* @__PURE__ */ jsxs70("span", { className: "text-[10px] uppercase tracking-wider text-muted-foreground font-medium flex items-center gap-2", children: [
|
|
18437
|
+
/* @__PURE__ */ jsx76(Clock16, { className: "h-3 w-3" }),
|
|
18542
18438
|
"Event Timeline"
|
|
18543
18439
|
] }) }),
|
|
18544
|
-
/* @__PURE__ */
|
|
18545
|
-
/* @__PURE__ */
|
|
18546
|
-
/* @__PURE__ */
|
|
18547
|
-
/* @__PURE__ */
|
|
18548
|
-
/* @__PURE__ */
|
|
18440
|
+
/* @__PURE__ */ jsx76("div", { className: "px-4 py-2 max-h-32 overflow-y-auto", children: /* @__PURE__ */ jsx76(EventTimeline, { events: eventTimeline, max: 10 }) }),
|
|
18441
|
+
/* @__PURE__ */ jsxs70("div", { className: "px-4 py-1.5 border-t text-[10px] text-muted-foreground flex items-center gap-4", children: [
|
|
18442
|
+
/* @__PURE__ */ jsx76("span", { children: "\u2191\u2193 navigate" }),
|
|
18443
|
+
/* @__PURE__ */ jsx76("span", { children: "\u21B5 select detail" }),
|
|
18444
|
+
/* @__PURE__ */ jsx76("span", { children: "Esc deselect / close" })
|
|
18549
18445
|
] })
|
|
18550
18446
|
] })
|
|
18551
18447
|
] }),
|
|
18552
|
-
selectedAgent && /* @__PURE__ */
|
|
18553
|
-
/* @__PURE__ */
|
|
18554
|
-
/* @__PURE__ */
|
|
18555
|
-
/* @__PURE__ */
|
|
18556
|
-
/* @__PURE__ */
|
|
18557
|
-
/* @__PURE__ */
|
|
18448
|
+
selectedAgent && /* @__PURE__ */ jsx76("div", { className: "flex-1 overflow-hidden bg-card/50", children: /* @__PURE__ */ jsxs70("div", { className: "h-full flex flex-col", children: [
|
|
18449
|
+
/* @__PURE__ */ jsxs70("div", { className: "shrink-0 px-4 py-2 border-b bg-card/80 flex items-center gap-2", children: [
|
|
18450
|
+
/* @__PURE__ */ jsx76(ArrowRight6, { className: "h-4 w-4 text-primary" }),
|
|
18451
|
+
/* @__PURE__ */ jsx76("span", { className: "text-xs font-semibold text-primary", children: selectedAgent.name }),
|
|
18452
|
+
/* @__PURE__ */ jsx76("span", { className: "text-[10px] text-muted-foreground", children: "detailed view" }),
|
|
18453
|
+
/* @__PURE__ */ jsx76(
|
|
18558
18454
|
"button",
|
|
18559
18455
|
{
|
|
18560
18456
|
type: "button",
|
|
@@ -18564,25 +18460,25 @@ function FleetMonitor({
|
|
|
18564
18460
|
}
|
|
18565
18461
|
)
|
|
18566
18462
|
] }),
|
|
18567
|
-
/* @__PURE__ */
|
|
18463
|
+
/* @__PURE__ */ jsx76("div", { className: "flex-1 overflow-hidden", children: /* @__PURE__ */ jsx76(FleetAgentDetailPanel, { agent: selectedAgent, now: nowTick }) })
|
|
18568
18464
|
] }) }),
|
|
18569
|
-
!selectedAgent && fleetList.length > 0 && /* @__PURE__ */
|
|
18570
|
-
/* @__PURE__ */
|
|
18571
|
-
/* @__PURE__ */
|
|
18572
|
-
/* @__PURE__ */
|
|
18573
|
-
/* @__PURE__ */
|
|
18574
|
-
/* @__PURE__ */
|
|
18575
|
-
/* @__PURE__ */
|
|
18576
|
-
/* @__PURE__ */
|
|
18577
|
-
/* @__PURE__ */
|
|
18465
|
+
!selectedAgent && fleetList.length > 0 && /* @__PURE__ */ jsx76("div", { className: "flex-1 flex items-center justify-center bg-muted/20", children: /* @__PURE__ */ jsxs70("div", { className: "text-center space-y-3 max-w-sm", children: [
|
|
18466
|
+
/* @__PURE__ */ jsx76(Users4, { className: "h-12 w-12 text-muted-foreground/30 mx-auto" }),
|
|
18467
|
+
/* @__PURE__ */ jsx76("p", { className: "text-sm text-muted-foreground", children: "Select an agent to view detailed information" }),
|
|
18468
|
+
/* @__PURE__ */ jsx76("p", { className: "text-xs text-muted-foreground/60", children: "Click on any agent in the list to see detailed metrics, tool logs, streaming output, and more \u2014 similar to the chat history detailed view." }),
|
|
18469
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center justify-center gap-4 pt-2", children: [
|
|
18470
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-1.5 text-[10px] text-muted-foreground", children: [
|
|
18471
|
+
/* @__PURE__ */ jsx76("kbd", { className: "px-1.5 py-0.5 rounded bg-muted border text-[9px]", children: "\u2191" }),
|
|
18472
|
+
/* @__PURE__ */ jsx76("kbd", { className: "px-1.5 py-0.5 rounded bg-muted border text-[9px]", children: "\u2193" }),
|
|
18473
|
+
/* @__PURE__ */ jsx76("span", { children: "navigate" })
|
|
18578
18474
|
] }),
|
|
18579
|
-
/* @__PURE__ */
|
|
18580
|
-
/* @__PURE__ */
|
|
18581
|
-
/* @__PURE__ */
|
|
18475
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-1.5 text-[10px] text-muted-foreground", children: [
|
|
18476
|
+
/* @__PURE__ */ jsx76("kbd", { className: "px-1.5 py-0.5 rounded bg-muted border text-[9px]", children: "Enter" }),
|
|
18477
|
+
/* @__PURE__ */ jsx76("span", { children: "select" })
|
|
18582
18478
|
] }),
|
|
18583
|
-
/* @__PURE__ */
|
|
18584
|
-
/* @__PURE__ */
|
|
18585
|
-
/* @__PURE__ */
|
|
18479
|
+
/* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-1.5 text-[10px] text-muted-foreground", children: [
|
|
18480
|
+
/* @__PURE__ */ jsx76("kbd", { className: "px-1.5 py-0.5 rounded bg-muted border text-[9px]", children: "Esc" }),
|
|
18481
|
+
/* @__PURE__ */ jsx76("span", { children: "deselect" })
|
|
18586
18482
|
] })
|
|
18587
18483
|
] })
|
|
18588
18484
|
] }) })
|
|
@@ -18592,18 +18488,468 @@ function FleetMonitor({
|
|
|
18592
18488
|
);
|
|
18593
18489
|
}
|
|
18594
18490
|
|
|
18595
|
-
// src/
|
|
18491
|
+
// src/components/InspectorPanel.tsx
|
|
18492
|
+
import { Bot as Bot14, ChevronDown as ChevronDown11, ChevronUp, Users as Users5 } from "lucide-react";
|
|
18493
|
+
import { useMemo as useMemo19, useState as useState50 } from "react";
|
|
18494
|
+
|
|
18495
|
+
// src/components/AgentsMonitor.tsx
|
|
18496
|
+
import { Bot as Bot13, ChevronLeft, ChevronRight as ChevronRight12, Cpu as Cpu15, Crown as Crown3, Loader2 as Loader212, Wrench as Wrench10, X as X16, Zap as Zap11 } from "lucide-react";
|
|
18497
|
+
import { useCallback as useCallback28, useEffect as useEffect44, useMemo as useMemo18, useState as useState49 } from "react";
|
|
18498
|
+
import { jsx as jsx77, jsxs as jsxs71 } from "react/jsx-runtime";
|
|
18499
|
+
function fmtCost6(v) {
|
|
18500
|
+
if (v <= 0) return "$0";
|
|
18501
|
+
if (v >= 0.01) return `$${v.toFixed(3)}`;
|
|
18502
|
+
return `$${v.toFixed(5)}`.replace(/0+$/, "").replace(/\.$/, "");
|
|
18503
|
+
}
|
|
18504
|
+
function fmtDuration3(ms) {
|
|
18505
|
+
const sec = Math.floor(ms / 1e3);
|
|
18506
|
+
if (sec < 60) return `${sec}s`;
|
|
18507
|
+
const min = Math.floor(sec / 60);
|
|
18508
|
+
return `${min}m ${sec % 60}s`;
|
|
18509
|
+
}
|
|
18510
|
+
var STATUS_META6 = {
|
|
18511
|
+
running: { led: "bg-[hsl(var(--success))]", label: "running", pulse: true, badge: "bg-[hsl(var(--success))]/15 text-[hsl(var(--success))]" },
|
|
18512
|
+
completed: { led: "bg-[hsl(var(--success))]", label: "done", pulse: false, badge: "bg-muted text-muted-foreground" },
|
|
18513
|
+
failed: { led: "bg-destructive", label: "failed", pulse: false, badge: "bg-destructive/15 text-destructive" },
|
|
18514
|
+
timeout: { led: "bg-[hsl(var(--warning))]", label: "timeout", pulse: false, badge: "bg-amber-500/15 text-amber-500" },
|
|
18515
|
+
stopped: { led: "bg-muted-foreground", label: "stopped", pulse: false, badge: "bg-muted text-muted-foreground" }
|
|
18516
|
+
};
|
|
18517
|
+
function AgentCard2({ agent, isLeader }) {
|
|
18518
|
+
const meta2 = STATUS_META6[agent.status];
|
|
18519
|
+
const active = agent.status === "running";
|
|
18520
|
+
const elapsed = Date.now() - agent.startedAt;
|
|
18521
|
+
const toolLogSlice = agent.toolLog.slice(0, 8);
|
|
18522
|
+
const last8Tools = [...toolLogSlice].reverse();
|
|
18523
|
+
return /* @__PURE__ */ jsxs71("div", { className: cn(
|
|
18524
|
+
"rounded-xl border p-4 space-y-3",
|
|
18525
|
+
active ? "border-primary/20 bg-primary/[0.02]" : "border-border bg-card",
|
|
18526
|
+
isLeader && "ring-2 ring-amber-500/30"
|
|
18527
|
+
), children: [
|
|
18528
|
+
/* @__PURE__ */ jsxs71("div", { className: "flex items-start justify-between", children: [
|
|
18529
|
+
/* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-2", children: [
|
|
18530
|
+
/* @__PURE__ */ jsx77("span", { className: cn("led", meta2.led, meta2.pulse && "led-pulse", "mt-0.5") }),
|
|
18531
|
+
/* @__PURE__ */ jsxs71("div", { children: [
|
|
18532
|
+
/* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-1.5", children: [
|
|
18533
|
+
/* @__PURE__ */ jsx77("span", { className: "text-sm font-semibold", children: agent.name }),
|
|
18534
|
+
isLeader && /* @__PURE__ */ jsx77(Crown3, { className: "h-3.5 w-3.5 text-amber-500", "aria-label": "leader" }),
|
|
18535
|
+
agent.extensions > 0 && /* @__PURE__ */ jsxs71("span", { className: "inline-flex items-center gap-0.5 px-1.5 py-0.5 rounded-full bg-amber-500/15 text-[10px] text-amber-600 dark:text-amber-400 font-medium", children: [
|
|
18536
|
+
/* @__PURE__ */ jsx77(Zap11, { className: "h-2.5 w-2.5" }),
|
|
18537
|
+
"\xD7",
|
|
18538
|
+
agent.extensions
|
|
18539
|
+
] })
|
|
18540
|
+
] }),
|
|
18541
|
+
/* @__PURE__ */ jsx77("span", { className: cn("inline-block mt-0.5 px-1.5 py-0.5 rounded text-[10px] font-medium", meta2.badge), children: meta2.label })
|
|
18542
|
+
] })
|
|
18543
|
+
] }),
|
|
18544
|
+
/* @__PURE__ */ jsx77("div", { className: "flex items-center gap-1 text-[10px] text-muted-foreground", children: isLeader && /* @__PURE__ */ jsx77("span", { className: "text-[9px] bg-amber-500/15 text-amber-600 dark:text-amber-400 px-1.5 py-0.5 rounded", children: "LEADER" }) })
|
|
18545
|
+
] }),
|
|
18546
|
+
agent.description && /* @__PURE__ */ jsx77("p", { className: "text-xs text-muted-foreground leading-relaxed line-clamp-2", children: agent.description }),
|
|
18547
|
+
agent.budgetWarning && /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-2 px-3 py-2 rounded-lg bg-amber-500/10 border border-amber-500/20 text-xs", children: [
|
|
18548
|
+
/* @__PURE__ */ jsx77(Zap11, { className: "h-3.5 w-3.5 text-amber-500 shrink-0" }),
|
|
18549
|
+
/* @__PURE__ */ jsxs71("span", { className: "text-amber-600 dark:text-amber-400", children: [
|
|
18550
|
+
"\u26A1 hitting ",
|
|
18551
|
+
/* @__PURE__ */ jsx77("strong", { children: agent.budgetWarning.kind }),
|
|
18552
|
+
" limit (",
|
|
18553
|
+
agent.budgetWarning.used,
|
|
18554
|
+
"/",
|
|
18555
|
+
agent.budgetWarning.limit,
|
|
18556
|
+
") \u2014 extending"
|
|
18557
|
+
] })
|
|
18558
|
+
] }),
|
|
18559
|
+
agent.failureReason && /* @__PURE__ */ jsx77("div", { className: "flex items-center gap-2 px-3 py-2 rounded-lg bg-destructive/10 border border-destructive/20 text-xs", children: /* @__PURE__ */ jsxs71("span", { className: "text-destructive font-medium", children: [
|
|
18560
|
+
"\u2717 ",
|
|
18561
|
+
agent.failureReason
|
|
18562
|
+
] }) }),
|
|
18563
|
+
/* @__PURE__ */ jsxs71("div", { className: "grid grid-cols-4 gap-2", children: [
|
|
18564
|
+
/* @__PURE__ */ jsxs71("div", { className: "rounded-lg border bg-muted/30 px-2 py-1.5 text-center", children: [
|
|
18565
|
+
/* @__PURE__ */ jsx77("div", { className: "text-[10px] text-muted-foreground", children: "Iters" }),
|
|
18566
|
+
/* @__PURE__ */ jsx77("div", { className: "text-xs font-mono font-semibold tabular-nums", children: agent.iteration })
|
|
18567
|
+
] }),
|
|
18568
|
+
/* @__PURE__ */ jsxs71("div", { className: "rounded-lg border bg-muted/30 px-2 py-1.5 text-center", children: [
|
|
18569
|
+
/* @__PURE__ */ jsx77("div", { className: "text-[10px] text-muted-foreground", children: "Tools" }),
|
|
18570
|
+
/* @__PURE__ */ jsx77("div", { className: "text-xs font-mono font-semibold tabular-nums", children: agent.toolCalls })
|
|
18571
|
+
] }),
|
|
18572
|
+
/* @__PURE__ */ jsxs71("div", { className: "rounded-lg border bg-muted/30 px-2 py-1.5 text-center", children: [
|
|
18573
|
+
/* @__PURE__ */ jsx77("div", { className: "text-[10px] text-muted-foreground", children: "Cost" }),
|
|
18574
|
+
/* @__PURE__ */ jsx77("div", { className: "text-xs font-mono font-semibold tabular-nums", children: fmtCost6(agent.costUsd) })
|
|
18575
|
+
] }),
|
|
18576
|
+
/* @__PURE__ */ jsxs71("div", { className: "rounded-lg border bg-muted/30 px-2 py-1.5 text-center", children: [
|
|
18577
|
+
/* @__PURE__ */ jsx77("div", { className: "text-[10px] text-muted-foreground", children: "Elapsed" }),
|
|
18578
|
+
/* @__PURE__ */ jsx77("div", { className: "text-xs font-mono font-semibold tabular-nums", children: fmtDuration3(elapsed) })
|
|
18579
|
+
] })
|
|
18580
|
+
] }),
|
|
18581
|
+
/* @__PURE__ */ jsxs71("div", { className: "space-y-1.5", children: [
|
|
18582
|
+
/* @__PURE__ */ jsxs71("div", { className: "flex items-center justify-between", children: [
|
|
18583
|
+
/* @__PURE__ */ jsx77("span", { className: "text-[10px] text-muted-foreground", children: "Activity (12 bins)" }),
|
|
18584
|
+
/* @__PURE__ */ jsx77(SparklineChart, { bins: agent.sparklineBins, className: "font-mono text-[9px]" })
|
|
18585
|
+
] }),
|
|
18586
|
+
/* @__PURE__ */ jsx77(ContextBar, { pct: agent.ctxPct, tokens: agent.ctxTokens, maxTokens: agent.maxContext })
|
|
18587
|
+
] }),
|
|
18588
|
+
(agent.provider || agent.model) && /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-1.5 text-[10px] text-muted-foreground", children: [
|
|
18589
|
+
/* @__PURE__ */ jsx77(Cpu15, { className: "h-3 w-3" }),
|
|
18590
|
+
/* @__PURE__ */ jsxs71("span", { className: "font-mono", children: [
|
|
18591
|
+
agent.provider ?? "?",
|
|
18592
|
+
"/",
|
|
18593
|
+
agent.model ?? "?"
|
|
18594
|
+
] })
|
|
18595
|
+
] }),
|
|
18596
|
+
(agent.currentTool || agent.lastTool) && /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-1.5 text-[10px] text-muted-foreground", children: [
|
|
18597
|
+
/* @__PURE__ */ jsx77(Wrench10, { className: cn("h-3 w-3", active && "animate-pulse text-primary") }),
|
|
18598
|
+
/* @__PURE__ */ jsx77("span", { className: "font-mono", children: agent.currentTool ?? agent.lastTool }),
|
|
18599
|
+
active && /* @__PURE__ */ jsx77(Loader212, { className: "h-3 w-3 animate-spin" })
|
|
18600
|
+
] }),
|
|
18601
|
+
agent.partialText && active && /* @__PURE__ */ jsxs71("div", { className: "rounded-lg border bg-muted/30 p-2", children: [
|
|
18602
|
+
/* @__PURE__ */ jsx77("div", { className: "text-[9px] text-muted-foreground uppercase tracking-wider mb-1", children: "Streaming output" }),
|
|
18603
|
+
/* @__PURE__ */ jsx77("pre", { className: "text-[10px] font-mono text-foreground/80 whitespace-pre-wrap line-clamp-3 leading-relaxed", children: agent.partialText })
|
|
18604
|
+
] }),
|
|
18605
|
+
last8Tools.length > 0 && /* @__PURE__ */ jsxs71("div", { className: "space-y-1", children: [
|
|
18606
|
+
/* @__PURE__ */ jsx77("div", { className: "text-[9px] text-muted-foreground uppercase tracking-wider", children: "Recent tools" }),
|
|
18607
|
+
/* @__PURE__ */ jsx77("div", { className: "space-y-0.5", children: last8Tools.map((tool, i) => /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-2 text-[10px] font-mono", children: [
|
|
18608
|
+
/* @__PURE__ */ jsx77("span", { className: cn("shrink-0", tool.ok ? "text-[hsl(var(--success))]" : "text-destructive"), children: tool.ok ? "\u2713" : "\u2717" }),
|
|
18609
|
+
/* @__PURE__ */ jsx77("span", { className: "text-muted-foreground truncate", children: tool.name }),
|
|
18610
|
+
/* @__PURE__ */ jsx77("span", { className: "ml-auto tabular-nums text-muted-foreground shrink-0", children: tool.durationMs >= 1e3 ? `${(tool.durationMs / 1e3).toFixed(1)}s` : `${tool.durationMs}ms` })
|
|
18611
|
+
] }, i)) })
|
|
18612
|
+
] }),
|
|
18613
|
+
agent.finalText && !active && /* @__PURE__ */ jsxs71("div", { className: "rounded-lg border bg-muted/30 p-2", children: [
|
|
18614
|
+
/* @__PURE__ */ jsx77("div", { className: "text-[9px] text-muted-foreground uppercase tracking-wider mb-1", children: "Final output" }),
|
|
18615
|
+
/* @__PURE__ */ jsx77("pre", { className: "text-[10px] font-mono text-foreground/80 whitespace-pre-wrap line-clamp-4 leading-relaxed", children: agent.finalText })
|
|
18616
|
+
] })
|
|
18617
|
+
] });
|
|
18618
|
+
}
|
|
18619
|
+
|
|
18620
|
+
// src/components/InspectorPanel.tsx
|
|
18596
18621
|
import { Fragment as Fragment17, jsx as jsx78, jsxs as jsxs72 } from "react/jsx-runtime";
|
|
18622
|
+
var PANEL_HEIGHT = 320;
|
|
18623
|
+
function fmtCost7(v) {
|
|
18624
|
+
if (v <= 0) return "$0";
|
|
18625
|
+
if (v >= 0.01) return `$${v.toFixed(3)}`;
|
|
18626
|
+
return `$${v.toFixed(5)}`.replace(/0+$/, "").replace(/\.$/, "");
|
|
18627
|
+
}
|
|
18628
|
+
function fmtTok4(n) {
|
|
18629
|
+
if (n >= 1e6) return `${(n / 1e6).toFixed(1)}M`;
|
|
18630
|
+
if (n >= 1e3) return `${(n / 1e3).toFixed(1)}K`;
|
|
18631
|
+
return String(n);
|
|
18632
|
+
}
|
|
18633
|
+
function sortFleet(agents, leaderId) {
|
|
18634
|
+
const arr = Array.from(agents.values());
|
|
18635
|
+
arr.sort((x, y) => {
|
|
18636
|
+
if (x.id === leaderId) return -1;
|
|
18637
|
+
if (y.id === leaderId) return 1;
|
|
18638
|
+
const xa = x.status === "running" ? 0 : 1;
|
|
18639
|
+
const ya = y.status === "running" ? 0 : 1;
|
|
18640
|
+
if (xa !== ya) return xa - ya;
|
|
18641
|
+
return x.startedAt - y.startedAt;
|
|
18642
|
+
});
|
|
18643
|
+
return arr;
|
|
18644
|
+
}
|
|
18645
|
+
function InspectorPanel() {
|
|
18646
|
+
const inspectorOpen = useUIStore((s) => s.inspectorOpen);
|
|
18647
|
+
const inspectorTab = useUIStore((s) => s.inspectorTab);
|
|
18648
|
+
const toggleInspector = useUIStore((s) => s.toggleInspector);
|
|
18649
|
+
const setInspectorOpen = useUIStore((s) => s.setInspectorOpen);
|
|
18650
|
+
const setInspectorTab = useUIStore((s) => s.setInspectorTab);
|
|
18651
|
+
const fleetAgents = useFleetStore((s) => s.agents);
|
|
18652
|
+
const leaderId = useFleetStore((s) => s.leaderId);
|
|
18653
|
+
const fleetTokensIn = useFleetStore((s) => s.fleetTokensIn);
|
|
18654
|
+
const fleetTokensOut = useFleetStore((s) => s.fleetTokensOut);
|
|
18655
|
+
const fleetConcurrency = useFleetStore((s) => s.fleetConcurrency);
|
|
18656
|
+
const fleetConcurrencyMax = useFleetStore((s) => s.fleetConcurrencyMax);
|
|
18657
|
+
const eventTimeline = useFleetStore((s) => s.eventTimeline);
|
|
18658
|
+
const fleetList = useMemo19(
|
|
18659
|
+
() => sortFleet(fleetAgents, leaderId),
|
|
18660
|
+
[fleetAgents, leaderId]
|
|
18661
|
+
);
|
|
18662
|
+
const runningCount = fleetList.filter((a) => a.status === "running").length;
|
|
18663
|
+
const totalCost = fleetList.reduce((sum, a) => sum + a.costUsd, 0);
|
|
18664
|
+
const fleetTotal = fleetList.length;
|
|
18665
|
+
const [selectedAgentId, setSelectedAgentId] = useState50(null);
|
|
18666
|
+
const selectedAgent = useMemo19(() => {
|
|
18667
|
+
if (!selectedAgentId) return fleetList[0] ?? null;
|
|
18668
|
+
return fleetAgents.get(selectedAgentId) ?? fleetList[0] ?? null;
|
|
18669
|
+
}, [selectedAgentId, fleetList, fleetAgents]);
|
|
18670
|
+
const openFleetTab = () => setInspectorTab("fleet");
|
|
18671
|
+
const openAgentsTab = () => setInspectorTab("agents");
|
|
18672
|
+
const handleSelectAgent = (agent) => {
|
|
18673
|
+
setSelectedAgentId(agent.id);
|
|
18674
|
+
openAgentsTab();
|
|
18675
|
+
};
|
|
18676
|
+
return /* @__PURE__ */ jsxs72("div", { className: "shrink-0 border-t bg-card flex flex-col", children: [
|
|
18677
|
+
/* @__PURE__ */ jsxs72(
|
|
18678
|
+
"button",
|
|
18679
|
+
{
|
|
18680
|
+
type: "button",
|
|
18681
|
+
onClick: toggleInspector,
|
|
18682
|
+
className: cn(
|
|
18683
|
+
"group w-full flex items-center justify-between gap-2 px-3 h-7 text-[11px]",
|
|
18684
|
+
"text-muted-foreground hover:text-foreground hover:bg-accent/40 transition-colors"
|
|
18685
|
+
),
|
|
18686
|
+
title: inspectorOpen ? "Hide inspector panel" : "Show inspector panel (Fleet / Agents)",
|
|
18687
|
+
children: [
|
|
18688
|
+
/* @__PURE__ */ jsxs72("span", { className: "flex items-center gap-2 min-w-0", children: [
|
|
18689
|
+
inspectorOpen ? /* @__PURE__ */ jsx78(ChevronDown11, { className: "h-3.5 w-3.5 shrink-0" }) : /* @__PURE__ */ jsx78(ChevronUp, { className: "h-3.5 w-3.5 shrink-0" }),
|
|
18690
|
+
/* @__PURE__ */ jsx78("span", { className: "font-medium uppercase tracking-wider", children: "Inspector" }),
|
|
18691
|
+
fleetTotal > 0 && /* @__PURE__ */ jsxs72(Fragment17, { children: [
|
|
18692
|
+
/* @__PURE__ */ jsx78("span", { className: "opacity-40", children: "\xB7" }),
|
|
18693
|
+
/* @__PURE__ */ jsxs72("span", { className: "flex items-center gap-1", children: [
|
|
18694
|
+
/* @__PURE__ */ jsx78(
|
|
18695
|
+
"span",
|
|
18696
|
+
{
|
|
18697
|
+
className: cn(
|
|
18698
|
+
"h-1.5 w-1.5 rounded-full",
|
|
18699
|
+
runningCount > 0 ? "bg-emerald-500 animate-pulse" : "bg-muted-foreground/50"
|
|
18700
|
+
)
|
|
18701
|
+
}
|
|
18702
|
+
),
|
|
18703
|
+
/* @__PURE__ */ jsxs72("span", { className: "tabular-nums", children: [
|
|
18704
|
+
runningCount,
|
|
18705
|
+
"/",
|
|
18706
|
+
fleetTotal
|
|
18707
|
+
] })
|
|
18708
|
+
] }),
|
|
18709
|
+
/* @__PURE__ */ jsx78("span", { className: "opacity-40 hidden sm:inline", children: "\xB7" }),
|
|
18710
|
+
/* @__PURE__ */ jsxs72("span", { className: "tabular-nums font-mono hidden sm:inline", children: [
|
|
18711
|
+
"\u2193",
|
|
18712
|
+
fmtTok4(fleetTokensIn),
|
|
18713
|
+
" \u2191",
|
|
18714
|
+
fmtTok4(fleetTokensOut),
|
|
18715
|
+
" \xB7 ",
|
|
18716
|
+
fmtCost7(totalCost)
|
|
18717
|
+
] })
|
|
18718
|
+
] })
|
|
18719
|
+
] }),
|
|
18720
|
+
/* @__PURE__ */ jsxs72("span", { className: "flex items-center gap-1 shrink-0 opacity-70 group-hover:opacity-100", children: [
|
|
18721
|
+
/* @__PURE__ */ jsx78(Bot14, { className: "h-3 w-3" }),
|
|
18722
|
+
/* @__PURE__ */ jsx78(Users5, { className: "h-3 w-3" })
|
|
18723
|
+
] })
|
|
18724
|
+
]
|
|
18725
|
+
}
|
|
18726
|
+
),
|
|
18727
|
+
/* @__PURE__ */ jsx78(
|
|
18728
|
+
"div",
|
|
18729
|
+
{
|
|
18730
|
+
className: "overflow-hidden transition-[height] duration-300 ease-[cubic-bezier(0.16,1,0.3,1)]",
|
|
18731
|
+
style: { height: inspectorOpen ? PANEL_HEIGHT : 0 },
|
|
18732
|
+
children: /* @__PURE__ */ jsxs72("div", { className: "flex flex-col", style: { height: PANEL_HEIGHT }, children: [
|
|
18733
|
+
/* @__PURE__ */ jsxs72("div", { className: "flex items-center gap-1 px-2 h-8 border-b bg-muted/30 shrink-0", children: [
|
|
18734
|
+
/* @__PURE__ */ jsx78(
|
|
18735
|
+
TabButton,
|
|
18736
|
+
{
|
|
18737
|
+
active: inspectorTab === "fleet",
|
|
18738
|
+
onClick: openFleetTab,
|
|
18739
|
+
icon: /* @__PURE__ */ jsx78(Bot14, { className: "h-3.5 w-3.5" }),
|
|
18740
|
+
label: "Fleet",
|
|
18741
|
+
count: fleetTotal,
|
|
18742
|
+
running: runningCount
|
|
18743
|
+
}
|
|
18744
|
+
),
|
|
18745
|
+
/* @__PURE__ */ jsx78(
|
|
18746
|
+
TabButton,
|
|
18747
|
+
{
|
|
18748
|
+
active: inspectorTab === "agents",
|
|
18749
|
+
onClick: openAgentsTab,
|
|
18750
|
+
icon: /* @__PURE__ */ jsx78(Users5, { className: "h-3.5 w-3.5" }),
|
|
18751
|
+
label: "Agents",
|
|
18752
|
+
count: fleetTotal
|
|
18753
|
+
}
|
|
18754
|
+
),
|
|
18755
|
+
/* @__PURE__ */ jsx78("div", { className: "flex-1" }),
|
|
18756
|
+
/* @__PURE__ */ jsx78(
|
|
18757
|
+
"button",
|
|
18758
|
+
{
|
|
18759
|
+
type: "button",
|
|
18760
|
+
onClick: () => setInspectorOpen(false),
|
|
18761
|
+
className: "p-1 rounded hover:bg-muted transition-colors text-muted-foreground hover:text-foreground",
|
|
18762
|
+
"aria-label": "Collapse inspector panel",
|
|
18763
|
+
title: "Collapse (Esc)",
|
|
18764
|
+
children: /* @__PURE__ */ jsx78(ChevronDown11, { className: "h-4 w-4" })
|
|
18765
|
+
}
|
|
18766
|
+
)
|
|
18767
|
+
] }),
|
|
18768
|
+
/* @__PURE__ */ jsx78("div", { className: "flex-1 min-h-0 overflow-y-auto", children: inspectorTab === "fleet" ? /* @__PURE__ */ jsx78(
|
|
18769
|
+
FleetTabContent,
|
|
18770
|
+
{
|
|
18771
|
+
fleetList,
|
|
18772
|
+
leaderId,
|
|
18773
|
+
selectedAgentId,
|
|
18774
|
+
runningCount,
|
|
18775
|
+
fleetConcurrency,
|
|
18776
|
+
fleetConcurrencyMax,
|
|
18777
|
+
fleetTokensIn,
|
|
18778
|
+
fleetTokensOut,
|
|
18779
|
+
totalCost,
|
|
18780
|
+
eventTimeline,
|
|
18781
|
+
onSelectAgent: handleSelectAgent
|
|
18782
|
+
}
|
|
18783
|
+
) : /* @__PURE__ */ jsx78(
|
|
18784
|
+
AgentsTabContent,
|
|
18785
|
+
{
|
|
18786
|
+
fleetList,
|
|
18787
|
+
selectedAgent,
|
|
18788
|
+
leaderId,
|
|
18789
|
+
selectedAgentId: selectedAgent?.id ?? null,
|
|
18790
|
+
onSelectAgent: setSelectedAgentId
|
|
18791
|
+
}
|
|
18792
|
+
) })
|
|
18793
|
+
] })
|
|
18794
|
+
}
|
|
18795
|
+
)
|
|
18796
|
+
] });
|
|
18797
|
+
}
|
|
18798
|
+
function TabButton({
|
|
18799
|
+
active,
|
|
18800
|
+
onClick,
|
|
18801
|
+
icon,
|
|
18802
|
+
label,
|
|
18803
|
+
count,
|
|
18804
|
+
running
|
|
18805
|
+
}) {
|
|
18806
|
+
return /* @__PURE__ */ jsxs72(
|
|
18807
|
+
"button",
|
|
18808
|
+
{
|
|
18809
|
+
type: "button",
|
|
18810
|
+
onClick,
|
|
18811
|
+
className: cn(
|
|
18812
|
+
"flex items-center gap-1.5 px-2.5 h-6 rounded-md text-[11px] font-medium transition-colors",
|
|
18813
|
+
active ? "bg-background text-foreground shadow-sm ring-1 ring-border" : "text-muted-foreground hover:text-foreground hover:bg-background/60"
|
|
18814
|
+
),
|
|
18815
|
+
children: [
|
|
18816
|
+
icon,
|
|
18817
|
+
label,
|
|
18818
|
+
count > 0 && /* @__PURE__ */ jsx78(
|
|
18819
|
+
"span",
|
|
18820
|
+
{
|
|
18821
|
+
className: cn(
|
|
18822
|
+
"tabular-nums text-[10px] px-1 rounded-full",
|
|
18823
|
+
running && running > 0 ? "bg-emerald-500/15 text-emerald-600 dark:text-emerald-400" : "bg-muted text-muted-foreground"
|
|
18824
|
+
),
|
|
18825
|
+
children: running !== void 0 ? `${running}/${count}` : count
|
|
18826
|
+
}
|
|
18827
|
+
)
|
|
18828
|
+
]
|
|
18829
|
+
}
|
|
18830
|
+
);
|
|
18831
|
+
}
|
|
18832
|
+
function FleetTabContent({
|
|
18833
|
+
fleetList,
|
|
18834
|
+
leaderId,
|
|
18835
|
+
selectedAgentId,
|
|
18836
|
+
runningCount,
|
|
18837
|
+
fleetConcurrency,
|
|
18838
|
+
fleetConcurrencyMax,
|
|
18839
|
+
fleetTokensIn,
|
|
18840
|
+
fleetTokensOut,
|
|
18841
|
+
totalCost,
|
|
18842
|
+
eventTimeline,
|
|
18843
|
+
onSelectAgent
|
|
18844
|
+
}) {
|
|
18845
|
+
return /* @__PURE__ */ jsxs72("div", { className: "flex flex-col h-full", children: [
|
|
18846
|
+
/* @__PURE__ */ jsxs72("div", { className: "flex items-center gap-3 px-3 py-1.5 border-b text-[11px] text-muted-foreground shrink-0", children: [
|
|
18847
|
+
/* @__PURE__ */ jsxs72("span", { className: "flex items-center gap-1", children: [
|
|
18848
|
+
runningCount > 0 && /* @__PURE__ */ jsx78("span", { className: "h-1.5 w-1.5 rounded-full bg-emerald-500 animate-pulse" }),
|
|
18849
|
+
/* @__PURE__ */ jsxs72("span", { className: "tabular-nums", children: [
|
|
18850
|
+
runningCount,
|
|
18851
|
+
" running \xB7 ",
|
|
18852
|
+
fleetList.length,
|
|
18853
|
+
" total"
|
|
18854
|
+
] })
|
|
18855
|
+
] }),
|
|
18856
|
+
/* @__PURE__ */ jsx78(ConcurrencyGauge, { current: fleetConcurrency, max: fleetConcurrencyMax, showLabel: true }),
|
|
18857
|
+
/* @__PURE__ */ jsx78("div", { className: "flex-1" }),
|
|
18858
|
+
/* @__PURE__ */ jsxs72("span", { className: "tabular-nums font-mono", children: [
|
|
18859
|
+
"\u2193",
|
|
18860
|
+
fmtTok4(fleetTokensIn),
|
|
18861
|
+
" \u2191",
|
|
18862
|
+
fmtTok4(fleetTokensOut),
|
|
18863
|
+
" \xB7 ",
|
|
18864
|
+
fmtCost7(totalCost)
|
|
18865
|
+
] })
|
|
18866
|
+
] }),
|
|
18867
|
+
fleetList.length === 0 ? /* @__PURE__ */ jsxs72("div", { className: "flex flex-col items-center justify-center py-8 text-muted-foreground", children: [
|
|
18868
|
+
/* @__PURE__ */ jsx78(Users5, { className: "h-8 w-8 mb-2 opacity-20" }),
|
|
18869
|
+
/* @__PURE__ */ jsx78("p", { className: "text-xs font-medium", children: "No agents active" }),
|
|
18870
|
+
/* @__PURE__ */ jsx78("p", { className: "text-[11px] mt-0.5", children: "Agents appear here when the fleet is active." })
|
|
18871
|
+
] }) : /* @__PURE__ */ jsx78("div", { className: "flex-1 min-h-0 overflow-y-auto p-1.5", children: fleetList.map((agent) => /* @__PURE__ */ jsx78(
|
|
18872
|
+
FleetAgentRow,
|
|
18873
|
+
{
|
|
18874
|
+
agent,
|
|
18875
|
+
isSelected: selectedAgentId === agent.id,
|
|
18876
|
+
isLeader: agent.id === leaderId,
|
|
18877
|
+
onClick: () => onSelectAgent(agent)
|
|
18878
|
+
},
|
|
18879
|
+
agent.id
|
|
18880
|
+
)) }),
|
|
18881
|
+
eventTimeline.length > 0 && /* @__PURE__ */ jsx78("div", { className: "border-t px-3 py-1.5 shrink-0", children: /* @__PURE__ */ jsx78(EventTimeline, { events: eventTimeline, max: 4 }) })
|
|
18882
|
+
] });
|
|
18883
|
+
}
|
|
18884
|
+
function AgentsTabContent({
|
|
18885
|
+
fleetList,
|
|
18886
|
+
selectedAgent,
|
|
18887
|
+
leaderId,
|
|
18888
|
+
selectedAgentId,
|
|
18889
|
+
onSelectAgent
|
|
18890
|
+
}) {
|
|
18891
|
+
if (fleetList.length === 0) {
|
|
18892
|
+
return /* @__PURE__ */ jsxs72("div", { className: "flex flex-col items-center justify-center py-8 text-muted-foreground", children: [
|
|
18893
|
+
/* @__PURE__ */ jsx78(Bot14, { className: "h-8 w-8 mb-2 opacity-20" }),
|
|
18894
|
+
/* @__PURE__ */ jsx78("p", { className: "text-xs font-medium", children: "No agents active" })
|
|
18895
|
+
] });
|
|
18896
|
+
}
|
|
18897
|
+
if (!selectedAgent) return null;
|
|
18898
|
+
const selectedIdx = Math.max(
|
|
18899
|
+
0,
|
|
18900
|
+
fleetList.findIndex((a) => a.id === selectedAgentId)
|
|
18901
|
+
);
|
|
18902
|
+
return /* @__PURE__ */ jsxs72("div", { className: "flex flex-col h-full", children: [
|
|
18903
|
+
/* @__PURE__ */ jsx78("div", { className: "flex-1 min-h-0 overflow-y-auto p-3", children: /* @__PURE__ */ jsx78("div", { className: "max-w-2xl mx-auto", children: /* @__PURE__ */ jsx78(AgentCard2, { agent: selectedAgent, isLeader: selectedAgent.id === leaderId }) }) }),
|
|
18904
|
+
/* @__PURE__ */ jsx78("div", { className: "border-t px-2 py-1.5 shrink-0", children: /* @__PURE__ */ jsx78("div", { className: "flex items-center gap-1 overflow-x-auto pb-0.5", children: fleetList.map((agent, i) => /* @__PURE__ */ jsxs72(
|
|
18905
|
+
"button",
|
|
18906
|
+
{
|
|
18907
|
+
type: "button",
|
|
18908
|
+
onClick: () => onSelectAgent(agent.id),
|
|
18909
|
+
className: cn(
|
|
18910
|
+
"shrink-0 flex items-center gap-1.5 px-2 py-1 rounded-md text-[10px] transition-colors",
|
|
18911
|
+
agent.id === selectedAgent?.id ? "bg-primary/15 text-primary ring-1 ring-primary/40" : "hover:bg-accent text-muted-foreground"
|
|
18912
|
+
),
|
|
18913
|
+
title: `${agent.name}${i === selectedIdx ? " (selected)" : ""}`,
|
|
18914
|
+
children: [
|
|
18915
|
+
/* @__PURE__ */ jsx78(
|
|
18916
|
+
"span",
|
|
18917
|
+
{
|
|
18918
|
+
className: cn(
|
|
18919
|
+
"h-1.5 w-1.5 rounded-full shrink-0",
|
|
18920
|
+
agent.status === "running" ? "bg-emerald-500 animate-pulse" : agent.status === "failed" ? "bg-destructive" : "bg-muted-foreground/50"
|
|
18921
|
+
)
|
|
18922
|
+
}
|
|
18923
|
+
),
|
|
18924
|
+
/* @__PURE__ */ jsx78("span", { className: "truncate max-w-[8rem]", children: agent.name })
|
|
18925
|
+
]
|
|
18926
|
+
},
|
|
18927
|
+
agent.id
|
|
18928
|
+
)) }) })
|
|
18929
|
+
] });
|
|
18930
|
+
}
|
|
18931
|
+
|
|
18932
|
+
// src/App.tsx
|
|
18933
|
+
import { Fragment as Fragment18, jsx as jsx79, jsxs as jsxs73 } from "react/jsx-runtime";
|
|
18597
18934
|
function AppInner() {
|
|
18598
18935
|
const { theme } = useTheme();
|
|
18599
|
-
const {
|
|
18936
|
+
const {
|
|
18937
|
+
currentView,
|
|
18938
|
+
sidebarOpen,
|
|
18939
|
+
toggleSidebar,
|
|
18940
|
+
setSearchOpen,
|
|
18941
|
+
setSidebarOpen,
|
|
18942
|
+
setCurrentView,
|
|
18943
|
+
setInspectorTab,
|
|
18944
|
+
toggleInspector
|
|
18945
|
+
} = useUIStore();
|
|
18600
18946
|
const isLoading = useChatStore((s) => s.isLoading);
|
|
18601
18947
|
const iteration = useSessionStore((s) => s.iteration);
|
|
18602
18948
|
const projectName = useSessionStore((s) => s.projectName);
|
|
18603
18949
|
const sessionTitle = useSessionStore((s) => s.session?.title);
|
|
18604
18950
|
const sessionId = useSessionStore((s) => s.session?.id);
|
|
18605
18951
|
const nickname = useUIStore((s) => sessionId ? s.sessionNicknames[sessionId] : void 0);
|
|
18606
|
-
|
|
18952
|
+
useEffect45(() => {
|
|
18607
18953
|
const onOpenFile = (e) => {
|
|
18608
18954
|
const { filePath } = e.detail;
|
|
18609
18955
|
const ws = getWSClient(useConfigStore.getState().wsUrl);
|
|
@@ -18614,7 +18960,7 @@ function AppInner() {
|
|
|
18614
18960
|
window.addEventListener("wrongstack:open-file", onOpenFile);
|
|
18615
18961
|
return () => window.removeEventListener("wrongstack:open-file", onOpenFile);
|
|
18616
18962
|
}, []);
|
|
18617
|
-
|
|
18963
|
+
useEffect45(() => {
|
|
18618
18964
|
const onSaveFile = (e) => {
|
|
18619
18965
|
const { filePath } = e.detail;
|
|
18620
18966
|
const file = useFileStore.getState().openFiles.find((f) => f.path === filePath);
|
|
@@ -18630,7 +18976,7 @@ function AppInner() {
|
|
|
18630
18976
|
window.addEventListener("wrongstack:save-file", onSaveFile);
|
|
18631
18977
|
return () => window.removeEventListener("wrongstack:save-file", onSaveFile);
|
|
18632
18978
|
}, []);
|
|
18633
|
-
|
|
18979
|
+
useEffect45(() => {
|
|
18634
18980
|
if (typeof window === "undefined") return;
|
|
18635
18981
|
const mq = window.matchMedia("(max-width: 768px)");
|
|
18636
18982
|
const apply = () => {
|
|
@@ -18643,7 +18989,7 @@ function AppInner() {
|
|
|
18643
18989
|
return () => mq.removeEventListener("change", apply);
|
|
18644
18990
|
}, [setSidebarOpen]);
|
|
18645
18991
|
useWebSocketBootstrap();
|
|
18646
|
-
|
|
18992
|
+
useEffect45(() => {
|
|
18647
18993
|
const parts = [];
|
|
18648
18994
|
if (isLoading) {
|
|
18649
18995
|
const it = iteration ? ` iter ${iteration.index}${iteration.max ? `/${iteration.max}` : ""}` : "";
|
|
@@ -18660,7 +19006,7 @@ function AppInner() {
|
|
|
18660
19006
|
document.title = projectName || "AI Agent";
|
|
18661
19007
|
};
|
|
18662
19008
|
}, [isLoading, iteration, projectName, sessionTitle, nickname]);
|
|
18663
|
-
|
|
19009
|
+
useEffect45(() => {
|
|
18664
19010
|
const onKey = (e) => {
|
|
18665
19011
|
const t = e.target;
|
|
18666
19012
|
const tag = t?.tagName?.toLowerCase();
|
|
@@ -18710,11 +19056,26 @@ function AppInner() {
|
|
|
18710
19056
|
}
|
|
18711
19057
|
if (mod && e.shiftKey && e.key.toLowerCase() === "m") {
|
|
18712
19058
|
e.preventDefault();
|
|
18713
|
-
useUIStore.getState()
|
|
19059
|
+
const s = useUIStore.getState();
|
|
19060
|
+
if (s.inspectorOpen && s.inspectorTab === "fleet") {
|
|
19061
|
+
toggleInspector();
|
|
19062
|
+
} else {
|
|
19063
|
+
setInspectorTab("fleet");
|
|
19064
|
+
if (!s.inspectorOpen) toggleInspector();
|
|
19065
|
+
}
|
|
18714
19066
|
}
|
|
18715
19067
|
if (mod && e.shiftKey && e.key.toLowerCase() === "a") {
|
|
18716
19068
|
e.preventDefault();
|
|
18717
|
-
useUIStore.getState()
|
|
19069
|
+
const s = useUIStore.getState();
|
|
19070
|
+
if (s.inspectorOpen && s.inspectorTab === "agents") {
|
|
19071
|
+
toggleInspector();
|
|
19072
|
+
} else {
|
|
19073
|
+
setInspectorTab("agents");
|
|
19074
|
+
if (!s.inspectorOpen) toggleInspector();
|
|
19075
|
+
}
|
|
19076
|
+
}
|
|
19077
|
+
if (e.key === "Escape" && !mod && useUIStore.getState().inspectorOpen) {
|
|
19078
|
+
useUIStore.getState().setInspectorOpen(false);
|
|
18718
19079
|
}
|
|
18719
19080
|
if (!inField && !mod && !e.altKey) {
|
|
18720
19081
|
const bubbles = Array.from(document.querySelectorAll("[data-message-id]"));
|
|
@@ -18773,52 +19134,41 @@ function AppInner() {
|
|
|
18773
19134
|
window.addEventListener("keydown", onKey);
|
|
18774
19135
|
return () => window.removeEventListener("keydown", onKey);
|
|
18775
19136
|
}, [toggleSidebar, setSearchOpen]);
|
|
18776
|
-
return /* @__PURE__ */
|
|
18777
|
-
currentView !== "setup" && /* @__PURE__ */
|
|
18778
|
-
sidebarOpen && currentView !== "setup" && /* @__PURE__ */
|
|
18779
|
-
/* @__PURE__ */
|
|
18780
|
-
currentView !== "setup" && /* @__PURE__ */
|
|
18781
|
-
currentView === "chat" && /* @__PURE__ */
|
|
18782
|
-
sessionId && /* @__PURE__ */
|
|
18783
|
-
/* @__PURE__ */
|
|
19137
|
+
return /* @__PURE__ */ jsxs73("div", { className: cn("flex h-screen", theme), children: [
|
|
19138
|
+
currentView !== "setup" && /* @__PURE__ */ jsx79(ActivityBar, {}),
|
|
19139
|
+
sidebarOpen && currentView !== "setup" && /* @__PURE__ */ jsx79(SidePanel, {}),
|
|
19140
|
+
/* @__PURE__ */ jsxs73("main", { className: "flex-1 flex flex-col overflow-hidden", children: [
|
|
19141
|
+
currentView !== "setup" && /* @__PURE__ */ jsx79(ConnectionBanner, {}),
|
|
19142
|
+
currentView === "chat" && /* @__PURE__ */ jsxs73(Fragment18, { children: [
|
|
19143
|
+
sessionId && /* @__PURE__ */ jsx79("div", { className: "px-4 pt-2", children: /* @__PURE__ */ jsx79(WorkspaceDock, { sessionId }) }),
|
|
19144
|
+
/* @__PURE__ */ jsx79(ChatView, {}),
|
|
19145
|
+
/* @__PURE__ */ jsx79(InspectorPanel, {})
|
|
18784
19146
|
] }),
|
|
18785
|
-
currentView === "settings" && /* @__PURE__ */
|
|
18786
|
-
currentView === "setup" && /* @__PURE__ */
|
|
18787
|
-
currentView === "autophase" && /* @__PURE__ */
|
|
18788
|
-
currentView === "agents" && /* @__PURE__ */
|
|
18789
|
-
currentView === "agentflow" && /* @__PURE__ */
|
|
18790
|
-
currentView === "fleet" && /* @__PURE__ */
|
|
18791
|
-
currentView === "sessions" && /* @__PURE__ */
|
|
18792
|
-
currentView === "files" && /* @__PURE__ */
|
|
19147
|
+
currentView === "settings" && /* @__PURE__ */ jsx79(SettingsPanel, {}),
|
|
19148
|
+
currentView === "setup" && /* @__PURE__ */ jsx79(SetupScreen, {}),
|
|
19149
|
+
currentView === "autophase" && /* @__PURE__ */ jsx79(AutoPhaseView, { onClose: () => setCurrentView("chat") }),
|
|
19150
|
+
currentView === "agents" && /* @__PURE__ */ jsx79("div", { className: "flex-1 flex flex-col overflow-hidden", children: /* @__PURE__ */ jsx79(AgentsPage, {}) }),
|
|
19151
|
+
currentView === "agentflow" && /* @__PURE__ */ jsx79("div", { className: "flex-1 flex flex-col overflow-hidden", children: /* @__PURE__ */ jsx79(AgentFlowCanvasWithProvider, {}) }),
|
|
19152
|
+
currentView === "fleet" && /* @__PURE__ */ jsx79("div", { className: "flex-1 flex flex-col overflow-hidden", children: /* @__PURE__ */ jsx79(FleetMonitor, { isOverlay: false }) }),
|
|
19153
|
+
currentView === "sessions" && /* @__PURE__ */ jsx79("div", { className: "flex-1 overflow-y-auto", children: /* @__PURE__ */ jsx79(SessionsDashboard, {}) }),
|
|
19154
|
+
currentView === "files" && /* @__PURE__ */ jsx79(CodeEditor, {})
|
|
18793
19155
|
] }),
|
|
18794
|
-
|
|
18795
|
-
|
|
18796
|
-
|
|
18797
|
-
|
|
18798
|
-
|
|
18799
|
-
|
|
18800
|
-
setFleetMonitorOpen(false);
|
|
18801
|
-
setAgentsMonitorOpen(true);
|
|
18802
|
-
}
|
|
18803
|
-
}
|
|
18804
|
-
),
|
|
18805
|
-
agentsMonitorOpen && /* @__PURE__ */ jsx78(AgentsMonitor, { onClose: () => setAgentsMonitorOpen(false) }),
|
|
18806
|
-
/* @__PURE__ */ jsx78(ConfirmDialog, {}),
|
|
18807
|
-
/* @__PURE__ */ jsx78(ConfirmModalHost, {}),
|
|
18808
|
-
/* @__PURE__ */ jsx78(CommandPalette, {}),
|
|
18809
|
-
/* @__PURE__ */ jsx78(ShortcutsOverlay, {}),
|
|
18810
|
-
/* @__PURE__ */ jsx78(QuickModelSwitcher, {}),
|
|
18811
|
-
/* @__PURE__ */ jsx78(Toaster, {})
|
|
19156
|
+
/* @__PURE__ */ jsx79(ConfirmDialog, {}),
|
|
19157
|
+
/* @__PURE__ */ jsx79(ConfirmModalHost, {}),
|
|
19158
|
+
/* @__PURE__ */ jsx79(CommandPalette, {}),
|
|
19159
|
+
/* @__PURE__ */ jsx79(ShortcutsOverlay, {}),
|
|
19160
|
+
/* @__PURE__ */ jsx79(QuickModelSwitcher, {}),
|
|
19161
|
+
/* @__PURE__ */ jsx79(Toaster, {})
|
|
18812
19162
|
] });
|
|
18813
19163
|
}
|
|
18814
19164
|
function App() {
|
|
18815
|
-
return /* @__PURE__ */
|
|
19165
|
+
return /* @__PURE__ */ jsx79(ErrorBoundary, { children: /* @__PURE__ */ jsx79(ThemeProvider, { defaultTheme: "system", children: /* @__PURE__ */ jsx79(AppInner, {}) }) });
|
|
18816
19166
|
}
|
|
18817
19167
|
|
|
18818
19168
|
// src/main.tsx
|
|
18819
19169
|
import "./index.css";
|
|
18820
|
-
import { jsx as
|
|
19170
|
+
import { jsx as jsx80 } from "react/jsx-runtime";
|
|
18821
19171
|
ReactDOM.createRoot(expectDefined14(document.getElementById("root"))).render(
|
|
18822
|
-
/* @__PURE__ */
|
|
19172
|
+
/* @__PURE__ */ jsx80(React7.StrictMode, { children: /* @__PURE__ */ jsx80(App, {}) })
|
|
18823
19173
|
);
|
|
18824
19174
|
//# sourceMappingURL=index.js.map
|