sij/khoj
1
0
Fork 0
mirror of https://github.com/khoj-ai/khoj.git synced 2024-11-30 10:53:02 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Auto-collapse train of thought, show after chat response in history

Browse source
This commit is contained in:
sabaimran 2024-10-27 15:48:13 -07:00
parent 101ea6efb1
commit 68499e253b
1 changed files with 36 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

69
src/interface/web/app/components/chatHistory/chatHistory.tsx
View file

@ -54,29 +54,32 @@ function TrainOfThoughtComponent(props: TrainOfThoughtComponentProps) {
const [collapsed, setCollapsed] = useState(props.completed);
return (
<div className={`${!collapsed ? styles.trainOfThought : ""} shadow-sm`} key={props.key}>
<div
className={`${!collapsed ? styles.trainOfThought + " shadow-sm" : ""}`}
key={props.key}
>
{!props.completed && <InlineLoading className="float-right" />}
{collapsed ? (
<Button
className="w-fit text-left justify-start content-start text-xs"
onClick={() => setCollapsed(false)}
variant="ghost"
size="sm"
>
What was my train of thought?
</Button>
) : (
<Button
className="w-fit text-left justify-start content-start text-xs"
onClick={() => setCollapsed(true)}
variant="ghost"
size="sm"
>
<XCircle size={16} className="mr-1" />
Close
</Button>
)}
{props.completed &&
(collapsed ? (
<Button
className="w-fit text-left justify-start content-start text-xs"
onClick={() => setCollapsed(false)}
variant="ghost"
size="sm"
>
What was my train of thought?
</Button>
) : (
<Button
className="w-fit text-left justify-start content-start text-xs p-0"
onClick={() => setCollapsed(true)}
variant="ghost"
size="sm"
>
<XCircle size={16} className="mr-1" />
Close
</Button>
))}
{!collapsed &&
props.trainOfThought.map((train, index) => (
<TrainOfThought
@ -292,17 +295,6 @@ export default function ChatHistory(props: ChatHistoryProps) {
data.chat &&
data.chat.map((chatMessage, index) => (
<>
{chatMessage.trainOfThought && chatMessage.by === "khoj" && (
<TrainOfThoughtComponent
trainOfThought={chatMessage.trainOfThought?.map(
(train) => train.data,
)}
lastMessage={false}
agentColor={data?.agent?.color || "orange"}
key={`${index}trainOfThought`}
completed={true}
/>
)}
<ChatMessage
key={`${index}fullHistory`}
ref={
@ -323,6 +315,17 @@ export default function ChatHistory(props: ChatHistoryProps) {
borderLeftColor={`${data?.agent?.color}-500`}
isLastMessage={index === data.chat.length - 1}
/>
{chatMessage.trainOfThought && chatMessage.by === "khoj" && (
<TrainOfThoughtComponent
trainOfThought={chatMessage.trainOfThought?.map(
(train) => train.data,
)}
lastMessage={false}
agentColor={data?.agent?.color || "orange"}
key={`${index}trainOfThought`}
completed={true}
/>
)}
</>
))}
{props.incomingMessages &&