Release 4.0.0

With HTTPS and "$oneClickUnsubscribeUrl = false", we were sending "false" instead of an actual URL.

[MAILPOET-4813]

.circleci/config.yml

@@ -179,10 +179,10 @@ jobs:
       - run:
           name: Download additional WP Plugins for tests
           command: |
-            ./do download:woo-commerce-zip 6.8.2
+            ./do download:woo-commerce-zip 7.0.1
-            ./do download:woo-commerce-subscriptions-zip 4.5.1
+            ./do download:woo-commerce-subscriptions-zip 4.6.0
-            ./do download:woo-commerce-memberships-zip 1.23.0
+            ./do download:woo-commerce-memberships-zip 1.23.1
-            ./do download:woo-commerce-blocks-zip 8.4.0
+            ./do download:woo-commerce-blocks-zip 8.8.2
       - run:
           name: Dump tests ENV variables for acceptance tests
           command: |
@@ -749,6 +749,12 @@ workflows:
             - js_tests
             - integration_test_woocommerce
             - integration_test_base
+            - integration_test_woo_cot_no_sync
+            - integration_test_woo_cot_off
+            - integration_test_woo_cot_sync
+            - acceptance_tests_woo_cot_sync
+            - acceptance_tests_woo_cot_off
+            - acceptance_tests_woo_cot_no_sync
 
   nightly:
     triggers:
@@ -773,14 +779,14 @@ workflows:
       - acceptance_tests:
           <<: *slack-fail-post-step
           name: acceptance_oldest
-          woo_core_version: 6.2.2
+          woo_core_version: 6.8.0
           woo_subscriptions_version: 4.3.0
           woo_memberships_version: 1.21.0
-          woo_blocks_version: 5.3.2
+          woo_blocks_version: 6.8.0
           mysql_command: --max_allowed_packet=100M
           mysql_image_version: 5.7.36
-          codeception_image_version: 7.4-cli_20210126.1
+          codeception_image_version: 7.4-cli_20220605.0
-          wordpress_image_version: wp-5.6_php7.2_20220406.1
+          wordpress_image_version: wp-5.8_php7.3_20221104.1
           requires:
             - build
       - unit_tests:

mailpoet/assets/css/src/components-automation-editor/_add-trigger.scss

@@ -1,4 +1,4 @@
-.mailpoet-automation-workflow-add-trigger {
+.mailpoet-automation-add-trigger {
   align-items: center;
   border: 1px dashed #c3c4c7;
   border-radius: 4px;

mailpoet/assets/css/src/components-automation-editor/_automation.scss

@@ -1,14 +1,14 @@
-.mailpoet-automation-editor-workflow {
+.mailpoet-automation-editor-automation {
   background: #fbfbfb;
   flex-grow: 1;
 }
 
-.mailpoet-automation-editor-workflow-wrapper {
+.mailpoet-automation-editor-automation-wrapper {
   display: grid;
   padding: 50px 20px;
 }
 
-.mailpoet-automation-editor-workflow-end {
+.mailpoet-automation-editor-automation-end {
   background: #8c8f94;
   border-radius: 999999px;
   fill: white;

mailpoet/assets/css/src/components-automation-editor/_empty-automation.scss

@@ -1,4 +1,4 @@
-.mailpoet-automation-editor-empty-workflow {
+.mailpoet-automation-editor-empty-automation {
   align-items: center;
   display: grid;
   height: 100%;

mailpoet/assets/css/src/components-plugin/_stats.scss

@@ -119,6 +119,10 @@
   color: $color-stats-average;
 }
 
+.mailpoet-statistics-value-number-critical {
+  color: $color-stats-critical;
+}
+
 .mailpoet-statistics-value-number-excellent {
   color: $color-stats-excellent;
 }

mailpoet/assets/css/src/components/_tags.scss

@@ -41,6 +41,15 @@
   }
 }
 
+.mailpoet-tag-critical {
+  border-color: $color-stats-critical;
+  color: $color-stats-critical;
+
+  &.mailpoet-tag-inverted {
+    background: $color-stats-critical;
+  }
+}
+
 .mailpoet-tag-good {
   border-color: $color-stats-good;
   color: $color-stats-good;

mailpoet/assets/css/src/mailpoet-automation-editor.scss

@@ -11,17 +11,17 @@
 
 @import './components-automation-editor/add-step-button';
 @import './components-automation-editor/add-trigger';
+@import './components-automation-editor/automation';
 @import './components-automation-editor/block-icon';
 @import './components-automation-editor/chip';
 @import './components-automation-editor/dropdown';
-@import './components-automation-editor/empty-workflow';
+@import './components-automation-editor/empty-automation';
 @import './components-automation-editor/errors';
 @import './components-automation-editor/panel';
 @import './components-automation-editor/separator';
 @import './components-automation-editor/status';
 @import './components-automation-editor/step';
 @import './components-automation-editor/step-card';
-@import './components-automation-editor/workflow';
 @import './components-automation-editor/notices';
 @import './components-automation-editor/deactivate-modal';
 

mailpoet/assets/css/src/mailpoet-automation-templates.scss

@@ -17,17 +17,30 @@ ul.mailpoet-automation-templates {
 
 .mailpoet-automation-template-list-item {
   button.components-button {
+    align-content: baseline;
+    align-items: flex-start;
     background: #fff;
     border: 1px solid #dcdcde;
     border-radius: 4px;
     cursor: pointer;
-    display: flex;
+    display: grid;
-    flex-direction: column;
+    grid-template-rows: 40px auto auto;
     height: 100%;
     padding: 24px 24px 26px;
     text-align: left;
     width: 100%;
 
+    &:disabled,
+    &[aria-disabled='true'] {
+      color: #787c82;
+      cursor: not-allowed;
+      opacity: 1;
+
+      h2 {
+        color: #787c82;
+      }
+    }
+
     &:hover {
       background: #fff;
       border: 1px solid #dcdcde;
@@ -49,7 +62,6 @@ ul.mailpoet-automation-templates {
   h2 {
     background: transparent;
     border: none;
-    color: #2271b1;
     font-size: 14px;
     font-weight: 600;
     line-height: 21px;
@@ -78,4 +90,27 @@ ul.mailpoet-automation-templates {
       fill: #dcdcde;
     }
   }
+
+  .badge {
+    text-align: right;
+    transform: translateX(24px);
+
+    span {
+      padding: 3px 8px;
+    }
+  }
+}
+
+.mailpoet-automation-template-list-item-coming-soon {
+  .badge span {
+    background: #ffe9cc;
+    color: #1d2327;
+  }
+}
+
+.mailpoet-automation-template-list-item-premium {
+  .badge span {
+    background: #ff5301;
+    color: #fff;
+  }
 }

mailpoet/assets/css/src/settings/_colors.scss

@@ -69,6 +69,7 @@ $color-badge-video-guide: #46b450;
 $color-stats-average: #f559c3;
 $color-stats-good: #ff9f00;
 $color-stats-excellent: #7ed321;
+$color-stats-critical: #f00;
 $color-stats-unknown: $color-primary-inactive;
 
 // Automation editor

mailpoet/assets/js/src/automation/api/hooks.ts

@@ -1,81 +0,0 @@
-import { useCallback, useEffect, useState } from 'react';
-import { api } from '../config';
-
-const API_URL = `${api.root}/mailpoet/v1/automation`;
-
-export const request = (
-  path: string,
-  init?: RequestInit,
-): ReturnType<typeof fetch> => fetch(`${API_URL}/${path}`, init);
-
-type Error<T> = {
-  response?: Response;
-  data?: T;
-};
-
-type State<T> = {
-  data?: T;
-  loading: boolean;
-  error?: Error<T>;
-};
-
-type Result<T> = [(init?: RequestInit) => Promise<void>, State<T>];
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-type Data = Record<string, any>;
-
-export const useMutation = <T extends Data>(
-  path: string,
-  config?: RequestInit,
-): Result<T> => {
-  const [state, setState] = useState<State<T>>({
-    data: undefined,
-    loading: false,
-    error: undefined,
-  });
-
-  const mutation = useCallback(
-    async (init?: RequestInit) => {
-      setState((prevState) => ({ ...prevState, loading: true }));
-      const response = await request(path, {
-        ...config,
-        ...init,
-        headers: {
-          'content-type': 'application/json',
-          ...(init?.headers ?? {}),
-          'x-wp-nonce': api.nonce,
-        },
-      });
-
-      try {
-        const data = await response.json();
-        const error = response.ok ? null : { ...response, data };
-        setState((prevState) => ({ ...prevState, data, error }));
-      } catch (_) {
-        const error = { response };
-        setState((prevState) => ({ ...prevState, error }));
-      } finally {
-        setState((prevState) => ({ ...prevState, loading: false }));
-      }
-    },
-    [config, path],
-  );
-
-  return [mutation, state];
-};
-
-export const useQuery = <T extends Data>(
-  path: string,
-  init?: RequestInit,
-): State<T> => {
-  const [mutation, result] = useMutation<T>(path, init);
-
-  useEffect(
-    () => {
-      void mutation();
-    },
-    [] /* eslint-disable-line react-hooks/exhaustive-deps -- request only on initial load */,
-  );
-
-  return result;
-};

mailpoet/assets/js/src/automation/api/index.ts

@@ -1,9 +1,7 @@
 import apiFetch from '@wordpress/api-fetch';
 import { api } from '../config';
 
-export * from './hooks';
+const apiUrl = `${api.root}/mailpoet/v1/`;
-
-const apiUrl = `${api.root}/mailpoet/v1/automation/`;
 
 export type ApiError = {
   code?: string;

mailpoet/assets/js/src/automation/automation.tsx

@@ -1,24 +1,33 @@
-import { useEffect } from 'react';
+import { useEffect, useState } from 'react';
 import ReactDOM from 'react-dom';
 import { BrowserRouter } from 'react-router-dom';
 import { TopBarWithBeamer } from 'common/top_bar/top_bar';
 import { Popover, SlotFillProvider } from '@wordpress/components';
 import { useSelect } from '@wordpress/data';
-import { initializeApi, useMutation } from './api';
+import { initializeApi } from './api';
 import { registerTranslations } from './i18n';
 import { createStore, storeName } from './listing/store';
 import { AutomationListing, AutomationListingHeader } from './listing';
 import { registerApiErrorHandler } from './listing/api-error-handler';
 import { Notices } from './listing/components/notices';
-import { WorkflowListingNotices } from './listing/workflow-listing-notices';
 import { BuildYourOwnSection, HeroSection, TemplatesSection } from './sections';
-import {
+import { MailPoet } from '../mailpoet';
-  CreateEmptyWorkflowButton,
+
-  CreateWorkflowFromTemplateButton,
+const trackOpenEvent = () => {
-} from './testing';
+  MailPoet.trackEvent('Automations > Listing viewed');
+};
 
 function Content(): JSX.Element {
-  const count = useSelect((select) => select(storeName).getWorkflowCount());
+  const [isBooting, setIsBooting] = useState(true);
+  const count = useSelect((select) => select(storeName).getAutomationCount());
+
+  useEffect(() => {
+    if (!isBooting || count === 0) {
+      return;
+    }
+    trackOpenEvent();
+    setIsBooting(false);
+  }, [isBooting, count]);
   const content =
     count > 0 ? (
       <>
@@ -49,7 +58,7 @@ function Content(): JSX.Element {
   );
 }
 
-function Workflows(): JSX.Element {
+function Automations(): JSX.Element {
   return (
     <>
       <TopBarWithBeamer />
@@ -59,79 +68,12 @@ function Workflows(): JSX.Element {
   );
 }
 
-function RecreateSchemaButton(): JSX.Element {
-  const [createSchema, { loading, error }] = useMutation('system/database', {
-    method: 'POST',
-  });
-
-  return (
-    <div>
-      <WorkflowListingNotices />
-      <button
-        className="button button-link-delete"
-        type="button"
-        onClick={() => createSchema()}
-        disabled={loading}
-      >
-        Recreate DB schema (data will be lost)
-      </button>
-      {error && (
-        <div>{error?.data?.message ?? 'An unknown error occurred'}</div>
-      )}
-    </div>
-  );
-}
-
-function DeleteSchemaButton(): JSX.Element {
-  const [deleteSchema, { loading, error }] = useMutation('system/database', {
-    method: 'DELETE',
-  });
-
-  return (
-    <div>
-      <button
-        className="button button-link-delete"
-        type="button"
-        onClick={async () => {
-          await deleteSchema();
-          window.location.href =
-            '/wp-admin/admin.php?page=mailpoet-experimental';
-        }}
-        disabled={loading}
-      >
-        Delete DB schema & deactivate feature
-      </button>
-      {error && (
-        <div>{error?.data?.message ?? 'An unknown error occurred'}</div>
-      )}
-    </div>
-  );
-}
-
 function App(): JSX.Element {
   return (
     <SlotFillProvider>
       <BrowserRouter>
-        <div>
+        <Automations />
-          <Workflows />
+        <Popover.Slot />
-          <div style={{ marginTop: 30, display: 'grid', gridGap: 8 }}>
-            <CreateEmptyWorkflowButton />
-            <CreateWorkflowFromTemplateButton slug="simple-welcome-email">
-              Create testing workflow from template (welcome email)
-            </CreateWorkflowFromTemplateButton>
-            <CreateWorkflowFromTemplateButton slug="welcome-email-sequence">
-              Create testing workflow from template (welcome sequence, only
-              premium)
-            </CreateWorkflowFromTemplateButton>
-            <CreateWorkflowFromTemplateButton slug="advanced-welcome-email-sequence">
-              Create testing workflow from template (advanced welcome sequence,
-              only premium)
-            </CreateWorkflowFromTemplateButton>
-            <RecreateSchemaButton />
-            <DeleteSchemaButton />
-          </div>
-          <Popover.Slot />
-        </div>
       </BrowserRouter>
     </SlotFillProvider>
   );

mailpoet/assets/js/src/automation/config.ts

@@ -4,9 +4,9 @@ declare global {
       root: string;
       nonce: string;
     };
-    mailpoet_workflow_count: number;
+    mailpoet_automation_count: number;
   }
 }
 
 export const api = window.mailpoet_automation_api;
-export const workflowCount = window.mailpoet_workflow_count;
+export const automationCount = window.mailpoet_automation_count;

mailpoet/assets/js/src/automation/editor/api-error-handler.tsx

@@ -19,7 +19,7 @@ export const registerApiErrorHandler = (): void =>
         const status = errorObject.data?.status;
         const code = errorObject.code;
 
-        if (code === 'mailpoet_automation_workflow_not_valid') {
+        if (code === 'mailpoet_automation_not_valid') {
           dispatch(storeName).setErrors({ steps: errorObject.data.errors });
           return undefined;
         }

mailpoet/assets/js/src/automation/editor/components/actions/trash-button.tsx

@@ -9,9 +9,9 @@ import { storeName } from '../../store';
 
 export function TrashButton(): JSX.Element {
   const [showConfirmDialog, setShowConfirmDialog] = useState(false);
-  const { workflow } = useSelect(
+  const { automation } = useSelect(
     (select) => ({
-      workflow: select(storeName).getWorkflowData(),
+      automation: select(storeName).getAutomationData(),
     }),
     [],
   );
@@ -33,7 +33,7 @@ export function TrashButton(): JSX.Element {
       >
         {sprintf(
           __('You are about to delete the automation "%s".', 'mailpoet'),
-          workflow.name,
+          automation.name,
         )}
         <br />
         {__(' This will stop it for all subscribers immediately.', 'mailpoet')}

mailpoet/assets/js/src/automation/editor/components/automation/add-step-button.tsx

@@ -1,7 +1,7 @@
 import { useContext } from 'react';
 import { __unstableCompositeItem as CompositeItem } from '@wordpress/components';
 import { Icon, plus } from '@wordpress/icons';
-import { WorkflowCompositeContext } from './context';
+import { AutomationCompositeContext } from './context';
 
 type Props = {
   onClick?: (element: HTMLButtonElement) => void;
@@ -9,7 +9,7 @@ type Props = {
 };
 
 export function AddStepButton({ onClick, previousStepId }: Props): JSX.Element {
-  const compositeState = useContext(WorkflowCompositeContext);
+  const compositeState = useContext(AutomationCompositeContext);
   return (
     <CompositeItem
       state={compositeState}

mailpoet/assets/js/src/automation/editor/components/automation/add-trigger.tsx

@@ -3,7 +3,7 @@ import { __unstableCompositeItem as CompositeItem } from '@wordpress/components'
 import { Icon, plus } from '@wordpress/icons';
 import { __ } from '@wordpress/i18n';
 import { useDispatch } from '@wordpress/data';
-import { WorkflowCompositeContext } from './context';
+import { AutomationCompositeContext } from './context';
 import { Step } from './types';
 import { storeName } from '../../store';
 
@@ -12,14 +12,14 @@ type Props = {
 };
 
 export function AddTrigger({ step }: Props): JSX.Element {
-  const compositeState = useContext(WorkflowCompositeContext);
+  const compositeState = useContext(AutomationCompositeContext);
   const { setInserterPopover } = useDispatch(storeName);
 
   return (
     <CompositeItem
       state={compositeState}
       role="treeitem"
-      className="mailpoet-automation-workflow-add-trigger"
+      className="mailpoet-automation-add-trigger"
       data-previous-step-id={step.id}
       focusable
       onClick={(event) => {

mailpoet/assets/js/src/automation/editor/components/automation/context.tsx

@@ -1,5 +1,5 @@
 import { __unstableUseCompositeState as useCompositeState } from '@wordpress/components';
 import { createContext } from '@wordpress/element';
 
-export const WorkflowCompositeContext =
+export const AutomationCompositeContext =
   createContext<ReturnType<typeof useCompositeState>>(undefined);

mailpoet/assets/js/src/automation/editor/components/automation/empty-automation.tsx

@@ -0,0 +1,9 @@
+import { __ } from '@wordpress/i18n';
+
+export function EmptyAutomation(): JSX.Element {
+  return (
+    <div className="mailpoet-automation-editor-empty-automation">
+      {__('No automation data.', 'mailpoet')}
+    </div>
+  );
+}

mailpoet/assets/js/src/automation/editor/components/automation/index.tsx

@@ -7,8 +7,8 @@ import { useSelect } from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
 import { Icon, check } from '@wordpress/icons';
 import { Hooks } from 'wp-js-hooks';
-import { WorkflowCompositeContext } from './context';
+import { AutomationCompositeContext } from './context';
-import { EmptyWorkflow } from './empty-workflow';
+import { EmptyAutomation } from './empty-automation';
 import { Separator } from './separator';
 import { Step } from './step';
 import { Step as StepData } from './types';
@@ -21,10 +21,10 @@ import {
   RenderStepType,
 } from '../../../types/filters';
 
-export function Workflow(): JSX.Element {
+export function Automation(): JSX.Element {
-  const { workflowData, selectedStep } = useSelect(
+  const { automationData, selectedStep } = useSelect(
     (select) => ({
-      workflowData: select(storeName).getWorkflowData(),
+      automationData: select(storeName).getAutomationData(),
       selectedStep: select(storeName).getSelectedStep(),
     }),
     [],
@@ -36,9 +36,9 @@ export function Workflow(): JSX.Element {
     shift: true,
   });
 
-  const stepMap = workflowData?.steps ?? undefined;
+  const stepMap = automationData?.steps ?? undefined;
 
-  // serialize steps (for now, we support only one trigger and linear workflows)
+  // serialize steps (for now, we support only one trigger and linear automations)
   const steps = useMemo(() => {
     const stepArray = [stepMap.root];
 
@@ -56,7 +56,7 @@ export function Workflow(): JSX.Element {
   const renderStep = useMemo(
     (): RenderStepType =>
       Hooks.applyFilters(
-        'mailpoet.automation.workflow.render_step',
+        'mailpoet.automation.render_step',
         (stepData: StepData) =>
           stepData.type === 'root' ? (
             <AddTrigger step={stepData} />
@@ -73,7 +73,7 @@ export function Workflow(): JSX.Element {
   const renderSeparator = useMemo(
     (): RenderStepSeparatorType =>
       Hooks.applyFilters(
-        'mailpoet.automation.workflow.render_step_separator',
+        'mailpoet.automation.render_step_separator',
         (previousStepData: StepData) => (
           <Separator previousStepId={previousStepData.id} />
         ),
@@ -81,20 +81,20 @@ export function Workflow(): JSX.Element {
     [],
   );
 
-  if (!workflowData) {
+  if (!automationData) {
-    return <EmptyWorkflow />;
+    return <EmptyAutomation />;
   }
 
   return (
-    <WorkflowCompositeContext.Provider value={compositeState}>
+    <AutomationCompositeContext.Provider value={compositeState}>
       <Composite
         state={compositeState}
         role="tree"
         aria-label={__('Automation', 'mailpoet')}
         aria-orientation="vertical"
-        className="mailpoet-automation-editor-workflow"
+        className="mailpoet-automation-editor-automation"
       >
-        <div className="mailpoet-automation-editor-workflow-wrapper">
+        <div className="mailpoet-automation-editor-automation-wrapper">
           <Statistics />
           {stepMap.root.next_steps.length === 0 ? (
             <>
@@ -119,13 +119,13 @@ export function Workflow(): JSX.Element {
             </Fragment>
           ))}
           <Icon
-            className="mailpoet-automation-editor-workflow-end"
+            className="mailpoet-automation-editor-automation-end"
             icon={check}
           />
           <div />
         </div>
         <InserterPopover />
       </Composite>
-    </WorkflowCompositeContext.Provider>
+    </AutomationCompositeContext.Provider>
   );
 }

mailpoet/assets/js/src/automation/editor/components/automation/statistics.tsx

@@ -4,9 +4,9 @@ import { storeName } from '../../store';
 import { Statistics as BaseStatistics } from '../../../components/statistics';
 
 export function Statistics(): JSX.Element {
-  const { workflow } = useSelect(
+  const { automation } = useSelect(
     (select) => ({
-      workflow: select(storeName).getWorkflowData(),
+      automation: select(storeName).getAutomationData(),
     }),
     [],
   );
@@ -19,19 +19,19 @@ export function Statistics(): JSX.Element {
             key: 'entered',
             // translators: Total number of subscribers who entered an automation
             label: _x('Total Entered', 'automation stats', 'mailpoet'),
-            value: workflow.stats.totals.entered,
+            value: automation.stats.totals.entered,
           },
           {
             key: 'processing',
             // translators: Total number of subscribers who are being processed in an automation
             label: _x('Total Processing', 'automation stats', 'mailpoet'),
-            value: workflow.stats.totals.in_progress,
+            value: automation.stats.totals.in_progress,
           },
           {
             key: 'exited',
             // translators: Total number of subscribers who exited an automation, no matter the result
             label: _x('Total Exited', 'automation stats', 'mailpoet'),
-            value: workflow.stats.totals.exited,
+            value: automation.stats.totals.exited,
           },
         ]}
       />

mailpoet/assets/js/src/automation/editor/components/automation/step-more-menu.tsx

@@ -23,7 +23,7 @@ export function StepMoreMenu({ step }: Props): JSX.Element {
   const [showModal, setShowModal] = useState(false);
 
   const moreControls: StepMoreControlsType = Hooks.applyFilters(
-    'mailpoet.automation.workflow.step.more-controls',
+    'mailpoet.automation.step.more-controls',
     {
       delete: {
         key: 'delete',

mailpoet/assets/js/src/automation/editor/components/automation/step.tsx

@@ -4,7 +4,7 @@ import { __unstableCompositeItem as CompositeItem } from '@wordpress/components'
 import { useDispatch, useRegistry, useSelect } from '@wordpress/data';
 import { blockMeta } from '@wordpress/icons';
 import { __, _x } from '@wordpress/i18n';
-import { WorkflowCompositeContext } from './context';
+import { AutomationCompositeContext } from './context';
 import { StepMoreMenu } from './step-more-menu';
 import { Step as StepData } from './types';
 import { Chip } from '../chip';
@@ -48,7 +48,7 @@ export function Step({ step, isSelected }: Props): JSX.Element {
     [step],
   );
   const { openSidebar, selectStep } = useDispatch(storeName);
-  const compositeState = useContext(WorkflowCompositeContext);
+  const compositeState = useContext(AutomationCompositeContext);
   const { batch } = useRegistry();
 
   const compositeItemId = `step-${step.id}`;

mailpoet/assets/js/src/automation/editor/components/automation/types.ts

@@ -1,4 +1,4 @@
-import { WorkflowStatus } from '../../../listing/workflow';
+import { AutomationStatus } from '../../../listing/automation';
 
 export type NextStep = {
   id: string;
@@ -12,10 +12,10 @@ export type Step = {
   next_steps: NextStep[];
 };
 
-export type Workflow = {
+export type Automation = {
   id: number;
   name: string;
-  status: WorkflowStatus;
+  status: AutomationStatus;
   created_at: string;
   updated_at: string;
   activated_at: string;

mailpoet/assets/js/src/automation/editor/components/header/document_actions.tsx

@@ -10,7 +10,7 @@ import { useRef } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
 import { chevronDown } from '@wordpress/icons';
 import { storeName } from '../../store';
-import { WorkflowStatus } from '../../../listing/workflow';
+import { AutomationStatus } from '../../../listing/automation';
 
 // See: https://github.com/WordPress/gutenberg/blob/eff0cab2b3181c004dbd15398e570ecec28a3726/packages/edit-site/src/components/header/document-actions/index.js
 
@@ -22,10 +22,10 @@ const Dropdown: ComponentType<
 > = WpDropdown;
 
 export function DocumentActions({ children }): JSX.Element {
-  const { workflowName, workflowStatus, showIconLabels } = useSelect(
+  const { automationName, automationStatus, showIconLabels } = useSelect(
     (select) => ({
-      workflowName: select(storeName).getWorkflowData().name,
+      automationName: select(storeName).getAutomationData().name,
-      workflowStatus: select(storeName).getWorkflowData().status,
+      automationStatus: select(storeName).getAutomationData().status,
       showIconLabels: select(storeName).isFeatureActive('showIconLabels'),
     }),
     [],
@@ -36,9 +36,9 @@ export function DocumentActions({ children }): JSX.Element {
   const titleRef = useRef();
 
   let chipClass = 'mailpoet-automation-editor-chip-gray';
-  if (workflowStatus === WorkflowStatus.ACTIVE) {
+  if (automationStatus === AutomationStatus.ACTIVE) {
     chipClass = 'mailpoet-automation-editor-chip-success';
-  } else if (workflowStatus === WorkflowStatus.DEACTIVATING) {
+  } else if (automationStatus === AutomationStatus.DEACTIVATING) {
     chipClass = 'mailpoet-automation-editor-chip-danger';
   }
 
@@ -66,18 +66,18 @@ export function DocumentActions({ children }): JSX.Element {
                     <VisuallyHidden as="span">
                       {__('Editing automation:', 'mailpoet')}
                     </VisuallyHidden>
-                    {workflowName}
+                    {automationName}
                   </Text>
 
                   <Text
                     size="body"
                     className={`edit-site-document-actions__secondary-item ${chipClass}`}
                   >
-                    {workflowStatus === WorkflowStatus.ACTIVE &&
+                    {automationStatus === AutomationStatus.ACTIVE &&
                       __('Active', 'mailpoet')}
-                    {workflowStatus === WorkflowStatus.DEACTIVATING &&
+                    {automationStatus === AutomationStatus.DEACTIVATING &&
                       __('Deactivating', 'mailpoet')}
-                    {workflowStatus === WorkflowStatus.DRAFT &&
+                    {automationStatus === AutomationStatus.DRAFT &&
                       __('Draft', 'mailpoet')}
                   </Text>
                 </a>

mailpoet/assets/js/src/automation/editor/components/header/errors.tsx

@@ -35,17 +35,17 @@ type StepErrorProps = {
 function StepError({ stepId }: StepErrorProps): JSX.Element {
   const compositeState = useContext(ErrorsCompositeContext);
 
-  const { steps, workflowData } = useSelect(
+  const { steps, automationData } = useSelect(
     (select) => ({
       steps: select(storeName).getSteps(),
-      workflowData: select(storeName).getWorkflowData(),
+      automationData: select(storeName).getAutomationData(),
     }),
     [],
   );
 
   const { openSidebar, selectStep } = useDispatch(storeName);
 
-  const stepData = workflowData.steps[stepId];
+  const stepData = automationData.steps[stepId];
   const step = steps.find(({ key }) => key === stepData.key);
 
   return (
@@ -78,10 +78,10 @@ export function Errors(): JSX.Element | null {
     shift: true,
   });
 
-  const { errors, workflowData } = useSelect(
+  const { errors, automationData } = useSelect(
     (select) => ({
       errors: select(storeName).getErrors(),
-      workflowData: select(storeName).getWorkflowData(),
+      automationData: select(storeName).getAutomationData(),
     }),
     [],
   );
@@ -93,18 +93,18 @@ export function Errors(): JSX.Element | null {
     }
 
     const visited = new Map<string, StepErrorType | undefined>();
-    const ids = workflowData.steps.root.next_steps.map(({ id }) => id);
+    const ids = automationData.steps.root.next_steps.map(({ id }) => id);
     while (ids.length > 0) {
       const id = ids.shift();
       if (!visited.has(id)) {
         visited.set(id, errors.steps[id]);
-        workflowData.steps[id]?.next_steps?.forEach((step) =>
+        automationData.steps[id]?.next_steps?.forEach((step) =>
           ids.push(step.id),
         );
       }
     }
     return [...visited.values()].filter((error) => !!error);
-  }, [errors, workflowData]);
+  }, [errors, automationData]);
 
   // automatically open the popover when errors appear
   const hasErrors = stepErrors.length > 0;

mailpoet/assets/js/src/automation/editor/components/header/index.tsx

@@ -13,7 +13,7 @@ import { Errors } from './errors';
 import { InserterToggle } from './inserter_toggle';
 import { MoreMenu } from './more_menu';
 import { storeName } from '../../store';
-import { WorkflowStatus } from '../../../listing/workflow';
+import { AutomationStatus } from '../../../listing/automation';
 import {
   DeactivateImmediatelyModal,
   DeactivateModal,
@@ -23,22 +23,23 @@ import {
 //   https://github.com/WordPress/gutenberg/blob/9601a33e30ba41bac98579c8d822af63dd961488/packages/edit-post/src/components/header/index.js
 //   https://github.com/WordPress/gutenberg/blob/0ee78b1bbe9c6f3e6df99f3b967132fa12bef77d/packages/edit-site/src/components/header/index.js
 
-function ActivateButton({ onClick, label }): JSX.Element {
+function ActivateButton({ label }): JSX.Element {
   const { errors, isDeactivating } = useSelect(
     (select) => ({
       errors: select(storeName).getErrors(),
       isDeactivating:
-        select(storeName).getWorkflowData().status ===
+        select(storeName).getAutomationData().status ===
-        WorkflowStatus.DEACTIVATING,
+        AutomationStatus.DEACTIVATING,
     }),
     [],
   );
+  const { openActivationPanel } = useDispatch(storeName);
 
   const button = (
     <Button
       variant="primary"
       className="editor-post-publish-button"
-      onClick={onClick}
+      onClick={openActivationPanel}
       disabled={isDeactivating || !!errors}
     >
       {label}
@@ -53,7 +54,7 @@ function ActivateButton({ onClick, label }): JSX.Element {
         // The following error seems to be a mismatch. It claims the 'delay' prop does not exist, but it does.
         delay={0}
         text={__(
-          'Editing an active workflow is temporarily unavailable. We are working on introducing this functionality.',
+          'Editing an active automation is temporarily unavailable. We are working on introducing this functionality.',
           'mailpoet',
         )}
       >
@@ -68,14 +69,14 @@ function ActivateButton({ onClick, label }): JSX.Element {
 function UpdateButton(): JSX.Element {
   const { save } = useDispatch(storeName);
 
-  const { workflow } = useSelect(
+  const { automation } = useSelect(
     (select) => ({
-      workflow: select(storeName).getWorkflowData(),
+      automation: select(storeName).getAutomationData(),
     }),
     [],
   );
 
-  if (workflow.stats.totals.in_progress === 0) {
+  if (automation.stats.totals.in_progress === 0) {
     return (
       <Button
         variant="primary"
@@ -93,7 +94,7 @@ function UpdateButton(): JSX.Element {
       // The following error seems to be a mismatch. It claims the 'delay' prop does not exist, but it does.
       delay={0}
       text={__(
-        'Editing an active workflow is temporarily unavailable. We are working on introducing this functionality.',
+        'Editing an active automation is temporarily unavailable. We are working on introducing this functionality.',
         'mailpoet',
       )}
     >
@@ -125,7 +126,7 @@ function DeactivateButton(): JSX.Element {
   const { hasUsersInProgress } = useSelect(
     (select) => ({
       hasUsersInProgress:
-        select(storeName).getWorkflowData().stats.totals.in_progress > 0,
+        select(storeName).getAutomationData().stats.totals.in_progress > 0,
     }),
     [],
   );
@@ -165,7 +166,7 @@ function DeactivateNowButton(): JSX.Element {
   const { hasUsersInProgress } = useSelect(
     (select) => ({
       hasUsersInProgress:
-        select(storeName).getWorkflowData().stats.totals.in_progress > 0,
+        select(storeName).getAutomationData().stats.totals.in_progress > 0,
     }),
     [],
   );
@@ -201,18 +202,14 @@ function DeactivateNowButton(): JSX.Element {
 
 type Props = {
   showInserterToggle: boolean;
-  toggleActivatePanel: () => void;
 };
 
-export function Header({
+export function Header({ showInserterToggle }: Props): JSX.Element {
-  showInserterToggle,
+  const { setAutomationName } = useDispatch(storeName);
-  toggleActivatePanel,
+  const { automationName, automationStatus } = useSelect(
-}: Props): JSX.Element {
-  const { setWorkflowName } = useDispatch(storeName);
-  const { workflowName, workflowStatus } = useSelect(
     (select) => ({
-      workflowName: select(storeName).getWorkflowData().name,
+      automationName: select(storeName).getAutomationData().name,
-      workflowStatus: select(storeName).getWorkflowData().status,
+      automationStatus: select(storeName).getAutomationData().status,
     }),
     [],
   );
@@ -237,8 +234,8 @@ export function Header({
                 {__('Automation name', 'mailpoet')}
               </div>
               <TextControl
-                value={workflowName}
+                value={automationName}
-                onChange={(newName) => setWorkflowName(newName)}
+                onChange={(newName) => setAutomationName(newName)}
                 help={__(
                   `Give the automation a name that indicates its purpose. E.g. "Abandoned cart recovery"`,
                   'mailpoet',
@@ -252,28 +249,22 @@ export function Header({
       <div className="edit-site-header_end">
         <div className="edit-site-header__actions">
           <Errors />
-          {workflowStatus === WorkflowStatus.DRAFT && (
+          {automationStatus === AutomationStatus.DRAFT && (
             <>
               <SaveDraftButton />
-              <ActivateButton
+              <ActivateButton label={__('Activate', 'mailpoet')} />
-                onClick={toggleActivatePanel}
-                label={__('Activate', 'mailpoet')}
-              />
             </>
           )}
-          {workflowStatus === WorkflowStatus.ACTIVE && (
+          {automationStatus === AutomationStatus.ACTIVE && (
             <>
               <DeactivateButton />
               <UpdateButton />
             </>
           )}
-          {workflowStatus === WorkflowStatus.DEACTIVATING && (
+          {automationStatus === AutomationStatus.DEACTIVATING && (
             <>
               <DeactivateNowButton />
-              <ActivateButton
+              <ActivateButton label={__('Update & Activate', 'mailpoet')} />
-                onClick={toggleActivatePanel}
-                label={__('Update & Activate', 'mailpoet')}
-              />
             </>
           )}
           <PinnedItems.Slot scope={storeName} />

mailpoet/assets/js/src/automation/editor/components/inserter-popover/index.tsx

@@ -22,7 +22,7 @@ export function InserterPopover(): JSX.Element | null {
 
   const onInsert = useCallback((item: Item) => {
     const addStepCallback: AddStepCallbackType = Hooks.applyFilters(
-      'mailpoet.automation.workflow.add_step_callback',
+      'mailpoet.automation.add_step_callback',
       () => {
         setShowModal(true);
       },

mailpoet/assets/js/src/automation/editor/components/keyboard-shortcuts/index.tsx

@@ -5,7 +5,7 @@ import {
   store as keyboardShortcutsStore,
 } from '@wordpress/keyboard-shortcuts';
 import { __ } from '@wordpress/i18n';
-import { stepSidebarKey, storeName, workflowSidebarKey } from '../../store';
+import { stepSidebarKey, storeName, automationSidebarKey } from '../../store';
 
 // See:
 //    https://github.com/WordPress/gutenberg/blob/9601a33e30ba41bac98579c8d822af63dd961488/packages/edit-post/src/components/keyboard-shortcuts/index.js
@@ -55,7 +55,7 @@ export function KeyboardShortcuts(): null {
     } else {
       const sidebarToOpen = selectedStep()
         ? stepSidebarKey
-        : workflowSidebarKey;
+        : automationSidebarKey;
       openSidebar(sidebarToOpen);
     }
   });

mailpoet/assets/js/src/automation/editor/components/modals/deactivate-modal.tsx

@@ -3,7 +3,7 @@ import { Button, Modal } from '@wordpress/components';
 import { __, sprintf } from '@wordpress/i18n';
 import { dispatch, useSelect } from '@wordpress/data';
 import { storeName } from '../../store';
-import { WorkflowStatus } from '../../../listing/workflow';
+import { AutomationStatus } from '../../../listing/automation';
 
 type DeactivateImmediatelyModalProps = {
   onClose: () => void;
@@ -49,20 +49,20 @@ type DeactivateModalProps = {
 export function DeactivateModal({
   onClose,
 }: DeactivateModalProps): JSX.Element {
-  const { workflowName } = useSelect(
+  const { automationName } = useSelect(
     (select) => ({
-      workflowName: select(storeName).getWorkflowData().name,
+      automationName: select(storeName).getAutomationData().name,
     }),
     [],
   );
   const [selected, setSelected] = useState<
-    WorkflowStatus.DRAFT | WorkflowStatus.DEACTIVATING
+    AutomationStatus.DRAFT | AutomationStatus.DEACTIVATING
-  >(WorkflowStatus.DEACTIVATING);
+  >(AutomationStatus.DEACTIVATING);
   const [isBusy, setIsBusy] = useState<boolean>(false);
   // translators: %s is the name of the automation.
   const title = sprintf(
     __('Deactivate the "%s" automation?', 'mailpoet'),
-    workflowName,
+    automationName,
   );
 
   return (
@@ -79,7 +79,7 @@ export function DeactivateModal({
         <li>
           <label
             className={
-              selected === WorkflowStatus.DEACTIVATING
+              selected === AutomationStatus.DEACTIVATING
                 ? 'mailpoet-automation-option active'
                 : 'mailpoet-automation-option'
             }
@@ -89,8 +89,8 @@ export function DeactivateModal({
                 type="radio"
                 disabled={isBusy}
                 name="deactivation-method"
-                checked={selected === WorkflowStatus.DEACTIVATING}
+                checked={selected === AutomationStatus.DEACTIVATING}
-                onChange={() => setSelected(WorkflowStatus.DEACTIVATING)}
+                onChange={() => setSelected(AutomationStatus.DEACTIVATING)}
               />
             </span>
             <span>
@@ -107,7 +107,7 @@ export function DeactivateModal({
         <li>
           <label
             className={
-              selected === WorkflowStatus.DRAFT
+              selected === AutomationStatus.DRAFT
                 ? 'mailpoet-automation-option active'
                 : 'mailpoet-automation-option'
             }
@@ -117,8 +117,8 @@ export function DeactivateModal({
                 type="radio"
                 disabled={isBusy}
                 name="deactivation-method"
-                checked={selected === WorkflowStatus.DRAFT}
+                checked={selected === AutomationStatus.DRAFT}
-                onChange={() => setSelected(WorkflowStatus.DRAFT)}
+                onChange={() => setSelected(AutomationStatus.DRAFT)}
               />
             </span>
             <span>
@@ -140,7 +140,7 @@ export function DeactivateModal({
         onClick={() => {
           setIsBusy(true);
           dispatch(storeName).deactivate(
-            selected !== WorkflowStatus.DEACTIVATING,
+            selected !== AutomationStatus.DEACTIVATING,
           );
         }}
       >

mailpoet/assets/js/src/automation/editor/components/panel/activate-panel.tsx

@@ -4,7 +4,7 @@ import { Button, Spinner } from '@wordpress/components';
 import { closeSmall } from '@wordpress/icons';
 import { __, sprintf } from '@wordpress/i18n';
 import { storeName } from '../../store';
-import { WorkflowStatus } from '../../../listing/workflow';
+import { AutomationStatus } from '../../../listing/automation';
 import { MailPoet } from '../../../../mailpoet';
 
 function PreStep({ onClose }): JSX.Element {
@@ -58,9 +58,9 @@ function PreStep({ onClose }): JSX.Element {
 }
 
 function PostStep({ onClose }): JSX.Element {
-  const { workflow } = useSelect(
+  const { automation } = useSelect(
     (select) => ({
-      workflow: select(storeName).getWorkflowData(),
+      automation: select(storeName).getAutomationData(),
     }),
     [],
   );
@@ -81,7 +81,7 @@ function PostStep({ onClose }): JSX.Element {
 
       <div className="mailpoet-automation-activate-panel__body">
         <div className="mailpoet-automation-activate-panel__section">
-          {sprintf(__('"%s" is now live.', 'mailpoet'), workflow.name)}
+          {sprintf(__('"%s" is now live.', 'mailpoet'), automation.name)}
         </div>
         <p>
           <strong>{__('What’s next?', 'mailpoet')}</strong>
@@ -100,29 +100,31 @@ function PostStep({ onClose }): JSX.Element {
   );
 }
 
-export function ActivatePanel({ onClose }): JSX.Element {
+export function ActivatePanel(): JSX.Element {
-  const { workflow, errors } = useSelect(
+  const { automation, errors } = useSelect(
     (select) => ({
       errors: select(storeName).getErrors(),
-      workflow: select(storeName).getWorkflowData(),
+      automation: select(storeName).getAutomationData(),
     }),
     [],
   );
 
+  const { closeActivationPanel } = useDispatch(storeName);
+
   useEffect(() => {
     if (errors) {
-      onClose();
+      closeActivationPanel();
     }
-  }, [errors, onClose]);
+  }, [errors, closeActivationPanel]);
 
   if (errors) {
     return null;
   }
-  const isActive = workflow.status === WorkflowStatus.ACTIVE;
+  const isActive = automation.status === AutomationStatus.ACTIVE;
   return (
     <div className="mailpoet-automation-activate-panel">
-      {isActive && <PostStep onClose={onClose} />}
+      {isActive && <PostStep onClose={closeActivationPanel} />}
-      {!isActive && <PreStep onClose={onClose} />}
+      {!isActive && <PreStep onClose={closeActivationPanel} />}
     </div>
   );
 }

mailpoet/assets/js/src/automation/editor/components/sidebar/automation/index.tsx

@@ -4,10 +4,10 @@ import { __ } from '@wordpress/i18n';
 import { storeName } from '../../../store';
 import { TrashButton } from '../../actions/trash-button';
 
-export function WorkflowSidebar(): JSX.Element {
+export function AutomationSidebar(): JSX.Element {
-  const { workflowData } = useSelect(
+  const { automationData } = useSelect(
     (select) => ({
-      workflowData: select(storeName).getWorkflowData(),
+      automationData: select(storeName).getAutomationData(),
     }),
     [],
   );
@@ -22,30 +22,30 @@ export function WorkflowSidebar(): JSX.Element {
     <PanelBody title={__('Automation details', 'mailpoet')} initialOpen>
       <PanelRow>
         <strong>Date added</strong>{' '}
-        {new Date(Date.parse(workflowData.created_at)).toLocaleDateString(
+        {new Date(Date.parse(automationData.created_at)).toLocaleDateString(
           undefined,
           dateOptions,
         )}
       </PanelRow>
       <PanelRow>
         <strong>Activated</strong>{' '}
-        {workflowData.status === 'active' &&
+        {automationData.status === 'active' &&
-          new Date(Date.parse(workflowData.updated_at)).toLocaleDateString(
+          new Date(Date.parse(automationData.updated_at)).toLocaleDateString(
             undefined,
             dateOptions,
           )}
-        {workflowData.status !== 'active' &&
+        {automationData.status !== 'active' &&
-          workflowData.activated_at &&
+          automationData.activated_at &&
-          new Date(Date.parse(workflowData.activated_at)).toLocaleDateString(
+          new Date(Date.parse(automationData.activated_at)).toLocaleDateString(
             undefined,
             dateOptions,
           )}
-        {workflowData.status !== 'active' && !workflowData.activated_at && (
+        {automationData.status !== 'active' && !automationData.activated_at && (
           <span className="mailpoet-deactive">Not activated yet.</span>
         )}
       </PanelRow>
       <PanelRow>
-        <strong>Author</strong> {workflowData.author.name}
+        <strong>Author</strong> {automationData.author.name}
       </PanelRow>
       <PanelRow>
         <TrashButton />

mailpoet/assets/js/src/automation/editor/components/sidebar/header.tsx

@@ -1,7 +1,7 @@
 import { Button } from '@wordpress/components';
 import { useDispatch } from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
-import { stepSidebarKey, storeName, workflowSidebarKey } from '../../store';
+import { stepSidebarKey, storeName, automationSidebarKey } from '../../store';
 
 // See:
 //   https://github.com/WordPress/gutenberg/blob/9601a33e30ba41bac98579c8d822af63dd961488/packages/edit-post/src/components/sidebar/settings-header/index.js
@@ -13,11 +13,11 @@ type Props = {
 
 export function Header({ sidebarKey }: Props): JSX.Element {
   const { openSidebar } = useDispatch(storeName);
-  const openWorkflowSettings = () => openSidebar(workflowSidebarKey);
+  const openAutomationSettings = () => openSidebar(automationSidebarKey);
   const openStepSettings = () => openSidebar(stepSidebarKey);
 
-  const [workflowAriaLabel, workflowActiveClass] =
+  const [automationAriaLabel, automationActiveClass] =
-    sidebarKey === workflowSidebarKey
+    sidebarKey === automationSidebarKey
       ? [__('Automation (selected)', 'mailpoet'), 'is-active']
       : [__('Automation', 'mailpoet'), ''];
 
@@ -30,9 +30,9 @@ export function Header({ sidebarKey }: Props): JSX.Element {
     <ul>
       <li>
         <Button
-          onClick={openWorkflowSettings}
+          onClick={openAutomationSettings}
-          className={`edit-site-sidebar__panel-tab ${workflowActiveClass}`}
+          className={`edit-site-sidebar__panel-tab ${automationActiveClass}`}
-          aria-label={workflowAriaLabel}
+          aria-label={automationAriaLabel}
           data-label={__('Automation', 'mailpoet')}
         >
           {__('Automation', 'mailpoet')}

mailpoet/assets/js/src/automation/editor/components/sidebar/index.tsx

@@ -10,8 +10,8 @@ import {
 import { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';
 import { Header } from './header';
 import { StepSidebar } from './step';
-import { WorkflowSidebar } from './workflow';
+import { AutomationSidebar } from './automation';
-import { stepSidebarKey, storeName, workflowSidebarKey } from '../../store';
+import { stepSidebarKey, storeName, automationSidebarKey } from '../../store';
 
 // See:
 //   https://github.com/WordPress/gutenberg/blob/5caeae34b3fb303761e3b9432311b26f4e5ea3a6/packages/edit-post/src/components/sidebar/plugin-sidebar/index.js
@@ -26,7 +26,7 @@ const sidebarActiveByDefault = Platform.select({
 type Props = ComponentProps<typeof ComplementaryArea>;
 
 export function Sidebar(props: Props): JSX.Element {
-  const { keyboardShortcut, sidebarKey, showIconLabels, workflowName } =
+  const { keyboardShortcut, sidebarKey, showIconLabels, automationName } =
     useSelect(
       (select) => ({
         keyboardShortcut: select(
@@ -36,9 +36,9 @@ export function Sidebar(props: Props): JSX.Element {
         ),
         sidebarKey:
           select(interfaceStore).getActiveComplementaryArea(storeName) ??
-          workflowSidebarKey,
+          automationSidebarKey,
         showIconLabels: select(storeName).isFeatureActive('showIconLabels'),
-        workflowName: select(storeName).getWorkflowData().name,
+        automationName: select(storeName).getAutomationData().name,
       }),
       [],
     );
@@ -53,14 +53,14 @@ export function Sidebar(props: Props): JSX.Element {
       icon={cog}
       className="edit-site-sidebar mailpoet-automation-sidebar"
       panelClassName="edit-site-sidebar"
-      smallScreenTitle={workflowName || __('(no title)', 'mailpoet')}
+      smallScreenTitle={automationName || __('(no title)', 'mailpoet')}
       scope={storeName}
       toggleShortcut={keyboardShortcut}
       isActiveByDefault={sidebarActiveByDefault}
       showIconLabels={showIconLabels}
       {...props}
     >
-      {sidebarKey === workflowSidebarKey && <WorkflowSidebar />}
+      {sidebarKey === automationSidebarKey && <AutomationSidebar />}
       {sidebarKey === stepSidebarKey && <StepSidebar />}
     </ComplementaryArea>
   );

mailpoet/assets/js/src/automation/editor/components/workflow/empty-workflow.tsx

@@ -1,9 +0,0 @@
-import { __ } from '@wordpress/i18n';
-
-export function EmptyWorkflow(): JSX.Element {
-  return (
-    <div className="mailpoet-automation-editor-empty-workflow">
-      {__('No automation data.', 'mailpoet')}
-    </div>
-  );
-}

mailpoet/assets/js/src/automation/editor/index.tsx

@@ -23,17 +23,17 @@ import { InserterSidebar } from './components/inserter-sidebar';
 import { KeyboardShortcuts } from './components/keyboard-shortcuts';
 import { EditorNotices } from './components/notices';
 import { Sidebar } from './components/sidebar';
-import { Workflow } from './components/workflow';
+import { Automation } from './components/automation';
 import { createStore, storeName } from './store';
 import { initializeApi } from '../api';
 import { initialize as initializeCoreIntegration } from '../integrations/core';
 import { initialize as initializeMailPoetIntegration } from '../integrations/mailpoet';
 import { MailPoet } from '../../mailpoet';
-import { LISTING_NOTICE_PARAMETERS } from '../listing/workflow-listing-notices';
+import { LISTING_NOTICE_PARAMETERS } from '../listing/automation-listing-notices';
 import { registerApiErrorHandler } from './api-error-handler';
 import { ActivatePanel } from './components/panel/activate-panel';
 import { registerTranslations } from '../i18n';
-import { WorkflowStatus } from '../listing/workflow';
+import { AutomationStatus } from '../listing/automation';
 
 // See:
 //   https://github.com/WordPress/gutenberg/blob/9601a33e30ba41bac98579c8d822af63dd961488/packages/edit-post/src/components/layout/index.js
@@ -43,27 +43,27 @@ import { WorkflowStatus } from '../listing/workflow';
 const showInserterSidebar = false;
 
 /**
- * Show temporary message that active workflows cant be updated
+ * Show temporary message that active automations cant be updated
  *
  * see MAILPOET-4744
  */
-function updatingActiveWorkflowNotPossible() {
+function updatingActiveAutomationNotPossible() {
-  const workflow = globalSelect(storeName).getWorkflowData();
+  const automation = globalSelect(storeName).getAutomationData();
   if (
-    ![WorkflowStatus.ACTIVE, WorkflowStatus.DEACTIVATING].includes(
+    ![AutomationStatus.ACTIVE, AutomationStatus.DEACTIVATING].includes(
-      workflow.status,
+      automation.status,
     )
   ) {
     return;
   }
-  if (workflow.stats.totals.in_progress === 0) {
+  if (automation.stats.totals.in_progress === 0) {
     return;
   }
   const { createNotice } = dispatch(noticesStore as StoreDescriptor);
   void createNotice(
     'success',
     __(
-      'Editing an active workflow is temporarily unavailable. We are working on introducing this functionality.',
+      'Editing an active automation is temporarily unavailable. We are working on introducing this functionality.',
       'mailpoet',
     ),
     {
@@ -72,31 +72,53 @@ function updatingActiveWorkflowNotPossible() {
   );
 }
 
+function onUnload(event) {
+  if (!globalSelect(storeName).getAutomationSaved()) {
+    // eslint-disable-next-line no-param-reassign
+    event.returnValue = __(
+      'There are unsaved changes that will be lost. Do you want to continue?',
+      'mailpoet',
+    );
+    return event.returnValue;
+  }
+  return '';
+}
+
+function useConfirmUnsaved() {
+  useEffect(() => {
+    window.addEventListener('beforeunload', onUnload);
+    return () => window.removeEventListener('beforeunload', onUnload);
+  }, []);
+}
+
 function Editor(): JSX.Element {
   const {
     isFullscreenActive,
     isInserterOpened,
+    isActivationPanelOpened,
     isSidebarOpened,
     showIconLabels,
-    workflow,
+    automation,
   } = useSelect(
     (select) => ({
       isFullscreenActive: select(storeName).isFeatureActive('fullscreenMode'),
       isInserterOpened: select(storeName).isInserterSidebarOpened(),
       isSidebarOpened: select(storeName).isSidebarOpened(),
+      isActivationPanelOpened: select(storeName).isActivationPanelOpened(),
       showIconLabels: select(storeName).isFeatureActive('showIconLabels'),
-      workflow: select(storeName).getWorkflowData(),
+      automation: select(storeName).getAutomationData(),
     }),
     [],
   );
-  const [showActivatePanel, setShowActivatePanel] = useState(false);
   const [isBooting, setIsBooting] = useState(true);
 
+  useConfirmUnsaved();
+
   useEffect(() => {
     if (!isBooting) {
       return;
     }
-    updatingActiveWorkflowNotPossible();
+    updatingActiveAutomationNotPossible();
     setIsBooting(false);
   }, [isBooting]);
   const className = classnames('interface-interface-skeleton', {
@@ -104,17 +126,13 @@ function Editor(): JSX.Element {
     'show-icon-labels': showIconLabels,
   });
 
-  if (workflow.status === 'trash') {
+  if (automation.status === 'trash') {
     window.location.href = addQueryArgs(MailPoet.urls.automationListing, {
-      [LISTING_NOTICE_PARAMETERS.workflowHadBeenDeleted]: workflow.id,
+      [LISTING_NOTICE_PARAMETERS.automationHadBeenDeleted]: automation.id,
     });
     return null;
   }
 
-  const toggleActivatePanel = () => {
-    setShowActivatePanel(!showActivatePanel);
-  };
-
   return (
     <ShortcutProvider>
       <SlotFillProvider>
@@ -135,16 +153,11 @@ function Editor(): JSX.Element {
               </div>
             )
           }
-          header={
+          header={<Header showInserterToggle={showInserterSidebar} />}
-            <Header
-              showInserterToggle={showInserterSidebar}
-              toggleActivatePanel={toggleActivatePanel}
-            />
-          }
           content={
             <>
               <EditorNotices />
-              <Workflow />
+              <Automation />
             </>
           }
           sidebar={<ComplementaryArea.Slot scope={storeName} />}
@@ -152,7 +165,7 @@ function Editor(): JSX.Element {
             showInserterSidebar && isInserterOpened ? <InserterSidebar /> : null
           }
         />
-        {showActivatePanel && <ActivatePanel onClose={toggleActivatePanel} />}
+        {isActivationPanelOpened && <ActivatePanel />}
         <Popover.Slot />
       </SlotFillProvider>
     </ShortcutProvider>

mailpoet/assets/js/src/automation/editor/store/actions.ts

@@ -7,14 +7,42 @@ import { store as preferencesStore } from '@wordpress/preferences';
 import { addQueryArgs } from '@wordpress/url';
 import { storeName } from './constants';
 import { Feature, State } from './types';
-import { LISTING_NOTICE_PARAMETERS } from '../../listing/workflow-listing-notices';
+import { LISTING_NOTICE_PARAMETERS } from '../../listing/automation-listing-notices';
 import { MailPoet } from '../../../mailpoet';
-import { WorkflowStatus } from '../../listing/workflow';
+import { AutomationStatus } from '../../listing/automation';
 
-export const openSidebar =
+const trackErrors = (errors) => {
-  (key) =>
+  if (!errors?.steps) {
-  ({ registry }) =>
+    return;
+  }
+  const payload = Object.keys(errors.steps as object).map((stepId) => {
+    const error = errors.steps[stepId];
+    const stepKey = select(storeName).getStepById(stepId)?.key;
+    const fields = Object.keys(error.fields as object)
+      .map((field) => `${stepKey}/${field}`)
+      .reduce((prev, next) => prev.concat(next));
+    return fields;
+  });
+
+  MailPoet.trackEvent('Automations > Automation validation error', {
+    errors: payload,
+  });
+};
+
+export const openActivationPanel = () => ({
+  type: 'SET_ACTIVATION_PANEL_VISIBILITY',
+  value: true,
+});
+export const closeActivationPanel = () => ({
+  type: 'SET_ACTIVATION_PANEL_VISIBILITY',
+  value: false,
+});
+
+export const openSidebar = (key) => {
+  dispatch(storeName).closeActivationPanel();
+  return ({ registry }) =>
     registry.dispatch(interfaceStore).enableComplementaryArea(storeName, key);
+};
 
 export const closeSidebar =
   () =>
@@ -46,23 +74,23 @@ export function selectStep(value) {
   } as const;
 }
 
-export function setWorkflowName(name) {
+export function setAutomationName(name) {
-  const workflow = select(storeName).getWorkflowData();
+  const automation = select(storeName).getAutomationData();
   return {
-    type: 'UPDATE_WORKFLOW',
+    type: 'UPDATE_AUTOMATION',
-    workflow: {
+    automation: {
-      ...workflow,
+      ...automation,
       name,
     },
   } as const;
 }
 
 export function* save() {
-  const workflow = select(storeName).getWorkflowData();
+  const automation = select(storeName).getAutomationData();
   const data = yield apiFetch({
-    path: `/workflows/${workflow.id}`,
+    path: `/automations/${automation.id}`,
     method: 'PUT',
-    data: { ...workflow },
+    data: { ...automation },
   });
 
   const { createNotice } = dispatch(noticesStore as StoreDescriptor);
@@ -78,23 +106,23 @@ export function* save() {
 
   return {
     type: 'SAVE',
-    workflow: data?.data ?? workflow,
+    automation: data?.data ?? automation,
   } as const;
 }
 
 export function* activate() {
-  const workflow = select(storeName).getWorkflowData();
+  const automation = select(storeName).getAutomationData();
   const data = yield apiFetch({
-    path: `/workflows/${workflow.id}`,
+    path: `/automations/${automation.id}`,
     method: 'PUT',
     data: {
-      ...workflow,
+      ...automation,
-      status: WorkflowStatus.ACTIVE,
+      status: AutomationStatus.ACTIVE,
     },
   });
 
   const { createNotice } = dispatch(noticesStore as StoreDescriptor);
-  if (data?.data.status === WorkflowStatus.ACTIVE) {
+  if (data?.data.status === AutomationStatus.ACTIVE) {
     void createNotice(
       'success',
       __('Well done! Automation is now activated!', 'mailpoet'),
@@ -102,29 +130,33 @@ export function* activate() {
         type: 'snackbar',
       },
     );
+    MailPoet.trackEvent('Automations > Automation activated');
   }
 
   return {
     type: 'ACTIVATE',
-    workflow: data?.data ?? workflow,
+    automation: data?.data ?? automation,
   } as const;
 }
 
-export function* deactivate(deactivateWorkflowRuns = true) {
+export function* deactivate(deactivateAutomationRuns = true) {
-  const workflow = select(storeName).getWorkflowData();
+  const automation = select(storeName).getAutomationData();
   const data = yield apiFetch({
-    path: `/workflows/${workflow.id}`,
+    path: `/automations/${automation.id}`,
     method: 'PUT',
     data: {
-      ...workflow,
+      ...automation,
-      status: deactivateWorkflowRuns
+      status: deactivateAutomationRuns
-        ? WorkflowStatus.DRAFT
+        ? AutomationStatus.DRAFT
-        : WorkflowStatus.DEACTIVATING,
+        : AutomationStatus.DEACTIVATING,
     },
   });
 
   const { createNotice } = dispatch(noticesStore as StoreDescriptor);
-  if (deactivateWorkflowRuns && data?.data.status === WorkflowStatus.DRAFT) {
+  if (
+    deactivateAutomationRuns &&
+    data?.data.status === AutomationStatus.DRAFT
+  ) {
     void createNotice(
       'success',
       __('Automation is now deactivated!', 'mailpoet'),
@@ -132,10 +164,14 @@ export function* deactivate(deactivateWorkflowRuns = true) {
         type: 'snackbar',
       },
     );
+
+    MailPoet.trackEvent('Automations > Automation deactivated', {
+      type: 'immediate',
+    });
   }
   if (
-    !deactivateWorkflowRuns &&
+    !deactivateAutomationRuns &&
-    data?.data.status === WorkflowStatus.DEACTIVATING
+    data?.data.status === AutomationStatus.DEACTIVATING
   ) {
     void createNotice(
       'success',
@@ -147,36 +183,39 @@ export function* deactivate(deactivateWorkflowRuns = true) {
         type: 'snackbar',
       },
     );
+    MailPoet.trackEvent('Automations > Automation deactivated', {
+      type: 'continuous',
+    });
   }
 
   return {
     type: 'DEACTIVATE',
-    workflow: data?.data ?? workflow,
+    automation: data?.data ?? automation,
   } as const;
 }
 
 export function* trash(onTrashed: () => void = undefined) {
-  const workflow = select(storeName).getWorkflowData();
+  const automation = select(storeName).getAutomationData();
   const data = yield apiFetch({
-    path: `/workflows/${workflow.id}`,
+    path: `/automations/${automation.id}`,
     method: 'PUT',
     data: {
-      ...workflow,
+      ...automation,
-      status: WorkflowStatus.TRASH,
+      status: AutomationStatus.TRASH,
     },
   });
 
   onTrashed?.();
 
-  if (data?.status === WorkflowStatus.TRASH) {
+  if (data?.status === AutomationStatus.TRASH) {
     window.location.href = addQueryArgs(MailPoet.urls.automationListing, {
-      [LISTING_NOTICE_PARAMETERS.workflowDeleted]: workflow.id,
+      [LISTING_NOTICE_PARAMETERS.automationDeleted]: automation.id,
     });
   }
 
   return {
     type: 'TRASH',
-    workflow: data?.data ?? workflow,
+    automation: data?.data ?? automation,
   } as const;
 }
 
@@ -197,6 +236,7 @@ export function updateStepArgs(stepId, name, value) {
 }
 
 export function setErrors(errors) {
+  trackErrors(errors);
   return {
     type: 'SET_ERRORS',
     errors,

mailpoet/assets/js/src/automation/editor/store/constants.ts

@@ -1,4 +1,4 @@
 export const storeName = 'mailpoet/automation-editor';
 
-export const workflowSidebarKey = 'mailpoet/automation-editor/workflow';
+export const automationSidebarKey = 'mailpoet/automation-editor/automation';
 export const stepSidebarKey = 'mailpoet/automation-editor/step';

mailpoet/assets/js/src/automation/editor/store/initial_state.ts

@@ -5,12 +5,15 @@ declare let window: AutomationEditorWindow;
 export const getInitialState = (): State => ({
   context: { ...window.mailpoet_automation_context },
   stepTypes: {},
-  workflowData: { ...window.mailpoet_automation_workflow },
+  automationData: { ...window.mailpoet_automation },
-  workflowSaved: true,
+  automationSaved: true,
   selectedStep: undefined,
   inserterSidebar: {
     isOpened: false,
   },
+  activationPanel: {
+    isOpened: false,
+  },
   inserterPopover: undefined,
   errors: undefined,
 });

mailpoet/assets/js/src/automation/editor/store/reducer.ts

@@ -3,6 +3,14 @@ import { State } from './types';
 
 export function reducer(state: State, action: Action): State {
   switch (action.type) {
+    case 'SET_ACTIVATION_PANEL_VISIBILITY':
+      return {
+        ...state,
+        activationPanel: {
+          ...state.activationPanel,
+          isOpened: action.value,
+        },
+      };
     case 'TOGGLE_INSERTER_SIDEBAR':
       return {
         ...state,
@@ -21,35 +29,35 @@ export function reducer(state: State, action: Action): State {
         ...state,
         selectedStep: action.value,
       };
-    case 'UPDATE_WORKFLOW':
+    case 'UPDATE_AUTOMATION':
       return {
         ...state,
-        workflowData: action.workflow,
+        automationData: action.automation,
-        workflowSaved: false,
+        automationSaved: false,
       };
     case 'SAVE':
       return {
         ...state,
-        workflowData: action.workflow,
+        automationData: action.automation,
-        workflowSaved: true,
+        automationSaved: true,
       };
     case 'ACTIVATE':
       return {
         ...state,
-        workflowData: action.workflow,
+        automationData: action.automation,
-        workflowSaved: true,
+        automationSaved: true,
       };
     case 'DEACTIVATE':
       return {
         ...state,
-        workflowData: action.workflow,
+        automationData: action.automation,
-        workflowSaved: true,
+        automationSaved: true,
       };
     case 'TRASH':
       return {
         ...state,
-        workflowData: action.workflow,
+        automationData: action.automation,
-        workflowSaved: true,
+        automationSaved: true,
       };
     case 'REGISTER_STEP_TYPE':
       return {
@@ -60,7 +68,7 @@ export function reducer(state: State, action: Action): State {
         },
       };
     case 'UPDATE_STEP_ARGS': {
-      const prevArgs = state.workflowData.steps[action.stepId].args ?? {};
+      const prevArgs = state.automationData.steps[action.stepId].args ?? {};
 
       const value =
         typeof action.value === 'function'
@@ -74,7 +82,7 @@ export function reducer(state: State, action: Action): State {
             )
           : { ...prevArgs, [action.name]: value };
 
-      const step = { ...state.workflowData.steps[action.stepId], args };
+      const step = { ...state.automationData.steps[action.stepId], args };
 
       const stepErrors = Object.values(state.errors?.steps ?? {}).filter(
         ({ step_id }) => step_id !== action.stepId,
@@ -82,14 +90,14 @@ export function reducer(state: State, action: Action): State {
 
       return {
         ...state,
-        workflowData: {
+        automationData: {
-          ...state.workflowData,
+          ...state.automationData,
           steps: {
-            ...state.workflowData.steps,
+            ...state.automationData.steps,
             [action.stepId]: step,
           },
         },
-        workflowSaved: false,
+        automationSaved: false,
         selectedStep: step,
         errors:
           stepErrors.length > 0

mailpoet/assets/js/src/automation/editor/store/selectors.ts

@@ -4,7 +4,7 @@ import { store as preferencesStore } from '@wordpress/preferences';
 import { storeName } from './constants';
 import { Context, Errors, Feature, State, StepErrors, StepType } from './types';
 import { Item } from '../components/inserter/item';
-import { Step, Workflow } from '../components/workflow/types';
+import { Step, Automation } from '../components/automation/types';
 
 export const isFeatureActive = createRegistrySelector(
   (select) =>
@@ -21,6 +21,10 @@ export function isInserterSidebarOpened(state: State): boolean {
   return state.inserterSidebar.isOpened;
 }
 
+export function isActivationPanelOpened(state: State): boolean {
+  return state.activationPanel.isOpened;
+}
+
 export function getContext(state: State): Context {
   return state.context;
 }
@@ -54,18 +58,22 @@ export function getInserterPopover(
   return state.inserterPopover;
 }
 
-export function getWorkflowData(state: State): Workflow {
+export function getAutomationData(state: State): Automation {
-  return state.workflowData;
+  return state.automationData;
 }
 
-export function getWorkflowSaved(state: State): boolean {
+export function getAutomationSaved(state: State): boolean {
-  return state.workflowSaved;
+  return state.automationSaved;
 }
 
 export function getSelectedStep(state: State): Step | undefined {
   return state.selectedStep;
 }
 
+export function getStepById(state: State, id: string): Step | undefined {
+  return state.automationData.steps[id] ?? undefined;
+}
+
 export function getStepType(state: State, key: string): StepType | undefined {
   return state.stepTypes[key] ?? undefined;
 }

mailpoet/assets/js/src/automation/editor/store/types.ts

@@ -1,9 +1,9 @@
 import { ComponentType } from 'react';
-import { Step, Workflow } from '../components/workflow/types';
+import { Step, Automation } from '../components/automation/types';
 
 export interface AutomationEditorWindow extends Window {
   mailpoet_automation_context: Context;
-  mailpoet_automation_workflow: Workflow;
+  mailpoet_automation: Automation;
 }
 
 export type Context = {
@@ -48,12 +48,15 @@ export type Errors = {
 export type State = {
   context: Context;
   stepTypes: Record<string, StepType>;
-  workflowData: Workflow;
+  automationData: Automation;
-  workflowSaved: boolean;
+  automationSaved: boolean;
   selectedStep: Step | undefined;
   inserterSidebar: {
     isOpened: boolean;
   };
+  activationPanel: {
+    isOpened: boolean;
+  };
   inserterPopover?: {
     anchor: HTMLElement;
     type: 'steps' | 'triggers';

mailpoet/assets/js/src/automation/integrations/mailpoet/step-controls/index.tsx

@@ -3,7 +3,7 @@ import { chartBar } from '@wordpress/icons';
 import { Hooks } from 'wp-js-hooks';
 import { MoreControlType, StepMoreControlsType } from '../../../types/filters';
 import { StepType } from '../../../editor/store';
-import { Step } from '../../../editor/components/workflow/types';
+import { Step } from '../../../editor/components/automation/types';
 
 const emailStatisticsControl = (step: Step): MoreControlType => {
   const hasEmail = step.args?.email_id > 0;
@@ -28,7 +28,7 @@ const emailStatisticsControl = (step: Step): MoreControlType => {
 
 export function registerStepControls() {
   Hooks.addFilter(
-    'mailpoet.automation.workflow.step.more-controls',
+    'mailpoet.automation.step.more-controls',
     'mailpoet',
     (
       controls: StepMoreControlsType,

mailpoet/assets/js/src/automation/integrations/mailpoet/steps/send_email/edit/edit_newsletter.tsx

@@ -31,11 +31,11 @@ export function EditNewsletter(): JSX.Element {
     useState(false);
   const [fetchingPreviewLink, setFetchingPreviewLink] = useState(false);
 
-  const { selectedStep, workflowId, workflowSaved, errors } = useSelect(
+  const { selectedStep, automationId, automationSaved, errors } = useSelect(
     (select) => ({
       selectedStep: select(storeName).getSelectedStep(),
-      workflowId: select(storeName).getWorkflowData().id,
+      automationId: select(storeName).getAutomationData().id,
-      workflowSaved: select(storeName).getWorkflowSaved(),
+      automationSaved: select(storeName).getAutomationSaved(),
       errors: select(storeName).getStepError(
         select(storeName).getSelectedStep().id,
       ),
@@ -44,7 +44,7 @@ export function EditNewsletter(): JSX.Element {
   );
 
   const emailId = selectedStep?.args?.email_id as number | undefined;
-  const workflowStepId = selectedStep.id;
+  const automationStepId = selectedStep.id;
   const errorFields = errors?.fields ?? {};
   const emailIdError = errorFields?.email_id ?? '';
 
@@ -58,28 +58,28 @@ export function EditNewsletter(): JSX.Element {
         type: 'automation',
         subject: '',
         options: {
-          workflowId,
+          automationId,
-          workflowStepId,
+          automationStepId,
         },
       },
     });
 
     dispatch(storeName).updateStepArgs(
-      workflowStepId,
+      automationStepId,
       'email_id',
       parseInt(response.data.id as string, 10),
     );
 
     dispatch(storeName).save();
-  }, [workflowId, workflowStepId]);
+  }, [automationId, automationStepId]);
 
   // This component is rendered only when no email ID is set. Once we have the ID
-  // and the workflow is saved, we can safely redirect to the email design flow.
+  // and the automation is saved, we can safely redirect to the email design flow.
   useEffect(() => {
-    if (redirectToTemplateSelection && emailId && workflowSaved) {
+    if (redirectToTemplateSelection && emailId && automationSaved) {
       window.location.href = `admin.php?page=mailpoet-newsletters#/template/${emailId}`;
     }
-  }, [emailId, workflowSaved, redirectToTemplateSelection]);
+  }, [emailId, automationSaved, redirectToTemplateSelection]);
 
   if (!emailId || redirectToTemplateSelection) {
     return (

mailpoet/assets/js/src/automation/integrations/mailpoet/steps/send_email/edit/shortcode_help_text.tsx

@@ -8,7 +8,6 @@ export function ShortcodeHelpText(): JSX.Element {
         href="https://kb.mailpoet.com/article/215-personalize-newsletter-with-shortcodes"
         target="_blank"
         rel="noopener noreferrer"
-        data-beacon-article="59d662ef042863379ddc6faa"
       >
         {__('MailPoet shortcodes', 'mailpoet')}
       </a>

mailpoet/assets/js/src/automation/integrations/mailpoet/steps/send_email/index.tsx

@@ -3,7 +3,7 @@ import { Hooks } from 'wp-js-hooks';
 import { Icon } from './icon';
 import { Edit } from './edit';
 import { State, StepType } from '../../../../editor/store/types';
-import { Step } from '../../../../editor/components/workflow/types';
+import { Step } from '../../../../editor/components/automation/types';
 
 export const step: StepType = {
   key: 'mailpoet:send-email',
@@ -20,6 +20,6 @@ export const step: StepType = {
     Hooks.applyFilters(
       'mailpoet.automation.send_email.create_step',
       stepData,
-      state.workflowData.id,
+      state.automationData.id,
     ),
 } as const;

mailpoet/assets/js/src/automation/integrations/mailpoet/types/filters.tsx

@@ -2,10 +2,13 @@
  * The types in this file document the expected return types of specific
  * filters.
  */
-import { Step } from '../../../editor/components/workflow/types';
+import { Step } from '../../../editor/components/automation/types';
 
 // mailpoet.automation.send_email.create_step
-export type SendEmailCreateStepType = (step: Step, workflowId: number) => Step;
+export type SendEmailCreateStepType = (
+  step: Step,
+  automationId: number,
+) => Step;
 
 // mailpoet.automation.send_email.google_analytics_panel
 export type GoogleAnalyticsPanelBodyType = JSX.Element;

mailpoet/assets/js/src/automation/listing/automation-listing-notices.tsx

@@ -3,27 +3,30 @@ import { __ } from '@wordpress/i18n';
 import { Notice } from '../../notices/notice';
 
 export const LISTING_NOTICE_PARAMETERS = {
-  workflowHadBeenDeleted: 'mailpoet-had-been-deleted',
+  automationHadBeenDeleted: 'mailpoet-had-been-deleted',
-  workflowDeleted: 'mailpoet-workflow-deleted',
+  automationDeleted: 'mailpoet-automation-deleted',
 };
 
-export function WorkflowListingNotices(): JSX.Element {
+export function AutomationListingNotices(): JSX.Element {
-  const workflowHadBeenDeleted = parseInt(
+  const automationHadBeenDeleted = parseInt(
     getQueryArg(
       window.location.href,
-      LISTING_NOTICE_PARAMETERS.workflowHadBeenDeleted,
+      LISTING_NOTICE_PARAMETERS.automationHadBeenDeleted,
     ) as string,
     10,
   );
-  const workflowDeleted = parseInt(
+  const automationDeleted = parseInt(
     getQueryArg(
       window.location.href,
-      LISTING_NOTICE_PARAMETERS.workflowDeleted,
+      LISTING_NOTICE_PARAMETERS.automationDeleted,
     ) as string,
     10,
   );
 
-  if (Number.isNaN(workflowHadBeenDeleted) && Number.isNaN(workflowDeleted)) {
+  if (
+    Number.isNaN(automationHadBeenDeleted) &&
+    Number.isNaN(automationDeleted)
+  ) {
     return null;
   }
 
@@ -32,7 +35,7 @@ export function WorkflowListingNotices(): JSX.Element {
     ...Object.values(LISTING_NOTICE_PARAMETERS),
   );
   window.history.pushState('', '', urlWithoutNotices);
-  if (workflowHadBeenDeleted) {
+  if (automationHadBeenDeleted) {
     return (
       <Notice type="error" closable timeout={false}>
         <p>
@@ -44,7 +47,7 @@ export function WorkflowListingNotices(): JSX.Element {
       </Notice>
     );
   }
-  if (workflowDeleted) {
+  if (automationDeleted) {
     return (
       <Notice type="success" closable timeout={false}>
         <p>{__('1 automation moved to the Trash.', 'mailpoet')}</p>

mailpoet/assets/js/src/automation/listing/automation.ts

@@ -1,14 +1,14 @@
-export enum WorkflowStatus {
+export enum AutomationStatus {
   ACTIVE = 'active',
   DRAFT = 'draft',
   TRASH = 'trash',
   DEACTIVATING = 'deactivating',
 }
 
-export type Workflow = {
+export type Automation = {
   id: number;
   name: string;
-  status: WorkflowStatus;
+  status: AutomationStatus;
   stats: {
     totals: {
       entered: number;

mailpoet/assets/js/src/automation/listing/components/actions/edit-automation.tsx

@@ -1,19 +1,19 @@
 import { Button } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { addQueryArgs } from '@wordpress/url';
-import { Workflow } from '../../workflow';
+import { Automation } from '../../automation';
 import { MailPoet } from '../../../../mailpoet';
 
 type Props = {
-  workflow: Workflow;
+  automation: Automation;
   label?: string;
 };
 
-export function EditWorkflow({ workflow, label }: Props): JSX.Element {
+export function EditAutomation({ automation, label }: Props): JSX.Element {
   return (
     <Button
       variant="link"
-      href={addQueryArgs(MailPoet.urls.automationEditor, { id: workflow.id })}
+      href={addQueryArgs(MailPoet.urls.automationEditor, { id: automation.id })}
     >
       {label ?? __('Edit', 'mailpoet')}
     </Button>

mailpoet/assets/js/src/automation/listing/components/actions/index.tsx

@@ -1,2 +1,2 @@
-export * from './edit-workflow';
+export * from './edit-automation';
 export * from './undo-trash';

mailpoet/assets/js/src/automation/listing/components/actions/undo-trash.tsx

@@ -2,23 +2,23 @@ import { Button } from '@wordpress/components';
 import { useDispatch } from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
 import { storeName } from '../../store/constants';
-import { Workflow, WorkflowStatus } from '../../workflow';
+import { Automation, AutomationStatus } from '../../automation';
 
 type Props = {
-  workflow: Workflow;
+  automation: Automation;
-  previousStatus: WorkflowStatus;
+  previousStatus: AutomationStatus;
 };
 
 export function UndoTrashButton({
-  workflow,
+  automation,
   previousStatus,
 }: Props): JSX.Element {
-  const { restoreWorkflow } = useDispatch(storeName);
+  const { restoreAutomation } = useDispatch(storeName);
 
   return (
     <Button
       variant="link"
-      onClick={() => restoreWorkflow(workflow, previousStatus)}
+      onClick={() => restoreAutomation(automation, previousStatus)}
     >
       {__('Undo', 'mailpoet')}
     </Button>

mailpoet/assets/js/src/automation/listing/components/cells/actions.tsx

@@ -2,32 +2,26 @@ import { Fragment } from 'react';
 import { __ } from '@wordpress/i18n';
 import { DropdownMenu } from '@wordpress/components';
 import { moreVertical } from '@wordpress/icons';
-import {
+import { useDeleteButton, useRestoreButton, useTrashButton } from '../menu';
-  useDeleteButton,
+import { Automation } from '../../automation';
-  useDuplicateButton,
+import { EditAutomation } from '../actions';
-  useRestoreButton,
-  useTrashButton,
-} from '../menu';
-import { Workflow } from '../../workflow';
-import { EditWorkflow } from '../actions';
 
 type Props = {
-  workflow: Workflow;
+  automation: Automation;
 };
 
-export function Actions({ workflow }: Props): JSX.Element {
+export function Actions({ automation }: Props): JSX.Element {
   // Menu items are using custom hooks because the "DropdownMenu" component uses the "controls"
   // attribute rather than child components, but we need to render modal confirmation dialogs.
-  const duplicate = useDuplicateButton(workflow);
+  const trash = useTrashButton(automation);
-  const trash = useTrashButton(workflow);
+  const restore = useRestoreButton(automation);
-  const restore = useRestoreButton(workflow);
+  const del = useDeleteButton(automation);
-  const del = useDeleteButton(workflow);
 
-  const menuItems = [duplicate, trash, restore, del].filter((item) => item);
+  const menuItems = [trash, restore, del].filter((item) => item);
 
   return (
     <div className="mailpoet-automation-listing-cell-actions">
-      <EditWorkflow workflow={workflow} />
+      <EditAutomation automation={automation} />
       {menuItems.map(({ control, slot }) => (
         <Fragment key={control.title}>{slot}</Fragment>
       ))}

mailpoet/assets/js/src/automation/listing/components/cells/name.tsx

@@ -1,10 +1,10 @@
-import { EditWorkflow } from '../actions';
+import { EditAutomation } from '../actions';
-import { Workflow } from '../../workflow';
+import { Automation } from '../../automation';
 
 type Props = {
-  workflow: Workflow;
+  automation: Automation;
 };
 
-export function Name({ workflow }: Props): JSX.Element {
+export function Name({ automation }: Props): JSX.Element {
-  return <EditWorkflow workflow={workflow} label={workflow.name} />;
+  return <EditAutomation automation={automation} label={automation.name} />;
 }

mailpoet/assets/js/src/automation/listing/components/cells/status.tsx

@@ -1,16 +1,16 @@
 import { __ } from '@wordpress/i18n';
-import { Workflow, WorkflowStatus } from '../../workflow';
+import { Automation, AutomationStatus } from '../../automation';
 
 type Props = {
-  workflow: Workflow;
+  automation: Automation;
 };
 
-export function Status({ workflow }: Props): JSX.Element {
+export function Status({ automation }: Props): JSX.Element {
   return (
     <div className="mailpoet-automation-listing-cell-status">
-      {workflow.status === WorkflowStatus.ACTIVE
+      {automation.status === AutomationStatus.ACTIVE
         ? __('Active', 'mailpoet')
-        : __('Not active', 'mailpoet')}
+        : __('Draft', 'mailpoet')}
     </div>
   );
 }

mailpoet/assets/js/src/automation/listing/components/cells/subscribers.tsx

@@ -1,12 +1,12 @@
 import { _x } from '@wordpress/i18n';
-import { Workflow } from '../../workflow';
+import { Automation } from '../../automation';
 import { Statistics } from '../../../components/statistics';
 
 type Props = {
-  workflow: Workflow;
+  automation: Automation;
 };
 
-export function Subscribers({ workflow }: Props): JSX.Element {
+export function Subscribers({ automation }: Props): JSX.Element {
   return (
     <Statistics
       labelPosition="after"
@@ -15,19 +15,19 @@ export function Subscribers({ workflow }: Props): JSX.Element {
           key: 'entered',
           // translators: Total number of subscribers who entered an automation
           label: _x('Entered', 'automation stats', 'mailpoet'),
-          value: workflow.stats.totals.entered,
+          value: automation.stats.totals.entered,
         },
         {
           key: 'processing',
           // translators: Total number of subscribers who are being processed in an automation
           label: _x('Processing', 'automation stats', 'mailpoet'),
-          value: workflow.stats.totals.in_progress,
+          value: automation.stats.totals.in_progress,
         },
         {
           key: 'exited',
           // translators: Total number of subscribers who exited an automation, no matter the result
           label: _x('Exited', 'automation stats', 'mailpoet'),
-          value: workflow.stats.totals.exited,
+          value: automation.stats.totals.exited,
         },
       ]}
     />

mailpoet/assets/js/src/automation/listing/components/menu/delete.tsx

@@ -4,13 +4,13 @@ import { useDispatch } from '@wordpress/data';
 import { __, sprintf } from '@wordpress/i18n';
 import { Item } from './item';
 import { storeName } from '../../store';
-import { Workflow, WorkflowStatus } from '../../workflow';
+import { Automation, AutomationStatus } from '../../automation';
 
-export const useDeleteButton = (workflow: Workflow): Item | undefined => {
+export const useDeleteButton = (automation: Automation): Item | undefined => {
   const [showDialog, setShowDialog] = useState(false);
-  const { deleteWorkflow } = useDispatch(storeName);
+  const { deleteAutomation } = useDispatch(storeName);
 
-  if (workflow.status !== WorkflowStatus.TRASH) {
+  if (automation.status !== AutomationStatus.TRASH) {
     return undefined;
   }
 
@@ -27,7 +27,7 @@ export const useDeleteButton = (workflow: Workflow): Item | undefined => {
         title={__('Permanently delete automation', 'mailpoet')}
         confirmButtonText={__('Yes, permanently delete', 'mailpoet')}
         __experimentalHideHeader={false}
-        onConfirm={() => deleteWorkflow(workflow)}
+        onConfirm={() => deleteAutomation(automation)}
         onCancel={() => setShowDialog(false)}
       >
         {sprintf(
@@ -36,7 +36,7 @@ export const useDeleteButton = (workflow: Workflow): Item | undefined => {
             'Are you sure you want to permanently delete "%s" and all associated data? This cannot be undone!',
             'mailpoet',
           ),
-          workflow.name,
+          automation.name,
         )}
       </ConfirmDialog>
     ),

mailpoet/assets/js/src/automation/listing/components/menu/duplicate.tsx

@@ -2,12 +2,14 @@ import { useDispatch } from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
 import { Item } from './item';
 import { storeName } from '../../store';
-import { Workflow, WorkflowStatus } from '../../workflow';
+import { Automation, AutomationStatus } from '../../automation';
 
-export const useDuplicateButton = (workflow: Workflow): Item | undefined => {
+export const useDuplicateButton = (
-  const { duplicateWorkflow } = useDispatch(storeName);
+  automation: Automation,
+): Item | undefined => {
+  const { duplicateAutomation } = useDispatch(storeName);
 
-  if (workflow.status === WorkflowStatus.TRASH) {
+  if (automation.status === AutomationStatus.TRASH) {
     return undefined;
   }
 
@@ -16,7 +18,7 @@ export const useDuplicateButton = (workflow: Workflow): Item | undefined => {
     control: {
       title: __('Duplicate', 'mailpoet'),
       icon: null,
-      onClick: () => duplicateWorkflow(workflow),
+      onClick: () => duplicateAutomation(automation),
     },
   };
 };

mailpoet/assets/js/src/automation/listing/components/menu/restore.tsx

@@ -2,12 +2,12 @@ import { useDispatch } from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
 import { Item } from './item';
 import { storeName } from '../../store';
-import { Workflow, WorkflowStatus } from '../../workflow';
+import { Automation, AutomationStatus } from '../../automation';
 
-export const useRestoreButton = (workflow: Workflow): Item | undefined => {
+export const useRestoreButton = (automation: Automation): Item | undefined => {
-  const { restoreWorkflow } = useDispatch(storeName);
+  const { restoreAutomation } = useDispatch(storeName);
 
-  if (workflow.status !== WorkflowStatus.TRASH) {
+  if (automation.status !== AutomationStatus.TRASH) {
     return undefined;
   }
 
@@ -16,7 +16,7 @@ export const useRestoreButton = (workflow: Workflow): Item | undefined => {
     control: {
       title: __('Restore', 'mailpoet'),
       icon: null,
-      onClick: () => restoreWorkflow(workflow, WorkflowStatus.DRAFT),
+      onClick: () => restoreAutomation(automation, AutomationStatus.DRAFT),
     },
   };
 };

mailpoet/assets/js/src/automation/listing/components/menu/trash.tsx

@@ -4,13 +4,13 @@ import { useDispatch } from '@wordpress/data';
 import { __, _x, sprintf } from '@wordpress/i18n';
 import { Item } from './item';
 import { storeName } from '../../store';
-import { Workflow, WorkflowStatus } from '../../workflow';
+import { Automation, AutomationStatus } from '../../automation';
 
-export const useTrashButton = (workflow: Workflow): Item | undefined => {
+export const useTrashButton = (automation: Automation): Item | undefined => {
   const [showDialog, setShowDialog] = useState(false);
-  const { trashWorkflow } = useDispatch(storeName);
+  const { trashAutomation } = useDispatch(storeName);
 
-  if (workflow.status === WorkflowStatus.TRASH) {
+  if (automation.status === AutomationStatus.TRASH) {
     return undefined;
   }
 
@@ -27,7 +27,7 @@ export const useTrashButton = (workflow: Workflow): Item | undefined => {
         title={__('Trash automation', 'mailpoet')}
         confirmButtonText={__('Yes, move to trash', 'mailpoet')}
         __experimentalHideHeader={false}
-        onConfirm={() => trashWorkflow(workflow)}
+        onConfirm={() => trashAutomation(automation)}
         onCancel={() => setShowDialog(false)}
       >
         {sprintf(
@@ -36,7 +36,7 @@ export const useTrashButton = (workflow: Workflow): Item | undefined => {
             'Are you sure you want to move the automation "%s" to the Trash?',
             'mailpoet',
           ),
-          workflow.name,
+          automation.name,
         )}
       </ConfirmDialog>
     ),

mailpoet/assets/js/src/automation/listing/get-row.tsx

@@ -1,27 +1,27 @@
-import { Workflow } from './workflow';
+import { Automation } from './automation';
 import { Actions, Name, Status, Subscribers } from './components/cells';
 
-export function getRow(workflow: Workflow): object[] {
+export function getRow(automation: Automation): object[] {
   return [
     {
-      id: workflow.id,
+      id: automation.id,
-      value: workflow.name,
+      value: automation.name,
-      display: <Name workflow={workflow} />,
+      display: <Name automation={automation} />,
     },
     {
-      id: workflow.id,
+      id: automation.id,
       value: null,
-      display: <Subscribers workflow={workflow} />,
+      display: <Subscribers automation={automation} />,
     },
     {
-      id: workflow.id,
+      id: automation.id,
-      value: workflow.status,
+      value: automation.status,
-      display: <Status workflow={workflow} />,
+      display: <Status automation={automation} />,
     },
     {
-      id: workflow.id,
+      id: automation.id,
       value: null,
-      display: <Actions workflow={workflow} />,
+      display: <Actions automation={automation} />,
     },
   ];
 }

mailpoet/assets/js/src/automation/listing/index.tsx

@@ -7,7 +7,7 @@ import { useHistory, useLocation } from 'react-router-dom';
 import { plusIcon } from 'common/button/icon/plus';
 import { getRow } from './get-row';
 import { storeName } from './store';
-import { Workflow, WorkflowStatus } from './workflow';
+import { Automation, AutomationStatus } from './automation';
 import { MailPoet } from '../../mailpoet';
 
 const tabConfig = [
@@ -17,17 +17,17 @@ const tabConfig = [
     className: 'mailpoet-tab-all',
   },
   {
-    name: WorkflowStatus.ACTIVE,
+    name: AutomationStatus.ACTIVE,
     title: __('Active', 'mailpoet'),
     className: 'mailpoet-tab-active',
   },
   {
-    name: WorkflowStatus.DRAFT,
+    name: AutomationStatus.DRAFT,
     title: _x('Draft', 'noun', 'mailpoet'),
     className: 'mailpoet-tab-draft',
   },
   {
-    name: WorkflowStatus.TRASH,
+    name: AutomationStatus.TRASH,
     title: _x('Trash', 'noun', 'mailpoet'),
     className: 'mailpoet-tab-trash',
   },
@@ -68,14 +68,14 @@ export function AutomationListing(): JSX.Element {
     [location],
   );
 
-  const workflows = useSelect((select) => select(storeName).getWorkflows());
+  const automations = useSelect((select) => select(storeName).getAutomations());
-  const { loadWorkflows } = useDispatch(storeName);
+  const { loadAutomations } = useDispatch(storeName);
 
   const status = pageSearch.get('status');
 
   useEffect(() => {
-    loadWorkflows();
+    loadAutomations();
-  }, [loadWorkflows]);
+  }, [loadAutomations]);
 
   // focus tab button on status change (needed due to the force re-mount below)
   useLayoutEffect(() => {
@@ -103,24 +103,24 @@ export function AutomationListing(): JSX.Element {
     [pageSearch, history],
   );
 
-  const groupedWorkflows = useMemo<Record<string, Workflow[]>>(() => {
+  const groupedAutomations = useMemo<Record<string, Automation[]>>(() => {
     const grouped = { all: [] };
-    (workflows ?? []).forEach((workflow) => {
+    (automations ?? []).forEach((automation) => {
-      if (!grouped[workflow.status]) {
+      if (!grouped[automation.status]) {
-        grouped[workflow.status] = [];
+        grouped[automation.status] = [];
       }
-      grouped[workflow.status].push(workflow);
+      grouped[automation.status].push(automation);
-      if (workflow.status !== WorkflowStatus.TRASH) {
+      if (automation.status !== AutomationStatus.TRASH) {
-        grouped.all.push(workflow);
+        grouped.all.push(automation);
       }
     });
     return grouped;
-  }, [workflows]);
+  }, [automations]);
 
   const tabs = useMemo(
     () =>
       tabConfig.map((tab) => {
-        const count = (groupedWorkflows[tab.name] ?? []).length;
+        const count = (groupedAutomations[tab.name] ?? []).length;
         return {
           name: tab.name,
           title: (
@@ -132,38 +132,39 @@ export function AutomationListing(): JSX.Element {
           className: tab.className,
         };
       }),
-    [groupedWorkflows],
+    [groupedAutomations],
   );
 
   const renderTabs = useCallback(
     (tab) => {
-      const filteredWorkflows: Workflow[] = groupedWorkflows[tab.name] ?? [];
+      const filteredAutomations: Automation[] =
+        groupedAutomations[tab.name] ?? [];
       const rowsPerPage = parseInt(pageSearch.get('per_page') ?? '25', 10);
       const currentPage = parseInt(pageSearch.get('paged') ?? '1', 10);
       const start = (currentPage - 1) * rowsPerPage;
-      const rows = filteredWorkflows
+      const rows = filteredAutomations
-        .map((workflow) => getRow(workflow))
+        .map((automation) => getRow(automation))
         .slice(start, start + rowsPerPage);
 
       return (
         <TableCard
           className="mailpoet-automation-listing"
           title=""
-          isLoading={!workflows}
+          isLoading={!automations}
           headers={tableHeaders}
           rows={rows}
-          rowKey={(_, i) => filteredWorkflows[i].id}
+          rowKey={(_, i) => filteredAutomations[i].id}
           rowsPerPage={rowsPerPage}
           onQueryChange={(key) => (value) => {
             updateUrlSearchString({ [key]: value });
           }}
-          totalRows={filteredWorkflows.length}
+          totalRows={filteredAutomations.length}
           query={Object.fromEntries(pageSearch)}
           showMenu={false}
         />
       );
     },
-    [workflows, groupedWorkflows, pageSearch, updateUrlSearchString],
+    [automations, groupedAutomations, pageSearch, updateUrlSearchString],
   );
 
   return (

mailpoet/assets/js/src/automation/listing/store/actions.tsx

@@ -2,8 +2,8 @@ import { dispatch, StoreDescriptor } from '@wordpress/data';
 import { apiFetch } from '@wordpress/data-controls';
 import { __, sprintf } from '@wordpress/i18n';
 import { store as noticesStore } from '@wordpress/notices';
-import { Workflow, WorkflowStatus } from '../workflow';
+import { Automation, AutomationStatus } from '../automation';
-import { EditWorkflow, UndoTrashButton } from '../components/actions';
+import { EditAutomation, UndoTrashButton } from '../components/actions';
 
 const createSuccessNotice = (content: string, options?: unknown) =>
   dispatch(noticesStore as StoreDescriptor).createSuccessNotice(
@@ -14,78 +14,84 @@ const createSuccessNotice = (content: string, options?: unknown) =>
 const removeNotice = (id: string) =>
   dispatch(noticesStore as StoreDescriptor).removeNotice(id);
 
-export function* loadWorkflows() {
+export function* loadAutomations() {
   const data = yield apiFetch({
-    path: `/workflows`,
+    path: `/automations`,
   });
 
   return {
-    type: 'SET_WORKFLOWS',
+    type: 'SET_AUTOMATIONS',
-    workflows: data.data,
+    automations: data.data,
   } as const;
 }
 
-export function* duplicateWorkflow(workflow: Workflow) {
+export function* duplicateAutomation(automation: Automation) {
   const data = yield apiFetch({
-    path: `/workflows/${workflow.id}/duplicate`,
+    path: `/automations/${automation.id}/duplicate`,
     method: 'POST',
   });
 
   void createSuccessNotice(
     // translators: %s is the automation name
-    sprintf(__('Automation "%s" was duplicated.', 'mailpoet'), workflow.name),
+    sprintf(__('Automation "%s" was duplicated.', 'mailpoet'), automation.name),
   );
 
   return {
-    type: 'ADD_WORKFLOW',
+    type: 'ADD_AUTOMATION',
-    workflow: data.data,
+    automation: data.data,
   } as const;
 }
 
-export function* trashWorkflow(workflow: Workflow) {
+export function* trashAutomation(automation: Automation) {
   const data = yield apiFetch({
-    path: `/workflows/${workflow.id}`,
+    path: `/automations/${automation.id}`,
     method: 'PUT',
     data: {
-      status: WorkflowStatus.TRASH,
+      status: AutomationStatus.TRASH,
     },
   });
 
   const message = __('1 automation moved to the Trash.', 'mailpoet');
   void createSuccessNotice(message, {
-    id: `workflow-trashed-${workflow.id}`,
+    id: `automation-trashed-${automation.id}`,
     __unstableHTML: (
       <p>
         {message}{' '}
-        <UndoTrashButton workflow={workflow} previousStatus={workflow.status} />
+        <UndoTrashButton
+          automation={automation}
+          previousStatus={automation.status}
+        />
       </p>
     ),
   });
 
   return {
-    type: 'UPDATE_WORKFLOW',
+    type: 'UPDATE_AUTOMATION',
-    workflow: data.data,
+    automation: data.data,
   } as const;
 }
 
-export function* restoreWorkflow(workflow: Workflow, status: WorkflowStatus) {
+export function* restoreAutomation(
+  automation: Automation,
+  status: AutomationStatus,
+) {
   const data = yield apiFetch({
-    path: `/workflows/${workflow.id}`,
+    path: `/automations/${automation.id}`,
     method: 'PUT',
     data: {
       status,
     },
   });
 
-  void removeNotice(`workflow-trashed-${workflow.id}`);
+  void removeNotice(`automation-trashed-${automation.id}`);
 
   const message = __('1 automation restored from the Trash.', 'mailpoet');
   void createSuccessNotice(message, {
     __unstableHTML: (
       <p>
         {message}{' '}
-        <EditWorkflow
+        <EditAutomation
-          workflow={workflow}
+          automation={automation}
           label={__('Edit automation', 'mailpoet')}
         />
       </p>
@@ -93,14 +99,14 @@ export function* restoreWorkflow(workflow: Workflow, status: WorkflowStatus) {
   });
 
   return {
-    type: 'UPDATE_WORKFLOW',
+    type: 'UPDATE_AUTOMATION',
-    workflow: data.data,
+    automation: data.data,
   } as const;
 }
 
-export function* deleteWorkflow(workflow: Workflow) {
+export function* deleteAutomation(automation: Automation) {
   yield apiFetch({
-    path: `/workflows/${workflow.id}`,
+    path: `/automations/${automation.id}`,
     method: 'DELETE',
   });
 
@@ -109,7 +115,7 @@ export function* deleteWorkflow(workflow: Workflow) {
   );
 
   return {
-    type: 'DELETE_WORKFLOW',
+    type: 'DELETE_AUTOMATION',
-    workflow,
+    automation,
   } as const;
 }

mailpoet/assets/js/src/automation/listing/store/initial_state.ts

@@ -1,5 +1,5 @@
 import { State } from './types';
 
 export const getInitialState = (): State => ({
-  workflows: undefined,
+  automations: undefined,
 });

mailpoet/assets/js/src/automation/listing/store/reducer.ts

@@ -1,31 +1,33 @@
 import { Action } from '@wordpress/data';
 import { State } from './types';
-import { Workflow } from '../workflow';
+import { Automation } from '../automation';
 
 export function reducer(state: State, action: Action): State {
   switch (action.type) {
-    case 'SET_WORKFLOWS':
+    case 'SET_AUTOMATIONS':
       return {
         ...state,
-        workflows: action.workflows,
+        automations: action.automations,
       };
-    case 'ADD_WORKFLOW':
+    case 'ADD_AUTOMATION':
       return {
         ...state,
-        workflows: [action.workflow, ...state.workflows],
+        automations: [action.automation, ...state.automations],
       };
-    case 'UPDATE_WORKFLOW':
+    case 'UPDATE_AUTOMATION':
       return {
         ...state,
-        workflows: state.workflows.map((workflow: Workflow) =>
+        automations: state.automations.map((automation: Automation) =>
-          workflow.id === action.workflow.id ? action.workflow : workflow,
+          automation.id === action.automation.id
+            ? action.automation
+            : automation,
         ),
       };
-    case 'DELETE_WORKFLOW':
+    case 'DELETE_AUTOMATION':
       return {
         ...state,
-        workflows: state.workflows.filter(
+        automations: state.automations.filter(
-          (workflow: Workflow) => workflow.id !== action.workflow.id,
+          (automation: Automation) => automation.id !== action.automation.id,
         ),
       };
     default:

mailpoet/assets/js/src/automation/listing/store/selectors.ts

@@ -1,11 +1,11 @@
 import { State } from './types';
-import { Workflow } from '../workflow';
+import { Automation } from '../automation';
-import { workflowCount } from '../../config';
+import { automationCount } from '../../config';
 
-export function getWorkflows(state: State): Workflow[] {
+export function getAutomations(state: State): Automation[] {
-  return state.workflows;
+  return state.automations;
 }
 
-export function getWorkflowCount(state: State): number {
+export function getAutomationCount(state: State): number {
-  return state.workflows ? state.workflows.length : workflowCount;
+  return state.automations ? state.automations.length : automationCount;
 }

mailpoet/assets/js/src/automation/listing/store/types.ts

@@ -1,5 +1,5 @@
-import { Workflow } from '../workflow';
+import { Automation } from '../automation';
 
 export type State = {
-  workflows?: Workflow[];
+  automations?: Automation[];
 };

mailpoet/assets/js/src/automation/sections/build-your-own-section.tsx

@@ -15,13 +15,13 @@ export function BuildYourOwnSection(): JSX.Element {
       image: `${MailPoet.cdnUrl}automation/sections/start-with-a-trigger.png`,
     },
     {
-      slug: 'customize-your-workflow',
+      slug: 'customize-your-automation',
       title: __('Customize your automation', 'mailpoet'),
       text: __(
         'Choose steps and create a custom journey to best suit your needs.',
         'mailpoet',
       ),
-      image: `${MailPoet.cdnUrl}automation/sections/customize-your-workflow.png`,
+      image: `${MailPoet.cdnUrl}automation/sections/customize-your-automation.png`,
     },
     {
       slug: 'design-your-email',

mailpoet/assets/js/src/automation/sections/templates-section.tsx

@@ -1,11 +1,11 @@
 import { __ } from '@wordpress/i18n';
 import { Button } from '@wordpress/components';
 import { MailPoet } from '../../mailpoet';
-import { workflowTemplates } from '../templates/config';
+import { automationTemplates } from '../templates/config';
 import { TemplateListItem } from '../templates/components/template-list-item';
 
 export function TemplatesSection(): JSX.Element {
-  const templates = workflowTemplates.slice(0, 3);
+  const templates = automationTemplates.slice(0, 3);
 
   return (
     <section className="mailpoet-automation-section">

mailpoet/assets/js/src/automation/templates/components/template-list-item.tsx

@@ -1,30 +1,59 @@
+import { useCallback, useState } from 'react';
+import apiFetch from '@wordpress/api-fetch';
 import { Button } from '@wordpress/components';
 import { addQueryArgs } from '@wordpress/url';
 import { __ } from '@wordpress/i18n';
-import { WorkflowTemplate } from '../config';
+import { AutomationTemplate } from '../config';
-import { useMutation } from '../../api';
 import { MailPoet } from '../../../mailpoet';
 import { Notice } from '../../../notices/notice';
+import {
+  PremiumModal,
+  premiumValidAndActive,
+} from '../../../common/premium_modal';
 
 type TemplateListItemProps = {
-  template: WorkflowTemplate;
+  template: AutomationTemplate;
   heading?: 'h2' | 'h3';
 };
+
+const useCreateFromTemplate = () => {
+  const [state, setState] = useState({
+    data: undefined,
+    loading: false,
+    error: undefined,
+  });
+
+  const create = useCallback(async (slug: string) => {
+    setState((prevState) => ({ ...prevState, loading: true }));
+    try {
+      const data = await apiFetch({
+        path: `/automations/create-from-template`,
+        method: 'POST',
+        data: { slug },
+      });
+      setState((prevState) => ({ ...prevState, data }));
+    } catch (error) {
+      setState((prevState) => ({ ...prevState, error }));
+    } finally {
+      setState((prevState) => ({ ...prevState, loading: false }));
+    }
+  }, []);
+
+  return [create, state] as const;
+};
+
 export function TemplateListItem({
   template,
   heading,
 }: TemplateListItemProps): JSX.Element {
-  const [createWorkflowFromTemplate, { loading, error, data }] = useMutation(
+  const [showPremium, setShowPremium] = useState(false);
-    'workflows/create-from-template',
+  const [createAutomationFromTemplate, { loading, error, data }] =
-    {
+    useCreateFromTemplate();
-      method: 'POST',
-      body: JSON.stringify({
-        slug: template.slug,
-      }),
-    },
-  );
 
   if (!error && data) {
+    MailPoet.trackEvent('Automations > Template selected', {
+      'Automation slug': template.slug,
+    });
     window.location.href = addQueryArgs(MailPoet.urls.automationEditor, {
       id: data.data.id,
     });
@@ -45,19 +74,50 @@ export function TemplateListItem({
 
   const headingTag = heading ?? 'h2';
   return (
-    <li className="mailpoet-automation-template-list-item">
+    <li
+      className={`mailpoet-automation-template-list-item mailpoet-automation-template-list-item-${template.type}`}
+    >
       {notice}
       <Button
         isBusy={loading}
+        disabled={template.type === 'coming-soon'}
         onClick={() => {
-          void createWorkflowFromTemplate();
+          if (template.type === 'premium' && !premiumValidAndActive) {
+            setShowPremium(true);
+            return;
+          }
+          void createAutomationFromTemplate(template.slug);
         }}
       >
+        <div className="badge">
+          {template.type === 'coming-soon' && (
+            <span>{__('Coming soon', 'mailpoet')}</span>
+          )}
+          {template.type === 'premium' && (
+            <span>{__('Premium', 'mailpoet')}</span>
+          )}
+        </div>
         {headingTag === 'h3' && <h3>{template.name}&nbsp;→</h3>}
         {headingTag === 'h2' && <h2>{template.name}&nbsp;→</h2>}
 
         <p>{template.description}</p>
       </Button>
+      {showPremium && (
+        <PremiumModal
+          onRequestClose={() => {
+            setShowPremium(false);
+          }}
+          tracking={{
+            utm_medium: 'upsell_modal',
+            utm_campaign: 'automation_premium_template',
+          }}
+        >
+          {__(
+            'All templates and fully configurable automations are available in the premium version.',
+            'mailpoet',
+          )}
+        </PremiumModal>
+      )}
     </li>
   );
 }

mailpoet/assets/js/src/automation/templates/config.ts

@@ -1,13 +1,14 @@
-export type WorkflowTemplate = {
+export type AutomationTemplate = {
   slug: string;
   name: string;
   description: string;
+  type: 'default' | 'free-only' | 'premium' | 'coming-soon';
 };
 
 declare global {
   interface Window {
-    mailpoet_automation_templates: WorkflowTemplate[];
+    mailpoet_automation_templates: AutomationTemplate[];
   }
 }
 
-export const workflowTemplates = window.mailpoet_automation_templates;
+export const automationTemplates = window.mailpoet_automation_templates;

mailpoet/assets/js/src/automation/templates/index.tsx

@@ -1,7 +1,7 @@
 import ReactDOM from 'react-dom';
 import { __ } from '@wordpress/i18n';
 import { Flex } from '@wordpress/components';
-import { workflowTemplates } from './config';
+import { automationTemplates } from './config';
 import { TemplateListItem } from './components/template-list-item';
 import { initializeApi } from '../api';
 import { registerTranslations } from '../i18n';
@@ -23,7 +23,7 @@ function Templates(): JSX.Element {
       </Flex>
 
       <ul className="mailpoet-automation-templates">
-        {workflowTemplates.map((template) => (
+        {automationTemplates.map((template) => (
           <TemplateListItem key={template.slug} template={template} />
         ))}
         <FromScratchListItem />

mailpoet/assets/js/src/automation/testing.tsx

@@ -1,84 +0,0 @@
-import { ReactNode } from 'react';
-import { useMutation } from './api';
-import { Step, Workflow } from './editor/components/workflow/types';
-
-export const createRootStep = (): Step => ({
-  id: 'root',
-  type: 'root',
-  key: 'core:root',
-  args: {},
-  next_steps: [],
-});
-
-const createWorkflow = (): Partial<Workflow> => ({
-  name: 'Empty workflow',
-  steps: {
-    root: createRootStep(),
-  },
-});
-
-export function CreateEmptyWorkflowButton(): JSX.Element {
-  const [createSchema, { loading, error }] = useMutation('workflows', {
-    method: 'POST',
-  });
-
-  return (
-    <div>
-      <button
-        className="button"
-        type="button"
-        onClick={async () => {
-          await createSchema({
-            body: JSON.stringify(createWorkflow()),
-          });
-          window.location.reload();
-        }}
-        disabled={loading}
-      >
-        Create empty workflow (premium required)
-      </button>
-      {error && (
-        <div>{error?.data?.message ?? 'An unknown error occurred'}</div>
-      )}
-    </div>
-  );
-}
-
-type TemplateButtonProps = {
-  slug: string;
-  children?: ReactNode;
-};
-
-export function CreateWorkflowFromTemplateButton({
-  slug,
-  children,
-}: TemplateButtonProps): JSX.Element {
-  const [createWorkflowFromTemplate, { loading, error }] = useMutation(
-    'workflows/create-from-template',
-    {
-      method: 'POST',
-      body: JSON.stringify({
-        slug,
-      }),
-    },
-  );
-
-  return (
-    <div>
-      <button
-        className="button button-primary"
-        type="button"
-        onClick={async () => {
-          await createWorkflowFromTemplate();
-          window.location.reload();
-        }}
-        disabled={loading}
-      >
-        {children}
-      </button>
-      {error && (
-        <div>{error?.data?.message ?? 'An unknown error occurred'}</div>
-      )}
-    </div>
-  );
-}

mailpoet/assets/js/src/automation/types/filters.ts

@@ -7,7 +7,7 @@ import { Dispatch } from 'react';
 import { DropdownMenu } from '@wordpress/components';
 import { StoreConfig } from '@wordpress/data';
 import { Item } from '../editor/components/inserter/item';
-import { Step } from '../editor/components/workflow/types';
+import { Step } from '../editor/components/automation/types';
 import { State } from '../editor/store/types';
 
 export type MoreControlType = {
@@ -20,17 +20,17 @@ export type MoreControlType = {
  * APPLICATION HOOKS
  */
 
-// mailpoet.automation.workflow.step.more-controls
+// mailpoet.automation.step.more-controls
 // mailpoet.automation.hero.actions
 export type StepMoreControlsType = Record<string, MoreControlType>;
 
-// mailpoet.automation.workflow.add_step_callback
+// mailpoet.automation.add_step_callback
 export type AddStepCallbackType = (item?: Item) => void;
 
-// mailpoet.automation.workflow.render_step
+// mailpoet.automation.render_step
 export type RenderStepType = (step: Step) => JSX.Element;
 
-// mailpoet.automation.workflow.render_step_separator
+// mailpoet.automation.render_step_separator
 export type RenderStepSeparatorType = (step: Step) => JSX.Element;
 
 // mailpoet.automation.editor.create_store

mailpoet/assets/js/src/common/listings/_stories/newsletter_stats.tsx

@@ -6,14 +6,14 @@ MailPoet.I18n.add('excellentBadgeName', 'Excellent');
 MailPoet.I18n.add('excellentBadgeTooltip', 'Congrats!');
 MailPoet.I18n.add('goodBadgeName', 'Good');
 MailPoet.I18n.add('goodBadgeTooltip', 'Good stuff.');
-MailPoet.I18n.add('averageBadgeName', 'Average');
+MailPoet.I18n.add('criticalBadgeName', 'Critical');
-MailPoet.I18n.add('averageBadgeTooltip', 'Something to improve.');
+MailPoet.I18n.add('criticalBadgeTooltip', 'Something to improve.');
 MailPoet.I18n.add('openedStatTooltipExcellent', 'above 30%');
 MailPoet.I18n.add('openedStatTooltipGood', 'between 10 and 30%');
-MailPoet.I18n.add('openedStatTooltipAverage', 'under 10%');
+MailPoet.I18n.add('openedStatTooltipCritical', 'under 10%');
 MailPoet.I18n.add('clickedStatTooltipExcellent', 'above 3%');
 MailPoet.I18n.add('clickedStatTooltipGood', 'between 1 and 3%');
-MailPoet.I18n.add('clickedStatTooltipAverage', 'under 1%');
+MailPoet.I18n.add('clickedStatTooltipCritical', 'under 1%');
 MailPoet.I18n.add(
   'revenueStatsTooltipShort',
   'Revenues by customer who clicked on this email in the last 2 weeks.',

mailpoet/assets/js/src/common/listings/newsletter_stats.tsx

@@ -42,6 +42,12 @@ export function NewsletterStats({
             rate={clicked}
             tooltipId={`clicked-${newsletterId || '0'}`}
           />
+          <br />
+          <StatsBadge
+            stat="opened"
+            rate={opened}
+            tooltipId={`opened-${newsletterId || '0'}`}
+          />
         </div>
       )}
     </div>

mailpoet/assets/js/src/common/listings/newsletter_stats/badge.tsx

@@ -8,7 +8,7 @@ type BadgeProps = {
   tooltip?: string | ReactNode;
   tooltipId?: string;
   tooltipPlace?: Place;
-  type?: 'average' | 'good' | 'excellent' | 'unknown';
+  type?: 'average' | 'good' | 'excellent' | 'critical' | 'unknown';
   isInverted?: boolean;
 };
 

mailpoet/assets/js/src/common/listings/newsletter_stats/stats.tsx

@@ -13,21 +13,39 @@ type StatsBadgeProps = {
 const stats = {
   opened: {
     badgeRanges: [30, 10, 0],
-    badgeTypes: ['excellent', 'good', 'average'],
+    badgeTypes: ['excellent', 'good', 'critical'],
-    tooltipText: [
+    tooltipText: {
-      MailPoet.I18n.t('openedStatTooltipExcellent'),
+      excellent: MailPoet.I18n.t('openedStatTooltipExcellent'),
-      MailPoet.I18n.t('openedStatTooltipGood'),
+      good: MailPoet.I18n.t('openedStatTooltipGood'),
-      MailPoet.I18n.t('openedStatTooltipAverage'),
+      critical: MailPoet.I18n.t('openedStatTooltipCritical'),
-    ],
+    },
   },
   clicked: {
     badgeRanges: [3, 1, 0],
-    badgeTypes: ['excellent', 'good', 'average'],
+    badgeTypes: ['excellent', 'good', 'critical'],
-    tooltipText: [
+    tooltipText: {
-      MailPoet.I18n.t('clickedStatTooltipExcellent'),
+      excellent: MailPoet.I18n.t('clickedStatTooltipExcellent'),
-      MailPoet.I18n.t('clickedStatTooltipGood'),
+      good: MailPoet.I18n.t('clickedStatTooltipGood'),
-      MailPoet.I18n.t('clickedStatTooltipAverage'),
+      critical: MailPoet.I18n.t('clickedStatTooltipCritical'),
-    ],
+    },
+  },
+  bounced: {
+    badgeRanges: [1.5, 0.5, 0],
+    badgeTypes: ['critical', 'good', 'excellent'],
+    tooltipText: {
+      excellent: MailPoet.I18n.t('bouncedStatTooltipExcellent'),
+      good: MailPoet.I18n.t('bouncedStatTooltipGood'),
+      critical: MailPoet.I18n.t('bouncedStatTooltipCritical'),
+    },
+  },
+  unsubscribed: {
+    badgeRanges: [0.7, 0.3, 0],
+    badgeTypes: ['critical', 'good', 'excellent'],
+    tooltipText: {
+      excellent: MailPoet.I18n.t('unsubscribeStatTooltipExcellent'),
+      good: MailPoet.I18n.t('unsubscribeStatTooltipGood'),
+      critical: MailPoet.I18n.t('unsubscribeStatTooltipCritical'),
+    },
   },
 };
 
@@ -60,9 +78,9 @@ function StatsBadge(props: StatsBadgeProps) {
       name: MailPoet.I18n.t('goodBadgeName'),
       tooltipTitle: MailPoet.I18n.t('goodBadgeTooltip'),
     },
-    average: {
+    critical: {
-      name: MailPoet.I18n.t('averageBadgeName'),
+      name: MailPoet.I18n.t('criticalBadgeName'),
-      tooltipTitle: MailPoet.I18n.t('averageBadgeTooltip'),
+      tooltipTitle: MailPoet.I18n.t('criticalBadgeTooltip'),
     },
   };
 
@@ -86,15 +104,15 @@ function StatsBadge(props: StatsBadgeProps) {
       <div className="mailpoet-listing-stats-tooltip-content">
         <Badge type="excellent" name={badges.excellent.name} />
         {' : '}
-        {stat.tooltipText[0]}
+        {stat.tooltipText.excellent}
         <br />
         <Badge type="good" name={badges.good.name} />
         {' : '}
-        {stat.tooltipText[1]}
+        {stat.tooltipText.good}
         <br />
-        <Badge type="average" name={badges.average.name} />
+        <Badge type="critical" name={badges.critical.name} />
         {' : '}
-        {stat.tooltipText[2]}
+        {stat.tooltipText.critical}
       </div>
     </div>
   );

mailpoet/assets/js/src/common/premium_modal/index.tsx

@@ -22,7 +22,8 @@ import {
   UtmParams,
 } from './upgrade_info';
 
-const premiumValidAndActive = premiumFeaturesEnabled && MailPoet.premiumActive;
+export const premiumValidAndActive =
+  premiumFeaturesEnabled && MailPoet.premiumActive;
 
 type Props = Omit<ComponentProps<typeof Modal>, 'title' | 'onRequestClose'> & {
   // Fix type from "@types/wordpress__components" where it is defined as a union of event

mailpoet/assets/js/src/common/tag/_stories/tag.tsx

@@ -61,6 +61,20 @@ export function Tags() {
         Excellent
       </Tag>
       <div className="mailpoet-gap" />
+      <Tag dimension="large" variant="critical">
+        Critical
+      </Tag>
+      &nbsp;
+      <Tag dimension="large" variant="critical" isInverted>
+        Critical
+      </Tag>
+      <br />
+      <Tag variant="critical">Critical</Tag>
+      &nbsp;
+      <Tag variant="critical" isInverted>
+        Critical
+      </Tag>
+      <div className="mailpoet-gap" />
       <Tag dimension="large" variant="wordpress">
         WordPress
       </Tag>

mailpoet/assets/js/src/common/tag/tag.tsx

@@ -1,9 +1,18 @@
 import { ReactNode } from 'react';
 import classnames from 'classnames';
 
+export type TagVariant =
+  | 'average'
+  | 'good'
+  | 'excellent'
+  | 'critical'
+  | 'list'
+  | 'unknown'
+  | 'wordpress';
+
 type Props = {
   children?: ReactNode;
-  variant?: 'average' | 'good' | 'excellent' | 'list' | 'unknown' | 'wordpress';
+  variant?: TagVariant;
   dimension?: 'large';
   isInverted?: boolean;
   className?: string;

mailpoet/assets/js/src/common/tag/tags.tsx

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { Tag } from './tag';
+import { Tag, TagVariant } from './tag';
 import { Tooltip } from '../tooltip/tooltip';
 import { MailPoet } from '../../mailpoet';
 
@@ -21,7 +21,7 @@ type Props = {
   segments?: Segment[];
   subscriberTags?: SubscriberTag[];
   strings?: string[];
-  variant?: 'average' | 'good' | 'excellent' | 'list' | 'unknown' | 'wordpress';
+  variant?: TagVariant;
   isInverted?: boolean;
 };
 

mailpoet/assets/js/src/newsletter_editor/components/save.js

@@ -122,7 +122,7 @@ Module.SaveView = Marionette.View.extend({
     'click .mailpoet_save_activate_wc_customizer_button':
       'activateWooCommerceCustomizer',
     /* Automation email */
-    'click .mailpoet_save_go_to_workflow': 'saveAndGoToWorkflow',
+    'click .mailpoet_save_go_to_automation': 'saveAndGoToAutomation',
     'click .mailpoet_show_preview': 'showPreview',
   },
 
@@ -316,13 +316,13 @@ Module.SaveView = Marionette.View.extend({
       });
     }
   },
-  saveAndGoToWorkflow: function () {
+  saveAndGoToAutomation: function () {
     this.hideSaveOptions();
     Module._cancelAutosave();
     Module.save().done(function () {
       const newsletter = App.getNewsletter();
-      const workflowId = newsletter.get('options').get('workflowId');
+      const automationId = newsletter.get('options').get('automationId');
-      const goToUrl = `admin.php?page=mailpoet-automation-editor&id=${workflowId}`;
+      const goToUrl = `admin.php?page=mailpoet-automation-editor&id=${automationId}`;
       window.location.href = goToUrl;
     });
   },

mailpoet/assets/js/src/newsletter_editor/initializer.jsx

@@ -18,8 +18,8 @@ const renderHeading = (newsletterType, newsletterOptions) => {
       window.location = `admin.php?page=mailpoet-newsletters`;
     };
     if (newsletterType === 'automation') {
-      const workflowId = newsletterOptions.workflowId;
+      const automationId = newsletterOptions.automationId;
-      const goToUrl = `admin.php?page=mailpoet-automation-editor&id=${workflowId}`;
+      const goToUrl = `admin.php?page=mailpoet-automation-editor&id=${automationId}`;
       onLogoClick = () => {
         window.location = goToUrl;
       };
@@ -27,7 +27,7 @@ const renderHeading = (newsletterType, newsletterOptions) => {
       const onClickPreview = () =>
         document.querySelector('.mailpoet_show_preview').click();
       const onClickSave = () =>
-        document.querySelector('.mailpoet_save_go_to_workflow').click();
+        document.querySelector('.mailpoet_save_go_to_automation').click();
       buttons = (
         <>
           <input

mailpoet/assets/js/src/newsletters/campaign_stats/newsletter_general_stats.tsx

@@ -17,6 +17,9 @@ type Props = {
 
 const minNewslettersSent = 20;
 const minNewslettersOpened = 5;
+const minUnsubscribedStat = 5;
+const minBouncedStat = 5;
+const minNewslettersSentForBouncedAndUnsubscribed = 100;
 
 // When percentage value is lower then 0.1 we want to display value with two decimal places
 const formatWithOptimalPrecision = (value: number) => {
@@ -24,6 +27,16 @@ const formatWithOptimalPrecision = (value: number) => {
   return MailPoet.Num.toLocaleFixed(value, precision);
 };
 
+/*
+ * FormatForStats
+ * always round-up to one decimal place
+ * in stats.tsx, we are comparing against 0, 0.3, 0.5, 0.7, 1.5, etc
+ */
+const formatForStats = (value: number): number => {
+  const numValue = +value;
+  return +numValue.toFixed(1);
+};
+
 export function NewsletterGeneralStats({
   newsletter,
   isWoocommerceActive,
@@ -61,14 +74,35 @@ export function NewsletterGeneralStats({
     totalSent >= minNewslettersSent &&
     newsletter.statistics.opened >= minNewslettersOpened;
 
+  const displayUnsubscribedBadge =
+    newsletter.statistics.unsubscribed >= minUnsubscribedStat &&
+    totalSent >= minNewslettersSentForBouncedAndUnsubscribed;
+  const displayBouncedBadge =
+    newsletter.statistics.bounced >= minBouncedStat &&
+    totalSent >= minNewslettersSentForBouncedAndUnsubscribed;
+
+  const badgeTypeOpened = getBadgeType('opened', percentageOpened) || '';
   const opened = (
-    <div className="mailpoet-statistics-value-small">
+    <>
-      <span className="mailpoet-statistics-value-number">
+      <div className="mailpoet-statistics-value-small">
-        {percentageOpenedDisplay}
+        <span
-        {'% '}
+          className={`mailpoet-statistics-value-number mailpoet-statistics-value-number-${badgeTypeOpened}`}
-      </span>
+        >
-      {MailPoet.I18n.t('percentageOpened')}
+          {percentageOpenedDisplay}
-    </div>
+          {'% '}
+        </span>
+        {MailPoet.I18n.t('percentageOpened')}
+      </div>
+      {displayBadges && (
+        <StatsBadge
+          isInverted={false}
+          stat="opened"
+          rate={percentageOpened}
+          tooltipId={`opened-${newsletter.id || '0'}`}
+          tooltipPlace="right"
+        />
+      )}
+    </>
   );
 
   const machineOpened = (
@@ -100,24 +134,60 @@ export function NewsletterGeneralStats({
     </div>
   );
 
+  const formattedPercentageUnsubscribed = formatForStats(
+    percentageUnsubscribed,
+  );
+  const badgeTypeUnsubscribed = displayUnsubscribedBadge
+    ? getBadgeType('unsubscribed', formattedPercentageUnsubscribed)
+    : '';
   const unsubscribed = (
-    <div className="mailpoet-statistics-value-small">
+    <>
-      <span className="mailpoet-statistics-value-number">
+      <div className="mailpoet-statistics-value-small">
-        {percentageUnsubscribedDisplay}
+        <span
-        {'% '}
+          className={`mailpoet-statistics-value-number mailpoet-statistics-value-number-${badgeTypeUnsubscribed}`}
-      </span>
+        >
-      {MailPoet.I18n.t('percentageUnsubscribed')}
+          {percentageUnsubscribedDisplay}
-    </div>
+          {'% '}
+        </span>
+        {MailPoet.I18n.t('percentageUnsubscribed')}
+      </div>
+      {displayUnsubscribedBadge && (
+        <StatsBadge
+          isInverted={false}
+          stat="unsubscribed"
+          rate={formattedPercentageUnsubscribed}
+          tooltipId={`unsubscribed-${newsletter.id || '0'}`}
+          tooltipPlace="right"
+        />
+      )}
+    </>
   );
 
+  const formattedPercentageBounced = formatForStats(percentageBounced);
+  const badgeTypeBounced = displayBouncedBadge
+    ? getBadgeType('bounced', formattedPercentageBounced)
+    : '';
   const bounced = (
-    <div className="mailpoet-statistics-value-small">
+    <>
-      <span className="mailpoet-statistics-value-number">
+      <div className="mailpoet-statistics-value-small">
-        {percentageBouncedDisplay}
+        <span
-        {'% '}
+          className={`mailpoet-statistics-value-number mailpoet-statistics-value-number-${badgeTypeBounced}`}
-      </span>
+        >
-      {MailPoet.I18n.t('percentageBounced')}
+          {percentageBouncedDisplay}
-    </div>
+          {'% '}
+        </span>
+        {MailPoet.I18n.t('percentageBounced')}
+      </div>
+      {displayBouncedBadge && (
+        <StatsBadge
+          isInverted={false}
+          stat="bounced"
+          rate={formattedPercentageBounced}
+          tooltipId={`bounced-${newsletter.id || '0'}`}
+          tooltipPlace="right"
+        />
+      )}
+    </>
   );
 
   const badgeTypeClicked = getBadgeType('clicked', percentageClicked);

mailpoet/assets/js/src/newsletters/campaign_stats/page.tsx

@@ -99,6 +99,10 @@ function CampaignStatsPageComponent({ match, history, location }: Props) {
     );
   }
 
+  if (!newsletter) {
+    return <h3> {MailPoet.I18n.t('emailDoesNotExist')} </h3>;
+  }
+
   return (
     <>
       <HideScreenOptions />

mailpoet/assets/js/src/newsletters/send.jsx

@@ -203,11 +203,11 @@ class NewsletterSendComponent extends Component {
             : null;
         const item = response.data;
         // Automation type emails should redirect
-        // to an associated workflow from the send page
+        // to an associated automation from the send page
         if (item.type === 'automation') {
-          const workflowId = item.options?.workflowId;
+          const automationId = item.options?.automationId;
-          const goToUrl = workflowId
+          const goToUrl = automationId
-            ? `admin.php?page=mailpoet-automation-editor&id=${workflowId}`
+            ? `admin.php?page=mailpoet-automation-editor&id=${automationId}`
             : '/new';
           return this.setState(
             {

mailpoet/assets/js/src/newsletters/templates.jsx

@@ -317,9 +317,9 @@ class NewsletterTemplates extends Component {
     let buttons = null;
     let onClick;
     if (this.state.emailType === 'automation') {
-      const workflowId = this.state.emailOptions?.workflowId;
+      const automationId = this.state.emailOptions?.automationId;
-      const goToUrl = workflowId
+      const goToUrl = automationId
-        ? `admin.php?page=mailpoet-automation-editor&id=${workflowId}`
+        ? `admin.php?page=mailpoet-automation-editor&id=${automationId}`
         : 'admin.php?page=mailpoet-automation';
       onClick = () => {
         window.location = goToUrl;

mailpoet/lib/API/MP/v1/Subscribers.php

@@ -5,7 +5,6 @@ namespace MailPoet\API\MP\v1;
 use MailPoet\API\JSON\ResponseBuilders\SubscribersResponseBuilder;
 use MailPoet\Entities\SegmentEntity;
 use MailPoet\Entities\SubscriberEntity;
-use MailPoet\Features\FeaturesController;
 use MailPoet\Listing\ListingDefinition;
 use MailPoet\Newsletter\Scheduler\WelcomeScheduler;
 use MailPoet\Segments\SegmentsRepository;
@@ -54,9 +53,6 @@ class Subscribers {
   /** @var SubscriberSaveController */
   private $subscriberSaveController;
 
-  /** @var FeaturesController */
-  private $featuresController;
-
   /** @var RequiredCustomFieldValidator */
   private $requiredCustomFieldsValidator;
 
@@ -76,7 +72,6 @@ class Subscribers {
     SubscriberSaveController $subscriberSaveController,
     SubscribersResponseBuilder $subscribersResponseBuilder,
     WelcomeScheduler $welcomeScheduler,
-    FeaturesController $featuresController,
     RequiredCustomFieldValidator $requiredCustomFieldsValidator,
     SubscriberListingRepository $subscriberListingRepository,
     WPFunctions $wp
@@ -90,7 +85,6 @@ class Subscribers {
     $this->subscriberSaveController = $subscriberSaveController;
     $this->subscribersResponseBuilder = $subscribersResponseBuilder;
     $this->welcomeScheduler = $welcomeScheduler;
-    $this->featuresController = $featuresController;
     $this->requiredCustomFieldsValidator = $requiredCustomFieldsValidator;
     $this->wp = $wp;
     $this->subscriberListingRepository = $subscriberListingRepository;
@@ -202,10 +196,7 @@ class Subscribers {
       }
 
       // when global status changes to subscribed, fire subscribed hook for all subscribed segments
-      if (
+      if ($subscriber->getStatus() === SubscriberEntity::STATUS_SUBSCRIBED) {
-        $this->featuresController->isSupported(FeaturesController::AUTOMATION)
-        && $subscriber->getStatus() === SubscriberEntity::STATUS_SUBSCRIBED
-      ) {
         $subscriberSegments = $subscriber->getSubscriberSegments();
         foreach ($subscriberSegments as $subscriberSegment) {
           if ($subscriberSegment->getStatus() === SubscriberEntity::STATUS_SUBSCRIBED) {

mailpoet/lib/AdminPages/Pages/Automation.php

@@ -3,10 +3,9 @@
 namespace MailPoet\AdminPages\Pages;
 
 use MailPoet\AdminPages\PageRenderer;
-use MailPoet\Automation\Engine\Data\WorkflowTemplate;
+use MailPoet\Automation\Engine\Data\AutomationTemplate;
-use MailPoet\Automation\Engine\Migrations\Migrator;
+use MailPoet\Automation\Engine\Storage\AutomationStorage;
-use MailPoet\Automation\Engine\Storage\WorkflowStorage;
+use MailPoet\Automation\Engine\Storage\AutomationTemplateStorage;
-use MailPoet\Automation\Engine\Storage\WorkflowTemplateStorage;
 use MailPoet\Form\AssetsController;
 use MailPoet\WP\Functions as WPFunctions;
 
@@ -14,51 +13,42 @@ class Automation {
   /** @var AssetsController */
   private $assetsController;
 
-  /** @var Migrator */
-  private $migrator;
-
   /** @var PageRenderer */
   private $pageRenderer;
 
   /** @var WPFunctions */
   private $wp;
 
-  /** @var WorkflowStorage */
+  /** @var AutomationStorage */
-  private $workflowStorage;
+  private $automationStorage;
 
-  /** @var WorkflowTemplateStorage  */
+  /** @var AutomationTemplateStorage  */
   private $templateStorage;
 
   public function __construct(
     AssetsController $assetsController,
-    Migrator $migrator,
     PageRenderer $pageRenderer,
     WPFunctions $wp,
-    WorkflowStorage $workflowStorage,
+    AutomationStorage $automationStorage,
-    WorkflowTemplateStorage $templateStorage
+    AutomationTemplateStorage $templateStorage
   ) {
     $this->assetsController = $assetsController;
-    $this->migrator = $migrator;
     $this->pageRenderer = $pageRenderer;
     $this->wp = $wp;
-    $this->workflowStorage = $workflowStorage;
+    $this->automationStorage = $automationStorage;
     $this->templateStorage = $templateStorage;
   }
 
   public function render() {
     $this->assetsController->setupAutomationListingDependencies();
-
-    if (!$this->migrator->hasSchema()) {
-      $this->migrator->createSchema();
-    }
     $this->pageRenderer->displayPage('automation.html', [
       'api' => [
         'root' => rtrim($this->wp->escUrlRaw($this->wp->restUrl()), '/'),
         'nonce' => $this->wp->wpCreateNonce('wp_rest'),
       ],
-      'workflowCount' => $this->workflowStorage->getWorkflowCount(),
+      'automationCount' => $this->automationStorage->getAutomationCount(),
       'templates' => array_map(
-        function(WorkflowTemplate $template): array {
+        function(AutomationTemplate $template): array {
           return $template->toArray();
         },
         $this->templateStorage->getTemplates()

mailpoet/lib/AdminPages/Pages/AutomationEditor.php

@@ -3,11 +3,11 @@
 namespace MailPoet\AdminPages\Pages;
 
 use MailPoet\AdminPages\PageRenderer;
-use MailPoet\Automation\Engine\Data\Workflow;
+use MailPoet\Automation\Engine\Data\Automation;
 use MailPoet\Automation\Engine\Hooks;
-use MailPoet\Automation\Engine\Mappers\WorkflowMapper;
+use MailPoet\Automation\Engine\Mappers\AutomationMapper;
 use MailPoet\Automation\Engine\Registry;
-use MailPoet\Automation\Engine\Storage\WorkflowStorage;
+use MailPoet\Automation\Engine\Storage\AutomationStorage;
 use MailPoet\Form\AssetsController;
 use MailPoet\Segments\SegmentsRepository;
 use MailPoet\WP\Functions as WPFunctions;
@@ -17,11 +17,11 @@ class AutomationEditor {
   /** @var AssetsController */
   private $assetsController;
 
-  /** @var WorkflowMapper */
+  /** @var AutomationMapper */
-  private $workflowMapper;
+  private $automationMapper;
 
-  /** @var WorkflowStorage */
+  /** @var AutomationStorage */
-  private $workflowStorage;
+  private $automationStorage;
 
   /** @var PageRenderer */
   private $pageRenderer;
@@ -37,16 +37,16 @@ class AutomationEditor {
 
   public function __construct(
     AssetsController $assetsController,
-    WorkflowMapper $workflowMapper,
+    AutomationMapper $automationMapper,
-    WorkflowStorage $workflowStorage,
+    AutomationStorage $automationStorage,
     PageRenderer $pageRenderer,
     Registry $registry,
     SegmentsRepository $segmentsRepository,
     WPFunctions $wp
   ) {
     $this->assetsController = $assetsController;
-    $this->workflowMapper = $workflowMapper;
+    $this->automationMapper = $automationMapper;
-    $this->workflowStorage = $workflowStorage;
+    $this->automationStorage = $automationStorage;
     $this->pageRenderer = $pageRenderer;
     $this->registry = $registry;
     $this->segmentsRepository = $segmentsRepository;
@@ -60,8 +60,8 @@ class AutomationEditor {
 
     $this->wp->doAction(Hooks::EDITOR_BEFORE_LOAD, (int)$id);
 
-    $workflow = $id ? $this->workflowStorage->getWorkflow($id) : null;
+    $automation = $id ? $this->automationStorage->getAutomation($id) : null;
-    if (!$workflow) {
+    if (!$automation) {
       $notice = new WPNotice(
         WPNotice::TYPE_ERROR,
         __('Automation not found.', 'mailpoet')
@@ -71,7 +71,7 @@ class AutomationEditor {
       return;
     }
 
-    if ($workflow->getStatus() === Workflow::STATUS_TRASH) {
+    if ($automation->getStatus() === Automation::STATUS_TRASH) {
       $this->wp->wpSafeRedirect($this->wp->adminUrl('admin.php?page=mailpoet-automation&status=trash'));
       exit();
     }
@@ -83,7 +83,7 @@ class AutomationEditor {
     $roles = new \WP_Roles();
     $this->pageRenderer->displayPage('automation/editor.html', [
       'context' => $this->buildContext(),
-      'workflow' => $this->workflowMapper->buildWorkflow($workflow),
+      'automation' => $this->automationMapper->buildAutomation($automation),
       'sub_menu' => 'mailpoet-automation',
       'api' => [
         'root' => rtrim($this->wp->escUrlRaw($this->wp->restUrl()), '/'),

mailpoet/lib/AdminPages/Pages/AutomationTemplates.php

@@ -3,8 +3,8 @@
 namespace MailPoet\AdminPages\Pages;
 
 use MailPoet\AdminPages\PageRenderer;
-use MailPoet\Automation\Engine\Data\WorkflowTemplate;
+use MailPoet\Automation\Engine\Data\AutomationTemplate;
-use MailPoet\Automation\Engine\Storage\WorkflowTemplateStorage;
+use MailPoet\Automation\Engine\Storage\AutomationTemplateStorage;
 use MailPoet\Form\AssetsController;
 use MailPoet\WP\Functions as WPFunctions;
 
@@ -15,7 +15,7 @@ class AutomationTemplates {
   /** @var PageRenderer */
   private $pageRenderer;
 
-  /** @var WorkflowTemplateStorage  */
+  /** @var AutomationTemplateStorage  */
   private $templateStorage;
 
   /** @var WPFunctions */
@@ -24,7 +24,7 @@ class AutomationTemplates {
   public function __construct(
     AssetsController $assetsController,
     PageRenderer $pageRenderer,
-    WorkflowTemplateStorage $templateStorage,
+    AutomationTemplateStorage $templateStorage,
     WPFunctions $wp
   ) {
     $this->assetsController = $assetsController;
@@ -45,7 +45,7 @@ class AutomationTemplates {
           'nonce' => $this->wp->wpCreateNonce('wp_rest'),
         ],
         'templates' => array_map(
-          function(WorkflowTemplate $template): array {
+          function(AutomationTemplate $template): array {
             return $template->toArray();
           },
           $this->templateStorage->getTemplates()

mailpoet/lib/Analytics/Reporter.php

@@ -2,13 +2,12 @@
 
 namespace MailPoet\Analytics;
 
+use MailPoet\Automation\Engine\Data\Automation;
 use MailPoet\Automation\Engine\Data\Step;
-use MailPoet\Automation\Engine\Data\Workflow;
+use MailPoet\Automation\Engine\Storage\AutomationStorage;
-use MailPoet\Automation\Engine\Storage\WorkflowStorage;
 use MailPoet\Config\ServicesChecker;
 use MailPoet\Cron\CronTrigger;
 use MailPoet\Entities\DynamicSegmentFilterData;
-use MailPoet\Features\FeaturesController;
 use MailPoet\Listing\ListingDefinition;
 use MailPoet\Newsletter\NewslettersRepository;
 use MailPoet\Segments\DynamicSegments\DynamicSegmentFilterRepository;
@@ -74,11 +73,8 @@ class Reporter {
   /** @var SubscriberListingRepository */
   private $subscriberListingRepository;
 
-  /** @var FeaturesController  */
+  /** @var AutomationStorage  */
-  private $featuresController;
+  private $automationStorage;
-
-  /** @var WorkflowStorage  */
-  private $workflowStorage;
 
   public function __construct(
     NewslettersRepository $newslettersRepository,
@@ -92,8 +88,7 @@ class Reporter {
     SubscribersFeature $subscribersFeature,
     TrackingConfig $trackingConfig,
     SubscriberListingRepository $subscriberListingRepository,
-    FeaturesController $featuresController,
+    AutomationStorage $automationStorage
-    WorkflowStorage $workflowStorage
   ) {
     $this->newslettersRepository = $newslettersRepository;
     $this->segmentsRepository = $segmentsRepository;
@@ -106,8 +101,7 @@ class Reporter {
     $this->subscribersFeature = $subscribersFeature;
     $this->trackingConfig = $trackingConfig;
     $this->subscriberListingRepository = $subscriberListingRepository;
-    $this->featuresController = $featuresController;
+    $this->automationStorage = $automationStorage;
-    $this->workflowStorage = $workflowStorage;
   }
 
   public function getData() {
@@ -231,43 +225,39 @@ class Reporter {
   }
 
   private function automationProperties(): array {
-    if (!$this->featuresController->isSupported(FeaturesController::AUTOMATION)) {
+    $automations = $this->automationStorage->getAutomations();
-      return [];
+    $activeAutomations = array_filter(
-    }
+      $automations,
-
+      function(Automation $automation): bool {
-    $workflows = $this->workflowStorage->getWorkflows();
+        return $automation->getStatus() === Automation::STATUS_ACTIVE;
-    $activeWorkflows = array_filter(
-      $workflows,
-      function(Workflow $workflow): bool {
-        return $workflow->getStatus() === Workflow::STATUS_ACTIVE;
       }
     );
-    $activeWorkflowCount = count($activeWorkflows);
+    $activeAutomationCount = count($activeAutomations);
-    $draftWorkflows = array_filter(
+    $draftAutomations = array_filter(
-      $workflows,
+      $automations,
-      function(Workflow $workflow): bool {
+      function(Automation $automation): bool {
-        return $workflow->getStatus() === Workflow::STATUS_DRAFT;
+        return $automation->getStatus() === Automation::STATUS_DRAFT;
       }
     );
-    $workflowsWithWordPressUserSubscribesTrigger = array_filter(
+    $automationsWithWordPressUserSubscribesTrigger = array_filter(
-      $activeWorkflows,
+      $activeAutomations,
-      function(Workflow $workflow): bool {
+      function(Automation $automation): bool {
-        return $workflow->getTrigger('mailpoet:wp-user-registered') !== null;
+        return $automation->getTrigger('mailpoet:wp-user-registered') !== null;
       }
     );
-    $workflowsWithSomeoneSubscribesTrigger = array_filter(
+    $automationsWithSomeoneSubscribesTrigger = array_filter(
-      $activeWorkflows,
+      $activeAutomations,
-      function(Workflow $workflow): bool {
+      function(Automation $automation): bool {
-        return $workflow->getTrigger('mailpoet:someone-subscribes') !== null;
+        return $automation->getTrigger('mailpoet:someone-subscribes') !== null;
       }
     );
 
     $totalSteps = 0;
     $minSteps = null;
     $maxSteps = 0;
-    foreach ($activeWorkflows as $workflow) {
+    foreach ($activeAutomations as $automation) {
       $steps = array_filter(
-        $workflow->getSteps(),
+        $automation->getSteps(),
         function(Step $step): bool {
           return $step->getType() === Step::TYPE_ACTION;
         }
@@ -277,16 +267,16 @@ class Reporter {
       $maxSteps = max($maxSteps, $stepCount);
       $totalSteps += $stepCount;
     }
-    $averageSteps = $activeWorkflowCount > 0 ? $totalSteps / $activeWorkflowCount : 0;
+    $averageSteps = $activeAutomationCount > 0 ? $totalSteps / $activeAutomationCount : 0;
 
     return [
-      'Automation > Number of active workflows' => $activeWorkflowCount,
+      'Automation > Number of active automations' => $activeAutomationCount,
-      'Automation > Number of draft workflows' => count($draftWorkflows),
+      'Automation > Number of draft automations' => count($draftAutomations),
-      'Automation > Number of "WordPress user registers" active workflows' => count($workflowsWithWordPressUserSubscribesTrigger),
+      'Automation > Number of "WordPress user registers" active automations' => count($automationsWithWordPressUserSubscribesTrigger),
-      'Automation > Number of "Someone subscribes" active workflows ' => count($workflowsWithSomeoneSubscribesTrigger),
+      'Automation > Number of "Someone subscribes" active automations ' => count($automationsWithSomeoneSubscribesTrigger),
-      'Automation > Number of steps in shortest active workflow' => $minSteps,
+      'Automation > Number of steps in shortest active automation' => $minSteps,
-      'Automation > Number of steps in longest active workflow' => $maxSteps,
+      'Automation > Number of steps in longest active automation' => $maxSteps,
-      'Automation > Average number of steps in active workflows' => $averageSteps,
+      'Automation > Average number of steps in active automations' => $averageSteps,
     ];
   }
 

mailpoet/lib/Automation/Engine/API/API.php

@@ -6,9 +6,7 @@ use MailPoet\API\REST\API as MailPoetApi;
 use MailPoet\Automation\Engine\Hooks;
 use MailPoet\Automation\Engine\WordPress;
 
-class API {
+class API extends MailPoetApi {
-  private const PREFIX = 'automation/';
-
   /** @var MailPoetApi */
   private $api;
 
@@ -30,22 +28,22 @@ class API {
   }
 
   public function registerGetRoute(string $route, string $endpoint): void {
-    $this->api->registerGetRoute(self::PREFIX . $route, $endpoint);
+    $this->api->registerGetRoute($route, $endpoint);
   }
 
   public function registerPostRoute(string $route, string $endpoint): void {
-    $this->api->registerPostRoute(self::PREFIX . $route, $endpoint);
+    $this->api->registerPostRoute($route, $endpoint);
   }
 
   public function registerPutRoute(string $route, string $endpoint): void {
-    $this->api->registerPutRoute(self::PREFIX . $route, $endpoint);
+    $this->api->registerPutRoute($route, $endpoint);
   }
 
   public function registerPatchRoute(string $route, string $endpoint): void {
-    $this->api->registerPatchRoute(self::PREFIX . $route, $endpoint);
+    $this->api->registerPatchRoute($route, $endpoint);
   }
 
   public function registerDeleteRoute(string $route, string $endpoint): void {
-    $this->api->registerDeleteRoute(self::PREFIX . $route, $endpoint);
+    $this->api->registerDeleteRoute($route, $endpoint);
   }
 }

mailpoet/lib/Automation/Engine/Builder/CreateAutomationFromTemplateController.php

@@ -0,0 +1,47 @@
+<?php declare(strict_types = 1);
+
+namespace MailPoet\Automation\Engine\Builder;
+
+use MailPoet\Automation\Engine\Data\Automation;
+use MailPoet\Automation\Engine\Exceptions;
+use MailPoet\Automation\Engine\Exceptions\InvalidStateException;
+use MailPoet\Automation\Engine\Storage\AutomationStorage;
+use MailPoet\Automation\Engine\Storage\AutomationTemplateStorage;
+use MailPoet\Automation\Engine\Validation\AutomationValidator;
+
+class CreateAutomationFromTemplateController {
+  /** @var AutomationStorage */
+  private $storage;
+
+  /** @var AutomationTemplateStorage  */
+  private $templateStorage;
+
+  /** @var AutomationValidator */
+  private $automationValidator;
+
+  public function __construct(
+    AutomationStorage $storage,
+    AutomationTemplateStorage $templateStorage,
+    AutomationValidator $automationValidator
+  ) {
+    $this->storage = $storage;
+    $this->templateStorage = $templateStorage;
+    $this->automationValidator = $automationValidator;
+  }
+
+  public function createAutomation(string $slug): Automation {
+    $template = $this->templateStorage->getTemplateBySlug($slug);
+    if (!$template) {
+      throw Exceptions::automationTemplateNotFound($slug);
+    }
+
+    $automation = $template->getAutomation();
+    $this->automationValidator->validate($automation);
+    $automationId = $this->storage->createAutomation($automation);
+    $savedAutomation = $this->storage->getAutomation($automationId);
+    if (!$savedAutomation) {
+      throw new InvalidStateException('Automation not found.');
+    }
+    return $savedAutomation;
+  }
+}

mailpoet/lib/Automation/Engine/Builder/CreateWorkflowFromTemplateController.php

@@ -1,47 +0,0 @@
-<?php declare(strict_types = 1);
-
-namespace MailPoet\Automation\Engine\Builder;
-
-use MailPoet\Automation\Engine\Data\Workflow;
-use MailPoet\Automation\Engine\Exceptions;
-use MailPoet\Automation\Engine\Exceptions\InvalidStateException;
-use MailPoet\Automation\Engine\Storage\WorkflowStorage;
-use MailPoet\Automation\Engine\Storage\WorkflowTemplateStorage;
-use MailPoet\Automation\Engine\Validation\WorkflowValidator;
-
-class CreateWorkflowFromTemplateController {
-  /** @var WorkflowStorage */
-  private $storage;
-
-  /** @var WorkflowTemplateStorage  */
-  private $templateStorage;
-
-  /** @var WorkflowValidator */
-  private $workflowValidator;
-
-  public function __construct(
-    WorkflowStorage $storage,
-    WorkflowTemplateStorage $templateStorage,
-    WorkflowValidator $workflowValidator
-  ) {
-    $this->storage = $storage;
-    $this->templateStorage = $templateStorage;
-    $this->workflowValidator = $workflowValidator;
-  }
-
-  public function createWorkflow(string $slug): Workflow {
-    $template = $this->templateStorage->getTemplateBySlug($slug);
-    if (!$template) {
-      throw Exceptions::workflowTemplateNotFound($slug);
-    }
-
-    $workflow = $template->getWorkflow();
-    $this->workflowValidator->validate($workflow);
-    $workflowId = $this->storage->createWorkflow($workflow);
-    $savedWorkflow = $this->storage->getWorkflow($workflowId);
-    if (!$savedWorkflow) {
-      throw new InvalidStateException('Automation not found.');
-    }
-    return $savedWorkflow;
-  }
-}

mailpoet/lib/Automation/Engine/Builder/DeleteAutomationController.php

@@ -0,0 +1,32 @@
+<?php declare(strict_types = 1);
+
+namespace MailPoet\Automation\Engine\Builder;
+
+use MailPoet\Automation\Engine\Data\Automation;
+use MailPoet\Automation\Engine\Exceptions;
+use MailPoet\Automation\Engine\Storage\AutomationStorage;
+
+class DeleteAutomationController {
+  /** @var AutomationStorage */
+  private $automationStorage;
+
+  public function __construct(
+    AutomationStorage $automationStorage
+  ) {
+    $this->automationStorage = $automationStorage;
+  }
+
+  public function deleteAutomation(int $id): Automation {
+    $automation = $this->automationStorage->getAutomation($id);
+    if (!$automation) {
+      throw Exceptions::automationNotFound($id);
+    }
+
+    if ($automation->getStatus() !== Automation::STATUS_TRASH) {
+      throw Exceptions::automationNotTrashed($id);
+    }
+
+    $this->automationStorage->deleteAutomation($automation);
+    return $automation;
+  }
+}

mailpoet/lib/Automation/Engine/Builder/DeleteWorkflowController.php

@@ -1,32 +0,0 @@
-<?php declare(strict_types = 1);
-
-namespace MailPoet\Automation\Engine\Builder;
-
-use MailPoet\Automation\Engine\Data\Workflow;
-use MailPoet\Automation\Engine\Exceptions;
-use MailPoet\Automation\Engine\Storage\WorkflowStorage;
-
-class DeleteWorkflowController {
-  /** @var WorkflowStorage */
-  private $workflowStorage;
-
-  public function __construct(
-    WorkflowStorage $workflowStorage
-  ) {
-    $this->workflowStorage = $workflowStorage;
-  }
-
-  public function deleteWorkflow(int $id): Workflow {
-    $workflow = $this->workflowStorage->getWorkflow($id);
-    if (!$workflow) {
-      throw Exceptions::workflowNotFound($id);
-    }
-
-    if ($workflow->getStatus() !== Workflow::STATUS_TRASH) {
-      throw Exceptions::workflowNotTrashed($id);
-    }
-
-    $this->workflowStorage->deleteWorkflow($workflow);
-    return $workflow;
-  }
-}

mailpoet/lib/Automation/Engine/Builder/DuplicateAutomationController.php

@@ -2,55 +2,55 @@
 
 namespace MailPoet\Automation\Engine\Builder;
 
+use MailPoet\Automation\Engine\Data\Automation;
 use MailPoet\Automation\Engine\Data\NextStep;
 use MailPoet\Automation\Engine\Data\Step;
-use MailPoet\Automation\Engine\Data\Workflow;
 use MailPoet\Automation\Engine\Exceptions;
 use MailPoet\Automation\Engine\Exceptions\InvalidStateException;
-use MailPoet\Automation\Engine\Storage\WorkflowStorage;
+use MailPoet\Automation\Engine\Storage\AutomationStorage;
 use MailPoet\Automation\Engine\WordPress;
 use MailPoet\Util\Security;
 
-class DuplicateWorkflowController {
+class DuplicateAutomationController {
   /** @var WordPress */
   private $wordPress;
 
-  /** @var WorkflowStorage */
+  /** @var AutomationStorage */
-  private $workflowStorage;
+  private $automationStorage;
 
   public function __construct(
     WordPress $wordPress,
-    WorkflowStorage $workflowStorage
+    AutomationStorage $automationStorage
   ) {
     $this->wordPress = $wordPress;
-    $this->workflowStorage = $workflowStorage;
+    $this->automationStorage = $automationStorage;
   }
 
-  public function duplicateWorkflow(int $id): Workflow {
+  public function duplicateAutomation(int $id): Automation {
-    $workflow = $this->workflowStorage->getWorkflow($id);
+    $automation = $this->automationStorage->getAutomation($id);
-    if (!$workflow) {
+    if (!$automation) {
-      throw Exceptions::workflowNotFound($id);
+      throw Exceptions::automationNotFound($id);
     }
 
-    $duplicate = new Workflow(
+    $duplicate = new Automation(
-      $this->getName($workflow->getName()),
+      $this->getName($automation->getName()),
-      $this->getSteps($workflow->getSteps()),
+      $this->getSteps($automation->getSteps()),
       $this->wordPress->wpGetCurrentUser()
     );
-    $duplicate->setStatus(Workflow::STATUS_DRAFT);
+    $duplicate->setStatus(Automation::STATUS_DRAFT);
 
-    $workflowId = $this->workflowStorage->createWorkflow($duplicate);
+    $automationId = $this->automationStorage->createAutomation($duplicate);
-    $savedWorkflow = $this->workflowStorage->getWorkflow($workflowId);
+    $savedAutomation = $this->automationStorage->getAutomation($automationId);
-    if (!$savedWorkflow) {
+    if (!$savedAutomation) {
-      throw new InvalidStateException('Workflow not found.');
+      throw new InvalidStateException('Automation not found.');
     }
-    return $savedWorkflow;
+    return $savedAutomation;
   }
 
   private function getName(string $name): string {
     // translators: %s is the original automation name.
     $newName = sprintf(__('Copy of %s', 'mailpoet'), $name);
-    $maxLength = $this->workflowStorage->getNameColumnLength();
+    $maxLength = $this->automationStorage->getNameColumnLength();
     if (strlen($newName) > $maxLength) {
       $append = '…';
       return substr($newName, 0, $maxLength - strlen($append)) . $append;