Release wp-parsely 3.20.1

CHANGELOG.md

@@ -5,6 +5,12 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [3.20.1](https://github.com/Parsely/wp-parsely/compare/3.20.0...3.20.1) - 2025-06-19
+
+### Fixed
+
+- Fix outbound link highlights in Traffic Boost ([#3469](https://github.com/Parsely/wp-parsely/pull/3469))
+
 ## [3.20.0](https://github.com/Parsely/wp-parsely/compare/3.19.3...3.20.0) - 2025-06-18
 
 ### Changed

README.md

@@ -1,6 +1,6 @@
 # Parse.ly
 
-Stable tag: 3.20.0  
+Stable tag: 3.20.1  
 Requires at least: 6.0  
 Tested up to: 6.8  
 Requires PHP: 7.4  

build/content-helper/dashboard-page.asset.php

@@ -1 +1 @@
-<?php return array('dependencies' => array('react', 'wp-api-fetch', 'wp-components', 'wp-compose', 'wp-data', 'wp-dom-ready', 'wp-element', 'wp-escape-html', 'wp-i18n', 'wp-notices', 'wp-primitives', 'wp-url'), 'version' => 'd32bef74f4fde0b9ec6b');
+<?php return array('dependencies' => array('react', 'wp-api-fetch', 'wp-components', 'wp-compose', 'wp-data', 'wp-dom-ready', 'wp-element', 'wp-escape-html', 'wp-i18n', 'wp-notices', 'wp-primitives', 'wp-url'), 'version' => '1584528d4b5b04a117a7');

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "wp-parsely",
-	"version": "3.20.0",
+	"version": "3.20.1",
 	"private": true,
 	"description": "The Parse.ly plugin facilitates real-time and historical analytics to your content through a platform designed and built for digital publishing.",
 	"author": "parsely, hbbtstar, jblz, mikeyarce, GaryJ, parsely_mike, acicovic, mehmoodak, vaurdan",

src/content-helper/dashboard-page/pages/traffic-boost/preview/components/link-counter.tsx

@@ -2,7 +2,7 @@
  * WordPress dependencies
  */
 import { Button } from '@wordpress/components';
-import { useDispatch } from '@wordpress/data';
+import { useDispatch, useSelect } from '@wordpress/data';
 import { useEffect, useState } from '@wordpress/element';
 import { __, sprintf } from '@wordpress/i18n';
 
@@ -67,6 +67,7 @@ export const LinkCounter = ( {
 		smart: 0,
 	} );
 
+	const storePreviewLinkType = useSelect( ( select ) => select( TrafficBoostStore ).getPreviewLinkType(), [] );
 	const { setPreviewLinkType } = useDispatch( TrafficBoostStore );
 
 	useEffect( () => {
@@ -108,6 +109,17 @@ export const LinkCounter = ( {
 		setPreviewLinkType( initialSelectedLinkType );
 	}, [ initialSelectedLinkType, setPreviewLinkType ] );
 
+	/**
+	 * Updates the selected link type when changed externally via the store.
+	 *
+	 * @since 3.20.1
+	 */
+	useEffect( () => {
+		if ( storePreviewLinkType !== selectedLinkType ) {
+			setSelectedLinkType( storePreviewLinkType );
+		}
+	}, [ selectedLinkType, storePreviewLinkType ] );
+
 	/**
 	 * Handles click events on link type buttons.
 	 *

src/content-helper/dashboard-page/pages/traffic-boost/preview/components/preview-iframe.tsx

@@ -19,6 +19,7 @@ import { TextSelection } from '../preview';
 import { getContentArea, isExternalURL } from '../utils';
 import { PreviewActions } from './preview-actions';
 import { TextSelectionTooltip } from './text-selection-tooltip';
+import { useExistingLinkHighlight } from '../hooks/use-existing-link-highlight';
 
 /**
  * Props structure for PreviewIframe.
@@ -92,16 +93,18 @@ export const PreviewIframe = ( {
 	}, [ previewUrl ] );
 
 	// Create an actions bar to be mounted in the iframe with useIframeHighlight().
-	const actionsBar = <PreviewActions
-		activeLink={ activeLink }
-		onAccept={ onAccept }
-		onDiscard={ onDiscard }
-		onUpdateLink={ onUpdateLink }
-		onRemove={ onRemove }
-		onRestoreOriginal={ onRestoreOriginal }
-		selectedText={ selectedText ?? null }
-		iframeRef={ iframeRef }
-	/>;
+	const actionsBar = useMemo( () => (
+		<PreviewActions
+			activeLink={ activeLink }
+			onAccept={ onAccept }
+			onDiscard={ onDiscard }
+			onUpdateLink={ onUpdateLink }
+			onRemove={ onRemove }
+			onRestoreOriginal={ onRestoreOriginal }
+			selectedText={ selectedText ?? null }
+			iframeRef={ iframeRef }
+		/>
+	), [ activeLink, onAccept, onDiscard, onUpdateLink, onRemove, onRestoreOriginal, selectedText, iframeRef ] );
 
 	/**
 	 * Highlights the smart link in the iframe.
@@ -111,7 +114,6 @@ export const PreviewIframe = ( {
 	const {
 		injectHighlightStyles,
 		highlightSmartLink,
-		highlightLinkType,
 		removeSmartLinkHighlights,
 	} = useIframeHighlight( {
 		iframeRef,
@@ -123,6 +125,15 @@ export const PreviewIframe = ( {
 		actionsBar,
 	} );
 
+	const {
+		injectExistingLinkHighlightStyles,
+		highlightExistingLinkType,
+	} = useExistingLinkHighlight( {
+		iframeRef,
+		contentAreaRef,
+		activeLink,
+	} );
+
 	/**
 	 * Hides the admin bar from the iframe if the preview is in frontend mode.
 	 *
@@ -298,6 +309,7 @@ export const PreviewIframe = ( {
 		}
 
 		injectHighlightStyles( iframe );
+		injectExistingLinkHighlightStyles( iframe );
 
 		// Updates the content area ref to the iframe's content area.
 		const contentArea = getContentArea( iframe.contentDocument );
@@ -311,19 +323,17 @@ export const PreviewIframe = ( {
 		}
 
 		hideAdminBar( iframe );
-		highlightLinkType( iframe, selectedLinkType );
 		disableNavigation( iframe );
 
 		onLoadingChange( false );
 		jumpToSmartLink( iframe );
 	}, [ contentAreaRef,
 		disableNavigation,
 		hideAdminBar,
-		highlightLinkType,
 		injectHighlightStyles,
+		injectExistingLinkHighlightStyles,
 		jumpToSmartLink,
 		onLoadingChange,
-		selectedLinkType,
 	] );
 
 	/**
@@ -399,8 +409,8 @@ export const PreviewIframe = ( {
 			return;
 		}
 
-		highlightLinkType( iframe, selectedLinkType );
-	}, [ contentAreaRef, highlightLinkType, isLoading, selectedLinkType ] );
+		highlightExistingLinkType( iframe, selectedLinkType );
+	}, [ contentAreaRef, highlightExistingLinkType, isLoading, selectedLinkType ] );
 
 	return (
 		<div className="wp-parsely-preview">