feat: hiding Nuxt Devtools for Nuxt 2

Author: adhamfarrag

package.json

@@ -297,7 +297,7 @@
         },
         {
           "command": "nuxtr.directToggleDevTools",
-          "when": "nuxtr.isNuxtProject"
+          "when": "nuxtr.isNuxtProject && !nuxtr.isNuxtTwo"
         },
         {
           "command": "nuxtr.errorLayout",
@@ -937,7 +937,7 @@
         "command": "nuxtr.directToggleDevTools",
         "title": "Toggle DevTools",
         "category": "Nuxtr",
-        "when": "nuxtr.isNuxtProject"
+        "when": "nuxtr.isNuxtProject && !nuxtr.isNuxtTwo"
       },
       {
         "command": "nuxtr.directUpgradeNuxt",

src/commands/Devtools.ts

@@ -10,8 +10,9 @@ import {
     getInstallationCommand,
     runCommand,
     getNuxtVersion,
+    isNuxtTwo,
 } from "../utils";
-import { updateDevtoolsStatusBar } from "../statusBar";
+import { updateDevtoolsStatusBar, hideDevtoolsStatusBar } from "../statusBar";
 
 let mod: any;
 let nuxtConfigFile: string;
@@ -146,14 +147,23 @@ async function nuxtConfigWatcher() {
 
 async function nuxtDevToolsHandler() {
     const isInstalled = await isDevtoolsInstalled();
+    const nuxtTwo = isNuxtTwo();
     let isDevtoolsNative = false;
 
     let nuxtVersion = getNuxtVersion();
     if (typeof nuxtVersion === 'string') {
         isDevtoolsNative = semver.gte(nuxtVersion, '3.8.0') ? true : false;
     }
 
-    if (!isInstalled && !isDevtoolsNative) {
+    if (nuxtTwo) {
+        updateDevtoolsStatusBar({
+            command: '',
+            tooltip: "Nuxt Devtools: Not supported for Nuxt 2",
+            text: "$(nuxt-disabled)",
+            color: new ThemeColor("activityBar.inactiveForeground"),
+        });
+        hideDevtoolsStatusBar()
+    } else if (!isInstalled && !isDevtoolsNative) {
         await installDevtools();
         updateDevtoolsStatusBar({
             command: "nuxtr.directUpgradeNuxt",

src/index.ts

@@ -1,13 +1,18 @@
 import { ExtensionContext, commands } from 'vscode';
 import { activateExtension, publicCommands } from './extension'
-import { isNuxtProject } from './utils';
+import { isNuxtProject , isNuxtTwo }  from './utils';
 
 export async function activate(context: ExtensionContext) {
     const isNuxt = await isNuxtProject();
 
+
     commands.executeCommand('setContext', 'nuxtr.isNuxtProject', isNuxt);
 
+
     if (isNuxt) {
+        const nuxtTwo = isNuxtTwo();
+        commands.executeCommand('setContext', 'nuxtr.isNuxtTwo', nuxtTwo);
+
         await activateExtension(context);
     } else {
         publicCommands.forEach(({ command, function: commandFunction }) => {

src/statusBar/index.ts

@@ -44,4 +44,8 @@ export function updateDevtoolsStatusBar(statusBar: DevtoolsStatusBar) {
     statusBars.devToolsStatusBar.tooltip = statusBar.tooltip;
     statusBars.devToolsStatusBar.text = statusBar.text;
     statusBars.devToolsStatusBar.color = statusBar.color;
+}
+
+export function hideDevtoolsStatusBar() {
+    statusBars.devToolsStatusBar.hide()
 }