Create New Item
Item Type
File
Folder
Item Name
Search file in folder and subfolders...
Are you sure want to rename?
optometrists
/
cache
/
cache
/
cache
/
cache
/
cache
/
.wp-cli
/
wp-content
/
plugins
/
woocommerce
/
packages
/
woocommerce-blocks
/
assets
/
js
/
base
/
components
/
product-list
/
product-list-item
:
utils.js
Advanced Search
Upload
New Item
Settings
Back
Back Up
Advanced Editor
Save
/** * External dependencies */ import { getBlockMap } from '@woocommerce/atomic-utils'; import { Suspense } from '@wordpress/element'; /** * Maps a layout config into atomic components. * * @param {string} blockName Name of the parent block. Used to get extension children. * @param {Object} product Product object to pass to atomic components. * @param {Object[]} layoutConfig Object with component data. * @param {number} componentId Parent component ID needed for key generation. */ export const renderProductLayout = ( blockName, product, layoutConfig, componentId ) => { if ( ! layoutConfig ) { return; } const blockMap = getBlockMap( blockName ); return layoutConfig.map( ( [ name, props = {} ], index ) => { let children = []; if ( !! props.children && props.children.length > 0 ) { children = renderProductLayout( blockName, product, props.children, componentId ); } const LayoutComponent = blockMap[ name ]; if ( ! LayoutComponent ) { return null; } const productID = product.id || 0; const keyParts = [ 'layout', name, index, componentId, productID ]; return ( <Suspense key={ keyParts.join( '_' ) } fallback={ <div className="wc-block-placeholder" /> } > <LayoutComponent { ...props } children={ children } product={ product } /> </Suspense> ); } ); };