Eslint Plugin: Lint code formatting. (#19963)

* Eslint Plugin: Lint code formatting.

* Gutenberg: Add code formatting pre-commit hook.

* Eslint Plugin: Update docs.

* Gutenberg: Format code.

* Storybook: Update snapshots.

.eslintrc.js

@@ -29,13 +29,8 @@ const developmentFiles = [
 
 module.exports = {
 	root: true,
-	extends: [
-		'plugin:@wordpress/eslint-plugin/recommended',
-		'plugin:eslint-comments/recommended',
-	],
-	plugins: [
-		'import',
-	],
+	extends: [ 'plugin:@wordpress/eslint-plugin/recommended', 'plugin:eslint-comments/recommended' ],
+	plugins: [ 'import' ],
 	globals: {
 		wp: 'off',
 	},
@@ -53,31 +48,38 @@ module.exports = {
 				message: 'Path access on WordPress dependencies is not allowed.',
 			},
 			{
-				selector: 'ImportDeclaration[source.value=/^react-spring(?!\\u002Fweb\.cjs)/]',
+				selector: 'ImportDeclaration[source.value=/^react-spring(?!\\u002Fweb.cjs)/]',
 				message: 'The react-spring dependency must specify CommonJS bundle: react-spring/web.cjs',
 			},
 			{
-				selector: 'CallExpression[callee.name="deprecated"] Property[key.name="version"][value.value=/' + majorMinorRegExp + '/]',
+				selector:
+					'CallExpression[callee.name="deprecated"] Property[key.name="version"][value.value=/' +
+					majorMinorRegExp +
+					'/]',
 				message: 'Deprecated functions must be removed before releasing this version.',
 			},
 			{
-				selector: 'CallExpression[callee.name=/^(__|_n|_nx|_x)$/]:not([arguments.0.type=/^Literal|BinaryExpression$/])',
+				selector:
+					'CallExpression[callee.name=/^(__|_n|_nx|_x)$/]:not([arguments.0.type=/^Literal|BinaryExpression$/])',
 				message: 'Translate function arguments must be string literals.',
 			},
 			{
-				selector: 'CallExpression[callee.name=/^(_n|_nx|_x)$/]:not([arguments.1.type=/^Literal|BinaryExpression$/])',
+				selector:
+					'CallExpression[callee.name=/^(_n|_nx|_x)$/]:not([arguments.1.type=/^Literal|BinaryExpression$/])',
 				message: 'Translate function arguments must be string literals.',
 			},
 			{
-				selector: 'CallExpression[callee.name=_nx]:not([arguments.3.type=/^Literal|BinaryExpression$/])',
+				selector:
+					'CallExpression[callee.name=_nx]:not([arguments.3.type=/^Literal|BinaryExpression$/])',
 				message: 'Translate function arguments must be string literals.',
 			},
 			{
 				selector: 'CallExpression[callee.name=/^(__|_x|_n|_nx)$/] Literal[value=/\\.{3}/]',
 				message: 'Use ellipsis character (…) in place of three dots',
 			},
 			{
-				selector: 'ImportDeclaration[source.value="redux"] Identifier.imported[name="combineReducers"]',
+				selector:
+					'ImportDeclaration[source.value="redux"] Identifier.imported[name="combineReducers"]',
 				message: 'Use `combineReducers` from `@wordpress/data`',
 			},
 			{
@@ -97,67 +99,63 @@ module.exports = {
 				// for UUID generation, for which we already have a higher-order
 				// component: `withInstanceId`.
 				selector: 'CallExpression[callee.object.name="Math"][callee.property.name="random"]',
-				message: 'Do not use Math.random() to generate unique IDs; use withInstanceId instead. (If you’re not generating unique IDs: ignore this message.)',
+				message:
+					'Do not use Math.random() to generate unique IDs; use withInstanceId instead. (If you’re not generating unique IDs: ignore this message.)',
 			},
 			{
-				selector: 'CallExpression[callee.name="withDispatch"] > :function > BlockStatement > :not(VariableDeclaration,ReturnStatement)',
-				message: 'withDispatch must return an object with consistent keys. Avoid performing logic in `mapDispatchToProps`.',
+				selector:
+					'CallExpression[callee.name="withDispatch"] > :function > BlockStatement > :not(VariableDeclaration,ReturnStatement)',
+				message:
+					'withDispatch must return an object with consistent keys. Avoid performing logic in `mapDispatchToProps`.',
 			},
 			{
-				selector: 'LogicalExpression[operator="&&"][left.property.name="length"][right.type="JSXElement"]',
-				message: 'Avoid truthy checks on length property rendering, as zero length is rendered verbatim.',
+				selector:
+					'LogicalExpression[operator="&&"][left.property.name="length"][right.type="JSXElement"]',
+				message:
+					'Avoid truthy checks on length property rendering, as zero length is rendered verbatim.',
 			},
 		],
 	},
 	overrides: [
 		{
 			files: [ 'packages/**/*.js' ],
-			excludedFiles: [
-				'**/*.@(android|ios|native).js',
-				...developmentFiles,
-			],
+			excludedFiles: [ '**/*.@(android|ios|native).js', ...developmentFiles ],
 			rules: {
 				'import/no-extraneous-dependencies': 'error',
 			},
 		},
 		{
 			files: [ 'packages/**/*.js' ],
-			excludedFiles: [
-				'packages/block-library/src/*/save.js',
-				...developmentFiles,
-			],
+			excludedFiles: [ 'packages/block-library/src/*/save.js', ...developmentFiles ],
 			rules: {
-				'react/forbid-elements': [ 'error', {
-					forbid: [
-						[ 'button', 'Button' ],
-						[ 'circle', 'Circle' ],
-						[ 'g', 'G' ],
-						[ 'path', 'Path' ],
-						[ 'polygon', 'Polygon' ],
-						[ 'rect', 'Rect' ],
-						[ 'svg', 'SVG' ],
-					].map( ( [ element, componentName ] ) => {
-						return {
-							element,
-							message: `use cross-platform <${ componentName } /> component instead.`,
-						};
-					} ),
-				} ],
+				'react/forbid-elements': [
+					'error',
+					{
+						forbid: [
+							[ 'button', 'Button' ],
+							[ 'circle', 'Circle' ],
+							[ 'g', 'G' ],
+							[ 'path', 'Path' ],
+							[ 'polygon', 'Polygon' ],
+							[ 'rect', 'Rect' ],
+							[ 'svg', 'SVG' ],
+						].map( ( [ element, componentName ] ) => {
+							return {
+								element,
+								message: `use cross-platform <${ componentName } /> component instead.`,
+							};
+						} ),
+					},
+				],
 			},
 		},
 		{
-			files: [
-				'packages/jest*/**/*.js',
-			],
-			extends: [
-				'plugin:@wordpress/eslint-plugin/test-unit',
-			],
+			files: [ 'packages/jest*/**/*.js' ],
+			extends: [ 'plugin:@wordpress/eslint-plugin/test-unit' ],
 		},
 		{
 			files: [ 'packages/e2e-test*/**/*.js' ],
-			extends: [
-				'plugin:@wordpress/eslint-plugin/test-e2e',
-			],
+			extends: [ 'plugin:@wordpress/eslint-plugin/test-e2e' ],
 		},
 	],
 };

babel.config.js

@@ -3,9 +3,6 @@ module.exports = function( api ) {
 
 	return {
 		presets: [ '@wordpress/babel-preset-default' ],
-		plugins: [
-			'babel-plugin-emotion',
-			'babel-plugin-inline-json-import',
-		],
+		plugins: [ 'babel-plugin-emotion', 'babel-plugin-inline-json-import' ],
 	};
 };

bin/api-docs/are-readmes-unstaged.js

@@ -12,17 +12,24 @@ const execSync = require( 'child_process' ).execSync;
  */
 const getPackages = require( './packages' );
 
-const getUnstagedFiles = () => execSync( 'git diff --name-only', { encoding: 'utf8' } ).split( '\n' ).filter( ( element ) => '' !== element );
-const readmeFiles = getPackages().map( ( [ packageName ] ) => join( 'packages', packageName, 'README.md' ) );
+const getUnstagedFiles = () =>
+	execSync( 'git diff --name-only', { encoding: 'utf8' } )
+		.split( '\n' )
+		.filter( ( element ) => '' !== element );
+const readmeFiles = getPackages().map( ( [ packageName ] ) =>
+	join( 'packages', packageName, 'README.md' )
+);
 const unstagedReadmes = getUnstagedFiles().filter( ( element ) => readmeFiles.includes( element ) );
 
 if ( unstagedReadmes.length > 0 ) {
 	process.exitCode = 1;
-	process.stdout.write( chalk.red(
-		'\n',
-		'Some API docs may be out of date:',
-		unstagedReadmes.toString(),
-		'Either stage them or continue with --no-verify.',
-		'\n'
-	) );
+	process.stdout.write(
+		chalk.red(
+			'\n',
+			'Some API docs may be out of date:',
+			unstagedReadmes.toString(),
+			'Either stage them or continue with --no-verify.',
+			'\n'
+		)
+	);
 }

bin/api-docs/packages.js

@@ -7,10 +7,13 @@ const packages = [
 	'block-serialization-default-parser',
 	'blocks',
 	'compose',
-	[ 'core-data', {
-		'Autogenerated actions': 'src/actions.js',
-		'Autogenerated selectors': 'src/selectors.js',
-	} ],
+	[
+		'core-data',
+		{
+			'Autogenerated actions': 'src/actions.js',
+			'Autogenerated selectors': 'src/selectors.js',
+		},
+	],
 	'data',
 	'data-controls',
 	'date',

bin/api-docs/update-readmes.js

@@ -24,7 +24,7 @@ getPackages().forEach( ( entry ) => {
 				`--use-token "${ token }"`,
 				'--ignore "/unstable|experimental/i"',
 			],
-			{ shell: true },
+			{ shell: true }
 		);
 
 		if ( status !== 0 ) {