diff --git a/editor/src/components/inspector/sections/component-section/property-controls-section.tsx b/editor/src/components/inspector/sections/component-section/property-controls-section.tsx
index 309be0d92d5d..00c697a30a44 100644
--- a/editor/src/components/inspector/sections/component-section/property-controls-section.tsx
+++ b/editor/src/components/inspector/sections/component-section/property-controls-section.tsx
@@ -1,14 +1,13 @@
 import React from 'react'
 import type { ElementPath } from '../../../../core/shared/project-file-types'
 import type { PropertyControls } from '../../../custom-code/internal-property-controls'
-import { useEditorState } from '../../../editor/store/store-hook'
 import { setCursorOverlay } from '../../../editor/actions/action-creators'
 import { useKeepReferenceEqualityIfPossible } from '../../../../utils/react-performance'
 import { useHiddenElements } from './hidden-controls-section'
 import { FolderSection } from './folder-section'
 import type { CSSCursor } from '../../../canvas/canvas-types'
 import { UIGridRow } from '../../widgets/ui-grid-row'
-import { VerySubdued } from '../../../../uuiui'
+import { Subdued, VerySubdued } from '../../../../uuiui'
 import {
   AdvancedFolderLabel,
   isAdvancedFolderLabel,
@@ -52,7 +51,29 @@ export const PropertyControlsSection = React.memo((props: PropertyControlsSectio
 
   const propertiesWithFolders = synthesiseFolders(propertyControls)
 
-  return (
+  // unify the logic from the sub components
+  const hasContent = React.useMemo(
+    () =>
+      (Object.keys(detectedPropsAndValuesWithoutControls).length > 0 &&
+        Object.keys(detectedPropsAndValuesWithoutControls).some(
+          (prop) => !specialPropertiesToIgnore.includes(prop),
+        )) ||
+      propertiesWithFolders.folders.length > 0 ||
+      Object.keys(propertiesWithFolders.advanced).length > 0 ||
+      filteredDetectedPropsWithNoValue.length > 0 ||
+      Object.keys(propertiesWithFolders.uncategorized).length > 0 ||
+      propsWithControlsButNoValue.length > 0,
+    [
+      detectedPropsAndValuesWithoutControls,
+      propertiesWithFolders.folders,
+      propertiesWithFolders.advanced,
+      filteredDetectedPropsWithNoValue,
+      propertiesWithFolders.uncategorized,
+      propsWithControlsButNoValue.length,
+    ],
+  )
+
+  return hasContent ? (
     <>
       <FolderSection
         isRoot={true}
@@ -102,6 +123,12 @@ export const PropertyControlsSection = React.memo((props: PropertyControlsSectio
         </UIGridRow>
       ) : null}
     </>
+  ) : (
+    <UIGridRow padded tall={false} variant={'<-------------1fr------------->'}>
+      <div>
+        <Subdued>This component requires no configuration</Subdued>
+      </div>
+    </UIGridRow>
   )
 })
 
diff --git a/editor/src/core/performance/__snapshots__/performance-regression-tests.spec.tsx.snap b/editor/src/core/performance/__snapshots__/performance-regression-tests.spec.tsx.snap
index 7606c3d5cd63..ce9d850463cf 100644
--- a/editor/src/core/performance/__snapshots__/performance-regression-tests.spec.tsx.snap
+++ b/editor/src/core/performance/__snapshots__/performance-regression-tests.spec.tsx.snap
@@ -805,12 +805,12 @@ Array [
   "/UtopiaSpiedExoticType(Symbol(react.fragment))/UtopiaSpiedFunctionComponent(UIGridRow)/Symbol(react.forward_ref)(EmotionCssPropInternal)/div",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/Symbol(react.forward_ref)(Styled(div))/div",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/Symbol(react.forward_ref)(Styled(div))/div",
-  "/UtopiaSpiedExoticType(Symbol(react.fragment))/UtopiaSpiedExoticType(Symbol(react.fragment))//Symbol(react.memo)()",
-  "/UtopiaSpiedExoticType(Symbol(react.fragment))/UtopiaSpiedExoticType(Symbol(react.fragment))//UtopiaSpiedExoticType(Symbol(react.fragment))",
-  "//UtopiaSpiedExoticType(Symbol(react.fragment))//Symbol(react.memo)()",
-  "//UtopiaSpiedExoticType(Symbol(react.fragment))//Symbol(react.memo)()",
-  "//UtopiaSpiedExoticType(Symbol(react.fragment))//Symbol(react.forward_ref)(EmotionCssPropInternal)",
-  "/UtopiaSpiedExoticType(Symbol(react.fragment))//Symbol(react.forward_ref)(EmotionCssPropInternal)/div",
+  "/UtopiaSpiedExoticType(Symbol(react.fragment))/UtopiaSpiedExoticType(Symbol(react.fragment))//Symbol(react.forward_ref)(Styled(span))",
+  "/UtopiaSpiedExoticType(Symbol(react.fragment))/UtopiaSpiedExoticType(Symbol(react.fragment))//div",
+  "/UtopiaSpiedExoticType(Symbol(react.fragment))/UtopiaSpiedExoticType(Symbol(react.fragment))//UtopiaSpiedFunctionComponent(UIGridRow)",
+  "/UtopiaSpiedExoticType(Symbol(react.fragment))//UtopiaSpiedFunctionComponent(UIGridRow)/Symbol(react.forward_ref)(EmotionCssPropInternal)",
+  "//UtopiaSpiedFunctionComponent(UIGridRow)/Symbol(react.forward_ref)(EmotionCssPropInternal)/div",
+  "/div/div/Symbol(react.forward_ref)(Styled(span))/span",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/UtopiaSpiedFunctionComponent(InspectorSectionHeader)/div",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/UtopiaSpiedFunctionComponent(InspectorSectionHeader)/Symbol(react.memo)()",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/UtopiaSpiedFunctionComponent(InspectorSectionHeader)/Symbol(react.forward_ref)(Styled(div))",
@@ -2476,12 +2476,12 @@ Array [
   "/UtopiaSpiedExoticType(Symbol(react.fragment))/UtopiaSpiedFunctionComponent(UIGridRow)/Symbol(react.forward_ref)(EmotionCssPropInternal)/div",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/Symbol(react.forward_ref)(Styled(div))/div",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/Symbol(react.forward_ref)(Styled(div))/div",
-  "/UtopiaSpiedExoticType(Symbol(react.fragment))/UtopiaSpiedExoticType(Symbol(react.fragment))//Symbol(react.memo)()",
-  "/UtopiaSpiedExoticType(Symbol(react.fragment))/UtopiaSpiedExoticType(Symbol(react.fragment))//UtopiaSpiedExoticType(Symbol(react.fragment))",
-  "//UtopiaSpiedExoticType(Symbol(react.fragment))//Symbol(react.memo)()",
-  "//UtopiaSpiedExoticType(Symbol(react.fragment))//Symbol(react.memo)()",
-  "//UtopiaSpiedExoticType(Symbol(react.fragment))//Symbol(react.forward_ref)(EmotionCssPropInternal)",
-  "/UtopiaSpiedExoticType(Symbol(react.fragment))//Symbol(react.forward_ref)(EmotionCssPropInternal)/div",
+  "/UtopiaSpiedExoticType(Symbol(react.fragment))/UtopiaSpiedExoticType(Symbol(react.fragment))//Symbol(react.forward_ref)(Styled(span))",
+  "/UtopiaSpiedExoticType(Symbol(react.fragment))/UtopiaSpiedExoticType(Symbol(react.fragment))//div",
+  "/UtopiaSpiedExoticType(Symbol(react.fragment))/UtopiaSpiedExoticType(Symbol(react.fragment))//UtopiaSpiedFunctionComponent(UIGridRow)",
+  "/UtopiaSpiedExoticType(Symbol(react.fragment))//UtopiaSpiedFunctionComponent(UIGridRow)/Symbol(react.forward_ref)(EmotionCssPropInternal)",
+  "//UtopiaSpiedFunctionComponent(UIGridRow)/Symbol(react.forward_ref)(EmotionCssPropInternal)/div",
+  "/div/div/Symbol(react.forward_ref)(Styled(span))/span",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FixedHugDropdown/Symbol(react.memo)(Symbol(react.forward_ref)())",
   "/FixedHugDropdown/Symbol(react.memo)(Symbol(react.forward_ref)())/Symbol(react.forward_ref)()/Symbol(react.forward_ref)(EmotionCssPropInternal)",
   "/Symbol(react.memo)(Symbol(react.forward_ref)())/Symbol(react.forward_ref)()/Symbol(react.forward_ref)(EmotionCssPropInternal)/UtopiaSpiedClass(StateManager)",