From e4d364eebdb85d3997ce742fcbd39541fa936a32 Mon Sep 17 00:00:00 2001
From: PhilReact <philliplangmartinez@gmail.com>
Date: Mon, 17 Mar 2025 03:59:19 +0200
Subject: [PATCH] fix bug

---
 .../ResourceList/ResourceListDisplay.tsx         | 16 +++++++++++-----
 1 file changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/components/ResourceList/ResourceListDisplay.tsx b/src/components/ResourceList/ResourceListDisplay.tsx
index e54a0c9..6918078 100644
--- a/src/components/ResourceList/ResourceListDisplay.tsx
+++ b/src/components/ResourceList/ResourceListDisplay.tsx
@@ -87,7 +87,7 @@ export const MemorizedComponent = ({
   searchCacheDuration,
   resourceCacheDuration,
   disablePagination,
-  disableScrollTracker
+  disableScrollTracker,
 }: PropsResourceListDisplay)  => {
   const { fetchResources } = useResources();
   const {  filterOutDeletedResources } = useCacheStore();
@@ -202,6 +202,11 @@ export const MemorizedComponent = ({
     return () => window.removeEventListener("beforeunload", clearOnReload);
   }, [listName]);
 
+
+  const renderListItem = useCallback((item: ListItem, index: number) => {
+    return listItem(item, index);
+  }, [ listItem]);
+
   return (
     <div ref={elementRef} style={{
       width: '100%',
@@ -243,7 +248,7 @@ export const MemorizedComponent = ({
                     defaultLoaderParams={defaultLoaderParams}
                     item={item}
                     index={index}
-                    render={listItem}
+                    render={renderListItem}
                     renderListItemLoader={loaderItem}
                   />
                   {styles?.gap && <Spacer height={`${styles.gap / 2}px`} />}
@@ -255,7 +260,7 @@ export const MemorizedComponent = ({
             <>
              <HorizontalPaginatedList defaultLoaderParams={defaultLoaderParams} disablePagination={disablePagination} limit={search?.limit || 20} onLoadLess={(displayLimit)=> {
               removeFromList(listName, displayLimit)
-             }}  items={listToDisplay} listItem={listItem} onLoadMore={(displayLimit)=> getResourceMoreList(displayLimit)} gap={styles?.gap} minItemWidth={styles?.horizontalStyles?.minItemWidth} loaderItem={loaderItem} />
+             }}  items={listToDisplay} listItem={renderListItem} onLoadMore={(displayLimit)=> getResourceMoreList(displayLimit)} gap={styles?.gap} minItemWidth={styles?.horizontalStyles?.minItemWidth} loaderItem={loaderItem} />
             </>
             
           )}
@@ -264,7 +269,7 @@ export const MemorizedComponent = ({
               <VerticalPaginatedList disablePagination={disablePagination} limit={search?.limit || 20} onLoadLess={(displayLimit)=> {
 
               removeFromList(listName, displayLimit)
-             }} defaultLoaderParams={defaultLoaderParams} items={listToDisplay} listItem={listItem} onLoadMore={(displayLimit)=> getResourceMoreList(displayLimit)} loaderItem={loaderItem} />
+             }} defaultLoaderParams={defaultLoaderParams} items={listToDisplay} listItem={renderListItem} onLoadMore={(displayLimit)=> getResourceMoreList(displayLimit)} loaderItem={loaderItem} />
             </div>
           )}
         </div>
@@ -285,7 +290,8 @@ function arePropsEqual(
     prevProps.direction === nextProps.direction &&
     prevProps.onSeenLastItem === nextProps.onSeenLastItem &&
     JSON.stringify(prevProps.search) === JSON.stringify(nextProps.search) &&
-    JSON.stringify(prevProps.styles) === JSON.stringify(nextProps.styles)
+    JSON.stringify(prevProps.styles) === JSON.stringify(nextProps.styles) &&
+    prevProps.listItem === nextProps.listItem
   );
 }