import React from 'react'
import Configuration from '../Configuration'
import Heading from './Heading'

const UpgradeTab = () => {
  const config = Configuration.getInstance()

  return (
    <div className="dreamfox-tab">
      <Heading text="Upgrade" />
      <div className="dreamfox-information__upgrade-box">
          <h3>WooCommerce Delivery Date Premium</h3>
          <p>This plugin has a Premium version with these features:</p>
          <ul className="dreamfox-information__list dreamfox-information__list--premium">
            <li>Holiday and blackout dates</li>
            <li>Working days only lead time</li>
            <li>Disable specific weekdays</li>
            <li>Custom checkout labels and required field options</li>
          </ul>
          <p className="dreamfox-information__cta-row">
            <a
              href={config.upgrade_url}
              className="button button-primary dreamfox-information__cta"
            >
              Upgrade to Premium
            </a>
            <a
              href={config.premium_features_url}
              className="dreamfox-information__link"
            >
              See all features and benefits
            </a>
          </p>
      </div>
    </div>
  )
}

export default UpgradeTab
