Conversations list should resize to take max space on side panel

This commit is contained in:
Debanjum Singh Solanky
2024-07-14 13:49:36 +05:30
parent c2bf405489
commit e6b21144e2
2 changed files with 33 additions and 32 deletions

View File

@@ -332,7 +332,8 @@ interface SessionsAndFilesProps {
function SessionsAndFiles(props: SessionsAndFilesProps) { function SessionsAndFiles(props: SessionsAndFilesProps) {
return ( return (
<> <>
<ScrollArea className="h-[40vh]"> <div>
<ScrollArea>
<ScrollAreaScrollbar orientation="vertical" className="h-full w-2.5 border-l border-l-transparent p-[1px]" /> <ScrollAreaScrollbar orientation="vertical" className="h-full w-2.5 border-l border-l-transparent p-[1px]" />
<div className={styles.sessionsList}> <div className={styles.sessionsList}>
{props.subsetOrganizedData != null && Object.keys(props.subsetOrganizedData).map((timeGrouping) => ( {props.subsetOrganizedData != null && Object.keys(props.subsetOrganizedData).map((timeGrouping) => (
@@ -361,6 +362,7 @@ function SessionsAndFiles(props: SessionsAndFilesProps) {
<ChatSessionsModal data={props.organizedData} showSidePanel={props.setEnabled} /> <ChatSessionsModal data={props.organizedData} showSidePanel={props.setEnabled} />
) )
} }
</div>
<FilesMenu conversationId={props.conversationId} uploadedFiles={props.uploadedFiles} isMobileWidth={props.isMobileWidth} /> <FilesMenu conversationId={props.conversationId} uploadedFiles={props.uploadedFiles} isMobileWidth={props.isMobileWidth} />
{props.userProfile && {props.userProfile &&
<UserProfileComponent userProfile={props.userProfile} webSocketConnected={props.webSocketConnected} collapsed={false} /> <UserProfileComponent userProfile={props.userProfile} webSocketConnected={props.webSocketConnected} collapsed={false} />
@@ -546,7 +548,7 @@ function ChatSessionsModal({ data, showSidePanel }: ChatSessionsModalProps) {
<Dialog> <Dialog>
<DialogTrigger <DialogTrigger
className="flex text-left text-medium text-gray-500 hover:text-gray-300 cursor-pointer my-4 text-sm p-[0.5rem]"> className="flex text-left text-medium text-gray-500 hover:text-gray-300 cursor-pointer my-4 text-sm p-[0.5rem]">
<span className="mr-2">See All <ArrowRight className="h-4 w-4" /></span> <span className="mr-2">See All <ArrowRight className="inline h-4 w-4" weight="bold"/></span>
</DialogTrigger> </DialogTrigger>
<DialogContent> <DialogContent>
<DialogHeader> <DialogHeader>

View File

@@ -11,7 +11,7 @@ div.session {
} }
div.compressed { div.compressed {
grid-template-columns: minmax(auto, 12rem) 1fr 1fr; grid-template-columns: minmax(12rem, 100%) 1fr 1fr;
} }
div.sessionHover { div.sessionHover {
@@ -85,11 +85,10 @@ div.profile {
div.panelWrapper { div.panelWrapper {
display: grid; display: grid;
padding: 0 1rem; padding: 0 1rem;
grid-template-rows: auto 1fr auto auto; grid-template-rows: 1fr auto auto;
height: 100%; height: 100%;
} }
div.modalSessionsList { div.modalSessionsList {
position: fixed; position: fixed;
top: 0; top: 0;