kexsh/agent-chat-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

improve components

Browse Source
This commit is contained in:
bracesproul
2025-03-07 12:43:22 -08:00
parent 5d4e33bb52
commit 0607f042e7
5 changed files with 68 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
agent/uis/open-code/plan/index.tsx
View File

@@ -8,9 +8,9 @@ interface PlanProps {
export default function Plan(props: PlanProps) {
return (
<div className="flex flex-col gap-4 w-full max-w-xl p-6 border-[1px] rounded-xl border-slate-500">
<div className="flex flex-col gap-4 w-full max-w-4xl p-6 border-[1px] rounded-xl border-slate-500">
<h2 className="text-2xl font-semibold text-center mb-2">Code Plan</h2>
<div className="grid grid-cols-2 divide-x divide-slate-300">
<div className="grid grid-cols-2 divide-x divide-slate-300 w-full">
<div className="flex flex-col gap-2 pr-6">
<h3 className="text-lg font-medium mb-4 text-slate-700">
Executed Plans

19
agent/uis/open-code/proposed-change/index.tsx
View File

@@ -7,7 +7,8 @@ import { coldarkDark } from "react-syntax-highlighter/dist/cjs/styles/prism";
import { UIMessage, useStreamContext } from "@langchain/langgraph-sdk/react-ui";
import { Message } from "@langchain/langgraph-sdk";
import { DO_NOT_RENDER_ID_PREFIX } from "@/lib/ensure-tool-responses";
import { useState } from "react";
import { useEffect, useState } from "react";
import { getToolResponse } from "../../utils/get-tool-response";
interface ProposedChangeProps {
toolCallId: string;
@@ -15,6 +16,9 @@ interface ProposedChangeProps {
planItem: string;
}
const ACCEPTED_CHANGE_CONTENT =
"User accepted the proposed change. Please continue.";
export default function ProposedChange(props: ProposedChangeProps) {
const [isAccepted, setIsAccepted] = useState(false);
@@ -27,7 +31,6 @@ export default function ProposedChange(props: ProposedChangeProps) {
alert("Rejected. (just kidding, you can't reject me silly!)");
};
const handleAccept = () => {
const content = "User accepted the proposed change. Please continue.";
thread.submit({
messages: [
{
@@ -35,7 +38,7 @@ export default function ProposedChange(props: ProposedChangeProps) {
tool_call_id: props.toolCallId,
id: `${DO_NOT_RENDER_ID_PREFIX}${uuidv4()}`,
name: "buy-stock",
content,
content: ACCEPTED_CHANGE_CONTENT,
},
{
type: "human",
@@ -47,9 +50,17 @@ export default function ProposedChange(props: ProposedChangeProps) {
setIsAccepted(true);
};
useEffect(() => {
if (typeof window === "undefined" || isAccepted) return;
const toolResponse = getToolResponse(props.toolCallId, thread);
if (toolResponse && toolResponse.content === ACCEPTED_CHANGE_CONTENT) {
setIsAccepted(true);
}
}, []);
if (isAccepted) {
return (
<div className="flex flex-col gap-4 w-full max-w-xl p-4 border-[1px] rounded-xl border-green-300">
<div className="flex flex-col gap-4 w-full max-w-4xl p-4 border-[1px] rounded-xl border-green-300">
<div className="flex flex-col items-start justify-start gap-2">
<p className="text-lg font-medium">Accepted Change</p>
<p className="text-sm font-mono">{props.planItem}</p>