highperfocused/danswer
1
0
Fork 0
mirror of https://github.com/danswer-ai/danswer.git synced 2025-04-10 21:09:51 +02:00
Code Issues Packages Projects Releases Wiki Activity

Fix overflow for quotes in search section (#2123)

Browse Source 
* fix overflow for quotes in search section

* proper overflow check
This commit is contained in:
pablodanswer 2024-08-13 13:32:11 -07:00 committed by GitHub
parent 5ad54fec87
commit ffd9b0180b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 23 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
web/src/components/search/SearchAnswer.tsx
View File

@ -65,12 +65,12 @@ export default function SearchAnswer({
return () => {
window.removeEventListener("resize", checkOverflow);
};
}, [answer]);
}, [answer, quotes]);
return (
<div
ref={answerContainerRef}
className={`my-4 ${searchAnswerExpanded ? "min-h-[16rem]" : "h-[16rem]"} overflow-y-hidden p-4 border-2 border-border rounded-lg relative`}
className={`my-4 ${searchAnswerExpanded ? "min-h-[16rem]" : "h-[16rem]"} ${!searchAnswerExpanded && searchAnswerOverflowing && "overflow-y-hidden"} p-4 border-2 border-border rounded-lg relative`}
>
<div>
<div className="flex gap-x-2">
@ -113,7 +113,7 @@ export default function SearchAnswer({
)}
</div>
<div className={`pt-1 h-auto border-t border-border w-full`}>
<div className={`pt-1 h-auto border-t border-border w-full`}>
<AnswerSection
answer={answer}
quotes={quotes}
@ -122,37 +122,28 @@ export default function SearchAnswer({
/>
</div>
{searchAnswerExpanded ||
(!searchAnswerOverflowing && (
<div className="w-full">
{quotes !== null && quotes.length > 0 && answer && (
<QuotesSection quotes={dedupedQuotes} isFetching={isFetching} />
)}
<div className="w-full">
{quotes !== null && quotes.length > 0 && answer && (
<QuotesSection quotes={dedupedQuotes} isFetching={isFetching} />
)}
{searchResponse.messageId !== null && (
<div className="absolute right-3 flex bottom-3">
<HoverableIcon
icon={<LikeFeedbackIcon />}
onClick={() =>
handleFeedback(
"like",
searchResponse?.messageId as number
)
}
/>
<HoverableIcon
icon={<DislikeFeedbackIcon />}
onClick={() =>
handleFeedback(
"dislike",
searchResponse?.messageId as number
)
}
/>
</div>
)}
{searchResponse.messageId !== null && (
<div className="absolute right-3 flex bottom-3">
<HoverableIcon
icon={<LikeFeedbackIcon />}
onClick={() =>
handleFeedback("like", searchResponse?.messageId as number)
}
/>
<HoverableIcon
icon={<DislikeFeedbackIcon />}
onClick={() =>
handleFeedback("dislike", searchResponse?.messageId as number)
}
/>
</div>
))}
)}
</div>
</div>
{!searchAnswerExpanded && searchAnswerOverflowing && (
<div className="absolute bottom-0 left-0 w-full h-[100px] bg-gradient-to-b from-background/5 via-background/60 to-background/90"></div>