diff --git a/assets/js/src/newsletters/types/re_engagement/re_engagement.tsx b/assets/js/src/newsletters/types/re_engagement/re_engagement.tsx
index 801b1bbb58..e3b687e16b 100644
--- a/assets/js/src/newsletters/types/re_engagement/re_engagement.tsx
+++ b/assets/js/src/newsletters/types/re_engagement/re_engagement.tsx
@@ -1,12 +1,15 @@
import React, { useState } from 'react';
import { __, assoc, compose } from 'lodash/fp';
+import { useHistory } from 'react-router-dom';
import MailPoet from 'mailpoet';
import Background from 'common/background/background';
import { Grid } from 'common/grid';
import Button from 'common/button/button';
-import ListingHeadingStepsRoute from '../../listings/heading_steps_route';
+import APIErrorsNotice from 'notices/api_errors_notice';
+
import { Scheduling } from './scheduling';
+import ListingHeadingStepsRoute from '../../listings/heading_steps_route';
interface ReengagementWindow extends Window {
settings: {
@@ -23,10 +26,39 @@ export function NewsletterTypeReEngagement(): JSX.Element {
).toString(),
afterTimeType: 'months',
});
+ const [errors, setErrors] = useState([]);
+ const history = useHistory();
+
+ function showTemplateSelection(newsletterId: string) {
+ history.push(`/template/${newsletterId}`);
+ }
+
+ function handleNext() {
+ setErrors([]);
+ MailPoet.Ajax.post({
+ api_version: MailPoet.apiVersion,
+ endpoint: 'newsletters',
+ action: 'create',
+ data: {
+ type: 're_engagement',
+ subject: MailPoet.I18n.t('draftNewsletterTitle'),
+ options,
+ },
+ }).done((response) => {
+ showTemplateSelection(response.data.id);
+ }).fail((response) => {
+ if (response.errors) {
+ setErrors(response.errors);
+ }
+ });
+ }
+
return (
+ {errors && (
)}
+
@@ -42,7 +74,7 @@ export function NewsletterTypeReEngagement(): JSX.Element {