👌 IMPROVE: Block name via Commander

Author: Ahmad Awais

packages/create-guten-block/app/cli.js

@@ -7,55 +7,51 @@
 'use strict';
 
 const chalk = require( 'chalk' );
-const envinfo = require( 'envinfo' );
 const commander = require( 'commander' );
-const clearConsole = require( './consoleClear' );
+const maybeEnvInfo = require( './envInfo' );
+const noBlockName = require( './noBlockName' );
 const packageJson = require( '../package.json' );
 
 // Commander.js program.
 module.exports = () => {
+	// Block's name
+	let blockName;
+
 	const program = new commander.Command( packageJson.name )
-		.version( packageJson.version, '-v, --version' )
-		.description(
-			`CGB ${ chalk.dim(
-				'(create-guten-block)'
-			) } is a Zero-Config #OCJS for builing WordPress Gutenberg Blocks.`
-		);
-	program
-		.option( '-d, --debug', 'Prints envinfo for debugging. ' )
 		.arguments( '<block-name>' )
 		.usage( `${ chalk.green( '<block-name>' ) }` )
+		.action( name => {
+			blockName = name;
+		} )
 		.allowUnknownOption()
 		.on( '--help', () => {
 			console.log( `\n    Only ${ chalk.green( '<block-name>' ) } is required.\n` );
 		} )
+		.option( '-d, --debug', 'Prints envinfo for debugging' )
+		.description(
+			`CGB ${ chalk.dim(
+				'(create-guten-block)'
+			) } is a Zero-Config #OCJS for builing WordPress Gutenberg Blocks.`
+		)
+		.version( packageJson.version, '-v, --version' )
 		.parse( process.argv );
 
-	// Envinfo.
-	if ( program.debug ) {
-		clearConsole();
-
-		console.log(
-			'\n🔰  ' +
-				chalk.black.bgYellow( ' Printing the debug env info below: \n\n' ) +
-				chalk.dim( '   This may take a couple of seconds...' )
-		);
-
-		// Print the envinfo.
-		envinfo.print( {
-			packages: [ 'cgb-scripts' ],
-			cpu: true,
-			duplicates: true,
-			browsers: true,
-			noNativeIDE: true,
-		} );
-
-		console.log(
-			'\n✅  ' +
-				chalk.black.bgGreen( ' Done ' ) +
-				chalk.dim( ' You can copy paste this info to share it...\n' )
-		);
-		// Let's end the process so the app doesn't continue.
-		process.exit();
-	}
+	// If no blockName.
+	if ( typeof blockName === 'undefined' ) {
+		// Maybe user asked for debug info.
+		maybeEnvInfo( program );
+
+		// If still running then tell user to provide blockName.
+		noBlockName();
+	} // End.
+
+	// We must have a blockName by now.
+
+	// Format the blockName.
+	const formatBlockName = blockName
+		.toLowerCase()
+		.split( ' ' )
+		.join( '-' );
+
+	return formatBlockName;
 };

packages/create-guten-block/app/envInfo.js

@@ -0,0 +1,41 @@
+/**
+ * Environment Info
+ *
+ * Prints envinfo for debugging.
+ */
+
+'use strict';
+
+const chalk = require( 'chalk' );
+const envinfo = require( 'envinfo' );
+const clearConsole = require( './consoleClear' );
+
+module.exports = program => {
+	// Envinfo.
+	if ( program.debug ) {
+		clearConsole();
+
+		console.log(
+			'\n🔰  ' +
+				chalk.black.bgYellow( ' Printing the debug env info below: \n\n' ) +
+				chalk.dim( '   This may take a couple of seconds...' )
+		);
+
+		// Print the envinfo.
+		envinfo.print( {
+			packages: [ 'cgb-scripts' ],
+			cpu: true,
+			duplicates: true,
+			browsers: true,
+			noNativeIDE: true,
+		} );
+
+		console.log(
+			'\n✅  ' +
+				chalk.black.bgGreen( ' Done ' ) +
+				chalk.dim( ' You can copy paste this info to share it...\n' )
+		);
+		// Let's end the process so the app doesn't continue.
+		process.exit( 0 );
+	} // End Envinfo.
+};

packages/create-guten-block/app/getBlockDir.js

@@ -7,6 +7,8 @@
 
 'use strict';
 
+const path = require( 'path' );
+
 module.exports = blockName => {
-	return `${ process.cwd() }/${ blockName }`;
+	return path.join( process.cwd(), blockName );
 };

packages/create-guten-block/app/getBlockName.js

@@ -0,0 +1,23 @@
+/**
+ * Handle if there's no block name.
+ */
+
+'use strict';
+
+const chalk = require( 'chalk' );
+
+module.exports = () => {
+	// Stop if there's no block name to create the plugin dir.
+	console.log(
+		'\n❌ ',
+		chalk.black.bgRed( ' You forgot to specify a block name: \n' )
+	);
+	console.log(
+		`  ${ chalk.dim( 'create-guten-block' ) } ${ chalk.green( '<block-name>' ) }`
+	);
+	console.log( chalk.dim( '\nFor example: \n' ) );
+	console.log(
+		`  ${ chalk.dim( 'create-guten-block' ) } ${ chalk.green( 'my-block' ) }\n`
+	);
+	process.exit( 1 );
+};

packages/create-guten-block/app/noBlockName.js

@@ -13,23 +13,20 @@ const prePrint = require( './prePrint' );
 const initBlock = require( './initBlock' );
 const getBlockDir = require( './getBlockDir' );
 const clearConsole = require( './consoleClear' );
-const getBlockName = require( './getBlockName' );
 const updateNotifier = require( './updateNotifier' );
 const createPluginDir = require( './createPluginDir' );
 const npmInstallScripts = require( './npmInstallScripts' );
 
 module.exports = async() => {
-	// 0. Set the CLI.
-	cli();
-
-	// 0. Clear the console.
 	clearConsole();
 
 	// 0. Update notifier.
 	updateNotifier();
 
-	// 1. Get the block name and direcotry by sending in the third argument.
-	const blockName = await getBlockName( process.argv[ 2 ] );
+	// 1. Set the CLI and get the blockName.
+	const blockName = cli();
+
+	// 2. Build the block direcotry path.
 	const blockDir = await getBlockDir( blockName );
 
 	// 2. Pre print.

packages/create-guten-block/app/run.js

@@ -0,0 +1,9 @@
+const clearConsole = require( './consoleClear' );
+const path = require( 'path' );
+
+clearConsole();
+
+const blockName = 'my-block';
+console.log( `${ process.cwd() }/${ blockName }` );
+
+console.log( path.join( process.cwd(), blockName ) );