Spaces:
Sleeping
Sleeping
| import React from 'react'; | |
| interface ChatInputProps { | |
| inputText: string; | |
| isStreaming: boolean; | |
| selectedDocId: string | null; | |
| activeDocName: string | undefined; | |
| onChange: (value: string) => void; | |
| onSubmit: (e: React.FormEvent) => void; | |
| } | |
| export function ChatInput({ | |
| inputText, | |
| isStreaming, | |
| selectedDocId, | |
| activeDocName, | |
| onChange, | |
| onSubmit, | |
| }: ChatInputProps) { | |
| return ( | |
| <div className="chat-input-container"> | |
| <form className="chat-input-form" onSubmit={onSubmit}> | |
| <input | |
| type="text" | |
| className="chat-input" | |
| value={inputText} | |
| onChange={(e) => onChange(e.target.value)} | |
| placeholder={ | |
| selectedDocId | |
| ? `Ask a question about ${activeDocName}...` | |
| : 'Ask about all uploaded documents...' | |
| } | |
| disabled={isStreaming} | |
| /> | |
| <button | |
| type="submit" | |
| className={`send-btn ${inputText.trim() && !isStreaming ? 'active' : ''}`} | |
| disabled={!inputText.trim() || isStreaming} | |
| > | |
| <svg | |
| width="20" | |
| height="20" | |
| viewBox="0 0 24 24" | |
| fill="none" | |
| stroke="currentColor" | |
| strokeWidth="2" | |
| > | |
| <line x1="22" y1="2" x2="11" y2="13"></line> | |
| <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon> | |
| </svg> | |
| </button> | |
| </form> | |
| </div> | |
| ); | |
| } | |