Fix refactor flat term selector to use data api for creating new terms (

#50952)
WordPress · Jun 19, 2023 · 9cd88c7 · 9cd88c7
1 parent a05b015
commit 9cd88c7
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 32 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/editor/package.json b/packages/editor/package.json
@@ -61,7 +61,6 @@
 		"@wordpress/wordcount": "file:../wordcount",
 		"classnames": "^2.3.1",
 		"date-fns": "^2.28.0",
-		"escape-html": "^1.0.3",
 		"memize": "^2.1.0",
 		"react-autosize-textarea": "^7.1.0",
 		"rememo": "^4.0.2",

diff --git a/packages/editor/src/components/post-taxonomies/flat-term-selector.js b/packages/editor/src/components/post-taxonomies/flat-term-selector.js
@@ -1,8 +1,3 @@
-/**
- * External dependencies
- */
-import escapeHtml from 'escape-html';
-
 /**
  * WordPress dependencies
  */
@@ -12,7 +7,6 @@ import { FormTokenField, withFilters } from '@wordpress/components';
 import { useSelect, useDispatch } from '@wordpress/data';
 import { store as coreStore } from '@wordpress/core-data';
 import { useDebounce } from '@wordpress/compose';
-import apiFetch from '@wordpress/api-fetch';
 import { speak } from '@wordpress/a11y';
 
 /**
@@ -51,28 +45,6 @@ const termNamesToIds = ( names, terms ) => {
 	);
 };
 
-// Tries to create a term or fetch it if it already exists.
-function findOrCreateTerm( termName, restBase, namespace ) {
-	const escapedTermName = escapeHtml( termName );
-
-	return apiFetch( {
-		path: `/${ namespace }/${ restBase }`,
-		method: 'POST',
-		data: { name: escapedTermName },
-	} )
-		.catch( ( error ) => {
-			if ( error.code !== 'term_exists' ) {
-				return Promise.reject( error );
-			}
-
-			return Promise.resolve( {
-				id: error.data.term_id,
-				name: termName,
-			} );
-		} )
-		.then( unescapeTerm );
-}
-
 export function FlatTermSelector( { slug } ) {
 	const [ values, setValues ] = useState( [] );
 	const [ search, setSearch ] = useState( '' );
@@ -165,11 +137,30 @@ export function FlatTermSelector( { slug } ) {
 	}, [ searchResults ] );
 
 	const { editPost } = useDispatch( editorStore );
+	const { saveEntityRecord } = useDispatch( coreStore );
 
 	if ( ! hasAssignAction ) {
 		return null;
 	}
 
+	async function findOrCreateTerm( term ) {
+		try {
+			const newTerm = await saveEntityRecord( 'taxonomy', slug, term, {
+				throwOnError: true,
+			} );
+			return unescapeTerm( newTerm );
+		} catch ( error ) {
+			if ( error.code !== 'term_exists' ) {
+				throw error;
+			}
+
+			return {
+				id: error.data.term_id,
+				name: term.name,
+			};
+		}
+	}
+
 	function onUpdateTerms( newTermIds ) {
 		editPost( { [ taxonomy.rest_base ]: newTermIds } );
 	}
@@ -209,10 +200,9 @@ export function FlatTermSelector( { slug } ) {
 			return;
 		}
 
-		const namespace = taxonomy?.rest_namespace ?? 'wp/v2';
 		Promise.all(
 			newTermNames.map( ( termName ) =>
-				findOrCreateTerm( termName, taxonomy.rest_base, namespace )
+				findOrCreateTerm( { name: termName } )
 			)
 		).then( ( newTerms ) => {
 			const newAvailableTerms = availableTerms.concat( newTerms );