fix (icon list): editor freezes when adding patterns with icon list

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( [

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
 			}

src/block/icon-list/edit.js

@@ -215,7 +215,7 @@ const Edit = props => {
 				className={ blockClassNames }
 			>
 				{ ! ordered && <IconSvgDef icon={ icon } uniqueId={ attributes.uniqueId } /> }
-				<ParentTagName { ...innerBlocksProps } >
+				<ParentTagName className={ tagNameClassNames } >
 					{ wrapList &&
 						<TagName className="stk-block-icon-list__group">
 							{ innerBlocksProps.children }