import { useState } from '@wordpress/element';

const defaultModalData = {
	open: false,
	id: '',
	title: '',
	upgradeUrl:
		'https://www.wptasty.com/pricing-recipes?utm_source=WordPress&utm_medium=tasty-framework&utm_campaign=modal&utm_content=template',
	previewImage: '',
};

export const useModal = () => {
	const [ modalData, setModalData ] = useState( defaultModalData );

	const openModal = ( id, title, upgradeUrl, previewImage = '' ) => {
		setModalData( ( prev ) => {
			return {
				...prev,
				open: true,
				id,
				title,
				upgradeUrl,
				previewImage,
			};
		} );
	};

	const closeModal = () => {
		setModalData( defaultModalData );
	};

	const generateUpgradeUrl = ( {
		medium = 'tasty-framework',
		campaign = 'modal',
		content = 'template',
	} ) => {
		return `https://www.wptasty.com/pricing-recipes?utm_source=WordPress&utm_medium=${ medium }&utm_campaign=${ campaign }&utm_content=${ content }`;
	};

	return { modalData, openModal, closeModal, generateUpgradeUrl };
};
