diff --git a/packages/js/email-editor/src/components/block-editor/editor.tsx b/packages/js/email-editor/src/components/block-editor/editor.tsx index fff6264485..cacc899ce1 100644 --- a/packages/js/email-editor/src/components/block-editor/editor.tsx +++ b/packages/js/email-editor/src/components/block-editor/editor.tsx @@ -1,8 +1,7 @@ /** * WordPress dependencies */ -import { useSelect } from '@wordpress/data'; - +import { useDispatch, useSelect } from '@wordpress/data'; import { ErrorBoundary, PostLockedModal, @@ -24,6 +23,7 @@ import { unlockPatternsRelatedSelectorsFromCoreStore } from '../../private-apis' import { storeName } from '../../store'; import { Layout } from './layout'; import { useNavigateToEntityRecord } from '../../hooks/use-navigate-to-entity-record'; +import { useEffect } from 'react'; export function InnerEditor( { postId: initialPostId, @@ -32,6 +32,12 @@ export function InnerEditor( { initialEdits, ...props } ) { + const { loadPersonalizationTags } = useDispatch( storeName ); + + useEffect( () => { + void loadPersonalizationTags(); + }, [ loadPersonalizationTags ] ); + const { currentPost, onNavigateToEntityRecord, diff --git a/packages/js/email-editor/src/store/actions.ts b/packages/js/email-editor/src/store/actions.ts index 7eefd2b66a..ecafb5ba04 100644 --- a/packages/js/email-editor/src/store/actions.ts +++ b/packages/js/email-editor/src/store/actions.ts @@ -266,4 +266,15 @@ export function revertAndSaveTemplate( template ) { ); } }; + +export function* loadPersonalizationTags() { + const data = yield apiFetch( { + path: `/mailpoet-email-editor/v1/get_personalization_tags`, + method: 'GET', + } ); + + return { + type: 'SET_PERSONALIZATION_TAGS', + personalizationTags: data.result, + } as const; } diff --git a/packages/js/email-editor/src/store/initial-state.ts b/packages/js/email-editor/src/store/initial-state.ts index f1c1f33802..b66c87bc60 100644 --- a/packages/js/email-editor/src/store/initial-state.ts +++ b/packages/js/email-editor/src/store/initial-state.ts @@ -40,6 +40,7 @@ export function getInitialState(): State { }, personalizationTags: { isModalOpened: false, + list: [], }, }; } diff --git a/packages/js/email-editor/src/store/reducer.ts b/packages/js/email-editor/src/store/reducer.ts index f918385170..552010d440 100644 --- a/packages/js/email-editor/src/store/reducer.ts +++ b/packages/js/email-editor/src/store/reducer.ts @@ -23,6 +23,14 @@ export function reducer( state: State, action ): State { activeTab: action.state.activeTab, }, }; + case 'SET_PERSONALIZATION_TAGS': + return { + ...state, + personalizationTags: { + ...state.personalizationTags, + list: action.personalizationTags, + }, + }; default: return state; } diff --git a/packages/js/email-editor/src/store/types.ts b/packages/js/email-editor/src/store/types.ts index 5aea0fa054..3c9e164923 100644 --- a/packages/js/email-editor/src/store/types.ts +++ b/packages/js/email-editor/src/store/types.ts @@ -195,6 +195,12 @@ export type State = { }; personalizationTags: { isModalOpened: boolean; + list: { + name: string; + token: string; + category: string; + attributes: string[]; + }[]; }; };