feat: overview favourite response

This commit is contained in:
Timothy J. Baek 2024-09-22 02:53:38 +02:00
parent 768717aaf9
commit c346130774
3 changed files with 34 additions and 5 deletions

View File

@ -150,6 +150,7 @@
}
const showMessage = async (message) => {
const _chatId = JSON.parse(JSON.stringify($chatId));
let _messageId = JSON.parse(JSON.stringify(message.id));
let messageChildrenIds = history.messages[_messageId].childrenIds;
@ -169,6 +170,9 @@
if (messageElement) {
messageElement.scrollIntoView({ behavior: 'smooth' });
}
await tick();
saveChatHandler(_chatId);
};
const chatEventHandler = async (event, cb) => {

View File

@ -164,6 +164,12 @@
<Overview
{history}
on:nodeclick={(e) => {
if (e.detail.node.data.message.favorite) {
history.messages[e.detail.node.data.message.id].favorite = true;
} else {
history.messages[e.detail.node.data.message.id].favorite = null;
}
showMessage(e.detail.node.data.message);
}}
on:close={() => {

View File

@ -4,13 +4,14 @@
import ProfileImageBase from '../Messages/ProfileImageBase.svelte';
import Tooltip from '$lib/components/common/Tooltip.svelte';
import Heart from '$lib/components/icons/Heart.svelte';
type $$Props = NodeProps;
export let data: $$Props['data'];
</script>
<div
class="px-4 py-3 shadow-md rounded-xl dark:bg-black bg-white border dark:border-gray-900 w-60 h-20"
class="px-4 py-3 shadow-md rounded-xl dark:bg-black bg-white border dark:border-gray-900 w-60 h-20 group"
>
<Tooltip
content={data?.message?.error ? data.message.error.content : data.message.content}
@ -24,8 +25,10 @@
className={'size-5 -translate-y-[1px]'}
/>
<div class="ml-2">
<div class="text-xs text-black dark:text-white font-medium">
{data?.user?.name ?? 'User'}
<div class=" flex justify-between items-center">
<div class="text-xs text-black dark:text-white font-medium">
{data?.user?.name ?? 'User'}
</div>
</div>
{#if data?.message?.error}
@ -43,8 +46,24 @@
/>
<div class="ml-2">
<div class="text-xs text-black dark:text-white font-medium">
{data?.model?.name ?? data?.message?.model ?? 'Assistant'}
<div class=" flex justify-between items-center">
<div class="text-xs text-black dark:text-white font-medium">
{data?.model?.name ?? data?.message?.model ?? 'Assistant'}
</div>
<button
class={data?.message?.favorite ? '' : 'invisible group-hover:visible'}
on:click={() => {
data.message.favorite = !(data?.message?.favorite ?? false);
}}
>
<Heart
className="size-3 {data?.message?.favorite
? 'fill-red-500 stroke-red-500'
: 'hover:fill-red-500 hover:stroke-red-500'} "
strokeWidth="2.5"
/>
</button>
</div>
{#if data?.message?.error}