fix: infinite loop

packages/core/admin/admin/src/content-manager/pages/ListView/ListViewPage.tsx

@@ -24,6 +24,7 @@ import {
   useStrapiApp,
 } from '@strapi/helper-plugin';
 import { ArrowLeft, Plus } from '@strapi/icons';
+import isEqual from 'lodash/isEqual';
 import { stringify } from 'qs';
 import { useIntl } from 'react-intl';
 import { useNavigate, Link as ReactRouterLink } from 'react-router-dom';
@@ -44,6 +45,7 @@ import {
   convertListLayoutToFieldLayouts,
   useDocumentLayout,
 } from '../../hooks/useDocumentLayout';
+import { usePrev } from '../../hooks/usePrev';
 import { useSyncRbac } from '../../hooks/useSyncRbac';
 import { useDeleteDocumentMutation, useGetAllDocumentsQuery } from '../../services/documents';
 import { buildValidParams } from '../../utils/api';
@@ -84,9 +86,16 @@ const ListViewPage = () => {
 
   const [displayedHeaders, setDisplayedHeaders] = React.useState<ListFieldLayout[]>([]);
 
+  const listLayout = usePrev(list.layout);
   React.useEffect(() => {
-    setDisplayedHeaders(list.layout);
-  }, [list.layout]);
+    /**
+     * ONLY update the displayedHeaders if the document
+     * layout has actually changed in value.
+     */
+    if (!isEqual(listLayout, list.layout)) {
+      setDisplayedHeaders(list.layout);
+    }
+  }, [list.layout, listLayout]);
 
   const handleSetHeaders = (headers: string[]) => {
     setDisplayedHeaders(