@40q/40q-cli 1.0.0 → 1.0.2

package/Readme.md

@@ -19,4 +19,18 @@ Setup is intended to scaffold tools configurations.
 ```
 
 Supported Tools:
-* eslint
+* eslint
+
+### Codegen
+Codegen generates code for you.
+
+```
+40q codegen [type] [template]
+```
+
+Supported Types:
+* block: generates code for Gutenberg blocks
+
+Templates are optional, if empty, it creates an example boilerplate for a Gutenberg block.
+
+For supported templates, run: `40q codegen block --help`

package/dist/index.js

@@ -0,0 +1,5 @@
+#!/usr/bin/env node
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const _40qCli_1 = require("./src/40qCli");
+_40qCli_1.q40Cli.init();

package/dist/resources/scripts/editor/blocks/section-header.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.styles = exports.save = exports.edit = exports.attributes = exports.category = exports.title = exports.name = void 0;
+const i18n_1 = require("@wordpress/i18n");
+const components_1 = require("@wordpress/components");
+const block_editor_1 = require("@wordpress/block-editor");
+/* Block name */
+exports.name = "by40q/section-header";
+/* Block title */
+exports.title = (0, i18n_1.__)("Section Header", "40q");
+/* Block category */
+exports.category = "text";
+/* Block attributes */
+exports.attributes = {
+    title: {
+        type: "string",
+        default: "40Q",
+    },
+};
+/* Block edit */
+const edit = ({ attributes, setAttributes }) => {
+    const { title } = attributes;
+    const blockProps = (0, block_editor_1.useBlockProps)();
+    return (<>
+      <block_editor_1.InspectorControls>
+        <components_1.PanelBody title={(0, i18n_1.__)("Section Header Settings")} initialOpen></components_1.PanelBody>
+      </block_editor_1.InspectorControls>
+
+      <div {...blockProps}>
+        <block_editor_1.RichText tagName="h2" placeholder={(0, i18n_1.__)("40Q")} value={title} onChange={(title) => setAttributes({ title })}/>
+      </div>
+    </>);
+};
+exports.edit = edit;
+/* Block save */
+const save = ({ attributes }) => <></>;
+exports.save = save;
+/* Block styles */
+exports.styles = [];

package/dist/src/40qCli.js

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.q40Cli = void 0;
+const yargs_1 = __importDefault(require("yargs"));
+const helpers_1 = require("yargs/helpers");
+const Setup_command_1 = require("./commands/Setup/Setup.command");
+const Codegen_command_1 = require("./commands/Codegen/Codegen.command");
+class q40Cli {
+    static init() {
+        (0, yargs_1.default)((0, helpers_1.hideBin)(process.argv))
+            .command('setup [tool]', 'Setup a tool', Setup_command_1.SetupCommand.builder, Setup_command_1.SetupCommand.handler)
+            .command('codegen [type] [template]', 'Generate code from a template', Codegen_command_1.CodegenCommand.builder, Codegen_command_1.CodegenCommand.handler)
+            .help().argv;
+    }
+}
+exports.q40Cli = q40Cli;

package/dist/src/commands/Codegen/Codegen.command.js

@@ -0,0 +1,61 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CodegenCommand = void 0;
+const inquirer_1 = __importDefault(require("inquirer"));
+const GenerateBlock_1 = require("./Generators/GenerateBlock");
+const Codegen_types_1 = require("./Codegen.types");
+class CodegenCommand {
+    static builder(yargs) {
+        yargs.positional('type', {
+            describe: 'Type of code piece to generate',
+            choices: Codegen_types_1.typeChoices,
+            demandOption: true,
+            type: 'string',
+        });
+        yargs.positional('template', {
+            describe: 'Template to use for code generation',
+            choices: Codegen_types_1.templateChoices,
+            demandOption: false,
+            type: 'string',
+        });
+    }
+    static handler(argv) {
+        var _a;
+        return __awaiter(this, void 0, void 0, function* () {
+            const type = argv.type;
+            const template = ((_a = argv.template) !== null && _a !== void 0 ? _a : 'default');
+            if (type === 'block') {
+                const answers = yield CodegenCommand.prompt([
+                    {
+                        type: 'input',
+                        name: 'name',
+                        message: 'Please enter a name for the block:',
+                        default: 'section-header',
+                    },
+                ], template === 'default');
+                const name = (answers === null || answers === void 0 ? void 0 : answers.name) || null;
+                return GenerateBlock_1.GenerateBlock.run(template, name);
+            }
+        });
+    }
+    static prompt(prompts, condition) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (!condition)
+                return null;
+            return yield inquirer_1.default.prompt(prompts);
+        });
+    }
+}
+exports.CodegenCommand = CodegenCommand;

package/dist/src/commands/Codegen/Codegen.types.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.templateChoices = exports.typeChoices = void 0;
+exports.typeChoices = ['block'];
+exports.templateChoices = ['section-header'];

package/dist/src/commands/Codegen/Generators/GenerateBlock.js

@@ -0,0 +1,49 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.GenerateBlock = void 0;
+const child_process_1 = require("child_process");
+const fs = __importStar(require("fs"));
+const path_1 = __importDefault(require("path"));
+const cliRoot_1 = require("../../../lib/cliRoot");
+class GenerateBlock {
+    static run(template, name) {
+        var _a;
+        const title = (_a = name === null || name === void 0 ? void 0 : name.split('-').map((word) => {
+            return word.charAt(0).toUpperCase() + word.slice(1);
+        }).join(' ')) !== null && _a !== void 0 ? _a : '';
+        const dirAndFileName = name || template;
+        (0, child_process_1.execSync)(`mkdir -p resources/scripts/editor/blocks/${dirAndFileName}`);
+        const cliRoot = (0, cliRoot_1.findCliRoot)(__dirname);
+        const templateContent = fs.readFileSync(path_1.default.join(cliRoot, 'templates/blocks/', `${template}.txt`), 'utf8');
+        fs.writeFileSync(path_1.default.join(process.cwd(), `resources/scripts/editor/blocks/${dirAndFileName}/${dirAndFileName}.tsx`), templateContent
+            .replace(/{{name}}/g, name !== null && name !== void 0 ? name : '')
+            .replace(/{{title}}/g, title));
+    }
+}
+exports.GenerateBlock = GenerateBlock;

package/dist/src/commands/Command.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Command = void 0;
+class Command {
+    static builder(yargs) { }
+    static handler(argv) { }
+}
+exports.Command = Command;

package/dist/src/commands/Setup/Setup.command.js

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SetupCommand = void 0;
+const child_process_1 = require("child_process");
+const eslintrc = `
+{
+    "extends": ["@40q/eslint-config"]
+}
+`;
+const huskyrc = `
+{
+    "hooks": {
+        "pre-commit": "lint-staged"
+    }
+} 
+`;
+const lintstagedrc = `
+{
+    "*.{js,jsx,ts,tsx}": ["eslint --fix"] 
+}
+`;
+class SetupCommand {
+    static builder(yargs) {
+        yargs.positional('tool', {
+            describe: 'Name of the tool to setup',
+            type: 'string',
+        });
+    }
+    static handler(argv) {
+        SetupCommand.setupTool(argv.tool);
+    }
+    static setupTool(tool) {
+        switch (tool) {
+            case 'eslint':
+                this.setupEslint();
+                break;
+            default:
+                console.error(`Unknown tool: ${tool}. Please specify a supported tool.`);
+        }
+    }
+    static setupEslint() {
+        console.log('Installing dependencies...');
+        (0, child_process_1.execSync)('yarn add --dev eslint @40q/eslint-config husky lint-staged');
+        console.log('Creating .eslintrc.json...');
+        (0, child_process_1.execSync)(`echo '${eslintrc}' > .eslintrc.json`);
+        console.log('Creating .huskyrc.json...');
+        (0, child_process_1.execSync)(`echo '${huskyrc}' > .huskyrc.json`);
+        console.log('Creating .lintstagedrc.json...');
+        (0, child_process_1.execSync)(`echo '${lintstagedrc}' > .lintstagedrc.json`);
+        console.log('Done!');
+    }
+}
+exports.SetupCommand = SetupCommand;

package/dist/src/commands/Setup.command.js

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SetupCommand = void 0;
+const child_process_1 = require("child_process");
+const eslintrc = `
+{
+    "extends": ["@40q/eslint-config"]
+}
+`;
+const huskyrc = `
+{
+    "hooks": {
+        "pre-commit": "lint-staged"
+    }
+} 
+`;
+const lintstagedrc = `
+{
+    "*.{js,jsx,ts,tsx}": ["eslint --fix"] 
+}
+`;
+class SetupCommand {
+    static builder(yargs) {
+        yargs.positional('tool', {
+            describe: 'Name of the tool to setup',
+            type: 'string',
+        });
+    }
+    static handler(argv) {
+        SetupCommand.setupTool(argv.tool);
+    }
+    static setupTool(tool) {
+        switch (tool) {
+            case 'eslint':
+                this.setupEslint();
+                break;
+            default:
+                console.error(`Unknown tool: ${tool}. Please specify a supported tool.`);
+        }
+    }
+    static setupEslint() {
+        console.log('Installing dependencies...');
+        (0, child_process_1.execSync)('yarn add --dev eslint @40q/eslint-config husky lint-staged');
+        console.log('Creating .eslintrc.json...');
+        (0, child_process_1.execSync)(`echo '${eslintrc}' > .eslintrc.json`);
+        console.log('Creating .huskyrc.json...');
+        (0, child_process_1.execSync)(`echo '${huskyrc}' > .huskyrc.json`);
+        console.log('Creating .lintstagedrc.json...');
+        (0, child_process_1.execSync)(`echo '${lintstagedrc}' > .lintstagedrc.json`);
+        console.log('Done!');
+    }
+}
+exports.SetupCommand = SetupCommand;

package/dist/src/lib/cliRoot.js

@@ -0,0 +1,39 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.findCliRoot = void 0;
+const fs = __importStar(require("fs"));
+const path = __importStar(require("path"));
+function findCliRoot(startDir) {
+    let currentDir = startDir;
+    while (currentDir !== path.parse(currentDir).root) {
+        if (fs.existsSync(path.join(currentDir, '.cliroot'))) {
+            return currentDir;
+        }
+        currentDir = path.dirname(currentDir);
+    }
+    throw new Error('CLI root directory with .cliroot marker not found.');
+}
+exports.findCliRoot = findCliRoot;

package/package.json

@@ -1,12 +1,13 @@
 {
     "name": "@40q/40q-cli",
-    "version": "1.0.0",
+    "version": "1.0.2",
     "description": "40q CLI tool",
     "main": "index.js",
     "bin": {
         "40q": "./dist/index.js"
     },
     "dependencies": {
+        "inquirer": "^8.0.0",
         "yargs": "^17.7.2"
     },
     "peerDependencies": {
@@ -14,7 +15,7 @@
     },
     "scripts": {
         "build": "tsc",
-        "build-publish": "yarn build && yarn publish --access public"
+        "deploy": "yarn build && yarn publish --access public"
     },
     "author": "40q <info@40q.agency> (https://40q.agency/)",
     "license": "ISC",
@@ -23,6 +24,7 @@
         "url": "https://github.com/40Q/40q-cli.git"
     },
     "devDependencies": {
+        "@types/inquirer": "^8.0.0",
         "@types/node": "^20.8.7",
         "@types/yargs": "^17.0.29",
         "ts-node": "^10.9.1",

package/src/40qCli.ts

@@ -1,6 +1,7 @@
 import yargs from 'yargs';
 import { hideBin } from 'yargs/helpers';
-import { SetupCommand } from './commands/Setup.command';
+import { SetupCommand } from './commands/Setup/Setup.command';
+import { CodegenCommand } from './commands/Codegen/Codegen.command';
 
 export class q40Cli {
     static init() {
@@ -11,6 +12,12 @@ export class q40Cli {
                 SetupCommand.builder,
                 SetupCommand.handler
             )
+            .command(
+                'codegen [type] [template]',
+                'Generate code from a template',
+                CodegenCommand.builder,
+                CodegenCommand.handler
+            )
             .help().argv;
     }
 }

package/src/commands/Codegen/Codegen.command.ts

@@ -0,0 +1,52 @@
+import { ArgumentsCamelCase, Argv } from 'yargs';
+import { Command } from '../Command';
+import inquirer, { QuestionCollection } from 'inquirer';
+import { GenerateBlock } from './Generators/GenerateBlock';
+import { Templates, Types, templateChoices, typeChoices } from './Codegen.types';
+
+export class CodegenCommand implements Command {
+    static builder(yargs: Argv<{}>) {
+        yargs.positional('type', {
+            describe: 'Type of code piece to generate',
+            choices: typeChoices,
+            demandOption: true,
+            type: 'string',
+        });
+
+        yargs.positional('template', {
+            describe: 'Template to use for code generation',
+            choices: templateChoices,
+            demandOption: false,
+            type: 'string',
+        });
+    }
+
+    static async handler(argv: ArgumentsCamelCase<{}>) {
+        const type = argv.type as Types;
+        const template = (argv.template ?? 'default') as Templates;
+
+        if (type === 'block') {
+            const answers = await CodegenCommand.prompt(
+                [
+                    {
+                        type: 'input',
+                        name: 'name',
+                        message: 'Please enter a name for the block:',
+                        default: 'section-header',
+                    },
+                ],
+                template === 'default'
+            );
+
+            const name = (answers?.name as string) || null;
+
+            return GenerateBlock.run(template, name);
+        }
+    }
+
+    static async prompt(prompts: QuestionCollection, condition: boolean) {
+        if (!condition) return null;
+
+        return await inquirer.prompt(prompts);
+    }
+}

package/src/commands/Codegen/Codegen.types.ts

@@ -0,0 +1,5 @@
+export const typeChoices = ['block'] as const;
+export type Types = (typeof typeChoices)[number];
+
+export const templateChoices = ['section-header'] as const;
+export type Templates = (typeof templateChoices)[number] | 'default';

package/src/commands/Codegen/Generators/GenerateBlock.ts

@@ -0,0 +1,36 @@
+import { execSync } from 'child_process';
+import * as fs from 'fs';
+import path from 'path';
+import { Templates } from '../Codegen.types';
+import { findCliRoot } from '../../../lib/cliRoot';
+
+export class GenerateBlock {
+    static run(template: Templates, name: string | null) {
+        const title =
+            name
+                ?.split('-')
+                .map((word) => {
+                    return word.charAt(0).toUpperCase() + word.slice(1);
+                })
+                .join(' ') ?? '';
+        const dirAndFileName = name || template;
+
+        execSync(`mkdir -p resources/scripts/editor/blocks/${dirAndFileName}`);
+
+        const cliRoot = findCliRoot(__dirname);
+        const templateContent = fs.readFileSync(
+            path.join(cliRoot, 'templates/blocks/', `${template}.txt`),
+            'utf8'
+        );
+
+        fs.writeFileSync(
+            path.join(
+                process.cwd(),
+                `resources/scripts/editor/blocks/${dirAndFileName}/${dirAndFileName}.tsx`
+            ),
+            templateContent
+                .replace(/{{name}}/g, name ?? '')
+                .replace(/{{title}}/g, title)
+        );
+    }
+}

package/src/commands/{Setup.command.ts → Setup/Setup.command.ts}

@@ -1,6 +1,6 @@
 import { ArgumentsCamelCase, Argv } from 'yargs';
 import { execSync } from 'child_process';
-import { Command } from './Command';
+import { Command } from '../Command';
 
 const eslintrc = `
 {

package/src/lib/cliRoot.ts

@@ -0,0 +1,16 @@
+import * as fs from 'fs';
+import * as path from 'path';
+
+export function findCliRoot(startDir: string): string {
+    let currentDir = startDir;
+
+    while (currentDir !== path.parse(currentDir).root) {
+        if (fs.existsSync(path.join(currentDir, '.cliroot'))) {
+            return currentDir;
+        }
+
+        currentDir = path.dirname(currentDir);
+    }
+
+    throw new Error('CLI root directory with .cliroot marker not found.');
+}

package/templates/blocks/default.txt

@@ -0,0 +1,54 @@
+import { __ } from "@wordpress/i18n";
+import { PanelBody } from "@wordpress/components";
+import {
+  InspectorControls,
+  RichText,
+  useBlockProps,
+} from "@wordpress/block-editor";
+
+/* Block name */
+export const name = "by40q/{{name}}";
+
+/* Block title */
+export const title = __("{{title}}", "40q");
+
+/* Block category */
+export const category = "text";
+
+/* Block attributes */
+export const attributes = {
+  title: {
+    type: "string",
+    default: "40Q",
+  },
+};
+
+/* Block edit */
+export const edit = ({ attributes, setAttributes }) => {
+  const { title } = attributes;
+
+  const blockProps = useBlockProps();
+
+  return (
+    <>
+      <InspectorControls>
+        <PanelBody title={__("{{title}} Settings")} initialOpen></PanelBody>
+      </InspectorControls>
+
+      <div {...blockProps}>
+        <RichText
+          tagName="h2"
+          placeholder={__("40Q")}
+          value={title}
+          onChange={(title) => setAttributes({ title })}
+        />
+      </div>
+    </>
+  );
+};
+
+/* Block save */
+export const save = () => <></>;
+
+/* Block styles */
+export const styles = [];

package/tsconfig.json

@@ -1,7 +1,8 @@
 {
     "compilerOptions": {
         "target": "es2016",
-        "module": "commonjs",
+        "module": "CommonJS",
+        "moduleResolution": "node",
         "esModuleInterop": true,
         "forceConsistentCasingInFileNames": true,
         "strict": true,