Remove usage of hardcoded mailpoet_email string from the JS package

MAILPOET-6430

packages/js/email-editor/src/components/header/campaign-name.tsx

@@ -17,7 +17,7 @@ import {
 /**
  * Internal dependencies
  */
-import { storeName } from '../../store';
+import { storeName, editorCurrentPostType } from '../../store';
 import { recordEvent, recordEventOnce } from '../../events';
 
 // @see https://github.com/WordPress/gutenberg/blob/5e0ffdbc36cb2e967dfa6a6b812a10a2e56a598f/packages/edit-post/src/components/header/document-actions/index.js
@@ -34,7 +34,7 @@ export function CampaignName() {
 
 	const [ emailTitle = '', setTitle ] = useEntityProp(
 		'postType',
-		'mailpoet_email',
+		editorCurrentPostType,
 		'title'
 	);
 

packages/js/email-editor/src/components/header/more-menu.tsx

@@ -13,7 +13,7 @@ import { useSelect, useDispatch } from '@wordpress/data';
 /**
  * Internal dependencies
  */
-import { storeName } from '../../store';
+import { storeName, editorCurrentPostType } from '../../store';
 import { TrashModal } from './trash-modal';
 import { recordEvent } from '../../events';
 
@@ -32,7 +32,7 @@ export function MoreMenu(): JSX.Element {
 	);
 	const [ status, setStatus ] = useEntityProp(
 		'postType',
-		'mailpoet_email',
+		editorCurrentPostType,
 		'status'
 	);
 	const { saveEditedEmail, updateEmailMailPoetProperty } =

packages/js/email-editor/src/components/header/trash-modal.tsx

@@ -10,6 +10,7 @@ import { store as noticesStore } from '@wordpress/notices';
 /**
  * Internal dependencies
  */
+import { editorCurrentPostType } from '../../store';
 import { recordEvent } from '../../events';
 
 export function TrashModal( {
@@ -31,7 +32,7 @@ export function TrashModal( {
 		recordEvent( 'trash_modal_move_to_trash_button_clicked' );
 		const success = await deleteEntityRecord(
 			'postType',
-			'mailpoet_email',
+			editorCurrentPostType,
 			postId as unknown as string,
 			{},
 			{ throwOnError: false }
@@ -41,7 +42,7 @@ export function TrashModal( {
 		} else {
 			const lastError = getLastEntityDeleteError(
 				'postType',
-				'mailpoet_email',
+				editorCurrentPostType,
 				postId
 			);
 			// Already deleted.

packages/js/email-editor/src/components/personalization-tags/rich-text-with-button.tsx

@@ -17,7 +17,7 @@ import {
 	getCursorPosition,
 	replacePersonalizationTagsWithHTMLComments,
 } from './rich-text-utils';
-import { storeName } from '../../store';
+import { storeName, editorCurrentPostType } from '../../store';
 import { PersonalizationTagsPopover } from './personalization-tags-popover';
 import { recordEvent, recordEventOnce } from '../../events';
 
@@ -30,7 +30,7 @@ export function RichTextWithButton( {
 } ) {
 	const [ mailpoetEmailData ] = useEntityProp(
 		'postType',
-		'mailpoet_email',
+		editorCurrentPostType,
 		'mailpoet_data'
 	);
 

packages/js/email-editor/src/components/preview/preview-dropdown.tsx

@@ -10,9 +10,9 @@ import { PostPreviewButton } from '@wordpress/editor';
 /**
  * Internal dependencies
  */
-import { SendPreviewEmail } from './send-preview-email';
 import { storeName } from '../../store';
 import { recordEvent } from '../../events';
+import { SendPreviewEmail } from './send-preview-email';
 
 export function PreviewDropdown() {
 	const previewDeviceType = useSelect(

packages/js/email-editor/src/components/preview/send-preview-email.tsx

@@ -22,6 +22,7 @@ import {
 	MailPoetEmailData,
 	SendingPreviewStatus,
 	storeName,
+	editorCurrentPostType,
 } from '../../store';
 import { recordEvent, recordEventOnce } from '../../events';
 
@@ -43,7 +44,7 @@ function RawSendPreviewEmail() {
 
 	const [ mailpoetEmailData ] = useEntityProp(
 		'postType',
-		'mailpoet_email',
+		editorCurrentPostType,
 		'mailpoet_data'
 	) as [ MailPoetEmailData, unknown, unknown ];
 

packages/js/email-editor/src/components/sidebar/details-panel.tsx

@@ -10,8 +10,9 @@ import classnames from 'classnames';
 /**
  * Internal dependencies
  */
-import { RichTextWithButton } from '../personalization-tags/rich-text-with-button';
+import { editorCurrentPostType } from '../../store';
 import { recordEvent } from '../../events';
+import { RichTextWithButton } from '../personalization-tags/rich-text-with-button';
 
 const previewTextMaxLength = 150;
 const previewTextRecommendedLength = 80;
@@ -19,7 +20,7 @@ const previewTextRecommendedLength = 80;
 export function DetailsPanel() {
 	const [ mailpoetEmailData ] = useEntityProp(
 		'postType',
-		'mailpoet_email',
+		editorCurrentPostType,
 		'mailpoet_data'
 	);
 

packages/js/email-editor/src/components/template-select/select-modal.tsx

@@ -16,6 +16,7 @@ import {
 	storeName,
 	TemplateCategory,
 	TemplatePreview,
+	editorCurrentPostType,
 } from '../../store';
 import { TemplateList } from './template-list';
 import { TemplateCategoriesListSidebar } from './template-categories-list-sidebar';
@@ -94,7 +95,7 @@ export function SelectTemplateModal( {
 	const hasTemplates = templates?.length > 0;
 
 	const handleTemplateSelection = ( template: TemplatePreview ) => {
-		const templateIsPostContent = template.type === 'mailpoet_email';
+		const templateIsPostContent = template.type === editorCurrentPostType;
 
 		const postContent = template.template as unknown as EmailEditorPostType;
 

packages/js/email-editor/src/editor.tsx

@@ -12,7 +12,7 @@ import '@wordpress/format-library'; // Enables text formatting capabilities
 import { initBlocks } from './blocks';
 import { initializeLayout } from './layouts/flex-email';
 import { InnerEditor } from './components/block-editor';
-import { createStore, storeName } from './store';
+import { createStore, storeName, editorCurrentPostType } from './store';
 import { initHooks } from './editor-hooks';
 import { KeyboardShortcuts } from './components/keybord-shortcuts';
 import { initEventCollector } from './events';
@@ -33,7 +33,7 @@ function Editor() {
 			<InnerEditor
 				initialEdits={ [] }
 				postId={ postId }
-				postType="mailpoet_email"
+				postType={ editorCurrentPostType }
 				settings={ settings }
 			/>
 		</StrictMode>

packages/js/email-editor/src/global.d.ts

@@ -15,4 +15,5 @@ interface Window {
 		editor_layout: unknown; // Can't import type in global.d.ts. Typed in getEmailLayout() in store/settings.ts
 		editor_theme: unknown; // Can't import type in global.d.ts. Typed in getEditorTheme() in store/settings.ts
 	};
+	mailpoet_email_editor_current_post_type: string;
 }

packages/js/email-editor/src/store/actions.ts

@@ -24,7 +24,11 @@ import {
 /**
  * Internal dependencies
  */
-import { storeName, mainSidebarDocumentTab } from './constants';
+import {
+	storeName,
+	mainSidebarDocumentTab,
+	editorCurrentPostType,
+} from './constants';
 import {
 	SendingPreviewStatus,
 	State,
@@ -99,7 +103,7 @@ export function* saveEditedEmail() {
 
 	const result = yield dispatch( coreDataStore ).saveEditedEntityRecord(
 		'postType',
-		'mailpoet_email',
+		editorCurrentPostType,
 		postId,
 		{ throwOnError: true }
 	);
@@ -135,14 +139,14 @@ export function* updateEmailMailPoetProperty( name: string, value: string ) {
 	// There can be a better way how to get the edited post data
 	const editedPost = select( coreDataStore ).getEditedEntityRecord(
 		'postType',
-		'mailpoet_email',
+		editorCurrentPostType,
 		postId
 	);
 	// @ts-expect-error Property 'mailpoet_data' does not exist on type 'Updatable<Attachment<any>>'.
 	const mailpoetData = editedPost?.mailpoet_data || {};
 	yield dispatch( coreDataStore ).editEntityRecord(
 		'postType',
-		'mailpoet_email',
+		editorCurrentPostType,
 		postId,
 		{
 			mailpoet_data: {
@@ -159,7 +163,7 @@ export const setTemplateToPost =
 		const postId = registry.select( storeName ).getEmailPostId();
 		registry
 			.dispatch( coreDataStore )
-			.editEntityRecord( 'postType', 'mailpoet_email', postId, {
+			.editEntityRecord( 'postType', editorCurrentPostType, postId, {
 				template: templateSlug,
 			} );
 	};

packages/js/email-editor/src/store/constants.ts

@@ -4,3 +4,6 @@ export const mainSidebarId = 'email-editor/editor/main';
 export const mainSidebarDocumentTab = 'document';
 export const mainSidebarBlockTab = 'block';
 export const stylesSidebarId = 'email-editor/editor/styles';
+
+export const editorCurrentPostType =
+	window.mailpoet_email_editor_current_post_type;

packages/js/email-editor/src/store/selectors.ts

@@ -13,7 +13,7 @@ import { Post } from '@wordpress/core-data/build-types/entity-types/post';
 /**
  * Internal dependencies
  */
-import { storeName } from './constants';
+import { storeName, editorCurrentPostType } from './constants';
 import { State, Feature, EmailTemplate, EmailEditorPostType } from './types';
 
 function getContentFromEntity( entity ): string {
@@ -59,7 +59,7 @@ export const hasEdits = createRegistrySelector( ( select ) => (): boolean => {
 	const postId = select( storeName ).getEmailPostId();
 	return !! select( coreDataStore ).hasEditsForEntityRecord(
 		'postType',
-		'mailpoet_email',
+		editorCurrentPostType,
 		postId
 	);
 } );
@@ -69,7 +69,7 @@ export const isEmailLoaded = createRegistrySelector(
 		const postId = select( storeName ).getEmailPostId();
 		return !! select( coreDataStore ).getEntityRecord(
 			'postType',
-			'mailpoet_email',
+			editorCurrentPostType,
 			postId
 		);
 	}
@@ -79,7 +79,7 @@ export const isSaving = createRegistrySelector( ( select ) => (): boolean => {
 	const postId = select( storeName ).getEmailPostId();
 	return !! select( coreDataStore ).isSavingEntityRecord(
 		'postType',
-		'mailpoet_email',
+		editorCurrentPostType,
 		postId
 	);
 } );
@@ -89,7 +89,7 @@ export const isEmpty = createRegistrySelector( ( select ) => (): boolean => {
 
 	const post: EmailEditorPostType = select( coreDataStore ).getEntityRecord(
 		'postType',
-		'mailpoet_email',
+		editorCurrentPostType,
 		postId
 	);
 	if ( ! post ) {
@@ -111,7 +111,7 @@ export const hasEmptyContent = createRegistrySelector(
 
 		const post = select( coreDataStore ).getEntityRecord(
 			'postType',
-			'mailpoet_email',
+			editorCurrentPostType,
 			postId
 		);
 		if ( ! post ) {
@@ -130,7 +130,7 @@ export const isEmailSent = createRegistrySelector(
 
 		const post = select( coreDataStore ).getEntityRecord(
 			'postType',
-			'mailpoet_email',
+			editorCurrentPostType,
 			postId
 		);
 		if ( ! post ) {
@@ -154,7 +154,7 @@ export const getEditedEmailContent = createRegistrySelector(
 		const postId = select( storeName ).getEmailPostId();
 		const record = select( coreDataStore ).getEditedEntityRecord(
 			'postType',
-			'mailpoet_email',
+			editorCurrentPostType,
 			postId
 		) as unknown as
 			| { content: string | unknown; blocks: BlockInstance[] }
@@ -170,7 +170,7 @@ export const getEditedEmailContent = createRegistrySelector(
 export const getSentEmailEditorPosts = createRegistrySelector(
 	( select ) => () =>
 		select( coreDataStore )
-			.getEntityRecords( 'postType', 'mailpoet_email', {
+			.getEntityRecords( 'postType', editorCurrentPostType, {
 				per_page: 30, // show a maximum of 30 for now
 				status: 'publish,sent', // show only sent emails
 			} )
@@ -290,13 +290,13 @@ export const getEmailTemplates = createRegistrySelector(
 		select( coreDataStore )
 			.getEntityRecords( 'postType', 'wp_template', {
 				per_page: -1,
-				post_type: 'mailpoet_email',
+				post_type: editorCurrentPostType,
 			} )
 			// We still need to filter the templates because, in some cases, the API also returns custom templates
 			// ignoring the post_type filter in the query
 			?.filter( ( template ) =>
 				// @ts-expect-error Missing property in type
-				template.post_types.includes( 'mailpoet_email' )
+				template.post_types.includes( editorCurrentPostType )
 			)
 );
 

packages/js/email-editor/src/store/types.ts

@@ -268,6 +268,6 @@ export type MailPoetEmailPostContentExtended = {
 };
 
 export type EmailEditorPostType = Omit< Post, 'type' > & {
-	type: 'mailpoet_email';
+	type: string;
 	mailpoet_data?: MailPoetEmailPostContentExtended;
 };

packages/php/email-editor/src/Engine/class-email-editor.php

@@ -105,6 +105,7 @@ class Email_Editor {
 		if ( $is_editor_page ) {
 			$this->extend_email_post_api();
 			$this->settings_controller->init();
+			add_filter( 'admin_footer', array( $this, 'load_js_vars' ), 24 ); // @phpstan-ignore-line -- Filter callback return statement is missing.
 		}
 		add_action( 'rest_api_init', array( $this, 'register_email_editor_api_routes' ) );
 		add_filter( 'mailpoet_email_editor_send_preview_email', array( $this->send_preview_email, 'send_preview_email' ), 11, 1 ); // allow for other filter methods to take precedent.
@@ -296,4 +297,28 @@ class Email_Editor {
 
 		return __DIR__ . '/Templates/single-email-post-template.php';
 	}
+
+	/**
+	 * Load JS vars
+	 *
+	 * @return void
+	 * @throws \InvalidArgumentException If the post-type is invalid.
+	 */
+	public function load_js_vars() {
+		global $post;
+
+		$email_editor_post_type_names      = array_column( $this->get_post_types(), 'name' );
+		$email_editor_current_post_type    = $post->post_type;
+		$current_post_is_email_editor_type = in_array( $email_editor_current_post_type, $email_editor_post_type_names, true );
+
+		if ( ! $current_post_is_email_editor_type ) {
+			throw new \InvalidArgumentException( esc_html__( 'Invalid email post type', 'mailpoet' ) );
+		}
+
+		?>
+		<script type="text/javascript"> <?php // phpcs:ignore ?>
+			window.mailpoet_email_editor_current_post_type = <?php echo wp_json_encode( $email_editor_current_post_type ); ?>;
+		</script>
+		<?php
+	}
 }