From 077dc7623782b7c4bc28b010c5a8682d05e00f5c Mon Sep 17 00:00:00 2001
From: Kasper <kasperkh.kh@gmail.com>
Date: Sun, 21 Jan 2024 05:36:23 +0100
Subject: [PATCH] Keep video selected if it moves position

---
 CHANGELOG.md            |  3 ++-
 src/routes/+page.svelte | 24 ++++++++++++++++++++----
 2 files changed, 22 insertions(+), 5 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 4be87e0..4c508c5 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,7 +1,8 @@
 # Changelog
 
 ## Next
-- Fix deselection not happening when videos update
+- Fix selection staying in the same position when videos update
+- Keep video selected if it moves position
 
 ## 1.6.2 - 2024 Jan 15
 - Fix channel page filtering
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 4bc7ebb..addade8 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -16,17 +16,32 @@
 		loading++
 
 		const selectedId = videos[selectedIndex]?.id
+		const oldselectedIndex = selectedIndex
 
 		const newVideos = await commands.getVideos(options, null)
 		allLoaded = newVideos.length < $viewOptions.limit
 		videos = newVideos
-		// Remove selection if the video changes position
-		if (!selectedId || selectedId !== videos[selectedIndex]?.id) {
+
+		// Update the selection index if the video moves
+		const newSelectedIndex = videos.findIndex((v) => v.id === selectedId)
+		if (newSelectedIndex >= 0) {
+			selectedIndex = newSelectedIndex
+			selectionVisible = true
+		} else {
+			// Or clear selection if the video disappeared from view
 			selectedIndex = 0
 			selectionVisible = false
 		}
+		const selectionMoved = selectionVisible && selectedIndex !== oldselectedIndex
 
-		await tick()
+		if (selectionMoved) {
+			allowScrollToBox = false
+			await tick()
+			allowScrollToBox = true
+			scrollToBox(selectedIndex)
+		} else {
+			await tick()
+		}
 		await autoloadHandler()
 		loading--
 	}
@@ -263,8 +278,9 @@
 
 	let boxes: HTMLDivElement[] = []
 	$: scrollToBox(selectedIndex)
+	let allowScrollToBox = true
 	function scrollToBox(index: number) {
-		if (scrollDiv && boxes[index]) {
+		if (scrollDiv && boxes[index] && allowScrollToBox) {
 			const el = boxes[index].getBoundingClientRect()
 			const parent = scrollDiv.getBoundingClientRect()
 			const topOffset = el.top - parent.top