Merge pull request #118 from ryanwelcher/fix/pagination

Resurrect the pagination toggle control.

Author: ryanwelcher

src/components/pagination-toggle.js

@@ -1,39 +1,30 @@
 /**
  * WordPress dependencies
  */
-import { useSelect } from '@wordpress/data';
-import { store as blockEditorStore } from '@wordpress/block-editor';
-import { useEffect } from '@wordpress/element';
+import { ToggleControl } from '@wordpress/components';
+import { __ } from '@wordpress/i18n';
 
-/**
- * Check for the core/query-pagination block.
- *
- * @param {Array} blocks The array of innerBlocks
- * @return {string|boolean} Return either the clientId or false if not found.
- */
-const getPaginationBlockClientId = ( blocks ) => {
-	return blocks.find( ( block ) => block.name === 'core/query-pagination' )
-		?.clientId;
-};
+export const PaginationToggle = ( { attributes, setAttributes } ) => {
+	const { query: { disable_pagination: disablePagination } = {} } =
+		attributes;
 
-export const PaginationToggle = ( { attributes, setAttributes, clientId } ) => {
-	const innerBlocks = useSelect(
-		( select ) =>
-			select( blockEditorStore ).getBlocksByClientId( clientId )[ 0 ]
-				?.innerBlocks
+	return (
+		<ToggleControl
+			label={ __( 'Disable pagination', 'advanced-query-loop' ) }
+			help={ __(
+				'Disabling pagination will not show any pagination controls on the front end. It can also provide a performance improvement for complicated queries.',
+				'advanced-query-loop'
+			) }
+			checked={ !! disablePagination }
+			onChange={ () => {
+				setAttributes( {
+					query: {
+						...attributes.query,
+						disable_pagination: ! disablePagination,
+					},
+				} );
+			} }
+			__nextHasNoMarginBottom
+		/>
 	);
-
-	useEffect( () => {
-		setAttributes( {
-			query: {
-				...attributes.query,
-				disable_pagination: ! getPaginationBlockClientId( innerBlocks )
-					? true
-					: false,
-			},
-		} );
-	}, [ innerBlocks, setAttributes ] );
-
-	// There is no UI for component.
-	return null;
 };