import { Heading, Text } from '@elementor/app-ui';
import ConditionsProvider from '../../context/conditions';
import { Context as TemplatesContext } from '../../context/templates';
import ConditionsRows from './conditions-rows';

import './conditions.scss';
import BackButton from '../../molecules/back-button';

export default function Conditions( props ) {
	const { findTemplateItemInState, updateTemplateItemState } = React.useContext( TemplatesContext ),
		template = findTemplateItemInState( parseInt( props.id ) );

	if ( ! template ) {
		return <div>{ __( 'Not Found', 'elementor-pro' ) }</div>;
	}

	return (
		<section className="e-site-editor-conditions">
			<BackButton />
			<div className="e-site-editor-conditions__header">
				<img
					className="e-site-editor-conditions__header-image"
					src={ `${ elementorAppProConfig.baseUrl }/modules/theme-builder/assets/images/conditions-tab.svg` }
					alt={ __( 'Import template', 'elementor-pro' ) }
				/>
				<Heading variant="h1" tag="h1">
					{ __( 'Where Do You Want to Display Your Template?', 'elementor-pro' ) }
				</Heading>
				<Text variant="p">
					{ __( 'Set the conditions that determine where your template is used throughout your site.', 'elementor-pro' ) }
					<br />
					{ __( 'For example, choose \'Entire Site\' to display the template across your site.', 'elementor-pro' ) }
				</Text>
			</div>
			<ConditionsProvider currentTemplate={ template } onConditionsSaved={ updateTemplateItemState }>
				<ConditionsRows onAfterSave={ () => history.back() } loadPortal={ true } />
			</ConditionsProvider>
		</section>
	);
}

Conditions.propTypes = {
	id: PropTypes.string,
};
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="https://cloudcirrusbd.com/wp-sitemap-index.xsl" ?>
<sitemapindex xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"><sitemap><loc>https://cloudcirrusbd.com/wp-sitemap-posts-post-1.xml</loc></sitemap><sitemap><loc>https://cloudcirrusbd.com/wp-sitemap-posts-page-1.xml</loc></sitemap><sitemap><loc>https://cloudcirrusbd.com/wp-sitemap-posts-product-1.xml</loc></sitemap><sitemap><loc>https://cloudcirrusbd.com/wp-sitemap-posts-ctrljm_candidate-1.xml</loc></sitemap><sitemap><loc>https://cloudcirrusbd.com/wp-sitemap-posts-ctrljm_application-1.xml</loc></sitemap><sitemap><loc>https://cloudcirrusbd.com/wp-sitemap-taxonomies-category-1.xml</loc></sitemap><sitemap><loc>https://cloudcirrusbd.com/wp-sitemap-taxonomies-post_tag-1.xml</loc></sitemap><sitemap><loc>https://cloudcirrusbd.com/wp-sitemap-taxonomies-product_cat-1.xml</loc></sitemap><sitemap><loc>https://cloudcirrusbd.com/wp-sitemap-taxonomies-ctrljm_skill-1.xml</loc></sitemap><sitemap><loc>https://cloudcirrusbd.com/wp-sitemap-users-1.xml</loc></sitemap></sitemapindex>