Move welcome emails to free plugin

[MAILPOET-1518]

assets/js/src/newsletters/listings/welcome.jsx

@@ -113,6 +113,28 @@ let newsletterActions = [
       );
     },
   },
+  {
+    name: 'duplicate',
+    label: MailPoet.I18n.t('duplicate'),
+    onClick: (newsletter, refresh) => MailPoet.Ajax.post({
+      api_version: window.mailpoet_api_version,
+      endpoint: 'newsletters',
+      action: 'duplicate',
+      data: {
+        id: newsletter.id,
+      },
+    }).done((response) => {
+      MailPoet.Notice.success((MailPoet.I18n.t('newsletterDuplicated')).replace('%$1s', response.data.subject));
+      refresh();
+    }).fail((response) => {
+      if (response.errors.length > 0) {
+        MailPoet.Notice.error(
+          response.errors.map(error => error.message),
+          { scroll: true }
+        );
+      }
+    }),
+  },
   {
     name: 'edit',
     link: function link(newsletter) {

assets/js/src/newsletters/newsletters.jsx

@@ -10,6 +10,7 @@ import NewsletterTemplates from 'newsletters/templates.jsx';
 import NewsletterSend from 'newsletters/send.jsx';
 import NewsletterTypeStandard from 'newsletters/types/standard.jsx';
 import NewsletterTypeNotification from 'newsletters/types/notification/notification.jsx';
+import NewsletterTypeWelcome from 'newsletters/types/welcome/welcome.jsx';
 import AutomaticEmailEventsList from 'newsletters/types/automatic_emails/events_list.jsx';
 import NewsletterListStandard from 'newsletters/listings/standard.jsx';
 import NewsletterListWelcome from 'newsletters/listings/welcome.jsx';
@@ -73,6 +74,10 @@ if (container) {
       path: 'new/notification',
       component: NewsletterTypeNotification,
     },
+    {
+      path: 'new/welcome',
+      component: NewsletterTypeWelcome,
+    },
     /* Template selection */
     {
       name: 'template',

assets/js/src/newsletters/types.jsx

@@ -67,6 +67,7 @@ const NewsletterTypes = React.createClass({
   render: function render() {
     const createStandardNewsletter = _.partial(this.createNewsletter, 'standard');
     const createNotificationNewsletter = _.partial(this.setupNewsletter, 'notification');
+    const createWelcomeNewsletter = _.partial(this.setupNewsletter, 'welcome');
     const defaultTypes = [
       {
         slug: 'standard',
@@ -93,11 +94,22 @@ const NewsletterTypes = React.createClass({
         videoGuide: 'https://beta.docs.mailpoet.com/article/254-video-guide-to-welcome-emails',
         action: (function action() {
           return (
-            <div>
-              <a href="?page=mailpoet-premium" target="_blank">
-                {MailPoet.I18n.t('premiumFeatureLink')}
-              </a>
-            </div>
+            <a
+              className="button button-primary"
+              onClick={createWelcomeNewsletter}
+              data-automation-id="create_welcome"
+              onKeyDown={(event) => {
+                if ((['keydown', 'keypress'].includes(event.type) && ['Enter', ' '].includes(event.key))
+                ) {
+                  event.preventDefault();
+                  createWelcomeNewsletter();
+                }
+              }}
+              role="button"
+              tabIndex={0}
+            >
+              {MailPoet.I18n.t('setUp')}
+            </a>
           );
         }()),
       },

assets/js/src/newsletters/types/welcome/welcome.jsx

@@ -0,0 +1,104 @@
+import React from 'react';
+import _ from 'underscore';
+import MailPoet from 'mailpoet';
+import PropTypes from 'prop-types';
+import Breadcrumb from '../../breadcrumb.jsx';
+import WelcomeScheduling from './scheduling.jsx';
+
+const field = {
+  name: 'options',
+  label: 'Event',
+  type: 'reactComponent',
+  component: WelcomeScheduling,
+};
+
+class NewsletterWelcome extends React.Component {
+  constructor(props) {
+    super(props);
+    let availableSegments = window.mailpoet_segments || [];
+    let defaultSegment = 1;
+    availableSegments = availableSegments.filter(segment => segment.type === 'default');
+
+    if (_.size(availableSegments) > 0) {
+      defaultSegment = _.first(availableSegments).id;
+    }
+
+    this.state = {
+      options: {
+        event: 'segment',
+        segment: defaultSegment,
+        role: 'subscriber',
+        afterTimeNumber: 1,
+        afterTimeType: 'immediate',
+      },
+    };
+
+    this.handleValueChange = this.handleValueChange.bind(this);
+    this.handleNext = this.handleNext.bind(this);
+  }
+
+  handleValueChange(event) {
+    const { state } = this;
+    state[event.target.name] = event.target.value;
+    this.setState(state);
+  }
+
+  handleNext() {
+    MailPoet.Ajax.post({
+      api_version: window.mailpoet_api_version,
+      endpoint: 'newsletters',
+      action: 'create',
+      data: _.extend({}, this.state, {
+        type: 'welcome',
+        subject: MailPoet.I18n.t('draftNewsletterTitle'),
+      }),
+    }).done((response) => {
+      this.showTemplateSelection(response.data.id);
+    }).fail((response) => {
+      if (response.errors.length > 0) {
+        MailPoet.Notice.error(
+          response.errors.map(error => error.message),
+          { scroll: true }
+        );
+      }
+    });
+  }
+
+  showTemplateSelection(newsletterId) {
+    this.props.router.push(`/template/${newsletterId}`);
+  }
+
+  render() {
+    return (
+      <div>
+        <h1>{MailPoet.I18n.t('welcomeNewsletterTypeTitle')}</h1>
+        <Breadcrumb step="type" />
+
+        <h3>{MailPoet.I18n.t('selectEventToSendWelcomeEmail')}</h3>
+
+        <WelcomeScheduling
+          item={this.state}
+          field={field}
+          onValueChange={this.handleValueChange}
+        />
+
+        <p className="submit">
+          <input
+            className="button button-primary"
+            type="button"
+            onClick={this.handleNext}
+            value={MailPoet.I18n.t('next')}
+          />
+        </p>
+      </div>
+    );
+  }
+}
+
+NewsletterWelcome.propTypes = {
+  router: PropTypes.shape({
+    push: PropTypes.func.isRequired,
+  }).isRequired,
+};
+
+export default NewsletterWelcome;

webpack.config.js

@@ -165,13 +165,6 @@ var baseConfig = {
           'babel-loader',
         ]
       },
-      {
-        include: path.resolve(__dirname, 'assets/js/src/newsletters/types/welcome/scheduling.jsx'),
-        use: [
-          'expose-loader?' + globalPrefix + '.NewsletterWelcomeNotificationScheduling',
-          'babel-loader',
-        ]
-      },
       {
         include: path.resolve(__dirname, 'assets/js/src/newsletters/breadcrumb.jsx'),
         use: [