diff --git a/src/lib/apis/utils/index.ts b/src/lib/apis/utils/index.ts
index f99ac5641..40fdbfcfa 100644
--- a/src/lib/apis/utils/index.ts
+++ b/src/lib/apis/utils/index.ts
@@ -55,7 +55,7 @@ export const formatPythonCode = async (code: string) => {
 	return res;
 };
 
-export const downloadChatAsPDF = async (chat: object) => {
+export const downloadChatAsPDF = async (title: string, messages: object[]) => {
 	let error = null;
 
 	const blob = await fetch(`${WEBUI_API_BASE_URL}/utils/pdf`, {
@@ -64,8 +64,8 @@ export const downloadChatAsPDF = async (chat: object) => {
 			'Content-Type': 'application/json'
 		},
 		body: JSON.stringify({
-			title: chat.title,
-			messages: chat.messages
+			title: title,
+			messages: messages
 		})
 	})
 		.then(async (res) => {
diff --git a/src/lib/components/chat/Chat.svelte b/src/lib/components/chat/Chat.svelte
index 38987a1e1..9db03ef53 100644
--- a/src/lib/components/chat/Chat.svelte
+++ b/src/lib/components/chat/Chat.svelte
@@ -493,6 +493,7 @@
 			if (!$temporaryChatEnabled) {
 				chat = await updateChatById(localStorage.token, chatId, {
 					models: selectedModels,
+					messages: messages,
 					history: history,
 					params: params,
 					files: chatFiles
@@ -1808,6 +1809,7 @@
 				chat = await updateChatById(localStorage.token, _chatId, {
 					models: selectedModels,
 					history: history,
+					messages: createMessagesList(history.currentId),
 					params: params,
 					files: chatFiles
 				});
diff --git a/src/lib/components/chat/Messages.svelte b/src/lib/components/chat/Messages.svelte
index a8d0abf13..83ea3714f 100644
--- a/src/lib/components/chat/Messages.svelte
+++ b/src/lib/components/chat/Messages.svelte
@@ -80,7 +80,8 @@
 	const updateChatHistory = async () => {
 		await tick();
 		await updateChatById(localStorage.token, chatId, {
-			history: history
+			history: history,
+			messages: messages
 		});
 
 		currentChatPage.set(1);
@@ -380,9 +381,19 @@
 							{regenerateResponse}
 							{continueResponse}
 							{mergeResponses}
-							{updateChatHistory}
-							{chatActionHandler}
 							{readOnly}
+							on:action={async (e) => {
+								const message = history.messages[message.id];
+								if (typeof e.detail === 'string') {
+									await chatActionHandler(chatId, e.detail, message.model, message.id);
+								} else {
+									const { id, event } = e.detail;
+									await chatActionHandler(chatId, id, message.model, message.id, event);
+								}
+							}}
+							on:update={() => {
+								updateChatHistory();
+							}}
 							on:scroll={() => {
 								if (autoScroll) {
 									const element = document.getElementById('messages-container');
diff --git a/src/lib/components/chat/Messages/Message.svelte b/src/lib/components/chat/Messages/Message.svelte
index 3b07ef3db..5042b3474 100644
--- a/src/lib/components/chat/Messages/Message.svelte
+++ b/src/lib/components/chat/Messages/Message.svelte
@@ -11,7 +11,6 @@
 	import MultiResponseMessages from './MultiResponseMessages.svelte';
 	import ResponseMessage from './ResponseMessage.svelte';
 	import UserMessage from './UserMessage.svelte';
-	import { updateChatById } from '$lib/apis/chats';
 
 	export let chatId;
 	export let idx = 0;
@@ -21,9 +20,6 @@
 
 	export let user;
 
-	export let updateChatHistory;
-	export let chatActionHandler;
-
 	export let showPreviousMessage;
 	export let showNextMessage;
 
@@ -81,18 +77,10 @@
 				{continueResponse}
 				{regenerateResponse}
 				on:action={async (e) => {
-					console.log('action', e);
-					const message = history.messages[messageId];
-					if (typeof e.detail === 'string') {
-						await chatActionHandler(chatId, e.detail, message.model, message.id);
-					} else {
-						const { id, event } = e.detail;
-						await chatActionHandler(chatId, id, message.model, message.id, event);
-					}
+					dispatch('action', e.detail);
 				}}
 				on:update={async (e) => {
-					console.log('update', e);
-					updateChatHistory();
+					dispatch('update');
 				}}
 				on:save={async (e) => {
 					console.log('save', e);
@@ -100,13 +88,9 @@
 					const message = e.detail;
 					if (message) {
 						history.messages[message.id] = message;
-						await updateChatById(localStorage.token, chatId, {
-							history: history
-						});
+						dispatch('update');
 					} else {
-						await updateChatById(localStorage.token, chatId, {
-							history: history
-						});
+						dispatch('update');
 					}
 				}}
 				{readOnly}
@@ -123,40 +107,24 @@
 				{regenerateResponse}
 				{mergeResponses}
 				on:action={async (e) => {
-					console.log('action', e);
-					const message = history.messages[messageId];
-					if (typeof e.detail === 'string') {
-						await chatActionHandler(chatId, e.detail, message.model, message.id);
-					} else {
-						const { id, event } = e.detail;
-						await chatActionHandler(chatId, id, message.model, message.id, event);
-					}
+					dispatch('action', e.detail);
 				}}
 				on:update={async (e) => {
-					console.log('update', e);
-					updateChatHistory();
+					dispatch('update');
 				}}
 				on:save={async (e) => {
 					console.log('save', e);
-
 					const message = e.detail;
 					if (message) {
 						history.messages[message.id] = message;
-						await updateChatById(localStorage.token, chatId, {
-							history: history
-						});
+						dispatch('update');
 					} else {
-						await updateChatById(localStorage.token, chatId, {
-							history: history
-						});
+						dispatch('update');
 					}
 				}}
 				on:change={async () => {
 					await tick();
-					await updateChatById(localStorage.token, chatId, {
-						history: history
-					});
-
+					dispatch('update');
 					dispatch('scroll');
 				}}
 				{readOnly}
diff --git a/src/lib/components/layout/Navbar/Menu.svelte b/src/lib/components/layout/Navbar/Menu.svelte
index 2163d80e4..6be8c93ce 100644
--- a/src/lib/components/layout/Navbar/Menu.svelte
+++ b/src/lib/components/layout/Navbar/Menu.svelte
@@ -6,7 +6,7 @@
 	const { saveAs } = fileSaver;
 
 	import { downloadChatAsPDF } from '$lib/apis/utils';
-	import { copyToClipboard } from '$lib/utils';
+	import { copyToClipboard, createMessagesList } from '$lib/utils';
 
 	import { showOverview, showControls, mobile } from '$lib/stores';
 	import { flyAndScale } from '$lib/utils/transitions';
@@ -32,7 +32,9 @@
 
 	const getChatAsText = async () => {
 		const _chat = chat.chat;
-		const chatText = _chat.messages.reduce((a, message, i, arr) => {
+
+		const messages = createMessagesList(_chat.history, _chat.history.currentId);
+		const chatText = messages.reduce((a, message, i, arr) => {
 			return `${a}### ${message.role.toUpperCase()}\n${message.content}\n\n`;
 		}, '');
 
@@ -51,9 +53,11 @@
 
 	const downloadPdf = async () => {
 		const _chat = chat.chat;
+		const messages = createMessagesList(_chat.history, _chat.history.currentId);
+
 		console.log('download', chat);
 
-		const blob = await downloadChatAsPDF(_chat);
+		const blob = await downloadChatAsPDF(_chat.title, messages);
 
 		// Create a URL for the blob
 		const url = window.URL.createObjectURL(blob);
diff --git a/src/lib/utils/index.ts b/src/lib/utils/index.ts
index cea7f6e64..8478e885b 100644
--- a/src/lib/utils/index.ts
+++ b/src/lib/utils/index.ts
@@ -860,3 +860,16 @@ export const getWeekday = () => {
 	const weekdays = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
 	return weekdays[date.getDay()];
 };
+
+export const createMessagesList = (history, messageId) => {
+	if (messageId === null) {
+		return [];
+	}
+
+	const message = history.messages[messageId];
+	if (message?.parentId) {
+		return [...createMessagesList(history, message.parentId), message];
+	} else {
+		return [message];
+	}
+};