[ENG-1092] Fix key item selection after layout switch (#1342)

fix active item after layout switch

interface/app/$libraryId/Explorer/View/GridList.tsx

@@ -164,6 +164,25 @@ export default ({ children }: { children: RenderItem }) => {
 		return grid.getItem(index) ?? null;
 	}
 
+	function getActiveItem(elements: Element[]) {
+		// Get selected item with least index.
+		// Might seem kinda weird but it's the same behaviour as Finder.
+		const activeItem =
+			elements.reduce(
+				(least, current) => {
+					const currentItem = getElementItem(current);
+					if (!currentItem) return least;
+
+					if (!least) return currentItem;
+
+					return currentItem.index < least.index ? currentItem : least;
+				},
+				null as ReturnType<typeof getElementItem>
+			)?.data ?? null;
+
+		return activeItem;
+	}
+
 	useEffect(
 		() => {
 			const element = explorer.scrollRef.current;
@@ -200,6 +219,8 @@ export default ({ children }: { children: RenderItem }) => {
 		selectoUnSelected.current = set;
 		selecto.current.setSelectedTargets(items as HTMLElement[]);
 
+		activeItem.current = getActiveItem(items);
+
 		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [grid.columnCount, explorer.items]);
 
@@ -355,21 +376,7 @@ export default ({ children }: { children: RenderItem }) => {
 						setDragFromThumbnail(false);
 
 						const allSelected = selecto.current?.getSelectedTargets() ?? [];
-
-						// Sets active item to selected item with least index.
-						// Might seem kinda weird but it's the same behaviour as Finder.
-						activeItem.current =
-							allSelected.reduce(
-								(least, current) => {
-									const currentItem = getElementItem(current);
-									if (!currentItem) return least;
-
-									if (!least) return currentItem;
-
-									return currentItem.index < least.index ? currentItem : least;
-								},
-								null as ReturnType<typeof getElementItem>
-							)?.data ?? null;
+						activeItem.current = getActiveItem(allSelected);
 					}}
 					onScroll={({ direction }) => {
 						selecto.current?.findSelectableTargets();