IBX-8195: Content items are displayed multiple times in UDW after add…

…ing item to bookmarks (#1265)
ibexa · Jun 10, 2024 · fc50f29 · fc50f29
1 parent 57149fd
commit fc50f29
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 18 deletions.
diff --git a/src/bundle/Resources/public/scss/ui/modules/universal-discovery/_finder.branch.scss b/src/bundle/Resources/public/scss/ui/modules/universal-discovery/_finder.branch.scss
@@ -69,6 +69,6 @@
         display: flex;
         align-items: center;
         justify-content: center;
-        margin-top: calculateRem(50px);
+        margin: calculateRem(50px) 0;
     }
 }
diff --git a/src/bundle/ui-dev/src/modules/universal-discovery/components/finder/finder.branch.js b/src/bundle/ui-dev/src/modules/universal-discovery/components/finder/finder.branch.js
@@ -27,7 +27,6 @@ const FinderBranch = ({ locationData, itemsPerPage }) => {
     const [sortOrder] = useContext(SortOrderContext);
     const contentTypesMap = useContext(ContentTypesMapContext);
     const [markedLocationId] = useContext(MarkedLocationIdContext);
-    const totalCount = useRef(0);
     const branchRef = useRef(null);
     const sortingOptions = SORTING_OPTIONS.find((option) => option.sortClause === sorting);
     const [loadedLocations, isLoading] = useFindLocationsByParentLocationIdFetch(
@@ -40,14 +39,14 @@ const FinderBranch = ({ locationData, itemsPerPage }) => {
     let resizeStartPositionX = 0;
     let branchCurrentWidth = 0;
     const loadMore = ({ target }) => {
-        const areAllItemsLoaded = locationData.subitems.length >= totalCount.current;
+        const areAllItemsLoaded = locationData.subitems.length >= locationData.totalCount;
         const isOffsetReached = target.scrollHeight - target.clientHeight - target.scrollTop < SCROLL_OFFSET;
 
         if (areAllItemsLoaded || !isOffsetReached || isLoading) {
             return;
         }
 
-        setOffset(offset + itemsPerPage);
+        setOffset(Math.min(offset + itemsPerPage, locationData.totalCount));
     };
     const expandBranch = () => {
         dispatchLoadedLocationsAction({ type: 'UPDATE_LOCATIONS', data: { ...locationData, collapsed: false } });
@@ -113,11 +112,11 @@ const FinderBranch = ({ locationData, itemsPerPage }) => {
         return (
             <Fragment>
                 <div className="c-finder-branch__items-wrapper" onScroll={loadMore} style={{ width }}>
-                    {renderLoadingSpinner()}
-
                     {subitems.map(({ location }) => (
                         <FinderLeaf key={location.id} location={location} />
                     ))}
+
+                    {renderLoadingSpinner()}
                 </div>
                 {renderDragHandler()}
             </Fragment>
@@ -137,14 +136,12 @@ const FinderBranch = ({ locationData, itemsPerPage }) => {
 
     useEffect(() => {
         setOffset(0);
-        totalCount.current = 0;
     }, [sortingOptions.sortClause, sortOrder]);
 
     useEffect(() => {
         if (loadedLocations.subitems) {
             const data = { ...locationData, ...loadedLocations, subitems: [...locationData.subitems, ...loadedLocations.subitems] };
 
-            totalCount.current = loadedLocations.totalCount;
             dispatchLoadedLocationsAction({ type: 'UPDATE_LOCATIONS', data });
         }
     }, [loadedLocations, dispatchLoadedLocationsAction, isLoading]);
@@ -172,6 +169,7 @@ FinderBranch.propTypes = {
         parentLocationId: PropTypes.number.isRequired,
         subitems: PropTypes.array.isRequired,
         location: PropTypes.object.isRequired,
+        totalCount: PropTypes.number.isRequired,
         collapsed: PropTypes.bool,
     }).isRequired,
     itemsPerPage: PropTypes.number,

diff --git a/...e/ui-dev/src/modules/universal-discovery/hooks/useFindLocationsByParentLocationIdFetch.js b/...e/ui-dev/src/modules/universal-discovery/hooks/useFindLocationsByParentLocationIdFetch.js
@@ -66,17 +66,15 @@ export const useFindLocationsByParentLocationIdFetch = (locationData, { sortClau
 
         let effectCleaned = false;
 
-        if (state.dataFetched) {
-            if (
-                !locationData.parentLocationId ||
-                locationData.collapsed ||
-                locationData.subitems.length >= locationData.totalCount ||
-                locationData.subitems.length >= limit + offset
-            ) {
-                dispatch({ type: 'FETCH_END', data: {} });
+        if (
+            !locationData.parentLocationId ||
+            locationData.collapsed ||
+            locationData.subitems.length >= locationData.totalCount ||
+            locationData.subitems.length >= limit + offset
+        ) {
+            dispatch({ type: 'FETCH_END', data: state.data });
 
-                return;
-            }
+            return;
         }
 
         dispatch({ type: 'FETCH_START' });