diff --git a/assets/js/blocks/catalog-sorting/index.tsx b/assets/js/blocks/catalog-sorting/index.tsx
index b83b17bf6af..6f110fdd096 100644
--- a/assets/js/blocks/catalog-sorting/index.tsx
+++ b/assets/js/blocks/catalog-sorting/index.tsx
@@ -4,6 +4,7 @@
 import { registerBlockType } from '@wordpress/blocks';
 import { Icon } from '@wordpress/icons';
 import { totals } from '@woocommerce/icons';
+import { select, subscribe } from '@wordpress/data';
 
 /**
  * Internal dependencies
@@ -11,20 +12,36 @@ import { totals } from '@woocommerce/icons';
 import metadata from './block.json';
 import edit from './edit';
 
-registerBlockType( metadata, {
-	icon: {
-		src: (
-			<Icon
-				icon={ totals }
-				className="wc-block-editor-components-block-icon"
-			/>
-		),
-	},
-	attributes: {
-		...metadata.attributes,
-	},
-	edit,
-	save() {
-		return null;
-	},
+let currentEditorMode: string | undefined;
+
+subscribe( () => {
+	const store = select( 'core/edit-site' );
+
+	const prevEditorMode = currentEditorMode;
+	currentEditorMode = store?.getEditorMode();
+
+	if (
+		prevEditorMode === currentEditorMode ||
+		currentEditorMode !== 'visual'
+	) {
+		return;
+	}
+
+	registerBlockType( metadata, {
+		icon: {
+			src: (
+				<Icon
+					icon={ totals }
+					className="wc-block-editor-components-block-icon"
+				/>
+			),
+		},
+		attributes: {
+			...metadata.attributes,
+		},
+		edit,
+		save() {
+			return null;
+		},
+	} );
 } );