Select custom field uids from layout using reselect

packages/core/admin/admin/src/content-manager/pages/EditView/index.js

@@ -27,10 +27,10 @@ import useLazyComponents from '../../hooks/useLazyComponents';
 import DraftAndPublishBadge from './DraftAndPublishBadge';
 import Informations from './Informations';
 import Header from './Header';
-import { getFieldsActionMatchingPermissions, getCustomFieldUidsFromLayout } from './utils';
+import { getFieldsActionMatchingPermissions } from './utils';
 import DeleteLink from './DeleteLink';
 import GridRow from './GridRow';
-import { selectCurrentLayout, selectAttributesLayout } from './selectors';
+import { selectCurrentLayout, selectAttributesLayout, selectCustomFieldUids } from './selectors';
 
 const cmPermissions = permissions.contentManager;
 const ctbPermissions = [{ action: 'plugin::content-type-builder.read', subject: null }];
@@ -40,12 +40,12 @@ const EditView = ({ allowedActions, isSingleType, goBack, slug, id, origin, user
   const { trackUsage } = useTracking();
   const { formatMessage } = useIntl();
 
-  const { layout, formattedContentTypeLayout } = useSelector((state) => ({
+  const { layout, formattedContentTypeLayout, customFieldUids } = useSelector((state) => ({
     layout: selectCurrentLayout(state),
     formattedContentTypeLayout: selectAttributesLayout(state),
+    customFieldUids: selectCustomFieldUids(state),
   }));
 
-  const customFieldUids = getCustomFieldUidsFromLayout(layout);
   const { isLazyLoading, lazyComponentStore } = useLazyComponents(customFieldUids);
 
   const { createActionAllowedFields, readActionAllowedFields, updateActionAllowedFields } =

packages/core/admin/admin/src/content-manager/pages/EditView/selectors.js

@@ -1,10 +1,14 @@
 import { createSelector } from 'reselect';
-import { createAttributesLayout } from './utils';
+import { createAttributesLayout, getCustomFieldUidsFromLayout } from './utils';
 
 const selectCurrentLayout = (state) => state['content-manager_editViewLayoutManager'].currentLayout;
 
 const selectAttributesLayout = createSelector(selectCurrentLayout, (layout) =>
   createAttributesLayout(layout?.contentType ?? {})
 );
 
-export { selectCurrentLayout, selectAttributesLayout };
+const selectCustomFieldUids = createSelector(selectCurrentLayout, (layout) =>
+  getCustomFieldUidsFromLayout(layout)
+);
+
+export { selectCurrentLayout, selectAttributesLayout, selectCustomFieldUids };

packages/core/admin/admin/src/content-manager/pages/EditView/utils/getCustomFieldUidsFromLayout.js

@@ -1,4 +1,5 @@
 const getCustomFieldUidsFromLayout = (layout) => {
+  if (!layout) return [];
   // Get all the fields on the content-type and its components
   const allFields = [
     ...layout.contentType.layouts.edit,