added cors support and started chat client
This commit is contained in:
74
packages/chat-client/src/App.jsx
Normal file
74
packages/chat-client/src/App.jsx
Normal file
@@ -0,0 +1,74 @@
|
||||
import React, { useState } from 'react';
|
||||
import SessionList from './components/SessionList';
|
||||
import ChatWindow from './components/ChatWindow';
|
||||
import InfoPanel from './components/InfoPanel';
|
||||
import { useSession } from './hooks/useSession';
|
||||
import { useChat } from './hooks/useChat';
|
||||
|
||||
const DEFAULT_MODEL = 'companion:latest';
|
||||
|
||||
export default function App() {
|
||||
const [leftOpen, setLeftOpen] = useState(true);
|
||||
const [rightOpen, setRightOpen] = useState(true);
|
||||
const [selectedModel, setSelectedModel] = useState(DEFAULT_MODEL);
|
||||
|
||||
const {
|
||||
sessions,
|
||||
activeSession,
|
||||
messages,
|
||||
loadingHistory,
|
||||
selectSession,
|
||||
createSession,
|
||||
refreshSessions,
|
||||
appendMessage,
|
||||
updateLastMessage,
|
||||
} = useSession();
|
||||
|
||||
const {
|
||||
sendMessage,
|
||||
cancelStream,
|
||||
streaming,
|
||||
lastTokenCount,
|
||||
lastModel,
|
||||
} = useChat({ activeSession, appendMessage, updateLastMessage, refreshSessions });
|
||||
|
||||
function handleSendMessage(text) {
|
||||
sendMessage(text, selectedModel);
|
||||
}
|
||||
|
||||
return (
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
height: '100vh',
|
||||
overflow: 'hidden',
|
||||
}}>
|
||||
<SessionList
|
||||
sessions={sessions}
|
||||
activeSession={activeSession}
|
||||
onSelectSession={selectSession}
|
||||
onNewChat={createSession}
|
||||
isOpen={leftOpen}
|
||||
onToggle={() => setLeftOpen(o => !o)}
|
||||
/>
|
||||
|
||||
<ChatWindow
|
||||
messages={messages}
|
||||
loadingHistory={loadingHistory}
|
||||
streaming={streaming}
|
||||
activeSession={activeSession}
|
||||
onSendMessage={handleSendMessage}
|
||||
onCancel={cancelStream}
|
||||
/>
|
||||
|
||||
<InfoPanel
|
||||
isOpen={rightOpen}
|
||||
onToggle={() => setRightOpen(o => !o)}
|
||||
activeSession={activeSession}
|
||||
selectedModel={selectedModel}
|
||||
onModelChange={setSelectedModel}
|
||||
lastModel={lastModel}
|
||||
lastTokenCount={lastTokenCount}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user