From def0cfea45a511172c2ca16fbdde6152158ca09b Mon Sep 17 00:00:00 2001
From: nikec <43032218+niikeec@users.noreply.github.com>
Date: Wed, 6 Sep 2023 12:42:02 +0200
Subject: [PATCH] [ENG-1080] fix explorer fetching (#1302)

fix fetching
---
 .../app/$libraryId/Explorer/View/GridList.tsx     |  1 -
 .../app/$libraryId/Explorer/View/ListView.tsx     | 15 ++++-----------
 interface/app/$libraryId/Explorer/useExplorer.ts  |  5 -----
 interface/app/$libraryId/overview/data.ts         |  2 +-
 interface/components/GridList.tsx                 | 12 +++---------
 5 files changed, 8 insertions(+), 27 deletions(-)

diff --git a/interface/app/$libraryId/Explorer/View/GridList.tsx b/interface/app/$libraryId/Explorer/View/GridList.tsx
index dae7ee5b7..ea284cb76 100644
--- a/interface/app/$libraryId/Explorer/View/GridList.tsx
+++ b/interface/app/$libraryId/Explorer/View/GridList.tsx
@@ -127,7 +127,6 @@ export default ({ children }: { children: RenderItem }) => {
 		totalCount: explorer.count,
 		overscan: explorer.overscan,
 		onLoadMore: explorer.loadMore,
-		rowsBeforeLoadMore: explorer.rowsBeforeLoadMore,
 		size:
 			settings.layoutMode === 'grid'
 				? { width: settings.gridItemSize, height: itemHeight }
diff --git a/interface/app/$libraryId/Explorer/View/ListView.tsx b/interface/app/$libraryId/Explorer/View/ListView.tsx
index 551f15dae..5ee5e5a3b 100644
--- a/interface/app/$libraryId/Explorer/View/ListView.tsx
+++ b/interface/app/$libraryId/Explorer/View/ListView.tsx
@@ -764,22 +764,15 @@ export default () => {
 
 	// Load more items
 	useEffect(() => {
-		if (!explorer.loadMore || !explorer.items) return;
+		if (!explorer.loadMore) return;
 
 		const lastRow = virtualRows[virtualRows.length - 1];
 		if (!lastRow) return;
 
-		const rowsBeforeLoadMore = explorer.rowsBeforeLoadMore;
+		const loadMoreFromRow = Math.ceil(rows.length * 0.75);
 
-		const loadMoreOnIndex =
-			rowsBeforeLoadMore > rows.length || lastRow.index > rows.length - rowsBeforeLoadMore
-				? rows.length - 1
-				: rows.length - rowsBeforeLoadMore;
-
-		if (lastRow.index === loadMoreOnIndex || lastRow.index > explorer.items.length) {
-			explorer.loadMore.call(undefined);
-		}
-	}, [virtualRows, rows.length, explorer.rowsBeforeLoadMore, explorer.loadMore, explorer.items]);
+		if (lastRow.index >= loadMoreFromRow - 1) explorer.loadMore.call(undefined);
+	}, [virtualRows, rows.length, explorer.loadMore]);
 
 	useKey(['ArrowUp', 'ArrowDown'], (e) => {
 		if (!explorerView.selectable) return;
diff --git a/interface/app/$libraryId/Explorer/useExplorer.ts b/interface/app/$libraryId/Explorer/useExplorer.ts
index aa37c7a32..76fddf40d 100644
--- a/interface/app/$libraryId/Explorer/useExplorer.ts
+++ b/interface/app/$libraryId/Explorer/useExplorer.ts
@@ -37,10 +37,6 @@ export interface UseExplorerProps<TOrder extends Ordering> {
 	 * @defaultValue `true`
 	 */
 	allowMultiSelect?: boolean;
-	/**
-	 * @defaultValue `5`
-	 */
-	rowsBeforeLoadMore?: number;
 	overscan?: number;
 	/**
 	 * @defaultValue `true`
@@ -62,7 +58,6 @@ export function useExplorer<TOrder extends Ordering>({
 	return {
 		// Default values
 		allowMultiSelect: true,
-		rowsBeforeLoadMore: 5,
 		selectable: true,
 		scrollRef,
 		count: props.items?.length,
diff --git a/interface/app/$libraryId/overview/data.ts b/interface/app/$libraryId/overview/data.ts
index e84712478..63b8e943b 100644
--- a/interface/app/$libraryId/overview/data.ts
+++ b/interface/app/$libraryId/overview/data.ts
@@ -83,7 +83,7 @@ export function useCategoryExplorer(category: Category) {
 	const explorerSettings = isObjectQuery ? objectsExplorerSettings : pathsExplorerSettings;
 	const settings = explorerSettings.useSettingsSnapshot();
 
-	const take = 10;
+	const take = 100;
 
 	const objectFilter: ObjectFilterArgs = {
 		category,
diff --git a/interface/components/GridList.tsx b/interface/components/GridList.tsx
index a52efa642..ef1e1d2bc 100644
--- a/interface/components/GridList.tsx
+++ b/interface/components/GridList.tsx
@@ -32,7 +32,6 @@ export interface UseGridListProps<IdT extends ItemId = number, DataT extends Ite
 	gap?: number | { x?: number; y?: number };
 	overscan?: number;
 	top?: number;
-	rowsBeforeLoadMore?: number;
 	onLoadMore?: () => void;
 	getItemId?: (index: number) => IdT | undefined;
 	getItemData?: (index: number) => DataT;
@@ -211,15 +210,10 @@ export const GridList = ({ grid, children, scrollRef }: GridListProps) => {
 		const lastRow = virtualRows[virtualRows.length - 1];
 		if (!lastRow) return;
 
-		const rowsBeforeLoadMore = grid.rowsBeforeLoadMore || 1;
+		const loadMoreFromRow = Math.ceil(grid.rowCount * 0.75);
 
-		const loadMoreOnIndex =
-			rowsBeforeLoadMore > grid.rowCount || lastRow.index > grid.rowCount - rowsBeforeLoadMore
-				? grid.rowCount - 1
-				: grid.rowCount - rowsBeforeLoadMore;
-
-		if (lastRow.index === loadMoreOnIndex || lastRow.index > grid.rowCount) grid.onLoadMore();
-	}, [virtualRows, grid.rowCount, grid.rowsBeforeLoadMore, grid.onLoadMore, grid]);
+		if (lastRow.index >= loadMoreFromRow - 1) grid.onLoadMore();
+	}, [virtualRows, grid.rowCount, grid.onLoadMore, grid]);
 
 	useMutationObserver(scrollRef, () => setListOffset(ref.current?.offsetTop ?? 0));