Close chat sessions side panel on click open a chat session

This commit is contained in:
Debanjum Singh Solanky
2024-07-14 00:53:16 +05:30
parent d51011314f
commit f69f9e3523

View File

@@ -54,6 +54,7 @@ interface ChatHistory {
agent_avatar: string; agent_avatar: string;
compressed: boolean; compressed: boolean;
created: string; created: string;
showSidePanel: (isEnabled: boolean) => void;
} }
import { import {
@@ -349,7 +350,9 @@ function SessionsAndFiles(props: SessionsAndFilesProps) {
conversation_id={chatHistory.conversation_id} conversation_id={chatHistory.conversation_id}
slug={chatHistory.slug} slug={chatHistory.slug}
agent_avatar={chatHistory.agent_avatar} agent_avatar={chatHistory.agent_avatar}
agent_name={chatHistory.agent_name} /> agent_name={chatHistory.agent_name}
showSidePanel={props.setEnabled}
/>
))} ))}
</div> </div>
))} ))}
@@ -357,7 +360,7 @@ function SessionsAndFiles(props: SessionsAndFilesProps) {
</ScrollArea> </ScrollArea>
{ {
(props.data && props.data.length > 5) && ( (props.data && props.data.length > 5) && (
<ChatSessionsModal data={props.organizedData} /> <ChatSessionsModal data={props.organizedData} showSidePanel={props.setEnabled} />
) )
} }
<FilesMenu conversationId={props.conversationId} uploadedFiles={props.uploadedFiles} isMobileWidth={props.isMobileWidth} /> <FilesMenu conversationId={props.conversationId} uploadedFiles={props.uploadedFiles} isMobileWidth={props.isMobileWidth} />
@@ -527,7 +530,7 @@ function ChatSession(props: ChatHistory) {
onMouseLeave={() => setIsHovered(false)} onMouseLeave={() => setIsHovered(false)}
key={props.conversation_id} key={props.conversation_id}
className={`${styles.session} ${props.compressed ? styles.compressed : '!max-w-full'} ${isHovered ? `${styles.sessionHover}` : ''}`}> className={`${styles.session} ${props.compressed ? styles.compressed : '!max-w-full'} ${isHovered ? `${styles.sessionHover}` : ''}`}>
<Link href={`/chat?conversationId=${props.conversation_id}`}> <Link href={`/chat?conversationId=${props.conversation_id}`} onClick={() => props.showSidePanel(false)}>
<p className={styles.session}>{props.slug || "New Conversation 🌱"}</p> <p className={styles.session}>{props.slug || "New Conversation 🌱"}</p>
</Link> </Link>
<ChatSessionActionMenu conversationId={props.conversation_id} /> <ChatSessionActionMenu conversationId={props.conversation_id} />
@@ -537,9 +540,10 @@ function ChatSession(props: ChatHistory) {
interface ChatSessionsModalProps { interface ChatSessionsModalProps {
data: GroupedChatHistory | null; data: GroupedChatHistory | null;
showSidePanel: (isEnabled: boolean) => void;
} }
function ChatSessionsModal({ data }: ChatSessionsModalProps) { function ChatSessionsModal({ data, showSidePanel }: ChatSessionsModalProps) {
return ( return (
<Dialog> <Dialog>
<DialogTrigger <DialogTrigger
@@ -565,7 +569,8 @@ function ChatSessionsModal({ data }: ChatSessionsModalProps) {
conversation_id={chatHistory.conversation_id} conversation_id={chatHistory.conversation_id}
slug={chatHistory.slug} slug={chatHistory.slug}
agent_avatar={chatHistory.agent_avatar} agent_avatar={chatHistory.agent_avatar}
agent_name={chatHistory.agent_name} /> agent_name={chatHistory.agent_name}
showSidePanel={showSidePanel}/>
))} ))}
</div> </div>
))} ))}
@@ -718,8 +723,7 @@ export default function SidePanel(props: SidePanelProps) {
height={40} height={40}
/> />
{ {
authenticatedData && authenticatedData && isMobileWidth && enabled ?
isMobileWidth ?
<Drawer> <Drawer>
<DrawerTrigger><ArrowRight className="h-4 w-4 mx-2" /></DrawerTrigger> <DrawerTrigger><ArrowRight className="h-4 w-4 mx-2" /></DrawerTrigger>
<DrawerContent> <DrawerContent>