llm/SIA
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Approve context

Browse Source
This commit is contained in:
geens
2024-11-02 19:17:27 +01:00
parent 96d14fc46d
commit 2a15708145
9 changed files with 296 additions and 149 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
web/src/components/App.jsx
View File

@@ -1,12 +1,10 @@
import React, { useState, useEffect, useRef } from 'react';
import Editor from '@monaco-editor/react';
import { Card, CardContent, CardHeader, CardTitle } from '../components/ui/card.jsx';
import { Button } from '../components/ui/button.jsx';
import { ScrollArea } from '../components/ui/scroll-area.jsx';
import { Alert, AlertDescription } from '../components/ui/alert.jsx';
import { Tabs, TabsContent, TabsList, TabsTrigger } from '../components/ui/tabs.jsx';
import { Textarea } from '../components/ui/textarea.jsx';
import { Input } from '../components/ui/input.jsx';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { Button } from '@/components/ui/button';
import { ScrollArea } from '@/components/ui/scroll-area';
import { Alert, AlertDescription } from '@/components/ui/alert';
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
const WebSocketState = {
CONNECTING: 'CONNECTING',
@@ -29,6 +27,13 @@ const MessageType = {
VALIDATION_ERROR: 'VALIDATION_ERROR',
};
const ClientMessageType = {
APPROVE_CONTEXT: 'APPROVE_CONTEXT',
APPROVE_RESPONSE: 'APPROVE_RESPONSE',
MODIFY_RESPONSE: 'MODIFY_RESPONSE',
SEND_INPUT: 'SEND_INPUT',
};
const SIAInterface = () => {
// Editor content state
const [context, setContext] = useState('');
@@ -40,7 +45,7 @@ const SIAInterface = () => {
// UI state
const [activeTab, setActiveTab] = useState('input');
const [agentState, setAgentState] = useState(AgentState.UPDATE);
const [agentState, setAgentState] = useState(AgentState.CONTEXT_APPROVAL);
const [wsState, setWsState] = useState(WebSocketState.DISCONNECTED);
// WebSocket ref
@@ -58,10 +63,7 @@ const SIAInterface = () => {
};
useEffect(() => {
// Connect to WebSocket
connectWebSocket();
// Cleanup on unmount
return () => {
if (wsRef.current) {
wsRef.current.close();
@@ -80,10 +82,13 @@ const SIAInterface = () => {
ws.onclose = () => {
setWsState(WebSocketState.DISCONNECTED);
// Attempt to reconnect after delay
setTimeout(connectWebSocket, 2000);
};
ws.onerror = (error) => {
console.error('WebSocket error:', error);
};
ws.onmessage = (event) => {
try {
const message = JSON.parse(event.data);
@@ -113,21 +118,26 @@ const SIAInterface = () => {
}
};
const sendWebSocketMessage = (type, data) => {
const sendWebSocketMessage = (type, data = null) => {
if (wsRef.current?.readyState === WebSocket.OPEN) {
wsRef.current.send(JSON.stringify({ type, data }));
const message = {
type: type, // Ensure exact string match
data: data || undefined // Only include if not null
};
console.log('Sending message:', JSON.stringify(message)); // Log exact message being sent
wsRef.current.send(JSON.stringify(message));
} else {
console.error('WebSocket not connected, state:', wsRef.current?.readyState);
}
};
const handleSendInput = (withStdin = false) => {
if (!input.trim()) return;
// Send input to backend
sendWebSocketMessage('SEND_INPUT', input);
sendWebSocketMessage(ClientMessageType.SEND_INPUT, input);
setInput('');
if (withStdin) {
// Prepare read_stdin response
const readStdinXml = `<read_stdin>
<!-- Content will be populated with stdin -->
</read_stdin>`;
@@ -139,12 +149,26 @@ const SIAInterface = () => {
};
const handleApproveContext = () => {
sendWebSocketMessage('APPROVE_CONTEXT');
console.log('Current state:', agentState);
console.log('WebSocket state:', wsRef.current?.readyState);
if (agentState === AgentState.CONTEXT_APPROVAL &&
wsRef.current?.readyState === WebSocket.OPEN) {
console.log('Sending approve context message');
sendWebSocketMessage(ClientMessageType.APPROVE_CONTEXT);
} else {
console.warn(
'Cannot approve context.',
'Agent state:', agentState,
'WebSocket state:', wsRef.current?.readyState
);
}
};
const handleApproveResponse = (modified = false) => {
const response = modified ? modifiedResponse : originalResponse;
sendWebSocketMessage('APPROVE_RESPONSE', response);
if (agentState === AgentState.RESPONSE_APPROVAL) {
const response = modified ? modifiedResponse : originalResponse;
sendWebSocketMessage(ClientMessageType.APPROVE_RESPONSE, response);
}
};
const handleResetModified = () => {
@@ -190,7 +214,7 @@ const SIAInterface = () => {
<div className="mt-4">
<Button
onClick={handleApproveContext}
disabled={agentState !== AgentState.CONTEXT_APPROVAL}
disabled={agentState !== AgentState.CONTEXT_APPROVAL || wsState !== WebSocketState.CONNECTED}
className="w-full"
>
Approve Context
@@ -223,6 +247,7 @@ const SIAInterface = () => {
<div className="flex space-x-2">
<Button
onClick={() => handleSendInput(false)}
disabled={wsState !== WebSocketState.CONNECTED}
className="flex-1"
>
Send Input
@@ -230,6 +255,7 @@ const SIAInterface = () => {
<Button
onClick={() => handleSendInput(true)}
variant="secondary"
disabled={wsState !== WebSocketState.CONNECTED}
className="flex-1"
>
Send & Read Stdin
@@ -259,7 +285,11 @@ const SIAInterface = () => {
)}
<Button
onClick={() => handleApproveResponse(false)}
disabled={agentState !== AgentState.RESPONSE_APPROVAL || validationError}
disabled={
agentState !== AgentState.RESPONSE_APPROVAL ||
validationError ||
wsState !== WebSocketState.CONNECTED
}
className="w-full"
>
Approve Original Response
@@ -297,7 +327,11 @@ const SIAInterface = () => {
</Button>
<Button
onClick={() => handleApproveResponse(true)}
disabled={agentState !== AgentState.RESPONSE_APPROVAL || validationError}
disabled={
agentState !== AgentState.RESPONSE_APPROVAL ||
validationError ||
wsState !== WebSocketState.CONNECTED
}
className="flex-1"
>
Approve Modified Response
@@ -334,4 +368,4 @@ const SIAInterface = () => {
);
};
export default SIAInterface;
export default SIAInterface;