Merge pull request #322 from 10up/fix/podcast-terms

Ensure that the selected podcast term doesn't get removed from the podcast block settings.
10up · Nov 15, 2024 · acdd7b4 · acdd7b4
2 parents ff72cdc + dc89130
commit acdd7b4
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 590 deletions.
diff --git a/assets/js/create-podcast-show.js b/assets/js/create-podcast-show.js
@@ -263,18 +263,9 @@ const CreatePodcastShowPlugin = () => {
 	const [ isModalOpen, setIsModalOpen ] = useState( false );
 	const openModal = () => setIsModalOpen( true );
 	const closeModal = () => setIsModalOpen( false );
-	const initAttachedPodcastIds = attachedPodcasts.map( ( item ) => item.id );
-	const [attachedPodcastIds, setAttachedPodcastIds] = useState([]);
-
-	/*
-	 * This is a workaround for WP 5.7 to prevent infinite loop
-	 * when setting state.
-	 *
-	 * @todo remove this when the min supported WP version is bumped
-	 * to 6.1
-	 */
-	const [isAttached, setisAttached] = useState( true );
-
+	const attachedPodcastIds = useSelect( ( select ) => {
+		return select( 'core/editor' ).getEditedPostAttribute( 'podcasting_podcasts' );
+	} );
 
 	/**
 	 * Attaches the podcast term to the current post if selected.
@@ -283,12 +274,12 @@ const CreatePodcastShowPlugin = () => {
 	 * @param {Integer} podcastId The podcast term ID.
 	 */
 	function attachPodcastToPost( isChecked, podcastId ) {
-		let updatedAttachedPodcastIds = [ ...initAttachedPodcastIds, ...attachedPodcastIds, podcastId ];
+		let updatedAttachedPodcastIds = [ ...attachedPodcastIds, podcastId ];
 
 		if ( isChecked ) {
-			updatedAttachedPodcastIds = [ ...initAttachedPodcastIds, ...attachedPodcastIds, podcastId ];
+			updatedAttachedPodcastIds = [ ...attachedPodcastIds, podcastId ];
 		} else {
-			updatedAttachedPodcastIds = [...initAttachedPodcastIds,...attachedPodcastIds].filter( ( currentPodcastId ) => currentPodcastId !== podcastId );
+			updatedAttachedPodcastIds = attachedPodcastIds.filter( ( currentPodcastId ) => currentPodcastId !== podcastId );
 		}
 
 		dispatch( coreDataStore ).editEntityRecord(
@@ -299,9 +290,6 @@ const CreatePodcastShowPlugin = () => {
 				podcasting_podcasts: updatedAttachedPodcastIds,
 			}
 		)
-
-		setAttachedPodcastIds( updatedAttachedPodcastIds );
-		setisAttached( false );
 	}
 
 	return (
@@ -318,7 +306,7 @@ const CreatePodcastShowPlugin = () => {
 								key={ index }
 								label={ item.name }
 								onChange={ ( isChecked ) => attachPodcastToPost( isChecked, item.id ) }
-								checked={ isAttached ? initAttachedPodcastIds.includes( item.id ) : attachedPodcastIds.includes( item.id ) }
+								checked={ attachedPodcastIds.includes( item.id ) }
 							/>
 						)
 					} )

diff --git a/assets/js/edit.js b/assets/js/edit.js
@@ -27,13 +27,6 @@ import { useState, useEffect } from '@wordpress/element';
 import { dispatch, useSelect, useDispatch } from '@wordpress/data';
 import { createBlock } from '@wordpress/blocks';
 
-/*
- * Import hierarchical term selector.
- *
- * @TODO Import from `@wordpress/editor` once minimum WP version is 6.0.
- */
-import HierarchicalTermSelector from './term-selector/hierarchical-term-selector';
-
 function useFeaturedImage() {
     const featuredImageId = useSelect((select) => select('core/editor').getEditedPostAttribute('featured_media'), []);
     const { editPost } = useDispatch('core/editor');
@@ -88,7 +81,6 @@ function Edit( props ) {
 
 	const [ src, setSrc ] = useState( props.attributes.src );
 
-	useEffect( () => () => wp.data.dispatch('core/editor').editPost({ podcasting_podcasts: [] }) );
 	const postTitle = useSelect( ( select ) => select( 'core/editor' ).getEditedPostAttribute( 'title' ) );
 
 	const onSelectAttachment = (attachment) => {
@@ -176,18 +168,18 @@ function Edit( props ) {
 		</BlockControls>
 	);
 
-	const { getCurrentPost } = select('core/editor');
-	const postDetails = getCurrentPost();
-
-	const showId = postDetails ? postDetails.podcasting_podcasts[0] : null;
-
-	const show = select('core').getEntityRecords('taxonomy', 'podcasting_podcasts', {
-		per_page: 1,
-		term_id: showId,
-	});
+	const showId = useSelect( ( __select ) => {
+		const attachedPodcastIds = __select( 'core/editor' ).getEditedPostAttribute( 'podcasting_podcasts' );
+		return attachedPodcastIds ? attachedPodcastIds[0] : null;
+	} );
+	const show = useSelect( ( __select ) => {
+		return __select('core').getEntityRecords('taxonomy', 'podcasting_podcasts', {
+			include: [ showId ],
+		});
+	} );
 
-	const showName = show ? show[0].name : null;
-	const showImage = show ? show[0].meta.podcasting_image_url : null;
+	const showName = show && show[0] ? show[0]?.name : null;
+	const showImage = show && show[0] ? show[0]?.meta?.podcasting_image_url : null;
 
 	const onUpdateImage = (image) => {
 		setFeaturedImage(image.id);
@@ -199,12 +191,8 @@ function Edit( props ) {
 			<InspectorControls>
 				<PanelBody
 					title={__('Podcast Settings', 'simple-podcasting')}
+					className="simple-podcast-settings"
 				>
-					<PanelRow>
-						<div id="hierar-podcasting_podcasts">
-							<HierarchicalTermSelector slug="podcasting_podcasts" />
-						</div>
-					</PanelRow>
 					<PanelRow>
 						<ToggleControl
 							id="podcast-captioned-form-toggle"