2020-10-13 01:40:53 +00:00
|
|
|
/**
|
|
|
|
* External dependencies
|
|
|
|
*/
|
2020-10-22 03:01:25 +00:00
|
|
|
import { __experimentalNavigationItem as NavigationItem } from '@wordpress/components';
|
|
|
|
import { WooNavigationItem, useNavSlot } from '@woocommerce/navigation';
|
2020-10-13 01:40:53 +00:00
|
|
|
|
|
|
|
const Item = ( { item } ) => {
|
2020-10-22 03:01:25 +00:00
|
|
|
const slot = useNavSlot( 'woocommerce_navigation_' + item.id );
|
2020-10-13 01:40:53 +00:00
|
|
|
const hasFills = Boolean( slot.fills && slot.fills.length );
|
|
|
|
|
|
|
|
// Only render a slot if a coresponding Fill exists and the item is not a category
|
|
|
|
if ( hasFills && ! item.isCategory ) {
|
2020-10-22 03:01:25 +00:00
|
|
|
return (
|
|
|
|
<NavigationItem key={ item.id } item={ item.id }>
|
|
|
|
<WooNavigationItem.Slot name={ item.id } />
|
|
|
|
</NavigationItem>
|
|
|
|
);
|
2020-10-13 01:40:53 +00:00
|
|
|
}
|
2020-10-22 03:01:25 +00:00
|
|
|
|
2020-10-13 01:40:53 +00:00
|
|
|
return (
|
|
|
|
<NavigationItem
|
|
|
|
key={ item.id }
|
|
|
|
item={ item.id }
|
|
|
|
title={ item.title }
|
|
|
|
href={ item.url }
|
|
|
|
navigateToMenu={ ! item.url && item.id }
|
|
|
|
/>
|
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
export default Item;
|