apunkt/SurfSense
1
0
Fork 0
mirror of https://github.com/MODSetter/SurfSense.git synced 2026-04-25 16:56:22 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

add accessibilty

Browse source
This commit is contained in:
CREDO23 2025-10-22 15:35:44 +02:00 • committed by thierryverse
parent 24e366d326
commit 34c07d3699
2 changed files with 88 additions and 46 deletions
Download patch file Download diff file Expand all files Collapse all files

82
surfsense_web/components/chat/ChatInterface.tsx
View file

@ -2,7 +2,7 @@
import { type ChatHandler, ChatSection as LlamaIndexChatSection } from "@llamaindex/chat-ui";
import { PanelRight } from "lucide-react";
import { useState } from "react";
import { createContext, useState } from "react";
import type { ResearchMode } from "@/components/chat";
import { ChatInputUI } from "@/components/chat/ChatInputGroup";
import { ChatMessagesUI } from "@/components/chat/ChatMessages";
@ -20,6 +20,13 @@ interface ChatInterfaceProps {
onSearchModeChange?: (mode: "DOCUMENTS" | "CHUNKS") => void;
}
interface ChatInterfaceContext {
isChatPannelOpen: boolean;
setIsChatPannelOpen: (value: boolean) => void;
}
export const chatInterfaceContext = createContext<ChatInterfaceContext | null>(null);
export default function ChatInterface({
handler,
onDocumentSelectionChange,
@ -30,49 +37,56 @@ export default function ChatInterface({
onSearchModeChange,
}: ChatInterfaceProps) {
const [isChatPannelOpen, setIsChatPannelOpen] = useState(false);
const contextValue = {
isChatPannelOpen,
setIsChatPannelOpen,
};
return (
<LlamaIndexChatSection handler={handler} className="flex h-full">
<div className="flex gap-4 flex-1 w-full">
<div className="flex grow-1 flex-col">
<ChatMessagesUI />
<div className="border-t p-4">
<ChatInputUI
onDocumentSelectionChange={onDocumentSelectionChange}
selectedDocuments={selectedDocuments}
onConnectorSelectionChange={onConnectorSelectionChange}
selectedConnectors={selectedConnectors}
searchMode={searchMode}
onSearchModeChange={onSearchModeChange}
/>
<chatInterfaceContext.Provider value={contextValue}>
<LlamaIndexChatSection handler={handler} className="flex h-full">
<div className="flex gap-4 flex-1 w-full">
<div className="flex grow-1 flex-col">
<ChatMessagesUI />
<div className="border-t p-4">
<ChatInputUI
onDocumentSelectionChange={onDocumentSelectionChange}
selectedDocuments={selectedDocuments}
onConnectorSelectionChange={onConnectorSelectionChange}
selectedConnectors={selectedConnectors}
searchMode={searchMode}
onSearchModeChange={onSearchModeChange}
/>
</div>
</div>
</div>
<div
className={cn(
"border rounded-2xl shrink-0 flex flex-col h-full transition-all",
isChatPannelOpen ? "w-72" : "w-14"
)}
>
<div
className={cn(
"w-full border-b p-2 flex items-center transition-all ",
isChatPannelOpen ? "justify-end" : " justify-center "
"border rounded-2xl shrink-0 flex flex-col h-full transition-all",
isChatPannelOpen ? "w-72" : "w-14"
)}
>
<button
type="button"
onClick={() => setIsChatPannelOpen(!isChatPannelOpen)}
className={cn(" shrink-0 rounded-full p-2 w-fit hover:bg-muted")}
<div
className={cn(
"w-full border-b p-2 flex items-center transition-all ",
isChatPannelOpen ? "justify-end" : " justify-center "
)}
>
<PanelRight className="h-5 w-5" strokeWidth={1.5} />
</button>
</div>
<button
type="button"
onClick={() => setIsChatPannelOpen(!isChatPannelOpen)}
className={cn(" shrink-0 rounded-full p-2 w-fit hover:bg-muted")}
>
<PanelRight className="h-5 w-5" strokeWidth={1.5} />
</button>
</div>
<div className="border-b rounded-lg grow-1">
<ChatPanelContainer />
<div className="border-b rounded-lg grow-1">
<ChatPanelContainer />
</div>
</div>
</div>
</div>
</LlamaIndexChatSection>
</LlamaIndexChatSection>
</chatInterfaceContext.Provider>
);
}