Skip to content

Commit

Permalink
several steps
Browse files Browse the repository at this point in the history
  • Loading branch information
pablonyx committed Nov 22, 2024
1 parent 6061adb commit 71123f5
Show file tree
Hide file tree
Showing 18 changed files with 746 additions and 288 deletions.
2 changes: 1 addition & 1 deletion backend/danswer/chat/personas.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ personas:
# this is for DanswerBot to use when tagged in a non-configured channel
# Careful setting specific IDs, this won't autoincrement the next ID value for postgres
- id: 0
name: "Knowledge"
name: "Search"
description: >
Assistant with access to documents from your Connected Sources.
# Default Prompt objects attached to the persona, see prompts.yaml
Expand Down
105 changes: 98 additions & 7 deletions web/src/app/chat/ChatPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -132,8 +132,9 @@ export function ChatPage({

const {
chatSessions,
availableSources,
availableDocumentSets,
ccPairs,
tags,
documentSets,
llmProviders,
folders,
openedFolders,
Expand All @@ -153,6 +154,12 @@ export function ChatPage({
router.push("/search");
}

const [documentSidebarToggled, setDocumentSidebarToggled] = useState(false);

const toggleDocumentSidebar = () => {
setDocumentSidebarToggled((prev) => !prev);
};

const { assistants: availableAssistants, finalAssistants } = useAssistants();

const [showApiKeyModal, setShowApiKeyModal] = useState(
Expand Down Expand Up @@ -268,6 +275,16 @@ export function ChatPage({

const noAssistants = liveAssistant == null || liveAssistant == undefined;

const availableSources = ccPairs.map((ccPair) => ccPair.source);
const [finalAvailableSources, finalAvailableDocumentSets] =
computeAvailableFilters({
selectedPersona: availableAssistants.find(
(assistant) => assistant.id === liveAssistant?.id
),
availableSources: availableSources,
availableDocumentSets: documentSets,
});

// always set the model override for the chat session, when an assistant, llm provider, or user preference exists
useEffect(() => {
const personaDefault = getLLMProviderOverrideForPersona(
Expand Down Expand Up @@ -1804,6 +1821,11 @@ export function ChatPage({
setDocumentSelection((documentSelection) => !documentSelection);
setShowDocSidebar(false);
};
const [filtersToggled, setFiltersToggled] = useState(false);
const toggleFilters = () => {
setFiltersToggled((filtersToggled) => !filtersToggled);
setDocumentSidebarToggled(true);
};

interface RegenerationRequest {
messageId: number;
Expand Down Expand Up @@ -1965,6 +1987,53 @@ export function ChatPage({
</div>
</div>
</div>
{!settings?.isMobile && (
<div
style={{ transition: "width 0.30s ease-out" }}
className={`
flex-none
fixed
right-0
z-40
bg-background-100
h-screen
transition-all
bg-opacity-80
duration-300
ease-in-out
overflow-y-hidden
bg-background-100
transition-all
bg-opacity-80
duration-300
ease-in-out
h-full
${documentSidebarToggled ? "w-[300px]" : "w-[0px]"}
`}
>
<DocumentSidebar
filterManager={filterManager}
ccPairs={ccPairs}
tags={tags}
documentSets={documentSets}
ref={innerSidebarElementRef}
filtersToggled={filtersToggled}
closeSidebar={() => setDocumentSidebarToggled(false)}
selectedMessage={aiMessage}
selectedDocuments={selectedDocuments}
toggleDocumentSelection={toggleDocumentSelection}
clearSelectedDocuments={clearSelectedDocuments}
selectedDocumentTokens={selectedDocumentTokens}
maxTokens={maxTokens}
isLoading={isFetchingChatMessages}
initialWidth={300}
isOpen={documentSidebarToggled}
/>
</div>
)}

<BlurBackground
visible={!untoggled && (showDocSidebar || toggledSidebar)}
Expand Down Expand Up @@ -2191,6 +2260,9 @@ export function ChatPage({
}
>
<AIMessage
documentSelectionToggled={
documentSidebarToggled
}
continueGenerating={
i == messageHistory.length - 1 &&
currentCanContinue()
Expand Down Expand Up @@ -2227,9 +2299,12 @@ export function ChatPage({
}}
isActive={messageHistory.length - 1 == i}
selectedDocuments={selectedDocuments}
toggleDocumentSelection={
toggleDocumentSelectionAspects
}
toggleDocumentSelection={() => {
toggleDocumentSelectionAspects();
setDocumentSidebarToggled(
!documentSidebarToggled
);
}}
docs={message.documents}
currentPersona={liveAssistant}
alternativeAssistant={
Expand Down Expand Up @@ -2446,6 +2521,7 @@ export function ChatPage({
</div>
)}
<ChatInputBar
toggleFilters={toggleFilters}
showConfigureAPIKey={() =>
setShowApiKeyModal(true)
}
Expand Down Expand Up @@ -2500,6 +2576,20 @@ export function ChatPage({
</div>
</div>
</div>
{!settings?.isMobile && (
<div
style={{ transition: "width 0.30s ease-out" }}
className={`
flex-none
overflow-y-hidden
transition-all
duration-300
ease-in-out
h-full
${documentSidebarToggled ? "w-[300px]" : "w-[0px]"}
`}
></div>
)}
</div>
)}
</Dropzone>
Expand All @@ -2519,8 +2609,9 @@ export function ChatPage({
</div>
<FixedLogo backgroundToggled={toggledSidebar || showDocSidebar} />
</div>
{/* Right Sidebar - DocumentSidebar */}
</div>
<DocumentSidebar
{/* <DocumentSidebar
initialWidth={350}
ref={innerSidebarElementRef}
closeSidebar={() => setDocumentSelection(false)}
Expand All @@ -2532,7 +2623,7 @@ export function ChatPage({
maxTokens={maxTokens}
isLoading={isFetchingChatMessages}
isOpen={documentSelection}
/>
/> */}
</>
);
}
134 changes: 49 additions & 85 deletions web/src/app/chat/documentSidebar/ChatDocumentDisplay.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -30,104 +30,68 @@ export function ChatDocumentDisplay({
tokenLimitReached,
}: DocumentDisplayProps) {
const isInternet = document.is_internet;
// Consider reintroducing null scored docs in the future

if (document.score === null) {
return null;
}

const faviconUrl =
isInternet && document.link
? `https://www.google.com/s2/favicons?domain=${
new URL(document.link).hostname
}&sz=32`
: null;

return (
<div
key={document.semantic_identifier}
className={`p-2 w-[325px] justify-start rounded-md ${
isSelected ? "bg-background-200" : "bg-background-125"
} text-sm mx-3`}
>
<div className="flex relative justify-start overflow-y-visible">
<div className="opacity-100 will-change-auto">
<div
className={`flex relative flex-col gap-0.5 rounded-xl mx-2 my-1.5 ${
isSelected ? "bg-gray-200" : "hover:bg-background-125"
}`}
>
<a
href={document.link}
target="_blank"
className={
"rounded-lg flex font-bold flex-shrink truncate" +
(document.link ? "" : "pointer-events-none")
}
rel="noreferrer"
rel="noopener noreferrer"
className="flex flex-col px-2 py-1.5"
>
{isInternet ? (
<InternetSearchIcon url={document.link} />
) : (
<SourceIcon sourceType={document.source_type} iconSize={18} />
)}
<p className="overflow-hidden text-left text-ellipsis mx-2 my-auto text-sm">
<div className="line-clamp-1 flex h-6 items-center gap-2 text-xs">
{faviconUrl ? (
<img
alt="Favicon"
width="32"
height="32"
className="rounded-full bg-gray-200 object-cover"
src={faviconUrl}
/>
) : (
<SourceIcon sourceType={document.source_type} iconSize={18} />
)}
<span>
{document.link
? new URL(document.link).hostname
: document.source_type}
</span>
</div>
<div className="line-clamp-2 text-sm font-semibold">
{document.semantic_identifier || document.document_id}
</p>
</a>
{document.score !== null && (
<div className="my-auto">
{isAIPick && (
<div className="w-4 h-4 my-auto mr-1 flex flex-col">
<HoverPopup
mainContent={<FiRadio className="text-gray-500 my-auto" />}
popupContent={
<div className="text-xs text-gray-300 w-36 flex">
<div className="flex mx-auto">
<div className="w-3 h-3 flex flex-col my-auto mr-1">
<FiInfo className="my-auto" />
</div>
<div className="my-auto">The AI liked this doc!</div>
</div>
</div>
}
direction="bottom"
style="dark"
/>
</div>
</div>
<div className="line-clamp-2 text-sm font-normal leading-snug text-gray-600">
{buildDocumentSummaryDisplay(
document.match_highlights,
document.blurb
)}
<div
className={`
text-xs
text-emphasis
bg-hover
rounded
p-0.5
w-fit
my-auto
select-none
my-auto
mr-2`}
>
{Math.abs(document.score).toFixed(2)}
</div>
</div>
)}

{!isInternet && (
<DocumentSelector
isSelected={isSelected}
handleSelect={() => handleSelect(document.document_id)}
isDisabled={tokenLimitReached && !isSelected}
/>
)}
</div>
<div>
<div className="mt-1">
<DocumentMetadataBlock document={document} />
</div>
</div>
<p className="line-clamp-3 pl-1 pt-2 mb-1 text-start break-words">
{/* {buildDocumentSummaryDisplay(document.match_highlights, document.blurb)} */}
test
</p>
<div className="mb-2">
{/*
// TODO: find a way to include this
{queryEventId && (
<DocumentFeedbackBlock
documentId={document.document_id}
queryId={queryEventId}
setPopup={setPopup}
/>
)} */}
<div className="absolute top-2 right-2">
{!isInternet && (
<DocumentSelector
isSelected={isSelected}
handleSelect={() => handleSelect(document.document_id)}
isDisabled={tokenLimitReached && !isSelected}
/>
)}
</div>
</a>
</div>
</div>
);
Expand Down
Loading

0 comments on commit 71123f5

Please sign in to comment.