From 60658abbbc080e652b0b44c1e4aa2b6b2f1f532c Mon Sep 17 00:00:00 2001
From: "Timothy J. Baek" <timothyjrbeck@gmail.com>
Date: Mon, 1 Jan 2024 13:01:42 -0800
Subject: [PATCH] fix: edit message issue

---
 src/lib/components/chat/Messages.svelte       | 74 ++++++++++---------
 .../chat/Messages/ResponseMessage.svelte      |  2 -
 .../chat/Messages/UserMessage.svelte          |  5 --
 3 files changed, 38 insertions(+), 43 deletions(-)

diff --git a/src/lib/components/chat/Messages.svelte b/src/lib/components/chat/Messages.svelte
index 3920a40d..8669f97b 100644
--- a/src/lib/components/chat/Messages.svelte
+++ b/src/lib/components/chat/Messages.svelte
@@ -215,42 +215,44 @@
 {#if messages.length == 0}
 	<Placeholder models={selectedModels} modelfiles={selectedModelfiles} />
 {:else}
-	{#each messages as message, messageIdx}
-		<div class=" w-full">
-			<div class="flex justify-between px-5 mb-3 max-w-3xl mx-auto rounded-lg group">
-				{#if message.role === 'user'}
-					<UserMessage
-						user={$user}
-						{message}
-						siblings={message.parentId !== null
-							? history.messages[message.parentId]?.childrenIds ?? []
-							: Object.values(history.messages)
-									.filter((message) => message.parentId === null)
-									.map((message) => message.id) ?? []}
-						{confirmEditMessage}
-						{showPreviousMessage}
-						{showNextMessage}
-						{copyToClipboard}
-					/>
-				{:else}
-					<ResponseMessage
-						{message}
-						modelfiles={selectedModelfiles}
-						siblings={history.messages[message.parentId]?.childrenIds ?? []}
-						isLastMessage={messageIdx + 1 === messages.length}
-						{confirmEditResponseMessage}
-						{showPreviousMessage}
-						{showNextMessage}
-						{rateMessage}
-						{copyToClipboard}
-						{regenerateResponse}
-					/>
-				{/if}
+	{#key chatId}
+		{#each messages as message, messageIdx}
+			<div class=" w-full">
+				<div class="flex justify-between px-5 mb-3 max-w-3xl mx-auto rounded-lg group">
+					{#if message.role === 'user'}
+						<UserMessage
+							user={$user}
+							{message}
+							siblings={message.parentId !== null
+								? history.messages[message.parentId]?.childrenIds ?? []
+								: Object.values(history.messages)
+										.filter((message) => message.parentId === null)
+										.map((message) => message.id) ?? []}
+							{confirmEditMessage}
+							{showPreviousMessage}
+							{showNextMessage}
+							{copyToClipboard}
+						/>
+					{:else}
+						<ResponseMessage
+							{message}
+							modelfiles={selectedModelfiles}
+							siblings={history.messages[message.parentId]?.childrenIds ?? []}
+							isLastMessage={messageIdx + 1 === messages.length}
+							{confirmEditResponseMessage}
+							{showPreviousMessage}
+							{showNextMessage}
+							{rateMessage}
+							{copyToClipboard}
+							{regenerateResponse}
+						/>
+					{/if}
+				</div>
 			</div>
-		</div>
-	{/each}
+		{/each}
 
-	{#if bottomPadding}
-		<div class=" mb-10" />
-	{/if}
+		{#if bottomPadding}
+			<div class=" mb-10" />
+		{/if}
+	{/key}
 {/if}
diff --git a/src/lib/components/chat/Messages/ResponseMessage.svelte b/src/lib/components/chat/Messages/ResponseMessage.svelte
index 2bf4c42b..6f821b46 100644
--- a/src/lib/components/chat/Messages/ResponseMessage.svelte
+++ b/src/lib/components/chat/Messages/ResponseMessage.svelte
@@ -33,8 +33,6 @@
 	let speaking = null;
 
 	$: if (message) {
-		edit = false;
-		editedContent = '';
 		renderStyling();
 	}
 
diff --git a/src/lib/components/chat/Messages/UserMessage.svelte b/src/lib/components/chat/Messages/UserMessage.svelte
index f5be0af3..693d20e2 100644
--- a/src/lib/components/chat/Messages/UserMessage.svelte
+++ b/src/lib/components/chat/Messages/UserMessage.svelte
@@ -39,11 +39,6 @@
 		edit = false;
 		editedContent = '';
 	};
-
-	$: if (message) {
-		edit = false;
-		editedContent = '';
-	}
 </script>
 
 <div class=" flex w-full">