| "use client"; |
| import { type FC } from "react"; |
|
|
| import MessageBar from "@/components/message_bar"; |
| import EvaluationModal from "@/components/evaluation_modal"; |
| import WelcomeScreen from "@/components/welcome-screen"; |
| import ChatMessages from "@/components/chat-messages"; |
| import TranscriptsPanel from "@/components/transcripts-panel"; |
| import { useChatPage } from "@/hooks/useChatPage"; |
|
|
| const ChatPage: FC = () => { |
| const { |
| selectedTranscripts, |
| selectedTranscript, |
| isLoading, |
| evaluatingMessageIndex, |
| setEvaluatingMessageIndex, |
| selectedChat, |
| selectedChatId, |
| scrollRef, |
| scrollToBottom, |
| handleTranscriptClick, |
| handleEvaluate, |
| isTranscriptsOpen, |
| setIsTranscriptsOpen, |
| } = useChatPage(); |
|
|
| const showWelcome = |
| selectedChatId === null || selectedChat?.messages.length === 0; |
|
|
| return ( |
| <div className="flex-1 flex h-full bg-gradient-to-br from-background via-background to-muted/20"> |
| <div className="flex-1 flex flex-col min-w-0"> |
| {showWelcome ? ( |
| <WelcomeScreen |
| selectedChatId={selectedChatId} |
| hasMessages={Boolean(selectedChat?.messages?.length)} |
| /> |
| ) : ( |
| <ChatMessages |
| selectedChat={selectedChat} |
| isLoading={isLoading} |
| scrollRef={scrollRef} |
| onTranscriptClick={handleTranscriptClick} |
| onEvaluate={handleEvaluate} |
| /> |
| )} |
| |
| {selectedChatId && ( |
| <div className="bg-trasparent backdrop-blur supports-[backdrop-filter]:bg-transparent"> |
| <MessageBar |
| selectedChatId={selectedChatId} |
| selectedChat={selectedChat} |
| scrollToBottom={scrollToBottom} |
| /> |
| </div> |
| )} |
| </div> |
| |
| <TranscriptsPanel |
| selectedTranscript={selectedTranscript} |
| selectedTranscripts={selectedTranscripts} |
| selectedChatId={selectedChatId} |
| isTranscriptsOpen={isTranscriptsOpen} |
| setIsTranscriptsOpen={setIsTranscriptsOpen} |
| /> |
| |
| {selectedChat !== null && evaluatingMessageIndex && ( |
| <EvaluationModal |
| open={!!evaluatingMessageIndex} |
| onOpenChange={(open) => !open && setEvaluatingMessageIndex(null)} |
| message={selectedChat.messages[evaluatingMessageIndex]} |
| prevMessage={selectedChat.messages[evaluatingMessageIndex - 1]} |
| /> |
| )} |
| </div> |
| ); |
| }; |
|
|
| export default ChatPage; |
|
|
