Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2025-12-17 08:50:15 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 7

conversation conditional rendering

Browse source
This commit is contained in:
Danny Avila 2023-02-08 11:05:54 -05:00
parent 0c6dc8665b
commit 87685c3791
1 changed files with 18 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

23
src/components/Conversations/Conversation.jsx
View file

@ -9,10 +9,7 @@ import manualSWR from '~/utils/fetchers';
export default function Conversation({ id, parentMessageId, title = 'New conversation' }) {
const dispatch = useDispatch();
const conversationId = useSelector((state) => state.convo.conversationId);
const { trigger, isMutating } = manualSWR(
`http://localhost:3050/messages/${id}`,
'get'
);
const { trigger, isMutating } = manualSWR(`http://localhost:3050/messages/${id}`, 'get');
const clickHandler = async () => {
if (conversationId === id) {
@ -24,10 +21,20 @@ export default function Conversation({ id, parentMessageId, title = 'New convers
dispatch(setMessages(data));
};
const aProps = {
className:
'animate-flash group relative flex cursor-pointer items-center gap-3 break-all rounded-md bg-gray-800 py-3 px-3 pr-14 hover:bg-gray-800'
};
if (conversationId !== id) {
aProps.className =
'group relative flex cursor-pointer items-center gap-3 break-all rounded-md py-3 px-3 hover:bg-[#2A2B32] hover:pr-4';
}
return (
<a
onClick={() => clickHandler()}
className="animate-flash group relative flex cursor-pointer items-center gap-3 break-all rounded-md bg-gray-800 py-3 px-3 pr-14 hover:bg-gray-800"
{...aProps}
>
<svg
stroke="currentColor"
@ -46,10 +53,12 @@ export default function Conversation({ id, parentMessageId, title = 'New convers
<div className="relative max-h-5 flex-1 overflow-hidden text-ellipsis break-all">
{title}
</div>
{conversationId === id && (
<div className="visible absolute right-1 z-10 flex text-gray-300">
{id === conversationId && <RenameButton conversationId={id} />}
{id === conversationId && <DeleteButton conversationId={id} />}
<RenameButton conversationId={id} />
<DeleteButton conversationId={id} />
</div>
)}
</a>
);
}