diff --git a/mailpoet/assets/js/src/segments/dynamic/dynamic_segments_filters/email.tsx b/mailpoet/assets/js/src/segments/dynamic/dynamic_segments_filters/email.tsx
index 7fb4d6a721..dfd95ecf3f 100644
--- a/mailpoet/assets/js/src/segments/dynamic/dynamic_segments_filters/email.tsx
+++ b/mailpoet/assets/js/src/segments/dynamic/dynamic_segments_filters/email.tsx
@@ -11,6 +11,7 @@ import { storeName } from '../store';
import { EmailOpenStatisticsFields } from './fields/email/email_statistics_opens';
import { EmailClickStatisticsFields } from './fields/email/email_statistics_clicks';
import { EmailOpensAbsoluteCountFields } from './fields/email/email_opens_absolute_count';
+import { validateDaysPeriod } from './fields/days_period_field';
export function validateEmail(formItems: EmailFormItem): boolean {
// check if the action has the right type
@@ -35,7 +36,9 @@ export function validateEmail(formItems: EmailFormItem): boolean {
);
}
- return !!formItems.days && !!formItems.opens && !!formItems.operator;
+ return (
+ validateDaysPeriod(formItems) && !!formItems.opens && !!formItems.operator
+ );
}
const componentsMap = {
diff --git a/mailpoet/assets/js/src/segments/dynamic/dynamic_segments_filters/fields/days_period_field.tsx b/mailpoet/assets/js/src/segments/dynamic/dynamic_segments_filters/fields/days_period_field.tsx
new file mode 100644
index 0000000000..10e81e39cb
--- /dev/null
+++ b/mailpoet/assets/js/src/segments/dynamic/dynamic_segments_filters/fields/days_period_field.tsx
@@ -0,0 +1,52 @@
+import { useDispatch, useSelect } from '@wordpress/data';
+import { Input } from 'common';
+import { MailPoet } from 'mailpoet';
+import { DaysPeriodItem, FilterProps } from 'segments/dynamic/types';
+import { storeName } from 'segments/dynamic/store';
+
+function replaceElementsInDaysSentence(
+ fn: (value) => JSX.Element,
+): JSX.Element[] {
+ return MailPoet.I18n.t('emailActionOpensDaysSentence')
+ .split(/({days})/gim)
+ .map(fn);
+}
+
+export function DaysPeriodField({ filterIndex }: FilterProps): JSX.Element {
+ const segment: DaysPeriodItem = useSelect(
+ (select) => select(storeName).getSegmentFilter(filterIndex),
+ [filterIndex],
+ );
+ const { updateSegmentFilterFromEvent } = useDispatch(storeName);
+
+ return (
+ <>
+ {replaceElementsInDaysSentence((match) => {
+ if (match === '{days}') {
+ return (
+ {
+ void updateSegmentFilterFromEvent('days', filterIndex, e);
+ }}
+ min={1}
+ step={1}
+ placeholder={MailPoet.I18n.t('daysPlaceholder')}
+ />
+ );
+ }
+ if (typeof match === 'string' && match.trim().length > 1) {
+ return
{match}
;
+ }
+ return null;
+ })}
+ >
+ );
+}
+
+export function validateDaysPeriod(formItems: DaysPeriodItem): boolean {
+ return !!formItems.days;
+}
diff --git a/mailpoet/assets/js/src/segments/dynamic/dynamic_segments_filters/fields/email/email_opens_absolute_count.tsx b/mailpoet/assets/js/src/segments/dynamic/dynamic_segments_filters/fields/email/email_opens_absolute_count.tsx
index 8a5c01910b..412da2ef08 100644
--- a/mailpoet/assets/js/src/segments/dynamic/dynamic_segments_filters/fields/email/email_opens_absolute_count.tsx
+++ b/mailpoet/assets/js/src/segments/dynamic/dynamic_segments_filters/fields/email/email_opens_absolute_count.tsx
@@ -8,14 +8,7 @@ import { MailPoet } from 'mailpoet';
import { EmailFormItem, FilterProps } from '../../../types';
import { storeName } from '../../../store';
-
-function replaceElementsInDaysSentence(
- fn: (value) => JSX.Element,
-): JSX.Element[] {
- return MailPoet.I18n.t('emailActionOpensDaysSentence')
- .split(/({days})/gim)
- .map(fn);
-}
+import { DaysPeriodField } from '../days_period_field';
function replaceEmailActionOpensSentence(
fn: (value) => JSX.Element,
@@ -85,27 +78,7 @@ export function EmailOpensAbsoluteCountFields({
})}
- {replaceElementsInDaysSentence((match) => {
- if (match === '{days}') {
- return (
- {
- void updateSegmentFilterFromEvent('days', filterIndex, e);
- }}
- min="0"
- placeholder={MailPoet.I18n.t('emailActionDays')}
- />
- );
- }
- if (typeof match === 'string' && match.trim().length > 1) {
- return {match}
;
- }
- return null;
- })}
+
>
);
diff --git a/mailpoet/assets/js/src/segments/dynamic/types.ts b/mailpoet/assets/js/src/segments/dynamic/types.ts
index bf7cffbaa3..4694a06008 100644
--- a/mailpoet/assets/js/src/segments/dynamic/types.ts
+++ b/mailpoet/assets/js/src/segments/dynamic/types.ts
@@ -72,6 +72,10 @@ export interface DateFormItem extends FormItem {
value?: string;
}
+export interface DaysPeriodItem extends FormItem {
+ days?: string;
+}
+
export interface TextFormItem extends FormItem {
operator?: string;
value?: string;
@@ -133,7 +137,6 @@ export interface EmailFormItem extends FormItem {
link_ids?: string[];
operator?: string;
opens?: string;
- days?: string;
}
export type Segment = {
diff --git a/mailpoet/views/segments/translations.html b/mailpoet/views/segments/translations.html
index 84fe3a73be..ffdffb7c29 100644
--- a/mailpoet/views/segments/translations.html
+++ b/mailpoet/views/segments/translations.html
@@ -106,7 +106,6 @@
'emailActionOpensAbsoluteCount': __('number of opens'),
'emailActionMachineOpensAbsoluteCount': __('number of machine-opens'),
'emailActionOpens': __('opens'),
- 'emailActionDays': __('days'),
'emailActionOpensSentence': _x('{condition} {opens} opens', 'The result will be "more than 20 opens"'),
'emailActionOpensDaysSentence': _x('in the last {days} days', 'The result will be "in the last 5 days"'),
'moreThan': __('more than'),