Add defaultPage attribute to Comments Query Loop

WordPress · Jan 31, 2022 · 39a9318 · 39a9318
1 parent aa4cd79
commit 39a9318
Show file tree

Hide file tree

Showing 5 changed files with 44 additions and 9 deletions.
diff --git a/docs/reference-guides/core-blocks.md b/docs/reference-guides/core-blocks.md
@@ -204,7 +204,7 @@ An advanced block that allows displaying post comments based on different query
 -	**Name:** core/comments-query-loop
 -	**Category:** theme
 -	**Supports:** align (full, wide), color (background, gradients, link, text), ~~html~~
--	**Attributes:** inherit, order, perPage, tagName
+-	**Attributes:** defaultPage, inherit, order, perPage, tagName
 
 ## Cover
 

diff --git a/packages/block-library/src/comment-template/block.json b/packages/block-library/src/comment-template/block.json
@@ -7,7 +7,12 @@
 	"parent": [ "core/comments-query-loop" ],
 	"description": "Contains the block elements used to render a comment, like the title, date, author, avatar and more.",
 	"textdomain": "default",
-	"usesContext": [ "comments/perPage", "postId", "comments/order" ],
+	"usesContext": [
+		"comments/defaultPage",
+		"comments/order",
+		"comments/perPage",
+		"postId"
+	],
 	"supports": {
 		"reusable": false,
 		"html": false,

diff --git a/packages/block-library/src/comments-query-loop/block.json b/packages/block-library/src/comments-query-loop/block.json
@@ -22,11 +22,16 @@
 		"tagName": {
 			"type": "string",
 			"default": "div"
+		},
+		"defaultPage": {
+			"type": "string",
+			"default": "oldest"
 		}
 	},
 	"providesContext": {
 		"comments/perPage": "perPage",
 		"comments/order": "order",
+		"comments/defaultPage": "defaultPage",
 		"comments/inherit": "inherit"
 	},
 	"supports": {

diff --git a/packages/block-library/src/comments-query-loop/edit.js b/packages/block-library/src/comments-query-loop/edit.js
@@ -26,11 +26,13 @@ export default function CommentsQueryLoopEdit( { attributes, setAttributes } ) {
 		template: TEMPLATE,
 	} );
 
-	const { commentOrder, commentsPerPage } = useSelect( ( select ) => {
-		const { getSettings } = select( blockEditorStore );
-		const { __experimentalDiscussionSettings } = getSettings();
-		return __experimentalDiscussionSettings;
-	} );
+	const { commentOrder, commentsPerPage, defaultPage } = useSelect(
+		( select ) => {
+			const { getSettings } = select( blockEditorStore );
+			const { __experimentalDiscussionSettings } = getSettings();
+			return __experimentalDiscussionSettings;
+		}
+	);
 
 	return (
 		<>
@@ -40,6 +42,7 @@ export default function CommentsQueryLoopEdit( { attributes, setAttributes } ) {
 				defaultSettings={ {
 					defaultOrder: commentOrder,
 					defaultPerPage: commentsPerPage,
+					defaultDefaultPage: defaultPage,
 				} }
 			/>
 			<TagName { ...innerBlocksProps } />

diff --git a/packages/block-library/src/comments-query-loop/edit/comments-inspector-controls.js b/packages/block-library/src/comments-query-loop/edit/comments-inspector-controls.js
@@ -21,10 +21,21 @@ const orderOptions = [
 	},
 ];
 
+const defaultPageOptions = [
+	{
+		label: __( 'Newest' ),
+		value: 'newest',
+	},
+	{
+		label: __( 'Oldest' ),
+		value: 'oldest',
+	},
+];
+
 export default function CommentsInspectorControls( {
-	attributes: { TagName, perPage, order, inherit },
+	attributes: { TagName, perPage, order, inherit, defaultPage },
 	setAttributes,
-	defaultSettings: { defaultPerPage, defaultOrder },
+	defaultSettings: { defaultPerPage, defaultOrder, defaultDefaultPage },
 } ) {
 	return (
 		<InspectorControls>
@@ -37,6 +48,7 @@ export default function CommentsInspectorControls( {
 							inherit: ! inherit,
 							order: inherit ? defaultOrder : null,
 							perPage: inherit ? defaultPerPage : null,
+							defaultPage: inherit ? defaultDefaultPage : null,
 						} );
 					} }
 				/>
@@ -52,6 +64,16 @@ export default function CommentsInspectorControls( {
 								} );
 							} }
 						/>
+						<SelectControl
+							label={ __( 'Default page' ) }
+							value={ defaultPage }
+							options={ defaultPageOptions }
+							onChange={ ( value ) => {
+								setAttributes( {
+									defaultPage: value,
+								} );
+							} }
+						/>
 						<NumberControl
 							__unstableInputWidth="60px"
 							label={ __( 'Items per Page' ) }