feat(homepage-posts): add a show-full-content attribute

Automattic · Sep 19, 2024 · 067b7c2 · 067b7c2
1 parent 51551e6
commit 067b7c2
Show file tree

Hide file tree

Showing 5 changed files with 56 additions and 23 deletions.
diff --git a/includes/class-newspack-blocks-api.php b/includes/class-newspack-blocks-api.php
@@ -296,6 +296,7 @@ public static function posts_endpoint( $request ) {
 				'excerpt'             => [
 					'rendered' => post_password_required( $post ) ? '' : $excerpt,
 				],
+				'full_content'        => get_the_content( $post->ID ),
 				'featured_media'      => (int) get_post_thumbnail_id( $post->ID ),
 				'id'                  => $post->ID,
 				'meta'                => $meta->get_value( $post->ID, $request ),

diff --git a/src/blocks/homepage-articles/block.json b/src/blocks/homepage-articles/block.json
@@ -10,6 +10,10 @@
 			"type": "boolean",
 			"default": true
 		},
+		"showFullContent": {
+			"type": "boolean",
+			"default": false
+		},
 		"excerptLength": {
 			"type": "number",
 			"default": 55
@@ -214,9 +218,7 @@
 		},
 		"postType": {
 			"type": "array",
-			"default": [
-				"post"
-			],
+			"default": ["post"],
 			"items": {
 				"type": "string"
 			}
@@ -227,9 +229,7 @@
 		},
 		"includedPostStatuses": {
 			"type": "array",
-			"default": [
-				"publish"
-			],
+			"default": ["publish"],
 			"items": {
 				"type": "string"
 			}
@@ -239,4 +239,4 @@
 			"default": true
 		}
 	}
-}
+}
diff --git a/src/blocks/homepage-articles/edit.tsx b/src/blocks/homepage-articles/edit.tsx
@@ -111,6 +111,7 @@ class Edit extends Component< HomepageArticlesProps > {
 			showCaption,
 			showCredit,
 			showExcerpt,
+			showFullContent,
 			showReadMore,
 			readMoreLabel,
 			showSubtitle,
@@ -206,11 +207,16 @@ class Edit extends Component< HomepageArticlesProps > {
 							{ post.meta.newspack_post_subtitle || '' }
 						</RawHTML>
 					) }
-					{ showExcerpt && (
+					{ showExcerpt && ! showFullContent && (
 						<RawHTML key="excerpt" className="excerpt-contain">
 							{ post.excerpt.rendered }
 						</RawHTML>
 					) }
+					{ ! showExcerpt && showFullContent && (
+						<RawHTML key="full-content" className="excerpt-contain">
+							{ post.full_content }
+						</RawHTML>
+					) }
 					{ showReadMore && post.post_link && (
 						<a href="#" key="readmore" className="more-link">
 							{ readMoreLabel }
@@ -281,6 +287,7 @@ class Edit extends Component< HomepageArticlesProps > {
 			minHeight,
 			moreButton,
 			showExcerpt,
+			showFullContent,
 			showReadMore,
 			readMoreLabel,
 			excerptLength,
@@ -547,23 +554,44 @@ class Edit extends Component< HomepageArticlesProps > {
 						<ToggleControl
 							label={ __( 'Show Excerpt', 'newspack-blocks' ) }
 							checked={ showExcerpt }
-							onChange={ () => setAttributes( { showExcerpt: ! showExcerpt } ) }
+							onChange={ () => {
+								setAttributes({
+									showExcerpt: !showExcerpt,
+									showFullContent: showFullContent ? false : showFullContent
+								})
+							} }
 						/>
 					</PanelRow>
 					{ showExcerpt && (
-						<RangeControl
-							label={ __( 'Max number of words in excerpt', 'newspack-blocks' ) }
-							value={ excerptLength }
-							onChange={ ( value: number ) => setAttributes( { excerptLength: value } ) }
-							min={ 10 }
-							max={ 100 }
-						/>
+						<PanelRow>
+							<RangeControl
+								label={ __( 'Max number of words in excerpt', 'newspack-blocks' ) }
+								value={ excerptLength }
+								onChange={ ( value: number ) => setAttributes( { excerptLength: value } ) }
+								min={ 10 }
+								max={ 100 }
+							/>
+						</PanelRow>
 					) }
-					<ToggleControl
-						label={ __( 'Add a "Read More" link', 'newspack-blocks' ) }
-						checked={ showReadMore }
-						onChange={ () => setAttributes( { showReadMore: ! showReadMore } ) }
-					/>
+					<PanelRow>
+						<ToggleControl
+							label={ __( 'Show Full Content', 'newspack-blocks' ) }
+							checked={ showFullContent }
+							onChange={ () => {
+								setAttributes({
+									showFullContent: !showFullContent,
+									showExcerpt: showExcerpt ? false : showExcerpt
+								})
+							} }
+						/>
+					</PanelRow>
+					<PanelRow>
+						<ToggleControl
+							label={ __( 'Add a "Read More" link', 'newspack-blocks' ) }
+							checked={ showReadMore }
+							onChange={ () => setAttributes( { showReadMore: ! showReadMore } ) }
+						/>
+					</PanelRow>
 					{ showReadMore && (
 						<TextControl
 							label={ __( '"Read More" link text', 'newspack-blocks' ) }

diff --git a/src/blocks/homepage-articles/templates/article.php b/src/blocks/homepage-articles/templates/article.php
@@ -147,9 +147,12 @@ class="<?php echo esc_attr( implode( ' ', $classes ) ); ?>"
 				</div>
 			<?php endif; ?>
 			<?php
-			if ( $attributes['showExcerpt'] ) :
+			if ( $attributes['showExcerpt'] && ! $attributes['showFullContent'] ) :
 				the_excerpt();
 			endif;
+			if ( $attributes['showFullContent'] && ! $attributes['showExcerpt'] ) :
+				the_content();
+			endif;
 			if ( $post_link && ( $attributes['showReadMore'] ) ) :
 				?>
 				<a class="more-link" href="<?php echo esc_url( $post_link ); ?>" rel="bookmark">

diff --git a/src/types/index.d.ts b/src/types/index.d.ts
@@ -65,6 +65,7 @@ declare global {
 		excerpt: {
 			rendered: string;
 		};
+		full_content: string;
 		meta: {
 			newspack_post_subtitle: string;
 		};
@@ -104,6 +105,7 @@ declare global {
 		postType: PostType[];
 		showImage: boolean;
 		showExcerpt: boolean;
+		showFullContent: boolean;
 		tags: TagId[];
 		customTaxonomies: Taxonomy[];
 		specificPosts: string[];
@@ -112,7 +114,6 @@ declare global {
 		categoryExclusions: CategoryId[];
 		customTaxonomyExclusions: Taxonomy[];
 		className: string;
-		showExcerpt: boolean;
 		excerptLength: number;
 		showReadMore: boolean;
 		readMoreLabel: string;