import { __ } from '@wordpress/i18n';
import { useBlockProps } from '@wordpress/block-editor';
import { useSelect } from '@wordpress/data';
import { Notice } from '@wordpress/components';
export default function Edit({attributes}) {
let [title] = useSelect((select) => {
return [
select('core/editor').getEditedPostAttribute("title") || __('Example title', 'siteseo'),
]
}, []);
let crumbs = [];
if(attributes.prefix){
crumbs.push({
'title' : attributes.prefix,
'url' : false
});
}
if(!attributes.hideHome){
crumbs.push({
'title' : attributes.homeLabel ? attributes.homeLabel : __('Home'),
'url' : true
});
}
crumbs.push({
'title' : title,
'url' : false
});
return (
<>
<Notice status="warning" isDismissible={false} politeness="polite">
<p>{__('This is just a preview, to see the final result, please view this page as a normal user', 'siteseo')}</p>
</Notice>
<div { ...useBlockProps() }>
<ul className="siteseo-breadcrumbs">
{crumbs.map((crub, i) => {
return (<><li key={crub.url}>{crub.url ? (<a href="#" title={crub.title}>{crub.title}</a>) : (crub.title)}</li>
<div className="siteseo-breadcrumbs-seperator"><span>{(crumbs.length-1) != i ? attributes.seperator : ''}</span></div>
</>
);
})}
</ul>
</div>
</>
);
}