diff --git a/plugins/woocommerce-beta-tester/src/product-editor-dev-tools/block-inspector.tsx b/plugins/woocommerce-beta-tester/src/product-editor-dev-tools/block-inspector.tsx
index 1071cb3eb1c..20182c0b937 100644
--- a/plugins/woocommerce-beta-tester/src/product-editor-dev-tools/block-inspector.tsx
+++ b/plugins/woocommerce-beta-tester/src/product-editor-dev-tools/block-inspector.tsx
@@ -1,3 +1,8 @@
+/**
+ * External dependencies
+ */
+import { __ } from '@wordpress/i18n';
+
 export function BlockInspector( {
 	blockInfo: { blockName, templateBlockId, templateBlockOrder },
 }: {
@@ -9,16 +14,27 @@ export function BlockInspector( {
 } ) {
 	return (
 		<div className="woocommerce-product-editor-dev-tools-block-inspector">
-			<dl className="woocommerce-product-editor-dev-tools-block-inspector__properties">
-				<dt>Block name</dt>
-				<dd>{ blockName }</dd>
+			{ ! blockName && (
+				<p>
+					{ __(
+						'Focus on a block to see its details.',
+						'woocommerce'
+					) }
+				</p>
+			) }
 
-				<dt>Template block id</dt>
-				<dd>{ templateBlockId }</dd>
+			{ blockName && (
+				<dl className="woocommerce-product-editor-dev-tools-block-inspector__properties">
+					<dt>Block name</dt>
+					<dd>{ blockName }</dd>
 
-				<dt>Template block order</dt>
-				<dd>{ templateBlockOrder }</dd>
-			</dl>
+					<dt>Template block id</dt>
+					<dd>{ templateBlockId }</dd>
+
+					<dt>Template block order</dt>
+					<dd>{ templateBlockOrder }</dd>
+				</dl>
+			) }
 		</div>
 	);
 }