fix separator block

gambitph · Sep 2, 2024 · 4d914eb · 4d914eb
1 parent e8d7784
commit 4d914eb
Show file tree

Hide file tree

Showing 2 changed files with 52 additions and 47 deletions.
diff --git a/src/block/separator/edit.js b/src/block/separator/edit.js
@@ -45,15 +45,18 @@ const Edit = props => {
 	const {
 		className,
 		attributes,
+		setAttributes,
 	} = props
 
-	const PremiumSeparatorControls = useMemo( () => applyFilters( 'stackable.block.separator.edit.after', null ), [] )
-
 	const {
 		separatorDesign,
 		separatorInverted,
 	} = attributes
 
+	const attributesToPass = {
+		separatorLayer2Show: attributes.separatorLayer2Show,
+		separatorLayer3Show: attributes.separatorLayer3Show,
+	}
 	const blockClassNames = classnames( [
 		className,
 		'stk-block-separator',
@@ -77,7 +80,7 @@ const Edit = props => {
 
 	return (
 		<>
-			<InspectorControls PremiumSeparatorControls={ PremiumSeparatorControls } />
+			<InspectorControls attributes={ attributesToPass } setAttributes={ setAttributes } />
 
 			{ blockCss && <style key="block-css">{ blockCss }</style> }
 			<CustomCSS mainBlockClass="stk-block-separator" />
@@ -102,50 +105,52 @@ const Edit = props => {
 }
 
 const InspectorControls = memo( props => {
-	<>
-		<InspectorTabs hasLayoutPanel={ false } />
+	const PremiumSeparatorControls = useMemo( () => applyFilters( 'stackable.block.separator.edit.after', null ), [] )
+	return (
+		<>
+			<InspectorTabs hasLayoutPanel={ false } />
 
-		<InspectorStyleControls>
-			<PanelAdvancedSettings
-				title={ __( 'General', i18n ) }
-				id="general"
-				initialOpen={ true }
-			>
-				<AdvancedRangeControl
-					label={ __( 'Height', i18n ) }
-					min={ 30 }
-					sliderMax={ 400 }
-					placeholder=""
-					attribute="separatorHeight"
-					responsive="all"
-				/>
-				<AdvancedToggleControl
-					label={ __( 'Flip Horizontally', i18n ) }
-					attribute="separatorFlipHorizontally"
-				/>
-				<AdvancedToggleControl
-					label={ __( 'Flip Vertically', i18n ) }
-					attribute="separatorFlipVertically"
-				/>
-			</PanelAdvancedSettings>
-			<PanelAdvancedSettings
-				title={ __( 'Separator', i18n ) }
-				id="separator"
-			>
-				<Separator.InspectorControls.SeparatorControls hasFlipVertically={ true } />
-			</PanelAdvancedSettings>
-			{ props.PremiumSeparatorControls && <PremiumSeparatorControls { ...props } /> }
-		</InspectorStyleControls>
+			<InspectorStyleControls>
+				<PanelAdvancedSettings
+					title={ __( 'General', i18n ) }
+					id="general"
+					initialOpen={ true }
+				>
+					<AdvancedRangeControl
+						label={ __( 'Height', i18n ) }
+						min={ 30 }
+						sliderMax={ 400 }
+						placeholder=""
+						attribute="separatorHeight"
+						responsive="all"
+					/>
+					<AdvancedToggleControl
+						label={ __( 'Flip Horizontally', i18n ) }
+						attribute="separatorFlipHorizontally"
+					/>
+					<AdvancedToggleControl
+						label={ __( 'Flip Vertically', i18n ) }
+						attribute="separatorFlipVertically"
+					/>
+				</PanelAdvancedSettings>
+				<PanelAdvancedSettings
+					title={ __( 'Separator', i18n ) }
+					id="separator"
+				>
+					<Separator.InspectorControls.SeparatorControls hasFlipVertically={ true } />
+				</PanelAdvancedSettings>
+				{ PremiumSeparatorControls && <PremiumSeparatorControls { ...props } /> }
+			</InspectorStyleControls>
 
-		<BlockDiv.InspectorControls />
-		<Advanced.InspectorControls />
-		<Transform.InspectorControls />
-		<EffectsAnimations.InspectorControls />
-		<CustomAttributes.InspectorControls />
-		<CustomCSS.InspectorControls mainBlockClass="stk-block-separator" />
-		<Responsive.InspectorControls />
-		<ConditionalDisplay.InspectorControls />
-	</>
+			<BlockDiv.InspectorControls />
+			<Advanced.InspectorControls />
+			<Transform.InspectorControls />
+			<EffectsAnimations.InspectorControls />
+			<CustomAttributes.InspectorControls />
+			<CustomCSS.InspectorControls mainBlockClass="stk-block-separator" />
+			<Responsive.InspectorControls />
+			<ConditionalDisplay.InspectorControls />
+		</> )
 } )
 
 export default compose(

diff --git a/src/block/separator/style.js b/src/block/separator/style.js
@@ -13,7 +13,7 @@ import { BlockStyleGenerator } from '~stackable/components'
 /**
  * WordPress dependencies
  */
-import { applyFilters } from '@wordpress/hooks'
+import { doAction } from '@wordpress/hooks'
 
 const blockStyles = new BlockStyleGenerator( {
 	versionAdded: '3.0.0',
@@ -31,7 +31,7 @@ SeparatorStyles_.addSeparatorStyles( blockStyles, {
 	wrapperSelector: '.stk-block-separator__inner',
 	location: '',
 } )
-applyFilters( 'stackable.block-component.separator.layer-styles.addStyles', blockStyles, {
+doAction( 'stackable.block-component.separator.layer-styles.addStyles', blockStyles, {
 	selector: '',
 	enableFlipVertically: true,
 	isInitiallyFlippedVertically: false,