FileMaster

Edit File: refresh-button-portal.js

import { useState, useEffect, createPortal } from '@wordpress/element';
import { RefreshButton } from './page-seo-checks/analyzer/utils/page-builder';

const RefreshButtonPortal = ( {
	isRefreshing,
	isChecking,
	onClick,
	targetSelector = '.refresh-button-container',
} ) => {
	const [ targetElement, setTargetElement ] = useState( null );

useEffect( () => {
		const findTarget = () => {
			const element = document.querySelector( targetSelector );
			if ( element ) {
				setTargetElement( element );
			}
		};

findTarget();

const Observer =
			window.MutationObserver ||
			window.WebKitMutationObserver ||
			window.MozMutationObserver;
		const observer = Observer ? new Observer( findTarget ) : null;
		if ( observer ) {
			observer.observe( document.body, {
				childList: true,
				subtree: true,
			} );
		}

return () => observer.disconnect();
	}, [ targetSelector ] );

if ( ! targetElement ) {
		return null;
	}

return createPortal(
		<RefreshButton
			isRefreshing={ isRefreshing }
			isChecking={ isChecking }
			onClick={ onClick }
		/>,
		targetElement
	);
};

export default RefreshButtonPortal;

Back