Skip to content

Commit 89c02ac

Browse files
Fix disappearing buttons inside of Services blocks (#2613)
* remove display button toggle from services block * update cypress test to reflect change
1 parent 0206e8e commit 89c02ac

File tree

11 files changed

+22
-94
lines changed

11 files changed

+22
-94
lines changed

src/blocks/services/block.json

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,6 @@
1313
"headingLevel": {
1414
"type": "integer",
1515
"default": 3
16-
},
17-
"buttons": {
18-
"type": "boolean",
19-
"default": false
2016
}
2117
},
2218
"title": "Services",

src/blocks/services/edit.js

Lines changed: 1 addition & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -66,13 +66,6 @@ const Edit = ( props ) => {
6666
updateInnerAttributes( 'coblocks/service', { headingLevel } );
6767
};
6868

69-
const toggleCtas = () => {
70-
const buttons = ! attributes.buttons;
71-
setAttributes( { buttons } );
72-
73-
updateInnerAttributes( 'coblocks/service', { showCta: buttons } );
74-
};
75-
7669
const setColumns = ( value ) => {
7770
setAttributes( { columns: parseInt( value ) } );
7871
};
@@ -90,10 +83,9 @@ const Edit = ( props ) => {
9083
/* istanbul ignore next */
9184
useEffect( () => {
9285
// Handle add and removal of service block when column is changed.
93-
const { buttons, headingLevel, alignment } = props;
86+
const { headingLevel, alignment } = props;
9487

9588
handlePlaceholderPlacement( 'coblocks/service', {
96-
showCta: buttons,
9789
headingLevel,
9890
alignment,
9991
} );
@@ -159,7 +151,6 @@ const Edit = ( props ) => {
159151
setAttributes={ setAttributes }
160152
activeStyle={ activeStyle }
161153
layoutOptions={ layoutOptions }
162-
onToggleCtas={ toggleCtas }
163154
onUpdateStyle={ updateStyle }
164155
onSetColumns={ setColumns }
165156
/>

src/blocks/services/inspector.js

Lines changed: 1 addition & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import GutterControl from '../../components/gutter-control/gutter-control';
1212
* WordPress dependencies.
1313
*/
1414
import { __ } from '@wordpress/i18n';
15-
import { PanelBody, ToggleControl, RangeControl } from '@wordpress/components';
15+
import { PanelBody, RangeControl } from '@wordpress/components';
1616
import { InspectorControls } from '@wordpress/block-editor';
1717
import { ENTER, SPACE } from '@wordpress/keycodes';
1818

@@ -22,7 +22,6 @@ const Inspector = ( props ) => {
2222
setAttributes,
2323
activeStyle,
2424
layoutOptions,
25-
onToggleCtas,
2625
onUpdateStyle,
2726
} = props;
2827

@@ -71,17 +70,6 @@ const Inspector = ( props ) => {
7170
onChange={ ( columns ) => setAttributes( { columns } ) }
7271
/>
7372
{ attributes.columns >= 2 && <GutterControl { ...props } /> }
74-
<ToggleControl
75-
label={ __( 'Display buttons', 'coblocks' ) }
76-
className="components-toggle-control--services-action-button"
77-
help={
78-
attributes.buttons
79-
? __( 'Showing the call to action buttons.', 'coblocks' )
80-
: __( 'Toggle to show call to action buttons.', 'coblocks' )
81-
}
82-
checked={ attributes.buttons }
83-
onChange={ onToggleCtas }
84-
/>
8573
</PanelBody>
8674
</InspectorControls>
8775
);

src/blocks/services/service/block.json

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,6 @@
66
"type": "integer",
77
"default": 3
88
},
9-
"showCta": {
10-
"type": "boolean",
11-
"default": false
12-
},
139
"imageUrl": {
1410
"type": "string",
1511
"source": "attribute",

src/blocks/services/service/edit.js

Lines changed: 1 addition & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,6 @@ import classnames from 'classnames';
1414
*/
1515
import { __ } from '@wordpress/i18n';
1616
import { closeSmall } from '@wordpress/icons';
17-
import { createBlock } from '@wordpress/blocks';
1817
import { isBlobURL } from '@wordpress/blob';
1918
import { useEffect } from '@wordpress/element';
2019
import {
@@ -58,7 +57,7 @@ const Edit = ( props ) => {
5857
return isSelected || rootClientId === selectedRootClientId;
5958
} );
6059

61-
const { updateBlockAttributes, insertBlock, removeBlocks } = useDispatch( 'core/block-editor' );
60+
const { updateBlockAttributes } = useDispatch( 'core/block-editor' );
6261

6362
const updateInnerAttributes = ( blockName, newAttributes ) => {
6463
innerItems.forEach( ( item ) => {
@@ -71,30 +70,6 @@ const Edit = ( props ) => {
7170
} );
7271
};
7372

74-
const manageInnerBlock = ( blockName, blockAttributes, show = true ) => {
75-
const migrateButton = innerItems.filter( ( item ) => item.name === 'core/button' );
76-
77-
// Migrate core/button to core/buttons block
78-
if ( !! migrateButton.length ) {
79-
removeBlocks( migrateButton.map( ( item ) => item.clientId ), false );
80-
const newBlock = createBlock( blockName, blockAttributes, migrateButton );
81-
insertBlock( newBlock, innerItems.length, clientId, false );
82-
return;
83-
}
84-
85-
const targetBlock = innerItems.filter( ( item ) => item.name === blockName );
86-
87-
if ( ! targetBlock.length && show ) {
88-
const newButton = createBlock( 'core/button', {} );
89-
const newBlock = createBlock( blockName, blockAttributes, [ newButton ] );
90-
insertBlock( newBlock, innerItems.length, clientId, false );
91-
}
92-
93-
if ( targetBlock.length && ! show ) {
94-
removeBlocks( targetBlock.map( ( item ) => item.clientId ), false );
95-
}
96-
};
97-
9873
/* istanbul ignore next */
9974
useEffect( () => {
10075
updateInnerAttributes( 'core/heading', { level: attributes.headingLevel } );
@@ -105,15 +80,6 @@ const Edit = ( props ) => {
10580
updateInnerAttributes( 'core/buttons', { contentJustification: attributes.alignment } );
10681
}, [ attributes.alignment ] );
10782

108-
/* istanbul ignore next */
109-
useEffect( () => {
110-
manageInnerBlock( 'core/buttons', { contentJustification: attributes.alignment }, attributes.showCta );
111-
}, [ attributes.showCta ] );
112-
113-
const toggleCta = () => {
114-
setAttributes( { showCta: ! showCta } );
115-
};
116-
11783
const replaceImage = ( file ) => {
11884
setAttributes( { imageAlt: file.alt, imageId: file.id, imageUrl: file.url } );
11985
};
@@ -197,7 +163,6 @@ const Edit = ( props ) => {
197163
linkDestination,
198164
linkTarget,
199165
rel,
200-
showCta,
201166
alignment,
202167
} = attributes;
203168

@@ -255,7 +220,6 @@ const Edit = ( props ) => {
255220
</BlockControls>
256221
<InspectorControls
257222
attributes={ attributes }
258-
onToggleCta={ toggleCta }
259223
setAttributes={ setAttributes }
260224
/>
261225
<div className={ className }>

src/blocks/services/service/inspector.js

Lines changed: 1 addition & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -2,30 +2,17 @@
22
* WordPress dependencies.
33
*/
44
import { __ } from '@wordpress/i18n';
5-
import { PanelBody, ToggleControl, TextareaControl, ExternalLink, FocalPointPicker } from '@wordpress/components';
5+
import { PanelBody, TextareaControl, ExternalLink, FocalPointPicker } from '@wordpress/components';
66
import { InspectorControls } from '@wordpress/block-editor';
77

88
const Inspector = ( props ) => {
99
const {
1010
attributes,
1111
setAttributes,
12-
onToggleCta,
1312
} = props;
1413

1514
return (
1615
<InspectorControls>
17-
<PanelBody title={ __( 'Service settings', 'coblocks' ) }>
18-
<ToggleControl
19-
label={ __( 'Display button', 'coblocks' ) }
20-
help={
21-
attributes.showCta
22-
? __( 'Showing the call to action button.', 'coblocks' )
23-
: __( 'Toggle to show a call to action button.', 'coblocks' )
24-
}
25-
checked={ attributes.showCta }
26-
onChange={ onToggleCta }
27-
/>
28-
</PanelBody>
2916
{ attributes.imageUrl &&
3017
<PanelBody title={ __( 'Image settings', 'coblocks' ) } initialOpen={ false }>
3118
<TextareaControl
Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

33
exports[`coblocks/service should render 1`] = `
4-
"<!-- wp:coblocks/service {"showCta":1,"focalPoint":{"x":100,"y":0}} -->
4+
"<!-- wp:coblocks/service {"focalPoint":{"x":100,"y":0}} -->
55
<div class="wp-block-coblocks-service"><figure class="wp-block-coblocks-service__figure"><img src="https://website.com/wp-content/uploads/1234/56/image.jpg" alt="alt text" style="object-position:10000% 0%"/></figure><div class="wp-block-coblocks-service__content"></div></div>
66
<!-- /wp:coblocks/service -->"
77
`;
88

99
exports[`coblocks/service should render with href 1`] = `
10-
"<!-- wp:coblocks/service {"showCta":1} -->
10+
"<!-- wp:coblocks/service -->
1111
<div class="wp-block-coblocks-service"><figure class="wp-block-coblocks-service__figure"><a href="https://www.godaddy.com" target="_blank"><img src="https://website.com/wp-content/uploads/1234/56/image.jpg" alt="alt text"/></a></figure><div class="wp-block-coblocks-service__content"></div></div>
1212
<!-- /wp:coblocks/service -->"
1313
`;

src/blocks/services/service/test/save.spec.js

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,14 +27,12 @@ describe( 'coblocks/service', () => {
2727
block.attributes.imageUrl = 'https://website.com/wp-content/uploads/1234/56/image.jpg';
2828
block.attributes.imageAlt = 'alt text';
2929
block.attributes.focalPoint = { x: 100, y: 0 };
30-
block.attributes.showCta = 1;
3130
const serializedBlock = serialize( block );
3231

3332
expect( serializedBlock ).toBeDefined();
3433
expect( serializedBlock ).toContain( `src="${ block.attributes.imageUrl }"` );
3534
expect( serializedBlock ).toContain( `alt="${ block.attributes.imageAlt }"` );
3635
expect( serializedBlock ).toContain( 'style="object-position:10000% 0%"' );
37-
expect( serializedBlock ).toContain( '"showCta":1' );
3836
expect( serializedBlock ).toMatchSnapshot();
3937
} );
4038

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

33
exports[`coblocks/services should render 1`] = `
4-
"<!-- wp:coblocks/services {"columns":3,"alignment":"center","headingLevel":2,"buttons":true} -->
4+
"<!-- wp:coblocks/services {"columns":3,"alignment":"center","headingLevel":2} -->
55
<div class="wp-block-coblocks-services"><div class="has-columns has-3-columns has-responsive-columns has-huge-gutter"></div></div>
66
<!-- /wp:coblocks/services -->"
77
`;

src/blocks/services/test/save.spec.js

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,15 +32,13 @@ describe( 'coblocks/services', () => {
3232
block.attributes.gutter = 'huge';
3333
block.attributes.alignment = 'center';
3434
block.attributes.headingLevel = 2;
35-
block.attributes.buttons = true;
3635
serializedBlock = serialize( block );
3736

3837
expect( serializedBlock ).toBeDefined();
3938
expect( serializedBlock ).toContain( 'has-3-columns' );
4039
expect( serializedBlock ).toContain( 'has-huge-gutter' );
4140
expect( serializedBlock ).toContain( '"alignment":"center"' );
4241
expect( serializedBlock ).toContain( '"headingLevel":2' );
43-
expect( serializedBlock ).toContain( '"buttons":true' );
4442
expect( serializedBlock ).toMatchSnapshot();
4543
} );
4644
} );

0 commit comments

Comments
 (0)