@apteva/apteva-kit 0.1.9 → 0.1.10
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/index.d.mts +6 -2
- package/dist/index.d.ts +6 -2
- package/dist/index.js +417 -112
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +573 -268
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -2
package/dist/index.mjs
CHANGED
|
@@ -564,11 +564,133 @@ function Widgets({
|
|
|
564
564
|
return /* @__PURE__ */ jsx5("div", { className: cn(layoutClasses[layout], spacingClasses[spacing], className), children: widgets.map((widget) => /* @__PURE__ */ jsx5(WidgetRenderer, { widget, onAction }, widget.id)) });
|
|
565
565
|
}
|
|
566
566
|
|
|
567
|
-
// src/components/Chat/
|
|
567
|
+
// src/components/Chat/MarkdownContent.tsx
|
|
568
568
|
import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
569
|
+
function parseInlineMarkdown(text, keyPrefix = "") {
|
|
570
|
+
const result = [];
|
|
571
|
+
const boldRegex = /(\*\*|__)(.+?)\1/g;
|
|
572
|
+
let lastIndex = 0;
|
|
573
|
+
let match;
|
|
574
|
+
let key = 0;
|
|
575
|
+
while ((match = boldRegex.exec(text)) !== null) {
|
|
576
|
+
if (match.index > lastIndex) {
|
|
577
|
+
result.push(text.slice(lastIndex, match.index));
|
|
578
|
+
}
|
|
579
|
+
result.push(/* @__PURE__ */ jsx6("strong", { children: match[2] }, `${keyPrefix}b${key++}`));
|
|
580
|
+
lastIndex = match.index + match[0].length;
|
|
581
|
+
}
|
|
582
|
+
if (lastIndex < text.length) {
|
|
583
|
+
result.push(text.slice(lastIndex));
|
|
584
|
+
}
|
|
585
|
+
return result.length > 0 ? result : [text];
|
|
586
|
+
}
|
|
587
|
+
function parseMarkdown(content) {
|
|
588
|
+
const lines = content.split("\n");
|
|
589
|
+
const result = [];
|
|
590
|
+
let key = 0;
|
|
591
|
+
let i = 0;
|
|
592
|
+
while (i < lines.length) {
|
|
593
|
+
const line = lines[i];
|
|
594
|
+
const ulMatch = line.match(/^(\s*)([-*+])\s+(.*)$/);
|
|
595
|
+
if (ulMatch) {
|
|
596
|
+
const listItems = [];
|
|
597
|
+
const indent = ulMatch[1].length;
|
|
598
|
+
while (i < lines.length) {
|
|
599
|
+
const itemMatch = lines[i].match(/^(\s*)([-*+])\s+(.*)$/);
|
|
600
|
+
if (itemMatch && itemMatch[1].length === indent) {
|
|
601
|
+
listItems.push(
|
|
602
|
+
/* @__PURE__ */ jsx6("li", { children: parseInlineMarkdown(itemMatch[3], `${key}`) }, `li${key++}`)
|
|
603
|
+
);
|
|
604
|
+
i++;
|
|
605
|
+
} else {
|
|
606
|
+
break;
|
|
607
|
+
}
|
|
608
|
+
}
|
|
609
|
+
result.push(
|
|
610
|
+
/* @__PURE__ */ jsx6("ul", { className: "list-disc pl-5 my-1", children: listItems }, `ul${key++}`)
|
|
611
|
+
);
|
|
612
|
+
continue;
|
|
613
|
+
}
|
|
614
|
+
const olMatch = line.match(/^(\s*)(\d+)\.\s+(.*)$/);
|
|
615
|
+
if (olMatch) {
|
|
616
|
+
const listItems = [];
|
|
617
|
+
const indent = olMatch[1].length;
|
|
618
|
+
while (i < lines.length) {
|
|
619
|
+
const itemMatch = lines[i].match(/^(\s*)(\d+)\.\s+(.*)$/);
|
|
620
|
+
if (itemMatch && itemMatch[1].length === indent) {
|
|
621
|
+
listItems.push(
|
|
622
|
+
/* @__PURE__ */ jsx6("li", { children: parseInlineMarkdown(itemMatch[3], `${key}`) }, `li${key++}`)
|
|
623
|
+
);
|
|
624
|
+
i++;
|
|
625
|
+
} else {
|
|
626
|
+
break;
|
|
627
|
+
}
|
|
628
|
+
}
|
|
629
|
+
result.push(
|
|
630
|
+
/* @__PURE__ */ jsx6("ol", { className: "list-decimal pl-5 my-1", children: listItems }, `ol${key++}`)
|
|
631
|
+
);
|
|
632
|
+
continue;
|
|
633
|
+
}
|
|
634
|
+
if (line === "") {
|
|
635
|
+
result.push(/* @__PURE__ */ jsx6("br", {}, `br${key++}`));
|
|
636
|
+
} else {
|
|
637
|
+
result.push(
|
|
638
|
+
/* @__PURE__ */ jsxs4("span", { children: [
|
|
639
|
+
parseInlineMarkdown(line, `${key}`),
|
|
640
|
+
i < lines.length - 1 ? "\n" : ""
|
|
641
|
+
] }, `p${key++}`)
|
|
642
|
+
);
|
|
643
|
+
}
|
|
644
|
+
i++;
|
|
645
|
+
}
|
|
646
|
+
return result;
|
|
647
|
+
}
|
|
648
|
+
function MarkdownContent({ content, className = "" }) {
|
|
649
|
+
return /* @__PURE__ */ jsx6("div", { className: `markdown-content !text-sm leading-relaxed whitespace-pre-wrap ${className}`, children: parseMarkdown(content) });
|
|
650
|
+
}
|
|
651
|
+
|
|
652
|
+
// src/components/Chat/ToolCall.tsx
|
|
653
|
+
import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
654
|
+
function ToolCall({ name, status }) {
|
|
655
|
+
return /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2 py-2 px-3 my-2 rounded-lg bg-gray-100 dark:bg-gray-800 border border-gray-200 dark:border-gray-700 text-sm", children: [
|
|
656
|
+
status === "running" && /* @__PURE__ */ jsx7("div", { className: "w-2 h-2 rounded-full bg-blue-500 animate-pulse" }),
|
|
657
|
+
status === "completed" && /* @__PURE__ */ jsx7("div", { className: "w-2 h-2 rounded-full bg-green-500" }),
|
|
658
|
+
status === "error" && /* @__PURE__ */ jsx7("div", { className: "w-2 h-2 rounded-full bg-red-500" }),
|
|
659
|
+
/* @__PURE__ */ jsx7("span", { className: "text-gray-700 dark:text-gray-300 font-mono", children: name }),
|
|
660
|
+
status === "running" && /* @__PURE__ */ jsx7("span", { className: "text-gray-500 dark:text-gray-400 ml-auto", children: "Running..." }),
|
|
661
|
+
status === "completed" && /* @__PURE__ */ jsx7("span", { className: "text-green-600 dark:text-green-400 ml-auto", children: "Completed" }),
|
|
662
|
+
status === "error" && /* @__PURE__ */ jsx7("span", { className: "text-red-600 dark:text-red-400 ml-auto", children: "Error" })
|
|
663
|
+
] });
|
|
664
|
+
}
|
|
665
|
+
|
|
666
|
+
// src/components/Chat/Message.tsx
|
|
667
|
+
import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
569
668
|
function Message({ message, onAction }) {
|
|
570
669
|
const isUser = message.role === "user";
|
|
571
|
-
|
|
670
|
+
const contentSegments = message.metadata?.content_segments;
|
|
671
|
+
const renderContent = () => {
|
|
672
|
+
if (isUser) {
|
|
673
|
+
return /* @__PURE__ */ jsx8("div", { className: "whitespace-pre-wrap !text-sm leading-relaxed", children: message.content });
|
|
674
|
+
}
|
|
675
|
+
if (contentSegments && contentSegments.length > 0) {
|
|
676
|
+
return /* @__PURE__ */ jsx8("div", { children: contentSegments.map((segment, index) => {
|
|
677
|
+
if (segment.type === "text") {
|
|
678
|
+
return segment.content ? /* @__PURE__ */ jsx8(MarkdownContent, { content: segment.content }, `text-${index}`) : null;
|
|
679
|
+
} else if (segment.type === "tool") {
|
|
680
|
+
return /* @__PURE__ */ jsx8("div", { className: "my-2", children: /* @__PURE__ */ jsx8(
|
|
681
|
+
ToolCall,
|
|
682
|
+
{
|
|
683
|
+
name: segment.name,
|
|
684
|
+
status: segment.result !== void 0 ? "completed" : "running"
|
|
685
|
+
}
|
|
686
|
+
) }, segment.id);
|
|
687
|
+
}
|
|
688
|
+
return null;
|
|
689
|
+
}) });
|
|
690
|
+
}
|
|
691
|
+
return /* @__PURE__ */ jsx8(MarkdownContent, { content: message.content });
|
|
692
|
+
};
|
|
693
|
+
return /* @__PURE__ */ jsxs6(
|
|
572
694
|
"div",
|
|
573
695
|
{
|
|
574
696
|
className: cn(
|
|
@@ -576,16 +698,16 @@ function Message({ message, onAction }) {
|
|
|
576
698
|
isUser ? "px-4 py-2.5 rounded-xl bg-gray-100 dark:bg-gray-800 !text-gray-900 dark:!text-gray-100 ml-auto" : "!text-gray-900 dark:!text-gray-100"
|
|
577
699
|
),
|
|
578
700
|
children: [
|
|
579
|
-
|
|
580
|
-
message.widgets && message.widgets.length > 0 && /* @__PURE__ */
|
|
581
|
-
/* @__PURE__ */
|
|
701
|
+
renderContent(),
|
|
702
|
+
message.widgets && message.widgets.length > 0 && /* @__PURE__ */ jsx8("div", { className: cn(isUser ? "mt-3" : "mt-2"), children: /* @__PURE__ */ jsx8(Widgets, { widgets: message.widgets, onAction, layout: "stack" }) }),
|
|
703
|
+
/* @__PURE__ */ jsx8("div", { className: cn("!text-xs opacity-70", isUser ? "mt-1.5 !text-gray-500 dark:!text-gray-400" : "mt-1 !text-gray-500 dark:!text-gray-400"), suppressHydrationWarning: true, children: message.timestamp.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }) })
|
|
582
704
|
]
|
|
583
705
|
}
|
|
584
706
|
);
|
|
585
707
|
}
|
|
586
708
|
|
|
587
709
|
// src/components/Chat/MessageList.tsx
|
|
588
|
-
import { jsx as
|
|
710
|
+
import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
589
711
|
function MessageList({ messages, onAction }) {
|
|
590
712
|
const listRef = useRef(null);
|
|
591
713
|
useEffect2(() => {
|
|
@@ -593,15 +715,15 @@ function MessageList({ messages, onAction }) {
|
|
|
593
715
|
listRef.current.scrollTop = listRef.current.scrollHeight;
|
|
594
716
|
}
|
|
595
717
|
}, [messages]);
|
|
596
|
-
return /* @__PURE__ */
|
|
597
|
-
/* @__PURE__ */
|
|
598
|
-
/* @__PURE__ */
|
|
599
|
-
] }) }) : messages.map((message) => /* @__PURE__ */
|
|
718
|
+
return /* @__PURE__ */ jsx9("div", { ref: listRef, className: "flex-1 overflow-y-auto px-4 py-4 space-y-3", children: messages.length === 0 ? /* @__PURE__ */ jsx9("div", { className: "flex items-center justify-center h-full !text-gray-500 dark:!text-gray-400", children: /* @__PURE__ */ jsxs7("div", { className: "text-center space-y-2", children: [
|
|
719
|
+
/* @__PURE__ */ jsx9("div", { className: "text-4xl", children: "\u{1F4AC}" }),
|
|
720
|
+
/* @__PURE__ */ jsx9("p", { children: "No messages yet. Start a conversation!" })
|
|
721
|
+
] }) }) : messages.map((message) => /* @__PURE__ */ jsx9(Message, { message, onAction }, message.id)) });
|
|
600
722
|
}
|
|
601
723
|
|
|
602
724
|
// src/components/Chat/Composer.tsx
|
|
603
725
|
import { useState, useRef as useRef2 } from "react";
|
|
604
|
-
import { Fragment, jsx as
|
|
726
|
+
import { Fragment, jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
605
727
|
function Composer({ onSendMessage, placeholder = "Type a message...", disabled = false, onFileUpload }) {
|
|
606
728
|
const [text, setText] = useState("");
|
|
607
729
|
const [showMenu, setShowMenu] = useState(false);
|
|
@@ -633,32 +755,32 @@ function Composer({ onSendMessage, placeholder = "Type a message...", disabled =
|
|
|
633
755
|
setShowMenu(false);
|
|
634
756
|
}
|
|
635
757
|
};
|
|
636
|
-
return /* @__PURE__ */
|
|
637
|
-
showMenu && /* @__PURE__ */
|
|
638
|
-
/* @__PURE__ */
|
|
639
|
-
/* @__PURE__ */
|
|
758
|
+
return /* @__PURE__ */ jsxs8("div", { className: "px-4 py-3 bg-white dark:bg-gray-900 relative", children: [
|
|
759
|
+
showMenu && /* @__PURE__ */ jsxs8(Fragment, { children: [
|
|
760
|
+
/* @__PURE__ */ jsx10("div", { className: "fixed inset-0 z-10", onClick: () => setShowMenu(false) }),
|
|
761
|
+
/* @__PURE__ */ jsx10("div", { className: "absolute bottom-full left-4 mb-2 bg-gray-800 dark:bg-gray-700 rounded-xl shadow-lg overflow-hidden z-20 min-w-[240px]", children: /* @__PURE__ */ jsxs8(
|
|
640
762
|
"button",
|
|
641
763
|
{
|
|
642
764
|
onClick: () => fileInputRef.current?.click(),
|
|
643
765
|
className: "w-full flex items-center gap-3 px-4 py-3 hover:bg-gray-700 dark:hover:bg-gray-600 transition-colors !text-white text-left",
|
|
644
766
|
children: [
|
|
645
|
-
/* @__PURE__ */
|
|
646
|
-
/* @__PURE__ */
|
|
767
|
+
/* @__PURE__ */ jsx10("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx10("path", { d: "M10.5 3.5L5.5 8.5C4.67157 9.32843 4.67157 10.6716 5.5 11.5C6.32843 12.3284 7.67157 12.3284 8.5 11.5L14.5 5.5C15.8807 4.11929 15.8807 1.88071 14.5 0.5C13.1193 -0.880711 10.8807 -0.880711 9.5 0.5L3.5 6.5C1.56846 8.43154 1.56846 11.5685 3.5 13.5C5.43154 15.4315 8.56846 15.4315 10.5 13.5L15.5 8.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", transform: "translate(2, 3)" }) }),
|
|
768
|
+
/* @__PURE__ */ jsx10("span", { className: "!text-sm font-medium", children: "Add photos & files" })
|
|
647
769
|
]
|
|
648
770
|
}
|
|
649
771
|
) })
|
|
650
772
|
] }),
|
|
651
|
-
/* @__PURE__ */
|
|
652
|
-
/* @__PURE__ */
|
|
773
|
+
/* @__PURE__ */ jsxs8("div", { className: "relative border-2 border-gray-300 dark:border-gray-700 rounded-xl bg-white dark:bg-gray-900 transition-all duration-300 flex items-center px-3 py-2 gap-3", children: [
|
|
774
|
+
/* @__PURE__ */ jsx10(
|
|
653
775
|
"button",
|
|
654
776
|
{
|
|
655
777
|
onClick: () => setShowMenu(!showMenu),
|
|
656
778
|
className: "w-8 h-8 rounded-lg flex items-center justify-center transition-all flex-shrink-0 !text-gray-700 dark:!text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800",
|
|
657
779
|
title: "More options",
|
|
658
|
-
children: /* @__PURE__ */
|
|
780
|
+
children: /* @__PURE__ */ jsx10("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx10("path", { d: "M10 5v10M5 10h10", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
659
781
|
}
|
|
660
782
|
),
|
|
661
|
-
/* @__PURE__ */
|
|
783
|
+
/* @__PURE__ */ jsx10(
|
|
662
784
|
"textarea",
|
|
663
785
|
{
|
|
664
786
|
ref: textareaRef,
|
|
@@ -672,18 +794,18 @@ function Composer({ onSendMessage, placeholder = "Type a message...", disabled =
|
|
|
672
794
|
style: { maxHeight: "120px" }
|
|
673
795
|
}
|
|
674
796
|
),
|
|
675
|
-
/* @__PURE__ */
|
|
797
|
+
/* @__PURE__ */ jsx10(
|
|
676
798
|
"button",
|
|
677
799
|
{
|
|
678
800
|
onClick: handleSend,
|
|
679
801
|
disabled: !text.trim() || disabled,
|
|
680
802
|
className: "w-8 h-8 rounded-lg flex items-center justify-center font-bold transition-all flex-shrink-0 border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-800 !text-gray-700 dark:!text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 disabled:opacity-30 disabled:cursor-not-allowed !text-lg",
|
|
681
803
|
title: "Send message",
|
|
682
|
-
children: /* @__PURE__ */
|
|
804
|
+
children: /* @__PURE__ */ jsx10("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx10("path", { d: "M8 3L8 13M8 3L4 7M8 3L12 7", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
683
805
|
}
|
|
684
806
|
)
|
|
685
807
|
] }),
|
|
686
|
-
/* @__PURE__ */
|
|
808
|
+
/* @__PURE__ */ jsx10(
|
|
687
809
|
"input",
|
|
688
810
|
{
|
|
689
811
|
ref: fileInputRef,
|
|
@@ -697,66 +819,6 @@ function Composer({ onSendMessage, placeholder = "Type a message...", disabled =
|
|
|
697
819
|
] });
|
|
698
820
|
}
|
|
699
821
|
|
|
700
|
-
// src/components/Chat/Chat.tsx
|
|
701
|
-
import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
702
|
-
function Chat({
|
|
703
|
-
agentId,
|
|
704
|
-
threadId,
|
|
705
|
-
initialMessages = [],
|
|
706
|
-
context,
|
|
707
|
-
onThreadChange,
|
|
708
|
-
onMessageSent,
|
|
709
|
-
onAction,
|
|
710
|
-
onFileUpload,
|
|
711
|
-
placeholder = "Type a message...",
|
|
712
|
-
showHeader = true,
|
|
713
|
-
headerTitle = "Chat",
|
|
714
|
-
className
|
|
715
|
-
}) {
|
|
716
|
-
const [messages, setMessages] = useState2(initialMessages.length > 0 ? initialMessages : mockMessages);
|
|
717
|
-
const [isLoading, setIsLoading] = useState2(false);
|
|
718
|
-
useEffect3(() => {
|
|
719
|
-
if (threadId) {
|
|
720
|
-
console.log("Loading thread:", threadId);
|
|
721
|
-
onThreadChange?.(threadId);
|
|
722
|
-
}
|
|
723
|
-
}, [threadId, onThreadChange]);
|
|
724
|
-
const handleSendMessage = async (text) => {
|
|
725
|
-
const userMessage = {
|
|
726
|
-
id: `msg-${Date.now()}`,
|
|
727
|
-
role: "user",
|
|
728
|
-
content: text,
|
|
729
|
-
timestamp: /* @__PURE__ */ new Date()
|
|
730
|
-
};
|
|
731
|
-
setMessages((prev) => [...prev, userMessage]);
|
|
732
|
-
onMessageSent?.(userMessage);
|
|
733
|
-
setIsLoading(true);
|
|
734
|
-
try {
|
|
735
|
-
const response = await generateMockResponse(1e3);
|
|
736
|
-
setMessages((prev) => [...prev, response]);
|
|
737
|
-
} catch (error) {
|
|
738
|
-
console.error("Error generating response:", error);
|
|
739
|
-
} finally {
|
|
740
|
-
setIsLoading(false);
|
|
741
|
-
}
|
|
742
|
-
};
|
|
743
|
-
return /* @__PURE__ */ jsxs7("div", { className: cn("flex flex-col h-full bg-white dark:bg-gray-900", className), children: [
|
|
744
|
-
showHeader && /* @__PURE__ */ jsxs7("div", { className: "px-4 py-3 bg-white dark:bg-gray-900", children: [
|
|
745
|
-
/* @__PURE__ */ jsx9("h2", { className: "!text-lg font-semibold !text-gray-900 dark:!text-white", children: headerTitle }),
|
|
746
|
-
/* @__PURE__ */ jsxs7("p", { className: "!text-xs !text-gray-500 dark:!text-gray-400", children: [
|
|
747
|
-
"Agent: ",
|
|
748
|
-
agentId
|
|
749
|
-
] })
|
|
750
|
-
] }),
|
|
751
|
-
/* @__PURE__ */ jsx9(MessageList, { messages, onAction }),
|
|
752
|
-
isLoading && /* @__PURE__ */ jsx9("div", { className: "px-4 py-2 !text-sm !text-gray-500 dark:!text-gray-400 italic", children: "AI is thinking..." }),
|
|
753
|
-
/* @__PURE__ */ jsx9(Composer, { onSendMessage: handleSendMessage, placeholder, disabled: isLoading, onFileUpload })
|
|
754
|
-
] });
|
|
755
|
-
}
|
|
756
|
-
|
|
757
|
-
// src/components/Command/Command.tsx
|
|
758
|
-
import React, { useState as useState3, useEffect as useEffect4 } from "react";
|
|
759
|
-
|
|
760
822
|
// src/lib/apteva-client.ts
|
|
761
823
|
var DEFAULT_API_URL = "http://localhost:3000/agents";
|
|
762
824
|
var DEFAULT_API_KEY = "agt_894abd5966bc9f1e9f8f17f2a6f6b5e0";
|
|
@@ -868,15 +930,9 @@ var AptevaClient = class {
|
|
|
868
930
|
if (chunk.thread_id) {
|
|
869
931
|
threadId = chunk.thread_id;
|
|
870
932
|
}
|
|
871
|
-
|
|
872
|
-
onChunk({ type: "token", content: chunk.content });
|
|
873
|
-
} else if (chunk.type === "widget" && chunk.widget) {
|
|
874
|
-
onChunk({ type: "widget", widget: chunk.widget });
|
|
875
|
-
} else if (chunk.type === "complete") {
|
|
876
|
-
onChunk({ type: "complete", thread_id: threadId });
|
|
877
|
-
}
|
|
933
|
+
onChunk(chunk);
|
|
878
934
|
} catch (e) {
|
|
879
|
-
console.warn("Failed to parse SSE data:", data);
|
|
935
|
+
console.warn("[AptevaClient] Failed to parse SSE data:", data);
|
|
880
936
|
}
|
|
881
937
|
}
|
|
882
938
|
}
|
|
@@ -927,8 +983,257 @@ var AptevaClient = class {
|
|
|
927
983
|
};
|
|
928
984
|
var aptevaClient = new AptevaClient();
|
|
929
985
|
|
|
986
|
+
// src/components/Chat/Chat.tsx
|
|
987
|
+
import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
988
|
+
function Chat({
|
|
989
|
+
agentId,
|
|
990
|
+
threadId,
|
|
991
|
+
initialMessages = [],
|
|
992
|
+
context,
|
|
993
|
+
useMock = false,
|
|
994
|
+
onThreadChange,
|
|
995
|
+
onMessageSent,
|
|
996
|
+
onAction,
|
|
997
|
+
onFileUpload,
|
|
998
|
+
placeholder = "Type a message...",
|
|
999
|
+
showHeader = true,
|
|
1000
|
+
headerTitle = "Chat",
|
|
1001
|
+
className
|
|
1002
|
+
}) {
|
|
1003
|
+
const [messages, setMessages] = useState2(initialMessages);
|
|
1004
|
+
const [isLoading, setIsLoading] = useState2(false);
|
|
1005
|
+
const [currentThreadId, setCurrentThreadId] = useState2(threadId || null);
|
|
1006
|
+
useEffect3(() => {
|
|
1007
|
+
if (threadId) {
|
|
1008
|
+
console.log("Loading thread:", threadId);
|
|
1009
|
+
onThreadChange?.(threadId);
|
|
1010
|
+
}
|
|
1011
|
+
}, [threadId, onThreadChange]);
|
|
1012
|
+
const handleSendMessage = async (text) => {
|
|
1013
|
+
const userMessage = {
|
|
1014
|
+
id: `msg-${Date.now()}`,
|
|
1015
|
+
role: "user",
|
|
1016
|
+
content: text,
|
|
1017
|
+
timestamp: /* @__PURE__ */ new Date()
|
|
1018
|
+
};
|
|
1019
|
+
setMessages((prev) => [...prev, userMessage]);
|
|
1020
|
+
onMessageSent?.(userMessage);
|
|
1021
|
+
setIsLoading(true);
|
|
1022
|
+
try {
|
|
1023
|
+
if (useMock) {
|
|
1024
|
+
const response = await generateMockResponse(1e3);
|
|
1025
|
+
setMessages((prev) => [...prev, response]);
|
|
1026
|
+
} else {
|
|
1027
|
+
let contentSegments = [];
|
|
1028
|
+
let currentTextBuffer = "";
|
|
1029
|
+
let accumulatedWidgets = [];
|
|
1030
|
+
let responseThreadId = currentThreadId;
|
|
1031
|
+
let toolInputBuffer = "";
|
|
1032
|
+
const updateMessage = () => {
|
|
1033
|
+
const segments = [...contentSegments];
|
|
1034
|
+
if (currentTextBuffer) {
|
|
1035
|
+
const lastSegment = segments[segments.length - 1];
|
|
1036
|
+
if (lastSegment && lastSegment.type === "text") {
|
|
1037
|
+
lastSegment.content = currentTextBuffer;
|
|
1038
|
+
} else {
|
|
1039
|
+
segments.push({ type: "text", content: currentTextBuffer });
|
|
1040
|
+
}
|
|
1041
|
+
}
|
|
1042
|
+
setMessages((prev) => {
|
|
1043
|
+
const lastMessage = prev[prev.length - 1];
|
|
1044
|
+
if (lastMessage && lastMessage.role === "assistant") {
|
|
1045
|
+
return [
|
|
1046
|
+
...prev.slice(0, -1),
|
|
1047
|
+
{
|
|
1048
|
+
...lastMessage,
|
|
1049
|
+
content: currentTextBuffer,
|
|
1050
|
+
widgets: accumulatedWidgets.length > 0 ? accumulatedWidgets : void 0,
|
|
1051
|
+
metadata: {
|
|
1052
|
+
...lastMessage.metadata,
|
|
1053
|
+
content_segments: segments
|
|
1054
|
+
}
|
|
1055
|
+
}
|
|
1056
|
+
];
|
|
1057
|
+
} else {
|
|
1058
|
+
return [
|
|
1059
|
+
...prev,
|
|
1060
|
+
{
|
|
1061
|
+
id: `msg-${Date.now()}-streaming`,
|
|
1062
|
+
role: "assistant",
|
|
1063
|
+
content: currentTextBuffer,
|
|
1064
|
+
widgets: accumulatedWidgets.length > 0 ? accumulatedWidgets : void 0,
|
|
1065
|
+
timestamp: /* @__PURE__ */ new Date(),
|
|
1066
|
+
metadata: {
|
|
1067
|
+
content_segments: segments
|
|
1068
|
+
}
|
|
1069
|
+
}
|
|
1070
|
+
];
|
|
1071
|
+
}
|
|
1072
|
+
});
|
|
1073
|
+
};
|
|
1074
|
+
await aptevaClient.chatStream(
|
|
1075
|
+
{
|
|
1076
|
+
agent_id: agentId,
|
|
1077
|
+
message: text,
|
|
1078
|
+
stream: true,
|
|
1079
|
+
...currentThreadId && { thread_id: currentThreadId },
|
|
1080
|
+
...context && { system: context }
|
|
1081
|
+
},
|
|
1082
|
+
(chunk) => {
|
|
1083
|
+
console.log("[Chat] Chunk:", chunk);
|
|
1084
|
+
switch (chunk.type) {
|
|
1085
|
+
case "start":
|
|
1086
|
+
break;
|
|
1087
|
+
case "thread_id":
|
|
1088
|
+
if (chunk.thread_id) {
|
|
1089
|
+
responseThreadId = chunk.thread_id;
|
|
1090
|
+
if (!currentThreadId) {
|
|
1091
|
+
setCurrentThreadId(chunk.thread_id);
|
|
1092
|
+
onThreadChange?.(chunk.thread_id);
|
|
1093
|
+
}
|
|
1094
|
+
}
|
|
1095
|
+
break;
|
|
1096
|
+
case "content":
|
|
1097
|
+
case "token":
|
|
1098
|
+
if (chunk.content) {
|
|
1099
|
+
currentTextBuffer += chunk.content;
|
|
1100
|
+
updateMessage();
|
|
1101
|
+
}
|
|
1102
|
+
break;
|
|
1103
|
+
case "tool_call":
|
|
1104
|
+
if (chunk.tool_id && chunk.tool_name) {
|
|
1105
|
+
if (currentTextBuffer) {
|
|
1106
|
+
contentSegments.push({ type: "text", content: currentTextBuffer });
|
|
1107
|
+
currentTextBuffer = "";
|
|
1108
|
+
}
|
|
1109
|
+
contentSegments.push({
|
|
1110
|
+
type: "tool",
|
|
1111
|
+
id: chunk.tool_id,
|
|
1112
|
+
name: chunk.tool_name
|
|
1113
|
+
});
|
|
1114
|
+
toolInputBuffer = "";
|
|
1115
|
+
updateMessage();
|
|
1116
|
+
}
|
|
1117
|
+
break;
|
|
1118
|
+
case "tool_input_delta":
|
|
1119
|
+
if (chunk.tool_id && chunk.content) {
|
|
1120
|
+
toolInputBuffer += chunk.content;
|
|
1121
|
+
}
|
|
1122
|
+
break;
|
|
1123
|
+
case "tool_use":
|
|
1124
|
+
toolInputBuffer = "";
|
|
1125
|
+
break;
|
|
1126
|
+
case "tool_result":
|
|
1127
|
+
if (chunk.tool_id) {
|
|
1128
|
+
const toolSegment = contentSegments.find(
|
|
1129
|
+
(s) => s.type === "tool" && s.id === chunk.tool_id
|
|
1130
|
+
);
|
|
1131
|
+
if (toolSegment) {
|
|
1132
|
+
toolSegment.result = chunk.content;
|
|
1133
|
+
}
|
|
1134
|
+
updateMessage();
|
|
1135
|
+
}
|
|
1136
|
+
break;
|
|
1137
|
+
case "widget":
|
|
1138
|
+
if (chunk.widget) {
|
|
1139
|
+
accumulatedWidgets.push(chunk.widget);
|
|
1140
|
+
updateMessage();
|
|
1141
|
+
}
|
|
1142
|
+
break;
|
|
1143
|
+
case "stop":
|
|
1144
|
+
break;
|
|
1145
|
+
case "complete":
|
|
1146
|
+
break;
|
|
1147
|
+
case "error":
|
|
1148
|
+
throw new Error(chunk.message || "Stream error");
|
|
1149
|
+
default:
|
|
1150
|
+
break;
|
|
1151
|
+
}
|
|
1152
|
+
},
|
|
1153
|
+
(threadId2) => {
|
|
1154
|
+
if (currentTextBuffer) {
|
|
1155
|
+
const lastSegment = contentSegments[contentSegments.length - 1];
|
|
1156
|
+
if (lastSegment && lastSegment.type === "text") {
|
|
1157
|
+
lastSegment.content = currentTextBuffer;
|
|
1158
|
+
} else {
|
|
1159
|
+
contentSegments.push({ type: "text", content: currentTextBuffer });
|
|
1160
|
+
}
|
|
1161
|
+
}
|
|
1162
|
+
setMessages((prev) => {
|
|
1163
|
+
const lastMessage = prev[prev.length - 1];
|
|
1164
|
+
if (lastMessage && lastMessage.role === "assistant") {
|
|
1165
|
+
return [
|
|
1166
|
+
...prev.slice(0, -1),
|
|
1167
|
+
{
|
|
1168
|
+
...lastMessage,
|
|
1169
|
+
id: `msg-${Date.now()}`,
|
|
1170
|
+
content: currentTextBuffer || "Response received",
|
|
1171
|
+
widgets: accumulatedWidgets.length > 0 ? accumulatedWidgets : void 0,
|
|
1172
|
+
metadata: {
|
|
1173
|
+
thread_id: threadId2,
|
|
1174
|
+
content_segments: contentSegments
|
|
1175
|
+
}
|
|
1176
|
+
}
|
|
1177
|
+
];
|
|
1178
|
+
}
|
|
1179
|
+
return prev;
|
|
1180
|
+
});
|
|
1181
|
+
if (threadId2 && threadId2 !== currentThreadId) {
|
|
1182
|
+
setCurrentThreadId(threadId2);
|
|
1183
|
+
onThreadChange?.(threadId2);
|
|
1184
|
+
}
|
|
1185
|
+
setIsLoading(false);
|
|
1186
|
+
},
|
|
1187
|
+
(error) => {
|
|
1188
|
+
const errorMessage = {
|
|
1189
|
+
id: `msg-${Date.now()}-error`,
|
|
1190
|
+
role: "assistant",
|
|
1191
|
+
content: `Error: ${error.message}`,
|
|
1192
|
+
timestamp: /* @__PURE__ */ new Date(),
|
|
1193
|
+
metadata: { error: true }
|
|
1194
|
+
};
|
|
1195
|
+
setMessages((prev) => {
|
|
1196
|
+
const lastMessage = prev[prev.length - 1];
|
|
1197
|
+
if (lastMessage && lastMessage.id.includes("streaming")) {
|
|
1198
|
+
return [...prev.slice(0, -1), errorMessage];
|
|
1199
|
+
}
|
|
1200
|
+
return [...prev, errorMessage];
|
|
1201
|
+
});
|
|
1202
|
+
setIsLoading(false);
|
|
1203
|
+
}
|
|
1204
|
+
);
|
|
1205
|
+
}
|
|
1206
|
+
} catch (error) {
|
|
1207
|
+
console.error("Chat error:", error);
|
|
1208
|
+
const errorMessage = {
|
|
1209
|
+
id: `msg-${Date.now()}-error`,
|
|
1210
|
+
role: "assistant",
|
|
1211
|
+
content: error instanceof Error ? `Error: ${error.message}` : "An error occurred",
|
|
1212
|
+
timestamp: /* @__PURE__ */ new Date(),
|
|
1213
|
+
metadata: { error: true }
|
|
1214
|
+
};
|
|
1215
|
+
setMessages((prev) => [...prev, errorMessage]);
|
|
1216
|
+
} finally {
|
|
1217
|
+
setIsLoading(false);
|
|
1218
|
+
}
|
|
1219
|
+
};
|
|
1220
|
+
return /* @__PURE__ */ jsxs9("div", { className: cn("flex flex-col h-full bg-white dark:bg-gray-900", className), children: [
|
|
1221
|
+
showHeader && /* @__PURE__ */ jsxs9("div", { className: "px-4 py-3 bg-white dark:bg-gray-900", children: [
|
|
1222
|
+
/* @__PURE__ */ jsx11("h2", { className: "!text-lg font-semibold !text-gray-900 dark:!text-white", children: headerTitle }),
|
|
1223
|
+
/* @__PURE__ */ jsxs9("p", { className: "!text-xs !text-gray-500 dark:!text-gray-400", children: [
|
|
1224
|
+
"Agent: ",
|
|
1225
|
+
agentId
|
|
1226
|
+
] })
|
|
1227
|
+
] }),
|
|
1228
|
+
/* @__PURE__ */ jsx11(MessageList, { messages, onAction }),
|
|
1229
|
+
isLoading && /* @__PURE__ */ jsx11("div", { className: "px-4 py-2 !text-sm !text-gray-500 dark:!text-gray-400 italic", children: "AI is thinking..." }),
|
|
1230
|
+
/* @__PURE__ */ jsx11(Composer, { onSendMessage: handleSendMessage, placeholder, disabled: isLoading, onFileUpload })
|
|
1231
|
+
] });
|
|
1232
|
+
}
|
|
1233
|
+
|
|
930
1234
|
// src/components/Command/Command.tsx
|
|
931
|
-
import {
|
|
1235
|
+
import React, { useState as useState3, useEffect as useEffect4 } from "react";
|
|
1236
|
+
import { Fragment as Fragment2, jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
932
1237
|
function Command({
|
|
933
1238
|
agentId,
|
|
934
1239
|
command: initialCommand,
|
|
@@ -1378,7 +1683,7 @@ ${planToExecute}`;
|
|
|
1378
1683
|
setUploadedFiles((prev) => prev.filter((_, i) => i !== index));
|
|
1379
1684
|
};
|
|
1380
1685
|
const isCompact = variant === "compact";
|
|
1381
|
-
return /* @__PURE__ */
|
|
1686
|
+
return /* @__PURE__ */ jsxs10(
|
|
1382
1687
|
"div",
|
|
1383
1688
|
{
|
|
1384
1689
|
className: cn(
|
|
@@ -1393,9 +1698,9 @@ ${planToExecute}`;
|
|
|
1393
1698
|
),
|
|
1394
1699
|
style: { minHeight: isCompact ? "auto" : "180px" },
|
|
1395
1700
|
children: [
|
|
1396
|
-
/* @__PURE__ */
|
|
1397
|
-
state === "idle" && allowInput && !isCompact && /* @__PURE__ */
|
|
1398
|
-
/* @__PURE__ */
|
|
1701
|
+
/* @__PURE__ */ jsxs10("div", { className: cn("flex-1 flex", isCompact ? "flex-row items-center p-3 gap-3" : "flex-col p-4"), children: [
|
|
1702
|
+
state === "idle" && allowInput && !isCompact && /* @__PURE__ */ jsxs10(Fragment2, { children: [
|
|
1703
|
+
/* @__PURE__ */ jsx12(
|
|
1399
1704
|
"textarea",
|
|
1400
1705
|
{
|
|
1401
1706
|
value: command,
|
|
@@ -1411,42 +1716,42 @@ ${planToExecute}`;
|
|
|
1411
1716
|
rows: 6
|
|
1412
1717
|
}
|
|
1413
1718
|
),
|
|
1414
|
-
uploadedFiles.length > 0 && /* @__PURE__ */
|
|
1415
|
-
file.type === "image" ? /* @__PURE__ */
|
|
1719
|
+
uploadedFiles.length > 0 && /* @__PURE__ */ jsx12("div", { className: "flex flex-wrap gap-2 mt-2", children: uploadedFiles.map((file, index) => /* @__PURE__ */ jsxs10("div", { className: "relative group", children: [
|
|
1720
|
+
file.type === "image" ? /* @__PURE__ */ jsx12(
|
|
1416
1721
|
"img",
|
|
1417
1722
|
{
|
|
1418
1723
|
src: file.preview,
|
|
1419
1724
|
alt: file.name,
|
|
1420
1725
|
className: "w-20 h-20 object-cover rounded-lg border-2 border-gray-300 dark:border-gray-600"
|
|
1421
1726
|
}
|
|
1422
|
-
) : /* @__PURE__ */
|
|
1423
|
-
/* @__PURE__ */
|
|
1424
|
-
/* @__PURE__ */
|
|
1727
|
+
) : /* @__PURE__ */ jsxs10("div", { className: "w-20 h-20 flex flex-col items-center justify-center rounded-lg border-2 border-gray-300 dark:border-gray-600 bg-gray-50 dark:bg-gray-800", children: [
|
|
1728
|
+
/* @__PURE__ */ jsx12("svg", { className: "w-8 h-8 text-gray-500 dark:text-gray-400", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx12("path", { fillRule: "evenodd", d: "M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm2 6a1 1 0 011-1h6a1 1 0 110 2H7a1 1 0 01-1-1zm1 3a1 1 0 100 2h6a1 1 0 100-2H7z", clipRule: "evenodd" }) }),
|
|
1729
|
+
/* @__PURE__ */ jsx12("span", { className: "text-[8px] text-gray-500 dark:text-gray-400 mt-1 px-1 truncate max-w-full", children: file.name.length > 12 ? file.name.slice(0, 12) + "..." : file.name })
|
|
1425
1730
|
] }),
|
|
1426
|
-
/* @__PURE__ */
|
|
1731
|
+
/* @__PURE__ */ jsx12(
|
|
1427
1732
|
"button",
|
|
1428
1733
|
{
|
|
1429
1734
|
onClick: () => removeFile(index),
|
|
1430
1735
|
className: "absolute -top-2 -right-2 w-6 h-6 bg-red-500 hover:bg-red-600 text-white rounded-full flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity",
|
|
1431
1736
|
title: `Remove ${file.type}`,
|
|
1432
|
-
children: /* @__PURE__ */
|
|
1737
|
+
children: /* @__PURE__ */ jsx12("svg", { className: "w-4 h-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
|
|
1433
1738
|
}
|
|
1434
1739
|
)
|
|
1435
1740
|
] }, index)) })
|
|
1436
1741
|
] }),
|
|
1437
|
-
state === "idle" && allowInput && isCompact && /* @__PURE__ */
|
|
1438
|
-
/* @__PURE__ */
|
|
1439
|
-
enableFileUpload && /* @__PURE__ */
|
|
1742
|
+
state === "idle" && allowInput && isCompact && /* @__PURE__ */ jsxs10(Fragment2, { children: [
|
|
1743
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-0.5 flex-shrink-0", children: [
|
|
1744
|
+
enableFileUpload && /* @__PURE__ */ jsx12(
|
|
1440
1745
|
"button",
|
|
1441
1746
|
{
|
|
1442
1747
|
onClick: () => fileInputRef.current?.click(),
|
|
1443
1748
|
className: "w-8 h-8 rounded-lg flex items-center justify-center transition-all flex-shrink-0 !text-gray-500 dark:!text-gray-500 hover:bg-gray-100 dark:hover:bg-gray-800",
|
|
1444
1749
|
title: "Attach file",
|
|
1445
|
-
children: /* @__PURE__ */
|
|
1750
|
+
children: /* @__PURE__ */ jsx12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx12("path", { d: "M8.4 2.8L4.4 6.8C3.736 7.464 3.736 8.536 4.4 9.2C5.064 9.864 6.136 9.864 6.8 9.2L11.6 4.4C12.704 3.296 12.704 1.504 11.6 0.4C10.496 -0.704 8.704 -0.704 7.6 0.4L2.8 5.2C1.256 6.744 1.256 9.256 2.8 10.8C4.344 12.344 6.856 12.344 8.4 10.8L12.4 6.8", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", transform: "translate(1.6, 2.4)" }) })
|
|
1446
1751
|
}
|
|
1447
1752
|
),
|
|
1448
|
-
planMode && /* @__PURE__ */
|
|
1449
|
-
/* @__PURE__ */
|
|
1753
|
+
planMode && /* @__PURE__ */ jsxs10("div", { className: "relative settings-menu-container", children: [
|
|
1754
|
+
/* @__PURE__ */ jsx12(
|
|
1450
1755
|
"button",
|
|
1451
1756
|
{
|
|
1452
1757
|
onClick: () => setShowSettingsMenu(!showSettingsMenu),
|
|
@@ -1455,28 +1760,28 @@ ${planToExecute}`;
|
|
|
1455
1760
|
internalPlanMode ? "!text-blue-600 dark:!text-blue-400" : "!text-gray-500 dark:!text-gray-500"
|
|
1456
1761
|
),
|
|
1457
1762
|
title: "Settings",
|
|
1458
|
-
children: /* @__PURE__ */
|
|
1459
|
-
/* @__PURE__ */
|
|
1460
|
-
/* @__PURE__ */
|
|
1461
|
-
/* @__PURE__ */
|
|
1462
|
-
/* @__PURE__ */
|
|
1463
|
-
/* @__PURE__ */
|
|
1464
|
-
/* @__PURE__ */
|
|
1465
|
-
/* @__PURE__ */
|
|
1466
|
-
/* @__PURE__ */
|
|
1467
|
-
/* @__PURE__ */
|
|
1763
|
+
children: /* @__PURE__ */ jsxs10("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
1764
|
+
/* @__PURE__ */ jsx12("line", { x1: "4", y1: "21", x2: "4", y2: "14" }),
|
|
1765
|
+
/* @__PURE__ */ jsx12("line", { x1: "4", y1: "10", x2: "4", y2: "3" }),
|
|
1766
|
+
/* @__PURE__ */ jsx12("line", { x1: "12", y1: "21", x2: "12", y2: "12" }),
|
|
1767
|
+
/* @__PURE__ */ jsx12("line", { x1: "12", y1: "8", x2: "12", y2: "3" }),
|
|
1768
|
+
/* @__PURE__ */ jsx12("line", { x1: "20", y1: "21", x2: "20", y2: "16" }),
|
|
1769
|
+
/* @__PURE__ */ jsx12("line", { x1: "20", y1: "12", x2: "20", y2: "3" }),
|
|
1770
|
+
/* @__PURE__ */ jsx12("line", { x1: "1", y1: "14", x2: "7", y2: "14" }),
|
|
1771
|
+
/* @__PURE__ */ jsx12("line", { x1: "9", y1: "8", x2: "15", y2: "8" }),
|
|
1772
|
+
/* @__PURE__ */ jsx12("line", { x1: "17", y1: "16", x2: "23", y2: "16" })
|
|
1468
1773
|
] })
|
|
1469
1774
|
}
|
|
1470
1775
|
),
|
|
1471
|
-
showSettingsMenu && /* @__PURE__ */
|
|
1472
|
-
/* @__PURE__ */
|
|
1473
|
-
/* @__PURE__ */
|
|
1474
|
-
/* @__PURE__ */
|
|
1475
|
-
/* @__PURE__ */
|
|
1476
|
-
/* @__PURE__ */
|
|
1776
|
+
showSettingsMenu && /* @__PURE__ */ jsx12("div", { className: "absolute top-10 left-0 z-50 w-56 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg shadow-lg p-2.5 settings-menu-container", children: /* @__PURE__ */ jsxs10("label", { className: "flex items-center justify-between cursor-pointer group", children: [
|
|
1777
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2", children: [
|
|
1778
|
+
/* @__PURE__ */ jsx12("svg", { className: "w-3.5 h-3.5 text-gray-500 dark:text-gray-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01" }) }),
|
|
1779
|
+
/* @__PURE__ */ jsxs10("div", { children: [
|
|
1780
|
+
/* @__PURE__ */ jsx12("div", { className: "text-xs font-medium text-gray-700 dark:text-gray-300", children: "Plan Mode" }),
|
|
1781
|
+
/* @__PURE__ */ jsx12("div", { className: "text-[10px] text-gray-500 dark:text-gray-400", children: "Review first" })
|
|
1477
1782
|
] })
|
|
1478
1783
|
] }),
|
|
1479
|
-
/* @__PURE__ */
|
|
1784
|
+
/* @__PURE__ */ jsx12(
|
|
1480
1785
|
"button",
|
|
1481
1786
|
{
|
|
1482
1787
|
onClick: (e) => {
|
|
@@ -1488,7 +1793,7 @@ ${planToExecute}`;
|
|
|
1488
1793
|
internalPlanMode ? "bg-blue-600" : "bg-gray-300 dark:bg-gray-600"
|
|
1489
1794
|
),
|
|
1490
1795
|
type: "button",
|
|
1491
|
-
children: /* @__PURE__ */
|
|
1796
|
+
children: /* @__PURE__ */ jsx12(
|
|
1492
1797
|
"span",
|
|
1493
1798
|
{
|
|
1494
1799
|
className: cn(
|
|
@@ -1502,26 +1807,26 @@ ${planToExecute}`;
|
|
|
1502
1807
|
] }) })
|
|
1503
1808
|
] })
|
|
1504
1809
|
] }),
|
|
1505
|
-
uploadedFiles.length > 0 && /* @__PURE__ */
|
|
1506
|
-
file.type === "image" ? /* @__PURE__ */
|
|
1810
|
+
uploadedFiles.length > 0 && /* @__PURE__ */ jsx12("div", { className: "flex gap-1 flex-shrink-0", children: uploadedFiles.map((file, index) => /* @__PURE__ */ jsxs10("div", { className: "relative group", children: [
|
|
1811
|
+
file.type === "image" ? /* @__PURE__ */ jsx12(
|
|
1507
1812
|
"img",
|
|
1508
1813
|
{
|
|
1509
1814
|
src: file.preview,
|
|
1510
1815
|
alt: file.name,
|
|
1511
1816
|
className: "w-8 h-8 object-cover rounded border border-gray-300 dark:border-gray-600"
|
|
1512
1817
|
}
|
|
1513
|
-
) : /* @__PURE__ */
|
|
1514
|
-
/* @__PURE__ */
|
|
1818
|
+
) : /* @__PURE__ */ jsx12("div", { className: "w-8 h-8 flex items-center justify-center rounded border border-gray-300 dark:border-gray-600 bg-gray-50 dark:bg-gray-800", title: file.name, children: /* @__PURE__ */ jsx12("svg", { className: "w-4 h-4 text-gray-500 dark:text-gray-400", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx12("path", { fillRule: "evenodd", d: "M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm2 6a1 1 0 011-1h6a1 1 0 110 2H7a1 1 0 01-1-1zm1 3a1 1 0 100 2h6a1 1 0 100-2H7z", clipRule: "evenodd" }) }) }),
|
|
1819
|
+
/* @__PURE__ */ jsx12(
|
|
1515
1820
|
"button",
|
|
1516
1821
|
{
|
|
1517
1822
|
onClick: () => removeFile(index),
|
|
1518
1823
|
className: "absolute -top-1 -right-1 w-4 h-4 bg-red-500 hover:bg-red-600 text-white rounded-full flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity",
|
|
1519
1824
|
title: "Remove",
|
|
1520
|
-
children: /* @__PURE__ */
|
|
1825
|
+
children: /* @__PURE__ */ jsx12("svg", { className: "w-2.5 h-2.5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 3, children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12" }) })
|
|
1521
1826
|
}
|
|
1522
1827
|
)
|
|
1523
1828
|
] }, index)) }),
|
|
1524
|
-
/* @__PURE__ */
|
|
1829
|
+
/* @__PURE__ */ jsx12(
|
|
1525
1830
|
"input",
|
|
1526
1831
|
{
|
|
1527
1832
|
type: "text",
|
|
@@ -1537,7 +1842,7 @@ ${planToExecute}`;
|
|
|
1537
1842
|
className: "flex-1 bg-transparent border-none focus:outline-none !text-gray-900 dark:!text-gray-100 placeholder-gray-400 dark:placeholder-gray-500 py-1"
|
|
1538
1843
|
}
|
|
1539
1844
|
),
|
|
1540
|
-
/* @__PURE__ */
|
|
1845
|
+
/* @__PURE__ */ jsx12(
|
|
1541
1846
|
"button",
|
|
1542
1847
|
{
|
|
1543
1848
|
onClick: () => executeCommand(),
|
|
@@ -1553,33 +1858,33 @@ ${planToExecute}`;
|
|
|
1553
1858
|
!command.trim() && "border-gray-200 dark:border-gray-700 !text-gray-400 dark:!text-gray-600"
|
|
1554
1859
|
),
|
|
1555
1860
|
title: "Execute",
|
|
1556
|
-
children: /* @__PURE__ */
|
|
1861
|
+
children: /* @__PURE__ */ jsx12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx12("path", { d: "M8 3L8 13M8 3L4 7M8 3L12 7", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
1557
1862
|
}
|
|
1558
1863
|
)
|
|
1559
1864
|
] }),
|
|
1560
|
-
state === "loading" && !isCompact && /* @__PURE__ */
|
|
1561
|
-
/* @__PURE__ */
|
|
1562
|
-
/* @__PURE__ */
|
|
1563
|
-
showProgress && /* @__PURE__ */
|
|
1564
|
-
/* @__PURE__ */
|
|
1865
|
+
state === "loading" && !isCompact && /* @__PURE__ */ jsxs10("div", { className: "flex-1 flex flex-col items-center justify-center space-y-4 py-8", children: [
|
|
1866
|
+
/* @__PURE__ */ jsx12("div", { className: "w-6 h-6 border-2 border-gray-300 border-t-blue-500 rounded-full animate-spin" }),
|
|
1867
|
+
/* @__PURE__ */ jsx12("div", { className: "text-gray-600 dark:text-gray-400 text-sm text-center max-w-md", children: enableStreaming && streamedContent ? streamedContent : loadingText }),
|
|
1868
|
+
showProgress && /* @__PURE__ */ jsxs10("div", { className: "w-full max-w-sm", children: [
|
|
1869
|
+
/* @__PURE__ */ jsx12("div", { className: "w-full bg-gray-200 dark:bg-gray-700 rounded-full h-1.5", children: /* @__PURE__ */ jsx12(
|
|
1565
1870
|
"div",
|
|
1566
1871
|
{
|
|
1567
1872
|
className: "bg-blue-500 h-1.5 rounded-full transition-all duration-300",
|
|
1568
1873
|
style: { width: `${progress}%` }
|
|
1569
1874
|
}
|
|
1570
1875
|
) }),
|
|
1571
|
-
/* @__PURE__ */
|
|
1876
|
+
/* @__PURE__ */ jsxs10("p", { className: "text-xs text-gray-500 mt-2 text-center", children: [
|
|
1572
1877
|
progress,
|
|
1573
1878
|
"%"
|
|
1574
1879
|
] })
|
|
1575
1880
|
] })
|
|
1576
1881
|
] }),
|
|
1577
|
-
state === "loading" && isCompact && /* @__PURE__ */
|
|
1578
|
-
/* @__PURE__ */
|
|
1579
|
-
/* @__PURE__ */
|
|
1580
|
-
/* @__PURE__ */
|
|
1882
|
+
state === "loading" && isCompact && /* @__PURE__ */ jsxs10(Fragment2, { children: [
|
|
1883
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex-1 flex items-center gap-3 py-1", children: [
|
|
1884
|
+
/* @__PURE__ */ jsx12("div", { className: "w-4 h-4 border-2 border-gray-300 border-t-blue-500 rounded-full animate-spin" }),
|
|
1885
|
+
/* @__PURE__ */ jsx12("div", { className: "text-gray-600 dark:text-gray-400 text-sm truncate", children: enableStreaming && streamedContent ? streamedContent : loadingText })
|
|
1581
1886
|
] }),
|
|
1582
|
-
/* @__PURE__ */
|
|
1887
|
+
/* @__PURE__ */ jsx12(
|
|
1583
1888
|
"button",
|
|
1584
1889
|
{
|
|
1585
1890
|
disabled: true,
|
|
@@ -1591,20 +1896,20 @@ ${planToExecute}`;
|
|
|
1591
1896
|
"!text-lg",
|
|
1592
1897
|
"opacity-30 cursor-not-allowed"
|
|
1593
1898
|
),
|
|
1594
|
-
children: /* @__PURE__ */
|
|
1899
|
+
children: /* @__PURE__ */ jsx12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx12("path", { d: "M8 3L8 13M8 3L4 7M8 3L12 7", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
1595
1900
|
}
|
|
1596
1901
|
)
|
|
1597
1902
|
] }),
|
|
1598
|
-
state === "plan-pending" && !isCompact && /* @__PURE__ */
|
|
1599
|
-
/* @__PURE__ */
|
|
1600
|
-
/* @__PURE__ */
|
|
1601
|
-
/* @__PURE__ */
|
|
1602
|
-
/* @__PURE__ */
|
|
1603
|
-
/* @__PURE__ */
|
|
1903
|
+
state === "plan-pending" && !isCompact && /* @__PURE__ */ jsx12("div", { className: "flex-1 flex flex-col", children: /* @__PURE__ */ jsxs10("div", { className: "mb-4 p-4 bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 rounded-lg", children: [
|
|
1904
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-start gap-2 mb-3", children: [
|
|
1905
|
+
/* @__PURE__ */ jsx12("svg", { className: "w-5 h-5 text-blue-600 dark:text-blue-400 mt-0.5 flex-shrink-0", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01" }) }),
|
|
1906
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex-1", children: [
|
|
1907
|
+
/* @__PURE__ */ jsx12("h3", { className: "text-sm font-semibold text-blue-800 dark:text-blue-300 mb-1", children: "Proposed Plan" }),
|
|
1908
|
+
/* @__PURE__ */ jsx12("div", { className: "text-blue-700 dark:text-blue-300 text-sm whitespace-pre-line leading-relaxed", children: plan })
|
|
1604
1909
|
] })
|
|
1605
1910
|
] }),
|
|
1606
|
-
/* @__PURE__ */
|
|
1607
|
-
/* @__PURE__ */
|
|
1911
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex gap-2 mt-4", children: [
|
|
1912
|
+
/* @__PURE__ */ jsx12(
|
|
1608
1913
|
"button",
|
|
1609
1914
|
{
|
|
1610
1915
|
onClick: approvePlan,
|
|
@@ -1612,7 +1917,7 @@ ${planToExecute}`;
|
|
|
1612
1917
|
children: "Approve & Execute"
|
|
1613
1918
|
}
|
|
1614
1919
|
),
|
|
1615
|
-
/* @__PURE__ */
|
|
1920
|
+
/* @__PURE__ */ jsx12(
|
|
1616
1921
|
"button",
|
|
1617
1922
|
{
|
|
1618
1923
|
onClick: rejectPlan,
|
|
@@ -1622,20 +1927,20 @@ ${planToExecute}`;
|
|
|
1622
1927
|
)
|
|
1623
1928
|
] })
|
|
1624
1929
|
] }) }),
|
|
1625
|
-
state === "plan-pending" && isCompact && /* @__PURE__ */
|
|
1626
|
-
/* @__PURE__ */
|
|
1930
|
+
state === "plan-pending" && isCompact && /* @__PURE__ */ jsxs10(Fragment2, { children: [
|
|
1931
|
+
/* @__PURE__ */ jsxs10(
|
|
1627
1932
|
"button",
|
|
1628
1933
|
{
|
|
1629
1934
|
onClick: () => setShowPlanDetails(true),
|
|
1630
1935
|
className: "flex-1 flex items-center gap-2 px-3 py-2 bg-blue-50 dark:bg-blue-900/30 hover:bg-blue-100 dark:hover:bg-blue-900/40 border border-blue-200 dark:border-blue-800 rounded-lg transition-colors",
|
|
1631
1936
|
children: [
|
|
1632
|
-
/* @__PURE__ */
|
|
1633
|
-
/* @__PURE__ */
|
|
1937
|
+
/* @__PURE__ */ jsx12("svg", { className: "w-4 h-4 text-blue-600 dark:text-blue-400 flex-shrink-0", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01" }) }),
|
|
1938
|
+
/* @__PURE__ */ jsx12("span", { className: "text-sm font-medium text-blue-700 dark:text-blue-300 truncate flex-1", children: "View Execution Plan" })
|
|
1634
1939
|
]
|
|
1635
1940
|
}
|
|
1636
1941
|
),
|
|
1637
|
-
/* @__PURE__ */
|
|
1638
|
-
/* @__PURE__ */
|
|
1942
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex gap-2 flex-shrink-0", children: [
|
|
1943
|
+
/* @__PURE__ */ jsx12(
|
|
1639
1944
|
"button",
|
|
1640
1945
|
{
|
|
1641
1946
|
onClick: approvePlan,
|
|
@@ -1643,7 +1948,7 @@ ${planToExecute}`;
|
|
|
1643
1948
|
children: "Approve"
|
|
1644
1949
|
}
|
|
1645
1950
|
),
|
|
1646
|
-
/* @__PURE__ */
|
|
1951
|
+
/* @__PURE__ */ jsx12(
|
|
1647
1952
|
"button",
|
|
1648
1953
|
{
|
|
1649
1954
|
onClick: rejectPlan,
|
|
@@ -1653,15 +1958,15 @@ ${planToExecute}`;
|
|
|
1653
1958
|
)
|
|
1654
1959
|
] })
|
|
1655
1960
|
] }),
|
|
1656
|
-
state === "error" && /* @__PURE__ */
|
|
1657
|
-
/* @__PURE__ */
|
|
1658
|
-
/* @__PURE__ */
|
|
1659
|
-
/* @__PURE__ */
|
|
1660
|
-
/* @__PURE__ */
|
|
1661
|
-
/* @__PURE__ */
|
|
1961
|
+
state === "error" && /* @__PURE__ */ jsxs10("div", { className: "flex-1 flex flex-col", children: [
|
|
1962
|
+
/* @__PURE__ */ jsx12("div", { className: "mb-4 p-3 bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 rounded-lg", children: /* @__PURE__ */ jsxs10("div", { className: "flex items-start gap-2", children: [
|
|
1963
|
+
/* @__PURE__ */ jsx12("svg", { className: "w-5 h-5 text-red-600 mt-0.5 flex-shrink-0", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
|
|
1964
|
+
/* @__PURE__ */ jsxs10("div", { children: [
|
|
1965
|
+
/* @__PURE__ */ jsx12("h3", { className: "text-sm font-semibold text-red-800 dark:text-red-400", children: "Error" }),
|
|
1966
|
+
/* @__PURE__ */ jsx12("p", { className: "text-red-700 dark:text-red-300 text-sm mt-1", children: error?.message })
|
|
1662
1967
|
] })
|
|
1663
1968
|
] }) }),
|
|
1664
|
-
allowInput && /* @__PURE__ */
|
|
1969
|
+
allowInput && /* @__PURE__ */ jsx12(
|
|
1665
1970
|
"textarea",
|
|
1666
1971
|
{
|
|
1667
1972
|
value: command,
|
|
@@ -1678,16 +1983,16 @@ ${planToExecute}`;
|
|
|
1678
1983
|
}
|
|
1679
1984
|
)
|
|
1680
1985
|
] }),
|
|
1681
|
-
state === "success" && result && !isCompact && /* @__PURE__ */
|
|
1682
|
-
/* @__PURE__ */
|
|
1683
|
-
/* @__PURE__ */
|
|
1684
|
-
/* @__PURE__ */
|
|
1685
|
-
/* @__PURE__ */
|
|
1686
|
-
/* @__PURE__ */
|
|
1986
|
+
state === "success" && result && !isCompact && /* @__PURE__ */ jsx12("div", { className: "flex-1 overflow-auto", children: resultRenderer ? resultRenderer(result.data) : /* @__PURE__ */ jsxs10("div", { className: "space-y-4", children: [
|
|
1987
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-start gap-3 p-3 bg-green-50 dark:bg-green-900/20 border border-green-200 dark:border-green-800 rounded-lg", children: [
|
|
1988
|
+
/* @__PURE__ */ jsx12("svg", { className: "w-5 h-5 text-green-600 mt-0.5 flex-shrink-0", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
|
|
1989
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex-1", children: [
|
|
1990
|
+
/* @__PURE__ */ jsx12("h3", { className: "text-sm font-semibold text-green-800 dark:text-green-400 mb-1", children: "Success" }),
|
|
1991
|
+
/* @__PURE__ */ jsx12("p", { className: "text-green-700 dark:text-green-300 text-sm", children: "Command executed successfully" })
|
|
1687
1992
|
] })
|
|
1688
1993
|
] }),
|
|
1689
|
-
result.data?.summary && /* @__PURE__ */
|
|
1690
|
-
result.widgets && result.widgets.length > 0 && /* @__PURE__ */
|
|
1994
|
+
result.data?.summary && /* @__PURE__ */ jsx12("div", { className: "text-gray-700 dark:text-gray-300 text-sm leading-relaxed whitespace-pre-line", children: result.data.summary }),
|
|
1995
|
+
result.widgets && result.widgets.length > 0 && /* @__PURE__ */ jsx12("div", { className: "space-y-3", children: result.widgets.map((widget) => /* @__PURE__ */ jsx12(
|
|
1691
1996
|
WidgetRenderer,
|
|
1692
1997
|
{
|
|
1693
1998
|
widget,
|
|
@@ -1696,8 +2001,8 @@ ${planToExecute}`;
|
|
|
1696
2001
|
widget.id
|
|
1697
2002
|
)) })
|
|
1698
2003
|
] }) }),
|
|
1699
|
-
state === "success" && result && isCompact && /* @__PURE__ */
|
|
1700
|
-
/* @__PURE__ */
|
|
2004
|
+
state === "success" && result && isCompact && /* @__PURE__ */ jsxs10(Fragment2, { children: [
|
|
2005
|
+
/* @__PURE__ */ jsxs10(
|
|
1701
2006
|
"div",
|
|
1702
2007
|
{
|
|
1703
2008
|
className: "flex-1 flex items-center gap-2 py-1 cursor-text min-w-0",
|
|
@@ -1706,12 +2011,12 @@ ${planToExecute}`;
|
|
|
1706
2011
|
setResult(null);
|
|
1707
2012
|
},
|
|
1708
2013
|
children: [
|
|
1709
|
-
/* @__PURE__ */
|
|
1710
|
-
/* @__PURE__ */
|
|
2014
|
+
/* @__PURE__ */ jsx12("svg", { className: "w-4 h-4 text-green-600 flex-shrink-0", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
|
|
2015
|
+
/* @__PURE__ */ jsx12("div", { className: "text-green-700 dark:text-green-300 text-sm truncate flex-1 min-w-0", children: resultRenderer ? resultRenderer(result.data) : result.message || "Command executed successfully" })
|
|
1711
2016
|
]
|
|
1712
2017
|
}
|
|
1713
2018
|
),
|
|
1714
|
-
/* @__PURE__ */
|
|
2019
|
+
/* @__PURE__ */ jsx12(
|
|
1715
2020
|
"button",
|
|
1716
2021
|
{
|
|
1717
2022
|
onClick: () => {
|
|
@@ -1727,24 +2032,24 @@ ${planToExecute}`;
|
|
|
1727
2032
|
"!text-lg"
|
|
1728
2033
|
),
|
|
1729
2034
|
title: "New command",
|
|
1730
|
-
children: /* @__PURE__ */
|
|
2035
|
+
children: /* @__PURE__ */ jsx12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx12("path", { d: "M8 3L8 13M8 3L4 7M8 3L12 7", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
1731
2036
|
}
|
|
1732
2037
|
)
|
|
1733
2038
|
] })
|
|
1734
2039
|
] }),
|
|
1735
|
-
!isCompact && /* @__PURE__ */
|
|
1736
|
-
/* @__PURE__ */
|
|
1737
|
-
enableFileUpload && /* @__PURE__ */
|
|
2040
|
+
!isCompact && /* @__PURE__ */ jsxs10("div", { className: "p-3 flex items-center justify-between gap-2", children: [
|
|
2041
|
+
/* @__PURE__ */ jsx12("div", { className: "flex items-center gap-1", children: state === "idle" && allowInput && /* @__PURE__ */ jsxs10(Fragment2, { children: [
|
|
2042
|
+
enableFileUpload && /* @__PURE__ */ jsx12(
|
|
1738
2043
|
"button",
|
|
1739
2044
|
{
|
|
1740
2045
|
onClick: () => fileInputRef.current?.click(),
|
|
1741
2046
|
className: "w-8 h-8 rounded-lg flex items-center justify-center transition-all flex-shrink-0 !text-gray-500 dark:!text-gray-500 hover:bg-gray-100 dark:hover:bg-gray-800",
|
|
1742
2047
|
title: "Attach file",
|
|
1743
|
-
children: /* @__PURE__ */
|
|
2048
|
+
children: /* @__PURE__ */ jsx12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx12("path", { d: "M8.4 2.8L4.4 6.8C3.736 7.464 3.736 8.536 4.4 9.2C5.064 9.864 6.136 9.864 6.8 9.2L11.6 4.4C12.704 3.296 12.704 1.504 11.6 0.4C10.496 -0.704 8.704 -0.704 7.6 0.4L2.8 5.2C1.256 6.744 1.256 9.256 2.8 10.8C4.344 12.344 6.856 12.344 8.4 10.8L12.4 6.8", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", transform: "translate(1.6, 2.4)" }) })
|
|
1744
2049
|
}
|
|
1745
2050
|
),
|
|
1746
|
-
planMode && /* @__PURE__ */
|
|
1747
|
-
/* @__PURE__ */
|
|
2051
|
+
planMode && /* @__PURE__ */ jsxs10("div", { className: "relative settings-menu-container", children: [
|
|
2052
|
+
/* @__PURE__ */ jsx12(
|
|
1748
2053
|
"button",
|
|
1749
2054
|
{
|
|
1750
2055
|
onClick: () => setShowSettingsMenu(!showSettingsMenu),
|
|
@@ -1753,28 +2058,28 @@ ${planToExecute}`;
|
|
|
1753
2058
|
internalPlanMode ? "!text-blue-600 dark:!text-blue-400" : "!text-gray-500 dark:!text-gray-500"
|
|
1754
2059
|
),
|
|
1755
2060
|
title: "Settings",
|
|
1756
|
-
children: /* @__PURE__ */
|
|
1757
|
-
/* @__PURE__ */
|
|
1758
|
-
/* @__PURE__ */
|
|
1759
|
-
/* @__PURE__ */
|
|
1760
|
-
/* @__PURE__ */
|
|
1761
|
-
/* @__PURE__ */
|
|
1762
|
-
/* @__PURE__ */
|
|
1763
|
-
/* @__PURE__ */
|
|
1764
|
-
/* @__PURE__ */
|
|
1765
|
-
/* @__PURE__ */
|
|
2061
|
+
children: /* @__PURE__ */ jsxs10("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
2062
|
+
/* @__PURE__ */ jsx12("line", { x1: "4", y1: "21", x2: "4", y2: "14" }),
|
|
2063
|
+
/* @__PURE__ */ jsx12("line", { x1: "4", y1: "10", x2: "4", y2: "3" }),
|
|
2064
|
+
/* @__PURE__ */ jsx12("line", { x1: "12", y1: "21", x2: "12", y2: "12" }),
|
|
2065
|
+
/* @__PURE__ */ jsx12("line", { x1: "12", y1: "8", x2: "12", y2: "3" }),
|
|
2066
|
+
/* @__PURE__ */ jsx12("line", { x1: "20", y1: "21", x2: "20", y2: "16" }),
|
|
2067
|
+
/* @__PURE__ */ jsx12("line", { x1: "20", y1: "12", x2: "20", y2: "3" }),
|
|
2068
|
+
/* @__PURE__ */ jsx12("line", { x1: "1", y1: "14", x2: "7", y2: "14" }),
|
|
2069
|
+
/* @__PURE__ */ jsx12("line", { x1: "9", y1: "8", x2: "15", y2: "8" }),
|
|
2070
|
+
/* @__PURE__ */ jsx12("line", { x1: "17", y1: "16", x2: "23", y2: "16" })
|
|
1766
2071
|
] })
|
|
1767
2072
|
}
|
|
1768
2073
|
),
|
|
1769
|
-
showSettingsMenu && /* @__PURE__ */
|
|
1770
|
-
/* @__PURE__ */
|
|
1771
|
-
/* @__PURE__ */
|
|
1772
|
-
/* @__PURE__ */
|
|
1773
|
-
/* @__PURE__ */
|
|
1774
|
-
/* @__PURE__ */
|
|
2074
|
+
showSettingsMenu && /* @__PURE__ */ jsx12("div", { className: "absolute top-10 left-0 z-50 w-64 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg shadow-lg p-3 settings-menu-container", children: /* @__PURE__ */ jsxs10("label", { className: "flex items-center justify-between cursor-pointer group", children: [
|
|
2075
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2", children: [
|
|
2076
|
+
/* @__PURE__ */ jsx12("svg", { className: "w-4 h-4 text-gray-500 dark:text-gray-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01" }) }),
|
|
2077
|
+
/* @__PURE__ */ jsxs10("div", { children: [
|
|
2078
|
+
/* @__PURE__ */ jsx12("div", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: "Plan Mode" }),
|
|
2079
|
+
/* @__PURE__ */ jsx12("div", { className: "text-xs text-gray-500 dark:text-gray-400", children: "Review before executing" })
|
|
1775
2080
|
] })
|
|
1776
2081
|
] }),
|
|
1777
|
-
/* @__PURE__ */
|
|
2082
|
+
/* @__PURE__ */ jsx12(
|
|
1778
2083
|
"button",
|
|
1779
2084
|
{
|
|
1780
2085
|
onClick: (e) => {
|
|
@@ -1786,7 +2091,7 @@ ${planToExecute}`;
|
|
|
1786
2091
|
internalPlanMode ? "bg-blue-600" : "bg-gray-300 dark:bg-gray-600"
|
|
1787
2092
|
),
|
|
1788
2093
|
type: "button",
|
|
1789
|
-
children: /* @__PURE__ */
|
|
2094
|
+
children: /* @__PURE__ */ jsx12(
|
|
1790
2095
|
"span",
|
|
1791
2096
|
{
|
|
1792
2097
|
className: cn(
|
|
@@ -1800,9 +2105,9 @@ ${planToExecute}`;
|
|
|
1800
2105
|
] }) })
|
|
1801
2106
|
] })
|
|
1802
2107
|
] }) }),
|
|
1803
|
-
!(state === "idle" && allowInput) && /* @__PURE__ */
|
|
1804
|
-
/* @__PURE__ */
|
|
1805
|
-
(state === "success" || state === "error") && allowInput && /* @__PURE__ */
|
|
2108
|
+
!(state === "idle" && allowInput) && /* @__PURE__ */ jsx12("div", {}),
|
|
2109
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2", children: [
|
|
2110
|
+
(state === "success" || state === "error") && allowInput && /* @__PURE__ */ jsx12(
|
|
1806
2111
|
"button",
|
|
1807
2112
|
{
|
|
1808
2113
|
onClick: resetCommand,
|
|
@@ -1810,7 +2115,7 @@ ${planToExecute}`;
|
|
|
1810
2115
|
children: "Reset"
|
|
1811
2116
|
}
|
|
1812
2117
|
),
|
|
1813
|
-
(state === "idle" || state === "error") && /* @__PURE__ */
|
|
2118
|
+
(state === "idle" || state === "error") && /* @__PURE__ */ jsx12(
|
|
1814
2119
|
"button",
|
|
1815
2120
|
{
|
|
1816
2121
|
onClick: () => executeCommand(),
|
|
@@ -1826,29 +2131,29 @@ ${planToExecute}`;
|
|
|
1826
2131
|
!command.trim() && "border-gray-200 dark:border-gray-700 !text-gray-400 dark:!text-gray-600"
|
|
1827
2132
|
),
|
|
1828
2133
|
title: state === "error" ? "Retry" : "Execute",
|
|
1829
|
-
children: state === "error" ? /* @__PURE__ */
|
|
2134
|
+
children: state === "error" ? /* @__PURE__ */ jsx12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx12("path", { d: "M13 8C13 10.7614 10.7614 13 8 13C5.23858 13 3 10.7614 3 8C3 5.23858 5.23858 3 8 3C9.65685 3 11.1257 3.82818 12 5.09091M12 3V5.09091M12 5.09091H9.81818", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) : /* @__PURE__ */ jsx12("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx12("path", { d: "M8 3L8 13M8 3L4 7M8 3L12 7", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
|
|
1830
2135
|
}
|
|
1831
2136
|
)
|
|
1832
2137
|
] })
|
|
1833
2138
|
] }),
|
|
1834
|
-
showPlanDetails && isCompact && state === "plan-pending" && /* @__PURE__ */
|
|
1835
|
-
/* @__PURE__ */
|
|
1836
|
-
/* @__PURE__ */
|
|
1837
|
-
/* @__PURE__ */
|
|
1838
|
-
/* @__PURE__ */
|
|
2139
|
+
showPlanDetails && isCompact && state === "plan-pending" && /* @__PURE__ */ jsx12("div", { className: "fixed inset-0 bg-black/50 flex items-center justify-center z-50 p-4", onClick: () => setShowPlanDetails(false), children: /* @__PURE__ */ jsxs10("div", { className: "bg-white dark:bg-gray-900 rounded-2xl shadow-2xl max-w-2xl w-full max-h-[80vh] overflow-hidden", onClick: (e) => e.stopPropagation(), children: [
|
|
2140
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-center justify-between p-6 border-b border-gray-200 dark:border-gray-700", children: [
|
|
2141
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-3", children: [
|
|
2142
|
+
/* @__PURE__ */ jsx12("svg", { className: "w-6 h-6 text-blue-600 dark:text-blue-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01" }) }),
|
|
2143
|
+
/* @__PURE__ */ jsx12("h2", { className: "text-xl font-semibold text-gray-900 dark:text-white", children: "Proposed Execution Plan" })
|
|
1839
2144
|
] }),
|
|
1840
|
-
/* @__PURE__ */
|
|
2145
|
+
/* @__PURE__ */ jsx12(
|
|
1841
2146
|
"button",
|
|
1842
2147
|
{
|
|
1843
2148
|
onClick: () => setShowPlanDetails(false),
|
|
1844
2149
|
className: "text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 transition-colors",
|
|
1845
|
-
children: /* @__PURE__ */
|
|
2150
|
+
children: /* @__PURE__ */ jsx12("svg", { className: "w-6 h-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx12("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
|
|
1846
2151
|
}
|
|
1847
2152
|
)
|
|
1848
2153
|
] }),
|
|
1849
|
-
/* @__PURE__ */
|
|
1850
|
-
/* @__PURE__ */
|
|
1851
|
-
/* @__PURE__ */
|
|
2154
|
+
/* @__PURE__ */ jsx12("div", { className: "p-6 overflow-y-auto max-h-[calc(80vh-180px)]", children: /* @__PURE__ */ jsx12("div", { className: "prose prose-sm dark:prose-invert max-w-none", children: /* @__PURE__ */ jsx12("div", { className: "text-gray-700 dark:text-gray-300 whitespace-pre-line leading-relaxed", children: plan }) }) }),
|
|
2155
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-center justify-end gap-3 p-6 border-t border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-800/50", children: [
|
|
2156
|
+
/* @__PURE__ */ jsx12(
|
|
1852
2157
|
"button",
|
|
1853
2158
|
{
|
|
1854
2159
|
onClick: rejectPlan,
|
|
@@ -1856,7 +2161,7 @@ ${planToExecute}`;
|
|
|
1856
2161
|
children: "Modify Command"
|
|
1857
2162
|
}
|
|
1858
2163
|
),
|
|
1859
|
-
/* @__PURE__ */
|
|
2164
|
+
/* @__PURE__ */ jsx12(
|
|
1860
2165
|
"button",
|
|
1861
2166
|
{
|
|
1862
2167
|
onClick: approvePlan,
|
|
@@ -1866,7 +2171,7 @@ ${planToExecute}`;
|
|
|
1866
2171
|
)
|
|
1867
2172
|
] })
|
|
1868
2173
|
] }) }),
|
|
1869
|
-
/* @__PURE__ */
|
|
2174
|
+
/* @__PURE__ */ jsx12(
|
|
1870
2175
|
"input",
|
|
1871
2176
|
{
|
|
1872
2177
|
ref: fileInputRef,
|
|
@@ -1877,7 +2182,7 @@ ${planToExecute}`;
|
|
|
1877
2182
|
accept: "image/*,application/pdf,.doc,.docx,.txt"
|
|
1878
2183
|
}
|
|
1879
2184
|
),
|
|
1880
|
-
/* @__PURE__ */
|
|
2185
|
+
/* @__PURE__ */ jsx12("style", { dangerouslySetInnerHTML: {
|
|
1881
2186
|
__html: `
|
|
1882
2187
|
@keyframes pulse-border {
|
|
1883
2188
|
0%, 100% {
|
|
@@ -1899,7 +2204,7 @@ ${planToExecute}`;
|
|
|
1899
2204
|
|
|
1900
2205
|
// src/components/Prompt/Prompt.tsx
|
|
1901
2206
|
import { useState as useState4 } from "react";
|
|
1902
|
-
import { jsx as
|
|
2207
|
+
import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1903
2208
|
function Prompt({
|
|
1904
2209
|
agentId,
|
|
1905
2210
|
placeholder = "Enter your prompt...",
|
|
@@ -1961,9 +2266,9 @@ function Prompt({
|
|
|
1961
2266
|
handleSubmit();
|
|
1962
2267
|
}
|
|
1963
2268
|
};
|
|
1964
|
-
return /* @__PURE__ */
|
|
1965
|
-
/* @__PURE__ */
|
|
1966
|
-
/* @__PURE__ */
|
|
2269
|
+
return /* @__PURE__ */ jsxs11("div", { className: cn("space-y-2", className), children: [
|
|
2270
|
+
/* @__PURE__ */ jsxs11("div", { className: "flex gap-2", children: [
|
|
2271
|
+
/* @__PURE__ */ jsx13(
|
|
1967
2272
|
"input",
|
|
1968
2273
|
{
|
|
1969
2274
|
type: "text",
|
|
@@ -1976,7 +2281,7 @@ function Prompt({
|
|
|
1976
2281
|
className: "flex-1 px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-apteva-500 dark:bg-gray-800 dark:border-gray-600 dark:text-white"
|
|
1977
2282
|
}
|
|
1978
2283
|
),
|
|
1979
|
-
submitOn === "button" && /* @__PURE__ */
|
|
2284
|
+
submitOn === "button" && /* @__PURE__ */ jsx13(
|
|
1980
2285
|
"button",
|
|
1981
2286
|
{
|
|
1982
2287
|
onClick: handleSubmit,
|
|
@@ -1986,13 +2291,13 @@ function Prompt({
|
|
|
1986
2291
|
}
|
|
1987
2292
|
)
|
|
1988
2293
|
] }),
|
|
1989
|
-
maxLength && /* @__PURE__ */
|
|
2294
|
+
maxLength && /* @__PURE__ */ jsxs11("p", { className: "text-xs text-gray-500", children: [
|
|
1990
2295
|
value.length,
|
|
1991
2296
|
" / ",
|
|
1992
2297
|
maxLength,
|
|
1993
2298
|
" characters"
|
|
1994
2299
|
] }),
|
|
1995
|
-
showSuggestions && !value && /* @__PURE__ */
|
|
2300
|
+
showSuggestions && !value && /* @__PURE__ */ jsx13("div", { className: "flex flex-wrap gap-2", children: suggestions.map((suggestion, idx) => /* @__PURE__ */ jsx13(
|
|
1996
2301
|
"button",
|
|
1997
2302
|
{
|
|
1998
2303
|
onClick: () => setValue(suggestion),
|
|
@@ -2001,16 +2306,16 @@ function Prompt({
|
|
|
2001
2306
|
},
|
|
2002
2307
|
idx
|
|
2003
2308
|
)) }),
|
|
2004
|
-
isLoading && /* @__PURE__ */
|
|
2005
|
-
/* @__PURE__ */
|
|
2006
|
-
/* @__PURE__ */
|
|
2309
|
+
isLoading && /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2 text-sm text-gray-500", children: [
|
|
2310
|
+
/* @__PURE__ */ jsx13("div", { className: "w-4 h-4 border-2 border-apteva-500 border-t-transparent rounded-full animate-spin" }),
|
|
2311
|
+
/* @__PURE__ */ jsx13("span", { children: "AI is processing your request..." })
|
|
2007
2312
|
] })
|
|
2008
2313
|
] });
|
|
2009
2314
|
}
|
|
2010
2315
|
|
|
2011
2316
|
// src/components/Stream/Stream.tsx
|
|
2012
2317
|
import { useState as useState5, useEffect as useEffect5 } from "react";
|
|
2013
|
-
import { jsx as
|
|
2318
|
+
import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
2014
2319
|
function Stream({
|
|
2015
2320
|
agentId,
|
|
2016
2321
|
prompt,
|
|
@@ -2090,7 +2395,7 @@ function Stream({
|
|
|
2090
2395
|
plain: "text-gray-900 dark:text-gray-100"
|
|
2091
2396
|
};
|
|
2092
2397
|
if (!isStreaming && !isComplete) {
|
|
2093
|
-
return /* @__PURE__ */
|
|
2398
|
+
return /* @__PURE__ */ jsx14("div", { className: cn("p-4", className), children: /* @__PURE__ */ jsx14(
|
|
2094
2399
|
"button",
|
|
2095
2400
|
{
|
|
2096
2401
|
onClick: startStreaming,
|
|
@@ -2099,9 +2404,9 @@ function Stream({
|
|
|
2099
2404
|
}
|
|
2100
2405
|
) });
|
|
2101
2406
|
}
|
|
2102
|
-
return /* @__PURE__ */
|
|
2407
|
+
return /* @__PURE__ */ jsxs12("div", { className: cn(variantClasses[variant], className), children: [
|
|
2103
2408
|
text,
|
|
2104
|
-
isStreaming && showCursor && /* @__PURE__ */
|
|
2409
|
+
isStreaming && showCursor && /* @__PURE__ */ jsx14("span", { className: "apteva-stream-cursor" })
|
|
2105
2410
|
] });
|
|
2106
2411
|
}
|
|
2107
2412
|
|
|
@@ -2109,9 +2414,9 @@ function Stream({
|
|
|
2109
2414
|
import { useState as useState6 } from "react";
|
|
2110
2415
|
|
|
2111
2416
|
// src/components/Threads/ThreadItem.tsx
|
|
2112
|
-
import { jsx as
|
|
2417
|
+
import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
2113
2418
|
function ThreadItem({ thread, isActive = false, onSelect, onDelete }) {
|
|
2114
|
-
return /* @__PURE__ */
|
|
2419
|
+
return /* @__PURE__ */ jsxs13(
|
|
2115
2420
|
"div",
|
|
2116
2421
|
{
|
|
2117
2422
|
className: cn("apteva-thread-item", {
|
|
@@ -2119,19 +2424,19 @@ function ThreadItem({ thread, isActive = false, onSelect, onDelete }) {
|
|
|
2119
2424
|
}),
|
|
2120
2425
|
onClick: onSelect,
|
|
2121
2426
|
children: [
|
|
2122
|
-
/* @__PURE__ */
|
|
2123
|
-
/* @__PURE__ */
|
|
2124
|
-
thread.preview && /* @__PURE__ */
|
|
2125
|
-
/* @__PURE__ */
|
|
2126
|
-
/* @__PURE__ */
|
|
2427
|
+
/* @__PURE__ */ jsxs13("div", { className: "flex-1 min-w-0", children: [
|
|
2428
|
+
/* @__PURE__ */ jsx15("h4", { className: "font-semibold text-gray-900 dark:text-white truncate", children: thread.title }),
|
|
2429
|
+
thread.preview && /* @__PURE__ */ jsx15("p", { className: "text-sm text-gray-600 dark:text-gray-400 truncate", children: thread.preview }),
|
|
2430
|
+
/* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-2 mt-1 text-xs text-gray-500", children: [
|
|
2431
|
+
/* @__PURE__ */ jsxs13("span", { children: [
|
|
2127
2432
|
thread.messageCount,
|
|
2128
2433
|
" messages"
|
|
2129
2434
|
] }),
|
|
2130
|
-
/* @__PURE__ */
|
|
2131
|
-
/* @__PURE__ */
|
|
2435
|
+
/* @__PURE__ */ jsx15("span", { children: "\u2022" }),
|
|
2436
|
+
/* @__PURE__ */ jsx15("span", { children: formatRelativeTime(thread.updatedAt) })
|
|
2132
2437
|
] })
|
|
2133
2438
|
] }),
|
|
2134
|
-
onDelete && /* @__PURE__ */
|
|
2439
|
+
onDelete && /* @__PURE__ */ jsx15(
|
|
2135
2440
|
"button",
|
|
2136
2441
|
{
|
|
2137
2442
|
onClick: (e) => {
|
|
@@ -2161,7 +2466,7 @@ function formatRelativeTime(date) {
|
|
|
2161
2466
|
}
|
|
2162
2467
|
|
|
2163
2468
|
// src/components/Threads/ThreadList.tsx
|
|
2164
|
-
import { jsx as
|
|
2469
|
+
import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
2165
2470
|
function ThreadList({
|
|
2166
2471
|
threads,
|
|
2167
2472
|
currentThreadId,
|
|
@@ -2175,8 +2480,8 @@ function ThreadList({
|
|
|
2175
2480
|
(thread) => thread.title.toLowerCase().includes(searchQuery.toLowerCase()) || thread.preview?.toLowerCase().includes(searchQuery.toLowerCase())
|
|
2176
2481
|
);
|
|
2177
2482
|
const groupedThreads = groupBy === "date" ? groupThreadsByDate(filteredThreads) : { All: filteredThreads };
|
|
2178
|
-
return /* @__PURE__ */
|
|
2179
|
-
showSearch && /* @__PURE__ */
|
|
2483
|
+
return /* @__PURE__ */ jsxs14("div", { className: "flex flex-col h-full", children: [
|
|
2484
|
+
showSearch && /* @__PURE__ */ jsx16("div", { className: "p-3 border-b border-gray-200 dark:border-gray-700", children: /* @__PURE__ */ jsx16(
|
|
2180
2485
|
"input",
|
|
2181
2486
|
{
|
|
2182
2487
|
type: "text",
|
|
@@ -2186,10 +2491,10 @@ function ThreadList({
|
|
|
2186
2491
|
className: "w-full px-3 py-2 text-sm border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-apteva-500 dark:bg-gray-800 dark:border-gray-600 dark:text-white"
|
|
2187
2492
|
}
|
|
2188
2493
|
) }),
|
|
2189
|
-
/* @__PURE__ */
|
|
2190
|
-
Object.entries(groupedThreads).map(([group, groupThreads]) => /* @__PURE__ */
|
|
2191
|
-
groupBy !== "none" && /* @__PURE__ */
|
|
2192
|
-
groupThreads.map((thread) => /* @__PURE__ */
|
|
2494
|
+
/* @__PURE__ */ jsxs14("div", { className: "flex-1 overflow-y-auto", children: [
|
|
2495
|
+
Object.entries(groupedThreads).map(([group, groupThreads]) => /* @__PURE__ */ jsxs14("div", { children: [
|
|
2496
|
+
groupBy !== "none" && /* @__PURE__ */ jsx16("div", { className: "px-3 py-2 text-xs font-semibold text-gray-500 uppercase", children: group }),
|
|
2497
|
+
groupThreads.map((thread) => /* @__PURE__ */ jsx16(
|
|
2193
2498
|
ThreadItem,
|
|
2194
2499
|
{
|
|
2195
2500
|
thread,
|
|
@@ -2200,9 +2505,9 @@ function ThreadList({
|
|
|
2200
2505
|
thread.id
|
|
2201
2506
|
))
|
|
2202
2507
|
] }, group)),
|
|
2203
|
-
filteredThreads.length === 0 && /* @__PURE__ */
|
|
2204
|
-
/* @__PURE__ */
|
|
2205
|
-
/* @__PURE__ */
|
|
2508
|
+
filteredThreads.length === 0 && /* @__PURE__ */ jsxs14("div", { className: "p-8 text-center text-gray-500", children: [
|
|
2509
|
+
/* @__PURE__ */ jsx16("div", { className: "text-4xl mb-2", children: "\u{1F4AC}" }),
|
|
2510
|
+
/* @__PURE__ */ jsx16("p", { children: "No conversations found" })
|
|
2206
2511
|
] })
|
|
2207
2512
|
] })
|
|
2208
2513
|
] });
|
|
@@ -2234,7 +2539,7 @@ function groupThreadsByDate(threads) {
|
|
|
2234
2539
|
}
|
|
2235
2540
|
|
|
2236
2541
|
// src/components/Threads/Threads.tsx
|
|
2237
|
-
import { jsx as
|
|
2542
|
+
import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
2238
2543
|
function Threads({
|
|
2239
2544
|
threads,
|
|
2240
2545
|
currentThreadId,
|
|
@@ -2253,8 +2558,8 @@ function Threads({
|
|
|
2253
2558
|
tabs: "flex gap-2 border-b border-gray-200 dark:border-gray-700 overflow-x-auto"
|
|
2254
2559
|
};
|
|
2255
2560
|
if (variant === "tabs") {
|
|
2256
|
-
return /* @__PURE__ */
|
|
2257
|
-
threads.slice(0, 5).map((thread) => /* @__PURE__ */
|
|
2561
|
+
return /* @__PURE__ */ jsxs15("div", { className: cn(variantClasses[variant], className), children: [
|
|
2562
|
+
threads.slice(0, 5).map((thread) => /* @__PURE__ */ jsx17(
|
|
2258
2563
|
"button",
|
|
2259
2564
|
{
|
|
2260
2565
|
onClick: () => onThreadSelect?.(thread.id),
|
|
@@ -2266,7 +2571,7 @@ function Threads({
|
|
|
2266
2571
|
},
|
|
2267
2572
|
thread.id
|
|
2268
2573
|
)),
|
|
2269
|
-
showNewButton && onNewThread && /* @__PURE__ */
|
|
2574
|
+
showNewButton && onNewThread && /* @__PURE__ */ jsx17(
|
|
2270
2575
|
"button",
|
|
2271
2576
|
{
|
|
2272
2577
|
onClick: onNewThread,
|
|
@@ -2276,8 +2581,8 @@ function Threads({
|
|
|
2276
2581
|
)
|
|
2277
2582
|
] });
|
|
2278
2583
|
}
|
|
2279
|
-
return /* @__PURE__ */
|
|
2280
|
-
showNewButton && onNewThread && /* @__PURE__ */
|
|
2584
|
+
return /* @__PURE__ */ jsxs15("div", { className: cn(variantClasses[variant], "flex flex-col", className), children: [
|
|
2585
|
+
showNewButton && onNewThread && /* @__PURE__ */ jsx17("div", { className: "p-3 border-b border-gray-200 dark:border-gray-700", children: /* @__PURE__ */ jsx17(
|
|
2281
2586
|
"button",
|
|
2282
2587
|
{
|
|
2283
2588
|
onClick: onNewThread,
|
|
@@ -2285,7 +2590,7 @@ function Threads({
|
|
|
2285
2590
|
children: "+ New Conversation"
|
|
2286
2591
|
}
|
|
2287
2592
|
) }),
|
|
2288
|
-
/* @__PURE__ */
|
|
2593
|
+
/* @__PURE__ */ jsx17(
|
|
2289
2594
|
ThreadList,
|
|
2290
2595
|
{
|
|
2291
2596
|
threads,
|