Răsfoiți Sursa

Add option to toggle scrolling to bottom when switching between branches

Zhuoran 9 luni în urmă
părinte
comite
948d29b676

+ 14 - 10
src/lib/components/chat/Messages.svelte

@@ -146,12 +146,14 @@
 
 
 		await tick();
 		await tick();
 
 
-		const element = document.getElementById('messages-container');
-		autoScroll = element.scrollHeight - element.scrollTop <= element.clientHeight + 50;
+		if ($settings.scrollOnBranchChange) {
+			const element = document.getElementById('messages-container');
+			autoScroll = element.scrollHeight - element.scrollTop <= element.clientHeight + 50;
 
 
-		setTimeout(() => {
-			scrollToBottom();
-		}, 100);
+			setTimeout(() => {
+				scrollToBottom();
+			}, 100);
+		}
 	};
 	};
 
 
 	const showNextMessage = async (message) => {
 	const showNextMessage = async (message) => {
@@ -195,12 +197,14 @@
 
 
 		await tick();
 		await tick();
 
 
-		const element = document.getElementById('messages-container');
-		autoScroll = element.scrollHeight - element.scrollTop <= element.clientHeight + 50;
+		if ($settings.scrollOnBranchChange) {
+			const element = document.getElementById('messages-container');
+			autoScroll = element.scrollHeight - element.scrollTop <= element.clientHeight + 50;
 
 
-		setTimeout(() => {
-			scrollToBottom();
-		}, 100);
+			setTimeout(() => {
+				scrollToBottom();
+			}, 100);
+		}
 	};
 	};
 
 
 	const deleteMessageHandler = async (messageId) => {
 	const deleteMessageHandler = async (messageId) => {

+ 29 - 0
src/lib/components/chat/Settings/Interface.svelte

@@ -22,6 +22,7 @@
 	let responseAutoCopy = false;
 	let responseAutoCopy = false;
 	let widescreenMode = false;
 	let widescreenMode = false;
 	let splitLargeChunks = false;
 	let splitLargeChunks = false;
+	let scrollOnBranchChange = true;
 	let userLocation = false;
 	let userLocation = false;
 
 
 	// Interface
 	// Interface
@@ -39,6 +40,11 @@
 		saveSettings({ splitLargeChunks: splitLargeChunks });
 		saveSettings({ splitLargeChunks: splitLargeChunks });
 	};
 	};
 
 
+	const togglesScrollOnBranchChange = async () => {
+		scrollOnBranchChange = !scrollOnBranchChange;
+		saveSettings({ scrollOnBranchChange: scrollOnBranchChange });
+	};
+
 	const togglewidescreenMode = async () => {
 	const togglewidescreenMode = async () => {
 		widescreenMode = !widescreenMode;
 		widescreenMode = !widescreenMode;
 		saveSettings({ widescreenMode: widescreenMode });
 		saveSettings({ widescreenMode: widescreenMode });
@@ -141,6 +147,7 @@
 		chatBubble = $settings.chatBubble ?? true;
 		chatBubble = $settings.chatBubble ?? true;
 		widescreenMode = $settings.widescreenMode ?? false;
 		widescreenMode = $settings.widescreenMode ?? false;
 		splitLargeChunks = $settings.splitLargeChunks ?? false;
 		splitLargeChunks = $settings.splitLargeChunks ?? false;
+		scrollOnBranchChange = $settings.scrollOnBranchChange ?? true;
 		chatDirection = $settings.chatDirection ?? 'LTR';
 		chatDirection = $settings.chatDirection ?? 'LTR';
 		userLocation = $settings.userLocation ?? false;
 		userLocation = $settings.userLocation ?? false;
 
 
@@ -318,6 +325,28 @@
 				</div>
 				</div>
 			</div>
 			</div>
 
 
+			<div>
+				<div class=" py-0.5 flex w-full justify-between">
+					<div class=" self-center text-xs">
+						{$i18n.t('Scroll to bottom when switching between branches')}
+					</div>
+
+					<button
+						class="p-1 px-3 text-xs flex rounded transition"
+						on:click={() => {
+							togglesScrollOnBranchChange();
+						}}
+						type="button"
+					>
+						{#if scrollOnBranchChange === true}
+							<span class="ml-2 self-center">{$i18n.t('On')}</span>
+						{:else}
+							<span class="ml-2 self-center">{$i18n.t('Off')}</span>
+						{/if}
+					</button>
+				</div>
+			</div>
+
 			<div>
 			<div>
 				<div class=" py-0.5 flex w-full justify-between">
 				<div class=" py-0.5 flex w-full justify-between">
 					<div class=" self-center text-xs">
 					<div class=" self-center text-xs">