diff --git a/backend/open_webui/routers/chats.py b/backend/open_webui/routers/chats.py
index c62afaabec..0f87f0b0a8 100644
--- a/backend/open_webui/routers/chats.py
+++ b/backend/open_webui/routers/chats.py
@@ -218,7 +218,7 @@ async def get_chat_list_by_folder_id(
     folder_id: str, page: Optional[int] = 1, user=Depends(get_verified_user)
 ):
     try:
-        limit = 60
+        limit = 10
         skip = (page - 1) * limit
 
         return [
diff --git a/src/lib/components/chat/Placeholder/ChatList.svelte b/src/lib/components/chat/Placeholder/ChatList.svelte
index 62869f7fc2..d73bc30a9a 100644
--- a/src/lib/components/chat/Placeholder/ChatList.svelte
+++ b/src/lib/components/chat/Placeholder/ChatList.svelte
@@ -7,11 +7,18 @@
 	import { getTimeRange } from '$lib/utils';
 	import ChevronUp from '$lib/components/icons/ChevronUp.svelte';
 	import ChevronDown from '$lib/components/icons/ChevronDown.svelte';
+	import Loader from '$lib/components/common/Loader.svelte';
+	import Spinner from '$lib/components/common/Spinner.svelte';
 
 	dayjs.extend(localizedFormat);
 
 	export let chats = [];
 
+	export let chatListLoading = false;
+	export let allChatsLoaded = false;
+
+	export let loadHandler: Function = null;
+
 	let chatList = null;
 
 	const init = async () => {
@@ -158,19 +165,19 @@
 			</a>
 		{/each}
 
-		<!-- {#if !allChatsLoaded && loadHandler}
-		<Loader
-			on:visible={(e) => {
-				if (!chatListLoading) {
-					loadHandler();
-				}
-			}}
-		>
-			<div class="w-full flex justify-center py-1 text-xs animate-pulse items-center gap-2">
-				<Spinner className=" size-4" />
-				<div class=" ">Loading...</div>
-			</div>
-		</Loader>
-	{/if} -->
+		{#if !allChatsLoaded && loadHandler}
+			<Loader
+				on:visible={(e) => {
+					if (!chatListLoading) {
+						loadHandler();
+					}
+				}}
+			>
+				<div class="w-full flex justify-center py-1 text-xs animate-pulse items-center gap-2">
+					<Spinner className=" size-4" />
+					<div class=" ">Loading...</div>
+				</div>
+			</Loader>
+		{/if}
 	</div>
 {/if}
diff --git a/src/lib/components/chat/Placeholder/FolderPlaceholder.svelte b/src/lib/components/chat/Placeholder/FolderPlaceholder.svelte
index 5b5af5970b..fb4efddabb 100644
--- a/src/lib/components/chat/Placeholder/FolderPlaceholder.svelte
+++ b/src/lib/components/chat/Placeholder/FolderPlaceholder.svelte
@@ -13,11 +13,38 @@
 
 	let selectedTab = 'chats';
 
-	let chats = null;
 	let page = 1;
 
+	let chats = null;
+	let chatListLoading = false;
+	let allChatsLoaded = false;
+
+	const loadChats = async () => {
+		chatListLoading = true;
+
+		page += 1;
+
+		let newChatList = [];
+
+		newChatList = await getChatListByFolderId(localStorage.token, folder.id, page).catch(
+			(error) => {
+				console.error(error);
+				return [];
+			}
+		);
+
+		// once the bottom of the list has been reached (no results) there is no need to continue querying
+		allChatsLoaded = newChatList.length === 0;
+		chats = [...chats, ...newChatList];
+
+		chatListLoading = false;
+	};
+
 	const setChatList = async () => {
 		chats = null;
+		page = 1;
+		allChatsLoaded = false;
+		chatListLoading = false;
 
 		if (folder && folder.id) {
 			const res = await getChatListByFolderId(localStorage.token, folder.id, page);
@@ -71,7 +98,7 @@
 			<FolderKnowledge />
 		{:else if selectedTab === 'chats'}
 			{#if chats !== null}
-				<ChatList {chats} />
+				<ChatList {chats} {chatListLoading} {allChatsLoaded} loadHandler={loadChats} />
 			{:else}
 				<div class="py-10">
 					<Spinner />