/** * External dependencies */ import classnames from 'classnames'; import { useInnerBlockLayoutContext } from '@woocommerce/shared-context'; import { withInstanceId } from '@wordpress/compose'; /** * Internal dependencies */ import { renderProductLayout } from './utils'; import { ProductListItemProps } from '../types'; const ProductListItem = ( { product = {}, attributes, instanceId, }: ProductListItemProps ): JSX.Element => { const { layoutConfig } = attributes; const { parentClassName, parentName } = useInnerBlockLayoutContext(); const isLoading = Object.keys( product ).length === 0; const classes = classnames( `${ parentClassName }__product`, 'wc-block-layout', { 'is-loading': isLoading, } ); return (