Merge pull request #432 from N1ebieski/Add-a-command-to-refactor-a-class-attribute-in-blade-files-#52

Add commands that refactor class attributes in blade files

Author: joetannenbaum

package.json

@@ -42,6 +42,32 @@
         }
     ],
     "contributes": {
+        "menus": {
+            "commandPalette": [
+                {
+                    "command": "laravel.refactorSelectedHtmlClassToBladeDirective",
+                    "when": "editorHasSelection && resourceLangId == blade",
+                    "group": "laravel"
+                },
+                {
+                    "command": "laravel.refactorAllHtmlClassesToBladeDirectives",
+                    "when": "resourceLangId == blade",
+                    "group": "laravel"
+                }
+            ],
+            "editor/context": [
+                {
+                    "command": "laravel.refactorSelectedHtmlClassToBladeDirective",
+                    "when": "editorHasSelection && resourceLangId == blade",
+                    "group": "laravel"
+                },
+                {
+                    "command": "laravel.refactorAllHtmlClassesToBladeDirectives",
+                    "when": "resourceLangId == blade",
+                    "group": "laravel"
+                }
+            ]
+        },
         "languages": [
             {
                 "id": "blade",
@@ -82,6 +108,16 @@
                 "command": "laravel.runPintOnCurrentFile",
                 "title": "Run Pint on Current File",
                 "category": "Laravel"
+            },
+            {
+                "command": "laravel.refactorSelectedHtmlClassToBladeDirective",
+                "title": "Refactor selected HTML class attribute to Blade directive",
+                "category": "Laravel"
+            },
+            {
+                "command": "laravel.refactorAllHtmlClassesToBladeDirectives",
+                "title": "Refactor all HTML class attributes to Blade directives",
+                "category": "Laravel"
             }
         ],
         "configuration": {

src/commands/refactorClass.ts

@@ -0,0 +1,64 @@
+import * as vscode from "vscode";
+
+const transformClass = (classList: string) => {
+    const classes = classList
+        .trim()
+        .split(/\s+/)
+        .map((cls) => `'${cls}'`)
+        .join(", ");
+
+    return `@class([${classes}])`;
+};
+
+export const refactorAllHtmlClassesToBladeDirectives = () => {
+    const editor = vscode.window.activeTextEditor;
+
+    if (!editor) {
+        return;
+    }
+
+    const document = editor.document;
+    const fullText = document.getText();
+
+    const transformed = fullText.replace(
+        /(?<!:)class="(.+?)"/g,
+        (_, classList) => {
+            return transformClass(classList);
+        },
+    );
+
+    const entireRange = new vscode.Range(
+        document.positionAt(0),
+        document.positionAt(fullText.length),
+    );
+
+    editor.edit((editBuilder) => {
+        editBuilder.replace(entireRange, transformed);
+    });
+};
+
+export const refactorSelectedHtmlClassToBladeDirective = () => {
+    const editor = vscode.window.activeTextEditor;
+
+    if (!editor) {
+        return;
+    }
+
+    const selection = editor.selection;
+    const selectedText = editor.document.getText(selection);
+
+    const match = selectedText.match(/(?<!:)class="(.+?)"/);
+
+    if (!match) {
+        return;
+    }
+
+    const transformed = selectedText.replace(
+        /(?<!:)class="(.+?)"/,
+        transformClass(match[1]),
+    );
+
+    editor.edit((editBuilder) => {
+        editBuilder.replace(selection, transformed);
+    });
+};

src/extension.ts

@@ -14,6 +14,10 @@ import {
     runPintOnDirtyFiles,
     runPintOnSave,
 } from "./commands";
+import {
+    refactorAllHtmlClassesToBladeDirectives,
+    refactorSelectedHtmlClassToBladeDirective,
+} from "./commands/refactorClass";
 import { configAffected } from "./support/config";
 import { collectDebugInfo } from "./support/debug";
 import {
@@ -213,6 +217,14 @@ export async function activate(context: vscode.ExtensionContext) {
                 providedCodeActionKinds: [vscode.CodeActionKind.QuickFix],
             },
         ),
+        vscode.commands.registerCommand(
+            "laravel.refactorSelectedHtmlClassToBladeDirective",
+            refactorSelectedHtmlClassToBladeDirective,
+        ),
+        vscode.commands.registerCommand(
+            "laravel.refactorAllHtmlClassesToBladeDirectives",
+            refactorAllHtmlClassesToBladeDirectives,
+        ),
     );
 
     collectDebugInfo();