refac: folder page chat list

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}