From 27ff3861154c0c95cf8cbc448b99cca105dc2c82 Mon Sep 17 00:00:00 2001
From: "Timothy J. Baek" <timothyjrbeck@gmail.com>
Date: Tue, 30 Apr 2024 15:08:34 -0700
Subject: [PATCH] fix: horizontal scroll issue on mobile

#1854
---
 .../chat/MessageInput/Suggestions.svelte      |  8 +++---
 src/lib/components/layout/Sidebar.svelte      | 27 ++++++++++---------
 2 files changed, 18 insertions(+), 17 deletions(-)

diff --git a/src/lib/components/chat/MessageInput/Suggestions.svelte b/src/lib/components/chat/MessageInput/Suggestions.svelte
index dd37cc63..e68caafa 100644
--- a/src/lib/components/chat/MessageInput/Suggestions.svelte
+++ b/src/lib/components/chat/MessageInput/Suggestions.svelte
@@ -4,10 +4,10 @@
 
 	let prompts = [];
 
-	$: prompts =
-		suggestionPrompts.length <= 4
-			? suggestionPrompts
-			: suggestionPrompts.sort(() => Math.random() - 0.5).slice(0, 4);
+	$: prompts = suggestionPrompts;
+	// suggestionPrompts.length <= 4
+	// 	? suggestionPrompts
+	// 	: suggestionPrompts.sort(() => Math.random() - 0.5).slice(0, 4);
 </script>
 
 <div class="w-full">
diff --git a/src/lib/components/layout/Sidebar.svelte b/src/lib/components/layout/Sidebar.svelte
index 6764e1a1..5be325f8 100644
--- a/src/lib/components/layout/Sidebar.svelte
+++ b/src/lib/components/layout/Sidebar.svelte
@@ -53,28 +53,29 @@
 		show = window.innerWidth > BREAKPOINT;
 		await chats.set(await getChatList(localStorage.token));
 
-		let touchstartX = 0;
-		let touchendX = 0;
+		let touchstart;
+		let touchend;
 
 		function checkDirection() {
 			const screenWidth = window.innerWidth;
-			const swipeDistance = Math.abs(touchendX - touchstartX);
-			if (swipeDistance >= screenWidth / 4) {
-				if (touchendX < touchstartX) {
+			const swipeDistance = Math.abs(touchend.screenX - touchstart.screenX);
+			if (touchstart.clientX < 40 && swipeDistance >= screenWidth / 4) {
+				if (touchend.screenX < touchstart.screenX) {
 					show = false;
 				}
-				if (touchendX > touchstartX) {
+				if (touchend.screenX > touchstart.screenX) {
 					show = true;
 				}
 			}
 		}
 
 		const onTouchStart = (e) => {
-			touchstartX = e.changedTouches[0].screenX;
+			touchstart = e.changedTouches[0];
+			console.log(touchstart.clientX);
 		};
 
 		const onTouchEnd = (e) => {
-			touchendX = e.changedTouches[0].screenX;
+			touchend = e.changedTouches[0];
 			checkDirection();
 		};
 
@@ -84,14 +85,14 @@
 			}
 		};
 
-		document.addEventListener('touchstart', onTouchStart);
-		document.addEventListener('touchend', onTouchEnd);
+		window.addEventListener('touchstart', onTouchStart);
+		window.addEventListener('touchend', onTouchEnd);
 		window.addEventListener('resize', onResize);
 
 		return () => {
-			document.removeEventListener('touchstart', onTouchStart);
-			document.removeEventListener('touchend', onTouchEnd);
-			document.removeEventListener('resize', onResize);
+			window.removeEventListener('touchstart', onTouchStart);
+			window.removeEventListener('touchend', onTouchEnd);
+			window.removeEventListener('resize', onResize);
 		};
 	});