diff --git a/assets/js/src/segments/dynamic/editor.tsx b/assets/js/src/segments/dynamic/editor.tsx
index ca94a16099..e384e0574f 100644
--- a/assets/js/src/segments/dynamic/editor.tsx
+++ b/assets/js/src/segments/dynamic/editor.tsx
@@ -1,5 +1,5 @@
import React, { useEffect } from 'react';
-import { useDispatch, useSelect } from '@wordpress/data';
+import { useDispatch } from '@wordpress/data';
import { useRouteMatch, Link } from 'react-router-dom';
import MailPoet from 'mailpoet';
@@ -8,7 +8,6 @@ import Heading from 'common/typography/heading/heading';
import HideScreenOptions from 'common/hide_screen_options/hide_screen_options';
import { Form } from './form';
-import APIErrorsNotice from '../../notices/api_errors_notice';
import { createStore } from './store/store';
const Editor: React.FunctionComponent = () => {
@@ -16,11 +15,6 @@ const Editor: React.FunctionComponent = () => {
createStore();
- const errors: string[] = useSelect(
- (select) => select('mailpoet-dynamic-segments-form').getErrors(),
- []
- );
-
const { pageLoaded } = useDispatch('mailpoet-dynamic-segments-form');
useEffect(() => {
@@ -31,9 +25,6 @@ const Editor: React.FunctionComponent = () => {
<>
- {(errors.length > 0 && (
- ({ message: error }))} />
- ))}
{MailPoet.I18n.t('formPageTitle')}
diff --git a/assets/js/src/segments/dynamic/form.tsx b/assets/js/src/segments/dynamic/form.tsx
index 4ce7ae6982..9e1773c4d9 100644
--- a/assets/js/src/segments/dynamic/form.tsx
+++ b/assets/js/src/segments/dynamic/form.tsx
@@ -15,6 +15,7 @@ import { FormFilterFields } from './form_filter_fields';
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 {
FilterRow,
@@ -53,6 +54,11 @@ export const Form: React.FunctionComponent = ({
[]
);
+ const errors: string[] = useSelect(
+ (select) => select('mailpoet-dynamic-segments-form').getErrors(),
+ []
+ );
+
const { updateSegment, updateSegmentFilter, handleSave } = useDispatch('mailpoet-dynamic-segments-form');
return (
@@ -64,6 +70,9 @@ export const Form: React.FunctionComponent = ({
{MailPoet.I18n.t('name')}
+ {(errors.length > 0 && (
+ ({ message: error }))} />
+ ))}