Refactor: Convert command addition to factory pattern

Author: univdev

eslint.config.mjs

@@ -15,12 +15,11 @@ export default [{
     },
 
     rules: {
+        'curly': ['error', 'multi-line'],
         "@typescript-eslint/naming-convention": ["warn", {
             selector: "import",
             format: ["camelCase", "PascalCase"],
         }],
-
-        curly: "warn",
         eqeqeq: "warn",
         "no-throw-literal": "warn",
         semi: "warn",

src/commands/CreateReactComponent.command.ts

@@ -4,15 +4,26 @@ import * as fs from 'fs';
 import { reactComponentFactory } from '../factory/ReactComponent.factory';
 import { barrelFileFactory } from '../factory/BarrelFile.factory';
 
-export const createReactComponent = (dirPath: string, componentName: string) => {
-  vscode.window.showInformationMessage(dirPath, componentName);
+export const createReactComponentCommand = (uri: vscode.Uri) => {
+  if (uri && uri.fsPath) {
+    const dirPath = uri.fsPath;
 
-  const componentDir = path.join(dirPath, componentName);
-  fs.mkdirSync(componentDir);
+    vscode.window.showInputBox({ 
+      prompt: 'Enter React component name',
+      placeHolder: 'MyComponent'
+    }).then(componentName => {
+      if (componentName) {
+        vscode.window.showInformationMessage(dirPath, componentName);
 
-  const componentContent = reactComponentFactory(componentName);
-  const barrelFileContent = barrelFileFactory(componentName);
-
-  fs.writeFileSync(path.join(componentDir, `${componentName}.tsx`), componentContent);
-  fs.writeFileSync(path.join(componentDir, `index.ts`), barrelFileContent);
+        const componentDir = path.join(dirPath, componentName);
+        fs.mkdirSync(componentDir);
+      
+        const componentContent = reactComponentFactory(componentName);
+        const barrelFileContent = barrelFileFactory(componentName);
+      
+        fs.writeFileSync(path.join(componentDir, `${componentName}.tsx`), componentContent);
+        fs.writeFileSync(path.join(componentDir, `index.ts`), barrelFileContent);
+      }
+    });
+  }
 };

src/factory/Commands.factory.ts

@@ -0,0 +1,17 @@
+import * as vscode from 'vscode';
+import { createReactComponentCommand } from "../commands/CreateReactComponent.command";
+
+export const commandsFactory = (context: vscode.ExtensionContext) => {
+  commands.forEach((command) => {
+    context.subscriptions.push(command);
+  });
+};
+
+const commands = [
+  vscode.commands.registerCommand(
+    'vscode-react-developer-toolkit.createReactComponent',
+    createReactComponentCommand,
+  ),
+];
+
+export default commandsFactory;

src/factory/index.ts

@@ -0,0 +1 @@
+export * from './Commands.factory';