fix: fixes decaporg#6563 - performance improvements to pages with lists

geotrev · Sep 28, 2022 · 91ea776 · 91ea776
1 parent 0c5efd1
commit 91ea776
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 37 deletions.
diff --git a/packages/netlify-cms-widget-list/src/ListControl.js b/packages/netlify-cms-widget-list/src/ListControl.js
@@ -550,34 +550,36 @@ export default class ListControl extends React.Component {
         <NestedObjectLabel collapsed={collapsed} error={hasError}>
           {this.objectLabel(item)}
         </NestedObjectLabel>
-        <ClassNames>
-          {({ css, cx }) => (
-            <ObjectControl
-              classNameWrapper={cx(classNameWrapper, {
-                [css`
-                  ${styleStrings.collapsedObjectControl};
-                `]: collapsed,
-              })}
-              value={item}
-              field={field}
-              onChangeObject={this.handleChangeFor(index)}
-              editorControl={editorControl}
-              resolveWidget={resolveWidget}
-              metadata={metadata}
-              forList
-              onValidateObject={onValidateObject}
-              clearFieldErrors={clearFieldErrors}
-              fieldsErrors={fieldsErrors}
-              ref={this.processControlRef}
-              controlRef={controlRef}
-              validationKey={key}
-              collapsed={collapsed}
-              data-testid={`object-control-${key}`}
-              hasError={hasError}
-              parentIds={[...parentIds, forID, key]}
-            />
-          )}
-        </ClassNames>
+        {!collapsed && (
+          <ClassNames>
+            {({ css, cx }) => (
+              <ObjectControl
+                classNameWrapper={cx(classNameWrapper, {
+                  [css`
+                    ${styleStrings.collapsedObjectControl};
+                  `]: collapsed,
+                })}
+                value={item}
+                field={field}
+                onChangeObject={this.handleChangeFor(index)}
+                editorControl={editorControl}
+                resolveWidget={resolveWidget}
+                metadata={metadata}
+                forList
+                onValidateObject={onValidateObject}
+                clearFieldErrors={clearFieldErrors}
+                fieldsErrors={fieldsErrors}
+                ref={this.processControlRef}
+                controlRef={controlRef}
+                validationKey={key}
+                collapsed={collapsed}
+                data-testid={`object-control-${key}`}
+                hasError={hasError}
+                parentIds={[...parentIds, forID, key]}
+              />
+            )}
+          </ClassNames>
+        )}
       </SortableListItem>
     );
   };

diff --git a/packages/netlify-cms-widget-object/src/ObjectControl.js b/packages/netlify-cms-widget-object/src/ObjectControl.js
@@ -175,15 +175,17 @@ export default class ObjectControl extends React.Component {
                   t={t}
                 />
               )}
-              <div
-                className={cx({
-                  [css`
-                    ${styleStrings.collapsedObjectControl}
-                  `]: collapsed,
-                })}
-              >
-                {this.renderFields(multiFields, singleField)}
-              </div>
+              {!collapsed && (
+                <div
+                  className={cx({
+                    [css`
+                      ${styleStrings.collapsedObjectControl}
+                    `]: collapsed,
+                  })}
+                >
+                  {this.renderFields(multiFields, singleField)}
+                </div>
+              )}
             </div>
           )}
         </ClassNames>