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 }))} /> + ))}