import { useBoundStore } from '../../store/store';
import { __ } from '@wordpress/i18n';

interface AddNewPricingLevelButtonProps {
	productId: number;
}

export function AddNewPricingLevelButton(props: AddNewPricingLevelButtonProps) {
	const { productId } = props;
	const { addProductPricingLevel } = useBoundStore((state) => ({
		addProductPricingLevel: state.addProductPricingLevel,
	}));

	const handleAddNewPricingLevel = (
		e: React.MouseEvent<HTMLButtonElement, MouseEvent>
	) => {
		addProductPricingLevel(productId);
	};

	return (
		<button
			type="button"
			className="gwcp-add-new-product-level button"
			onClick={handleAddNewPricingLevel}
		>
			{__('Add New Pricing Level', 'gp-conditional-pricing')}
		</button>
	);
}