Add component with privacy protection notice

[MAILPOET-3742]

assets/js/src/segments/dynamic/form.tsx

@@ -16,6 +16,7 @@ import { isFormValid } from './validator';
 import { MinusIcon } from '../../common/button/icon/minus';
 import plusIcon from '../../common/button/icon/plus';
 import APIErrorsNotice from '../../notices/api_errors_notice';
+import { PrivacyProtectionNotice } from './privacy_protection_notice';
 
 import {
   FilterRow,
@@ -176,6 +177,7 @@ export const Form: React.FunctionComponent<Props> = ({
         </div>
         <div className="mailpoet-segments-counter-section">
           <SubscribersCounter />
+          <PrivacyProtectionNotice />
         </div>
         <div className="mailpoet-form-actions">
           <Button

assets/js/src/segments/dynamic/privacy_protection_notice.tsx

@@ -0,0 +1,43 @@
+import React from 'react';
+import MailPoet from 'mailpoet';
+import { useSelect } from '@wordpress/data';
+
+import { EmailActionTypes, Segment } from './types';
+
+const PrivacyProtectionNotice: React.FunctionComponent = () => {
+  const segment: Segment = useSelect(
+    (select) => select('mailpoet-dynamic-segments-form').getSegment(),
+    []
+  );
+
+  const opensActions: string[] = [
+    EmailActionTypes.OPENED,
+    EmailActionTypes.OPENS_ABSOLUTE_COUNT,
+    EmailActionTypes.MACHINE_OPENED,
+    EmailActionTypes.MACHINE_OPENS_ABSOLUTE_COUNT,
+    EmailActionTypes.NOT_OPENED,
+  ];
+
+  let containsOpensFilter = false;
+  segment.filters.forEach((formItem) => {
+    if (opensActions.includes(formItem.action)) {
+      containsOpensFilter = true;
+    }
+  });
+
+  if (!containsOpensFilter) {
+    return (
+      <span />
+    );
+  }
+
+  return (
+    <div className="mailpoet-form-field">
+      <span className="mailpoet-form-notice-message">
+        {(MailPoet.I18n.t('privacyProtectionNotice'))}
+      </span>
+    </div>
+  );
+};
+
+export { PrivacyProtectionNotice };

views/segments.html

@@ -229,5 +229,6 @@
     'subscribersCountWereCalculated': __('Lists and Segments subscribers counts were calculated'),
     'subscribersMinutesAgo': __('minutes ago'),
     'recalculateNow': __('Recalculate now'),
+    'privacyProtectionNotice': __('Due to email privacy protections, some opens may not be tracked. Consider using a different engagement metric.'),
   }) %>
 <% endblock %>