diff --git a/src/block/icon-list-item/edit.js b/src/block/icon-list-item/edit.js index 656e4b847..4e464e42f 100644 --- a/src/block/icon-list-item/edit.js +++ b/src/block/icon-list-item/edit.js @@ -43,7 +43,9 @@ import { useBlockContext } from '~stackable/hooks' import { __ } from '@wordpress/i18n' import { compose, createHigherOrderComponent } from '@wordpress/compose' import { dispatch } from '@wordpress/data' -import { useEffect, memo } from '@wordpress/element' +import { + useEffect, useRef, memo, +} from '@wordpress/element' const TABS = [ 'style', 'advanced' ] @@ -68,15 +70,28 @@ const Edit = props => { 'stackable/uniqueId': parentUniqueId, } = context + const updateOrderedTimeout = useRef() + const updateUniqueIdTimeout = useRef() + // Set the attributes so they can be used in Save. useEffect( () => { - dispatch( 'core/block-editor' ).__unstableMarkNextChangeAsNotPersistent() - setAttributes( { ordered } ) + clearTimeout( updateOrderedTimeout.current ) + if ( ordered !== props.attributes.ordered ) { + updateOrderedTimeout.current = setTimeout( () => { + dispatch( 'core/block-editor' ).__unstableMarkNextChangeAsNotPersistent() + setAttributes( { ordered } ) + }, 300 ) + } }, [ ordered ] ) useEffect( () => { - dispatch( 'core/block-editor' ).__unstableMarkNextChangeAsNotPersistent() - setAttributes( { parentUniqueId } ) + clearTimeout( updateUniqueIdTimeout.current ) + if ( parentUniqueId !== props.attributes.parentUniqueId ) { + updateUniqueIdTimeout.current = setTimeout( () => { + dispatch( 'core/block-editor' ).__unstableMarkNextChangeAsNotPersistent() + setAttributes( { parentUniqueId } ) + }, 300 ) + } }, [ parentUniqueId ] ) const blockClassNames = classnames( [ diff --git a/src/block/icon-list/deprecated/index.js b/src/block/icon-list/deprecated/index.js index 3339592e6..a137d3593 100644 --- a/src/block/icon-list/deprecated/index.js +++ b/src/block/icon-list/deprecated/index.js @@ -6,6 +6,7 @@ import { deprecateBlockBackgroundColorOpacity, deprecateContainerBackgroundColorOpacity, deprecateTypographyGradientColor, deprecateBlockShadowColor, deprecateContainerShadowColor, } from '~stackable/block-components' +import { createUniqueClass } from '~stackable/util' import { createBlock } from '@wordpress/blocks' @@ -109,10 +110,13 @@ const deprecated = [ } else { const contents = textToArray( text ) const blocks = contents.map( ( content, index ) => { - return createBlock( 'stackable/icon-list-item', { + const newBlock = createBlock( 'stackable/icon-list-item', { text: content, icon: getUniqueIcon( icons, index ), } ) + newBlock.attributes.uniqueId = createUniqueClass( newBlock.clientId ) + + return newBlock } ) innerBlocks = blocks } diff --git a/src/block/icon-list/edit.js b/src/block/icon-list/edit.js index 586c6f2c2..95b5d9f4f 100644 --- a/src/block/icon-list/edit.js +++ b/src/block/icon-list/edit.js @@ -215,7 +215,7 @@ const Edit = props => { className={ blockClassNames } > { ! ordered && } - + { wrapList && { innerBlocksProps.children }