Fix category title and add post_title to docs manifest (#41715)

docs/contributing/minification-of-SCSS-and-JS.md

@@ -1,4 +1,3 @@
-
 ---
 post_title: Minification of SCSS and JS
 ---

docs/extension-development/adding-a-section-to-a-settings-tab.md

@@ -1,4 +1,3 @@
-
 ---
 post_title: Adding a section to a settings tab
 ---

docs/extension-development/using-custom-attributes-in-menus.md

@@ -1,4 +1,3 @@
-
 ---
 post_title: Using custom attributes in menus and taxonomy archives
 ---
@@ -7,9 +6,7 @@ Attributes that can be used for the layered nav are a custom taxonomy, which mea
 
 > **Note:**  This is a  **Developer level**  doc. If you are unfamiliar with code/templates and resolving potential conflicts, select a  [WooExpert or Developer](https://woo.com/customizations/) for assistance. We are unable to provide support for customizations under our  [Support Policy](https://woo.com/support-policy/).
 
----
-post_title: Register the taxonomy for menus
----
+## Register the taxonomy for menus
 
 When registering taxonomies for your custom attributes, WooCommerce calls the following hook:
 
@@ -32,9 +29,7 @@ Custom attribute slugs are prefixed with `pa_`, so an attribute called `size` wo
 
 Now use your attribute in  **Appearance > Menus**. You will notice, however, that it has default blog styling when you click on a link to your taxonomy term.
 
----
-post_title: Create a template
----
+## Create a template
 
 You need to theme your attribute to make it display products as you want. To do this:
 

tools/monorepo-utils/src/md-docs/lib/generate-frontmatter.ts

@@ -10,7 +10,8 @@ import yaml from 'js-yaml';
  * @param fileContents
  */
 export const generatePostFrontMatter = (
-	fileContents: string
+	fileContents: string,
+	includeContent?: boolean
 ): {
 	[ key: string ]: unknown;
 } => {
@@ -22,6 +23,7 @@ export const generatePostFrontMatter = (
 		'post_name',
 		'category_title',
 		'category_slug',
+		'content',
 	];
 
 	const frontMatter = matter( fileContents, {
@@ -30,12 +32,21 @@ export const generatePostFrontMatter = (
 			// See https://github.com/jonschlinkert/gray-matter/issues/62#issuecomment-577628177 for more details.
 			yaml: ( s ) => yaml.load( s, { schema: yaml.JSON_SCHEMA } ),
 		},
-	} ).data;
+	} );
+	const content = frontMatter.content.split( '\n' );
+	const headings = content.filter(
+		( line ) => line.substring( 0, 2 ) === '# '
+	);
+	const title = headings[ 0 ]?.substring( 2 ).trim();
 
-	return Object.keys( frontMatter )
+	frontMatter.data.post_title = frontMatter.data.post_title ?? title;
+	if ( includeContent ?? false ) {
+		frontMatter.data.content = frontMatter.content;
+	}
+	return Object.keys( frontMatter.data )
 		.filter( ( key ) => allowList.includes( key ) )
 		.reduce( ( obj, key ) => {
-			obj[ key ] = frontMatter[ key ];
+			obj[ key ] = frontMatter.data[ key ];
 			return obj;
 		}, {} );
 };

tools/monorepo-utils/src/md-docs/lib/generate-manifest.ts

@@ -42,15 +42,25 @@ async function processDirectory(
 	// Process README.md (if exists) for the category definition.
 	const readmePath = path.join( subDirectory, 'README.md' );
 
-	if ( checkReadme && fs.existsSync( readmePath ) ) {
-		const readmeContent = fs.readFileSync( readmePath, 'utf-8' );
-		const frontMatter = generatePostFrontMatter( readmeContent );
-		Object.assign( category, frontMatter );
-	} else if ( checkReadme ) {
-		// derive the category title from the directory name, capitalize first letter
-		const categoryTitle = path.basename( subDirectory );
-		category.category_title =
-			categoryTitle.charAt( 0 ).toUpperCase() + categoryTitle.slice( 1 );
+	if ( checkReadme ) {
+		if ( fs.existsSync( readmePath ) ) {
+			const readmeContent = fs.readFileSync( readmePath, 'utf-8' );
+			const frontMatter = generatePostFrontMatter( readmeContent, true );
+			category.content = frontMatter.content;
+			category.category_slug = frontMatter.category_slug;
+			category.category_title = frontMatter.category_title;
+		}
+		// derive the category title from the directory name, capitalize first letter of each word.
+		const categoryFolder = path.basename( subDirectory );
+		const categoryTitle = categoryFolder
+			.split( '-' )
+			.map(
+				( slugPart ) =>
+					slugPart.charAt( 0 ).toUpperCase() + slugPart.slice( 1 )
+			)
+			.join( ' ' );
+		category.category_slug = category.category_slug ?? categoryFolder;
+		category.category_title = category.category_title ?? categoryTitle;
 	}
 
 	const markdownFiles = glob.sync( path.join( subDirectory, '*.md' ) );