diff --git a/apps/vscode-wing/.eslintrc.json b/apps/vscode-wing/.eslintrc.json
index fb2b2de6745..e0db8788bc1 100644
--- a/apps/vscode-wing/.eslintrc.json
+++ b/apps/vscode-wing/.eslintrc.json
@@ -58,6 +58,7 @@
         "devDependencies": [
           "**/test/**",
           "**/build-tools/**",
+          "src/**",
           ".projenrc.ts",
           "projenrc/**/*.ts"
         ],
diff --git a/apps/vscode-wing/.projen/deps.json b/apps/vscode-wing/.projen/deps.json
index 29a11112591..0846072ef41 100644
--- a/apps/vscode-wing/.projen/deps.json
+++ b/apps/vscode-wing/.projen/deps.json
@@ -1,14 +1,31 @@
 {
   "dependencies": [
+    {
+      "name": "@trpc/client",
+      "type": "build"
+    },
+    {
+      "name": "@types/node-fetch",
+      "type": "build"
+    },
     {
       "name": "@types/node",
       "version": "^16",
       "type": "build"
     },
+    {
+      "name": "@types/vscode",
+      "version": "^1.70.0",
+      "type": "build"
+    },
     {
       "name": "@types/which",
       "type": "build"
     },
+    {
+      "name": "@types/ws",
+      "type": "build"
+    },
     {
       "name": "@typescript-eslint/eslint-plugin",
       "version": "^5",
@@ -24,7 +41,13 @@
       "type": "build"
     },
     {
-      "name": "esbuild",
+      "name": "@wingconsole/app",
+      "version": "workspace:^",
+      "type": "build"
+    },
+    {
+      "name": "@wingconsole/server",
+      "version": "workspace:^",
       "type": "build"
     },
     {
@@ -52,11 +75,20 @@
       "version": "^8",
       "type": "build"
     },
+    {
+      "name": "node-fetch",
+      "version": "2",
+      "type": "build"
+    },
     {
       "name": "npm-check-updates",
       "version": "^16",
       "type": "build"
     },
+    {
+      "name": "open",
+      "type": "build"
+    },
     {
       "name": "prettier",
       "type": "build"
@@ -70,21 +102,24 @@
       "type": "build"
     },
     {
-      "name": "typescript",
+      "name": "tsup",
       "type": "build"
     },
     {
-      "name": "@types/vscode",
-      "version": "^1.70.0",
-      "type": "runtime"
+      "name": "typescript",
+      "type": "build"
     },
     {
       "name": "vscode-languageclient",
-      "type": "runtime"
+      "type": "build"
     },
     {
       "name": "which",
-      "type": "runtime"
+      "type": "build"
+    },
+    {
+      "name": "ws",
+      "type": "build"
     }
   ],
   "//": "~~ Generated by projen. To modify, edit .projenrc.ts and run \"npx projen\"."
diff --git a/apps/vscode-wing/.projen/tasks.json b/apps/vscode-wing/.projen/tasks.json
index 5f9c733780a..2f7b8062098 100644
--- a/apps/vscode-wing/.projen/tasks.json
+++ b/apps/vscode-wing/.projen/tasks.json
@@ -61,7 +61,7 @@
       "description": "Only compile",
       "steps": [
         {
-          "exec": "esbuild src/extension.ts --outfile=lib/index.js --external:node-gyp --external:vscode --format=cjs --platform=node --bundle"
+          "exec": "tsup"
         }
       ]
     },
@@ -165,19 +165,19 @@
           "exec": "pnpm update npm-check-updates"
         },
         {
-          "exec": "npm-check-updates --dep dev --upgrade --target=minor"
+          "exec": "npm-check-updates --dep dev --upgrade --target=minor --reject='@wingconsole/app,@wingconsole/server,node-fetch'"
         },
         {
-          "exec": "npm-check-updates --dep optional --upgrade --target=minor"
+          "exec": "npm-check-updates --dep optional --upgrade --target=minor --reject='@wingconsole/app,@wingconsole/server,node-fetch'"
         },
         {
-          "exec": "npm-check-updates --dep peer --upgrade --target=minor"
+          "exec": "npm-check-updates --dep peer --upgrade --target=minor --reject='@wingconsole/app,@wingconsole/server,node-fetch'"
         },
         {
-          "exec": "npm-check-updates --dep prod --upgrade --target=minor"
+          "exec": "npm-check-updates --dep prod --upgrade --target=minor --reject='@wingconsole/app,@wingconsole/server,node-fetch'"
         },
         {
-          "exec": "npm-check-updates --dep bundle --upgrade --target=minor"
+          "exec": "npm-check-updates --dep bundle --upgrade --target=minor --reject='@wingconsole/app,@wingconsole/server,node-fetch'"
         },
         {
           "exec": "pnpm i --no-frozen-lockfile"
@@ -198,7 +198,7 @@
       "description": "Watch & compile in the background",
       "steps": [
         {
-          "exec": "esbuild src/extension.ts --outfile=lib/index.js --external:node-gyp --external:vscode --format=cjs --platform=node --bundle --watch"
+          "exec": "tsup --watch"
         }
       ]
     }
diff --git a/apps/vscode-wing/.projenrc.ts b/apps/vscode-wing/.projenrc.ts
index 5d29d430914..9c65b4b9812 100644
--- a/apps/vscode-wing/.projenrc.ts
+++ b/apps/vscode-wing/.projenrc.ts
@@ -36,7 +36,7 @@ const project = new TypeScriptAppProject({
   jest: false,
   github: false,
   npmignoreEnabled: false,
-  entrypoint: "lib/index.js",
+  entrypoint: "lib/extension.js",
   eslintOptions: {
     dirs: ["src"],
     prettier: true,
@@ -48,17 +48,32 @@ const project = new TypeScriptAppProject({
   tsconfig: {
     compilerOptions: {
       noUncheckedIndexedAccess: true,
+      lib: ["es2021"],
     },
   },
 
-  deps: [
+  deps: [],
+  devDeps: [
     `@types/vscode@^${VSCODE_BASE_VERSION}`,
     "vscode-languageclient",
     "which",
+    "@trpc/client",
+    "ws",
+    "open",
+    "node-fetch@2",
+    "@types/node",
+    "@types/which",
+    "@vscode/vsce",
+    "@types/node-fetch",
+    "@types/ws",
+    "@wingconsole/app@workspace:^",
+    "@wingconsole/server@workspace:^",
   ],
-  devDeps: ["@types/node", "@types/which", "esbuild", "@vscode/vsce"],
 });
 
+// because we're bundling, allow dev deps in src
+project.eslint?.allowDevDeps("src/**");
+
 project.addGitIgnore("*.vsix");
 
 const vscodeIgnore = new IgnoreFile(project, ".vscodeignore");
@@ -122,6 +137,26 @@ const contributes: VSCodeExtensionContributions = {
         dark: "resources/icon-dark.png",
       },
     },
+    {
+      command: "wingConsole.openResource",
+      title: "Open resource",
+    },
+    {
+      command: "wingConsole.runTest",
+      title: "Run test",
+      icon: {
+        light: "resources/play-light.svg",
+        dark: "resources/play-dark.svg",
+      },
+    },
+    {
+      command: "wingConsole.runAllTests",
+      title: "Run all tests",
+      icon: {
+        light: "resources/play-all-light.svg",
+        dark: "resources/play-all-dark.svg",
+      },
+    },
   ],
   menus: {
     "editor/title": [
@@ -136,6 +171,20 @@ const contributes: VSCodeExtensionContributions = {
         group: "navigation",
       },
     ],
+    "view/item/context": [
+      {
+        command: "wingConsole.runTest",
+        when: "view == consoleTestsExplorer",
+        group: "inline",
+      },
+    ],
+    "explorer/context": [
+      {
+        command: "wingConsole.runAllTests",
+        when: "view == consoleTestsExplorer",
+        group: "inline",
+      },
+    ],
   },
   configuration: [
     {
@@ -150,6 +199,18 @@ const contributes: VSCodeExtensionContributions = {
       },
     },
   ],
+  views: {
+    explorer: [
+      {
+        id: "consoleExplorer",
+        name: "Wing Resources",
+      },
+      {
+        id: "consoleTestsExplorer",
+        name: "Wing Tests",
+      },
+    ],
+  },
 };
 
 project.addFields({
@@ -166,11 +227,11 @@ project.addFields({
   contributes,
 });
 
-const esbuildComment =
-  "esbuild src/extension.ts --outfile=lib/index.js --external:node-gyp --external:vscode --format=cjs --platform=node --bundle";
+project.addDevDeps("tsup");
+
 project.compileTask.reset();
-project.compileTask.exec(esbuildComment);
-project.watchTask.reset(`${esbuildComment} --watch`);
+project.compileTask.exec("tsup");
+project.watchTask.reset("tsup --watch");
 
 project.packageTask.reset(
   "pnpm version ${PROJEN_BUMP_VERSION:-0.0.0} --allow-same-version"
diff --git a/apps/vscode-wing/package.json b/apps/vscode-wing/package.json
index 04353cc7ac0..b198f9531bd 100644
--- a/apps/vscode-wing/package.json
+++ b/apps/vscode-wing/package.json
@@ -29,28 +29,34 @@
     "organization": true
   },
   "devDependencies": {
+    "@trpc/client": "^10.30.0",
     "@types/node": "^16",
+    "@types/node-fetch": "^2.6.4",
+    "@types/vscode": "^1.70.0",
     "@types/which": "^2.0.2",
+    "@types/ws": "^8.5.5",
     "@typescript-eslint/eslint-plugin": "^5",
     "@typescript-eslint/parser": "^5",
     "@vscode/vsce": "^2.16.0",
-    "esbuild": "^0.17.4",
+    "@wingconsole/app": "workspace:^",
+    "@wingconsole/server": "workspace:^",
     "eslint": "^8",
     "eslint-config-prettier": "^8.6.0",
     "eslint-import-resolver-node": "^0.3.7",
     "eslint-import-resolver-typescript": "^3.5.3",
     "eslint-plugin-import": "^2.27.5",
     "eslint-plugin-prettier": "^4.2.1",
+    "node-fetch": "2",
     "npm-check-updates": "^16",
+    "open": "^8.4.0",
     "prettier": "^2.8.3",
     "projen": "^0.71.60",
     "ts-node": "^10.9.1",
-    "typescript": "^4.9.4"
-  },
-  "dependencies": {
-    "@types/vscode": "^1.70.0",
+    "tsup": "^6.7.0",
+    "typescript": "^4.9.4",
     "vscode-languageclient": "^8.0.2",
-    "which": "^3.0.0"
+    "which": "^1.3.1",
+    "ws": "^8.13.0"
   },
   "keywords": [
     "cdk",
@@ -65,14 +71,14 @@
   "engines": {
     "vscode": "^1.70.0"
   },
-  "main": "lib/index.js",
+  "main": "lib/extension.js",
   "license": "MIT",
   "homepage": "https://winglang.io",
   "version": "0.0.0",
   "bugs": {
     "url": "https://github.com/winglang/wing/issues"
   },
-  "types": "lib/index.d.ts",
+  "types": "lib/extension.d.ts",
   "publisher": "Monada",
   "preview": true,
   "private": true,
@@ -136,6 +142,26 @@
           "light": "resources/icon-light.png",
           "dark": "resources/icon-dark.png"
         }
+      },
+      {
+        "command": "wingConsole.openResource",
+        "title": "Open resource"
+      },
+      {
+        "command": "wingConsole.runTest",
+        "title": "Run test",
+        "icon": {
+          "light": "resources/play-light.svg",
+          "dark": "resources/play-dark.svg"
+        }
+      },
+      {
+        "command": "wingConsole.runAllTests",
+        "title": "Run all tests",
+        "icon": {
+          "light": "resources/play-all-light.svg",
+          "dark": "resources/play-all-dark.svg"
+        }
       }
     ],
     "menus": {
@@ -150,6 +176,20 @@
           "command": "wing.openFile",
           "group": "navigation"
         }
+      ],
+      "view/item/context": [
+        {
+          "command": "wingConsole.runTest",
+          "when": "view == consoleTestsExplorer",
+          "group": "inline"
+        }
+      ],
+      "explorer/context": [
+        {
+          "command": "wingConsole.runAllTests",
+          "when": "view == consoleTestsExplorer",
+          "group": "inline"
+        }
       ]
     },
     "configuration": [
@@ -163,7 +203,19 @@
           }
         }
       }
-    ]
+    ],
+    "views": {
+      "explorer": [
+        {
+          "id": "consoleExplorer",
+          "name": "Wing Resources"
+        },
+        {
+          "id": "consoleTestsExplorer",
+          "name": "Wing Tests"
+        }
+      ]
+    }
   },
   "volta": {
     "extends": "../../package.json"
diff --git a/apps/vscode-wing/resources/play-all-dark.svg b/apps/vscode-wing/resources/play-all-dark.svg
new file mode 100644
index 00000000000..a8ff8f57595
--- /dev/null
+++ b/apps/vscode-wing/resources/play-all-dark.svg
@@ -0,0 +1,10 @@
+<svg
+        xmlns="http://www.w3.org/2000/svg"
+        fill="none"
+        viewBox="0 0 24 24"
+        strokeWidth="1.5"
+        stroke="#2ad5c1" height="16" width="16"
+        aria-hidden="true"
+      >
+        <path d="M5 8.69c0-.87.93-1.4 1.68-.98l7.11 4.06a1.13 1.13 0 0 1 0 1.96l-7.1 4.06A1.13 1.13 0 0 1 5 16.8V8.69zm5.75 0c0-.87.93-1.4 1.68-.98l7.11 4.06a1.13 1.13 0 0 1 0 1.96l-7.1 4.06a1.13 1.13 0 0 1-1.69-.98l0 -1M10.76 10l0 -1.5" />
+      </svg>
diff --git a/apps/vscode-wing/resources/play-all-light.svg b/apps/vscode-wing/resources/play-all-light.svg
new file mode 100644
index 00000000000..b2883623d14
--- /dev/null
+++ b/apps/vscode-wing/resources/play-all-light.svg
@@ -0,0 +1,10 @@
+<svg
+        xmlns="http://www.w3.org/2000/svg"
+        fill="none"
+        viewBox="0 0 24 24"
+        strokeWidth="1.5"
+        stroke="#000000" height="16" width="16"
+        aria-hidden="true"
+      >
+        <path d="M5 8.69c0-.87.93-1.4 1.68-.98l7.11 4.06a1.13 1.13 0 0 1 0 1.96l-7.1 4.06A1.13 1.13 0 0 1 5 16.8V8.69zm5.75 0c0-.87.93-1.4 1.68-.98l7.11 4.06a1.13 1.13 0 0 1 0 1.96l-7.1 4.06a1.13 1.13 0 0 1-1.69-.98l0 -1M10.76 10l0 -1.5" />
+      </svg>
diff --git a/apps/vscode-wing/resources/play-dark.svg b/apps/vscode-wing/resources/play-dark.svg
new file mode 100644
index 00000000000..6e208f956e7
--- /dev/null
+++ b/apps/vscode-wing/resources/play-dark.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#2ad5c1" height="16" width="16">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M5.25 5.653c0-.856.917-1.398 1.667-.986l11.54 6.348a1.125 1.125 0 010 1.971l-11.54 6.347a1.125 1.125 0 01-1.667-.985V5.653z" />
+</svg>
diff --git a/apps/vscode-wing/resources/play-light.svg b/apps/vscode-wing/resources/play-light.svg
new file mode 100644
index 00000000000..032a2f0a2c5
--- /dev/null
+++ b/apps/vscode-wing/resources/play-light.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#000000" height="16" width="16">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M5.25 5.653c0-.856.917-1.398 1.667-.986l11.54 6.348a1.125 1.125 0 010 1.971l-11.54 6.347a1.125 1.125 0 01-1.667-.985V5.653z" />
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/dark/archive-box.svg b/apps/vscode-wing/resources/resource-icons/dark/archive-box.svg
new file mode 100644
index 00000000000..f6ef06fab73
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/dark/archive-box.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#2ad5c1" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M20.25 7.5l-.625 10.632a2.25 2.25 0 01-2.247 2.118H6.622a2.25 2.25 0 01-2.247-2.118L3.75 7.5M10 11.25h4M3.375 7.5h17.25c.621 0 1.125-.504 1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125z"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/dark/beaker.svg b/apps/vscode-wing/resources/resource-icons/dark/beaker.svg
new file mode 100644
index 00000000000..c45c483c366
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/dark/beaker.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#2ad5c1" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M9.75 3.104v5.714a2.25 2.25 0 01-.659 1.591L5 14.5M9.75 3.104c-.251.023-.501.05-.75.082m.75-.082a24.301 24.301 0 014.5 0m0 0v5.714c0 .597.237 1.17.659 1.591L19.8 15.3M14.25 3.104c.251.023.501.05.75.082M19.8 15.3l-1.57.393A9.065 9.065 0 0112 15a9.065 9.065 0 00-6.23-.693L5 14.5m14.8.8l1.402 1.402c1.232 1.232.65 3.318-1.067 3.611A48.309 48.309 0 0112 21c-2.773 0-5.491-.235-8.135-.687-1.718-.293-2.3-2.379-1.067-3.61L5 14.5"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/dark/bolt.svg b/apps/vscode-wing/resources/resource-icons/dark/bolt.svg
new file mode 100644
index 00000000000..61574e4aee3
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/dark/bolt.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#2ad5c1" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 13.5l10.5-11.25L12 10.5h8.25L9.75 21.75 12 13.5H3.75z"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/dark/calculator.svg b/apps/vscode-wing/resources/resource-icons/dark/calculator.svg
new file mode 100644
index 00000000000..d79e9726463
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/dark/calculator.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#2ad5c1" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M15.75 15.75V18m-7.5-6.75h.008v.008H8.25v-.008zm0 2.25h.008v.008H8.25V13.5zm0 2.25h.008v.008H8.25v-.008zm0 2.25h.008v.008H8.25V18zm2.498-6.75h.007v.008h-.007v-.008zm0 2.25h.007v.008h-.007V13.5zm0 2.25h.007v.008h-.007v-.008zm0 2.25h.007v.008h-.007V18zm2.504-6.75h.008v.008h-.008v-.008zm0 2.25h.008v.008h-.008V13.5zm0 2.25h.008v.008h-.008v-.008zm0 2.25h.008v.008h-.008V18zm2.498-6.75h.008v.008h-.008v-.008zm0 2.25h.008v.008h-.008V13.5zM8.25 6h7.5v2.25h-7.5V6zM12 2.25c-1.892 0-3.758.11-5.593.322C5.307 2.7 4.5 3.65 4.5 4.757V19.5a2.25 2.25 0 002.25 2.25h10.5a2.25 2.25 0 002.25-2.25V4.757c0-1.108-.806-2.057-1.907-2.185A48.507 48.507 0 0012 2.25z"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/dark/clock.svg b/apps/vscode-wing/resources/resource-icons/dark/clock.svg
new file mode 100644
index 00000000000..87eab2dc2dc
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/dark/clock.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#2ad5c1" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 11-18 0 9 9 0 0118 0z"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/dark/cloud.svg b/apps/vscode-wing/resources/resource-icons/dark/cloud.svg
new file mode 100644
index 00000000000..4eb9e708fbb
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/dark/cloud.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#2ad5c1" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M2.25 15a4.5 4.5 0 004.5 4.5H18a3.75 3.75 0 001.332-7.257 3 3 0 00-3.758-3.848 5.25 5.25 0 00-10.233 2.33A4.502 4.502 0 002.25 15z"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/dark/cube.svg b/apps/vscode-wing/resources/resource-icons/dark/cube.svg
new file mode 100644
index 00000000000..8ce57410c00
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/dark/cube.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#2ad5c1" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M21 7.5l-9-5.25L3 7.5m18 0l-9 5.25m9-5.25v9l-9 5.25M3 7.5l9 5.25M3 7.5v9l9 5.25m0-9v9"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/dark/globe-alt.svg b/apps/vscode-wing/resources/resource-icons/dark/globe-alt.svg
new file mode 100644
index 00000000000..ab078d2abb6
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/dark/globe-alt.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#2ad5c1" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M12 21a9.004 9.004 0 008.716-6.747M12 21a9.004 9.004 0 01-8.716-6.747M12 21c2.485 0 4.5-4.03 4.5-9S14.485 3 12 3m0 18c-2.485 0-4.5-4.03-4.5-9S9.515 3 12 3m0 0a8.997 8.997 0 017.843 4.582M12 3a8.997 8.997 0 00-7.843 4.582m15.686 0A11.953 11.953 0 0112 10.5c-2.998 0-5.74-1.1-7.843-2.918m15.686 0A8.959 8.959 0 0121 12c0 .778-.099 1.533-.284 2.253m0 0A17.919 17.919 0 0112 16.5c-3.162 0-6.133-.815-8.716-2.247m0 0A9.015 9.015 0 013 12c0-1.605.42-3.113 1.157-4.418"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/dark/megaphone.svg b/apps/vscode-wing/resources/resource-icons/dark/megaphone.svg
new file mode 100644
index 00000000000..f5c85040fe1
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/dark/megaphone.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#2ad5c1" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M10.34 15.84c-.688-.06-1.386-.09-2.09-.09H7.5a4.5 4.5 0 110-9h.75c.704 0 1.402-.03 2.09-.09m0 9.18c.253.962.584 1.892.985 2.783.247.55.06 1.21-.463 1.511l-.657.38c-.551.318-1.26.117-1.527-.461a20.845 20.845 0 01-1.44-4.282m3.102.069a18.03 18.03 0 01-.59-4.59c0-1.586.205-3.124.59-4.59m0 9.18a23.848 23.848 0 018.835 2.535M10.34 6.66a23.847 23.847 0 008.835-2.535m0 0A23.74 23.74 0 0018.795 3m.38 1.125a23.91 23.91 0 011.014 5.395m-1.014 8.855c-.118.38-.245.754-.38 1.125m.38-1.125a23.91 23.91 0 001.014-5.395m0-3.46c.495.413.811 1.035.811 1.73 0 .695-.316 1.317-.811 1.73m0-3.46a24.347 24.347 0 010 3.46"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/dark/queue-list.svg b/apps/vscode-wing/resources/resource-icons/dark/queue-list.svg
new file mode 100644
index 00000000000..7eec9855d33
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/dark/queue-list.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#2ad5c1" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 12h16.5m-16.5 3.75h16.5M3.75 19.5h16.5M5.625 4.5h12.75a1.875 1.875 0 010 3.75H5.625a1.875 1.875 0 010-3.75z"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/dark/redis.svg b/apps/vscode-wing/resources/resource-icons/dark/redis.svg
new file mode 100644
index 00000000000..66e31bd3336
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/dark/redis.svg
@@ -0,0 +1,11 @@
+ <svg
+          xmlns="http://www.w3.org/2000/svg"
+          viewBox="0 0 32 32"
+          fill="none"
+          currentColor="#2ad5c1"
+        >
+          <path
+            fill="#2ad5c1"
+            d="M32 19.1c0 .3-.4.7-1.3 1.1-1.7.9-10.5 4.5-12.4 5.5-1.9 1-3 1-4.4.3-1.5-.7-11-4.5-12.6-5.4-.9-.4-1.3-.7-1.3-1v3.2c0 .3.4.7 1.3 1 1.7.9 11.1 4.7 12.6 5.4 1.5.7 2.5.7 4.4-.3 1.9-1 10.7-4.6 12.4-5.5 1-.4 1.3-.8 1.3-1V19zm0-5.3c0 .4-.4.7-1.3 1.1-1.7 1-10.5 4.6-12.4 5.5-1.9 1-3 1-4.4.3-1.5-.7-11-4.5-12.6-5.3C.4 15 0 14.6 0 14.3v3.2c0 .4.4.7 1.3 1.1l12.6 5.3c1.5.7 2.5.8 4.4-.2 1.9-1 10.7-4.6 12.4-5.5 1-.5 1.3-.8 1.3-1.2v-3.2zm0-5.4c0-.3-.4-.6-1.3-1L18.6 2.8c-1.7-.6-2.4-.6-4.4.1l-13 5c-.8.4-1.2.7-1.2 1v3.3c0 .3.4.6 1.3 1l12.6 5.4c1.5.7 2.5.7 4.4-.3 1.9-1 10.7-4.6 12.5-5.5.8-.5 1.2-.8 1.2-1.1V8.4zm-20.5 3 7.4-1.1-2.3 3.3zm16.4-3-4.9 2-4.4-1.7 4.9-2zm-13-3.1L14.4 4l2.2.9 2.1-.7-.6 1.3 2.2.8-2.8.3-.6 1.5-1-1.6-3.2-.3zM9.6 7.2c2.2 0 4 .7 4 1.5 0 .9-1.9 1.5-4 1.5s-4-.6-4-1.5c0-.8 1.8-1.5 4-1.5z"
+          />
+        </svg>
diff --git a/apps/vscode-wing/resources/resource-icons/dark/table-cells.svg b/apps/vscode-wing/resources/resource-icons/dark/table-cells.svg
new file mode 100644
index 00000000000..3902cf36eb9
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/dark/table-cells.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#2ad5c1" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M3.375 19.5h17.25m-17.25 0a1.125 1.125 0 01-1.125-1.125M3.375 19.5h7.5c.621 0 1.125-.504 1.125-1.125m-9.75 0V5.625m0 12.75v-1.5c0-.621.504-1.125 1.125-1.125m18.375 2.625V5.625m0 12.75c0 .621-.504 1.125-1.125 1.125m1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125m0 3.75h-7.5A1.125 1.125 0 0112 18.375m9.75-12.75c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125m19.5 0v1.5c0 .621-.504 1.125-1.125 1.125M2.25 5.625v1.5c0 .621.504 1.125 1.125 1.125m0 0h17.25m-17.25 0h7.5c.621 0 1.125.504 1.125 1.125M3.375 8.25c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125m17.25-3.75h-7.5c-.621 0-1.125.504-1.125 1.125m8.625-1.125c.621 0 1.125.504 1.125 1.125v1.5c0 .621-.504 1.125-1.125 1.125m-17.25 0h7.5m-7.5 0c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125M12 10.875v-1.5m0 1.5c0 .621-.504 1.125-1.125 1.125M12 10.875c0 .621.504 1.125 1.125 1.125m-2.25 0c.621 0 1.125.504 1.125 1.125M13.125 12h7.5m-7.5 0c-.621 0-1.125.504-1.125 1.125M20.625 12c.621 0 1.125.504 1.125 1.125v1.5c0 .621-.504 1.125-1.125 1.125m-17.25 0h7.5M12 14.625v-1.5m0 1.5c0 .621-.504 1.125-1.125 1.125M12 14.625c0 .621.504 1.125 1.125 1.125m-2.25 0c.621 0 1.125.504 1.125 1.125m0 1.5v-1.5m0 0c0-.621.504-1.125 1.125-1.125m0 0h7.5"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/light/archive-box.svg b/apps/vscode-wing/resources/resource-icons/light/archive-box.svg
new file mode 100644
index 00000000000..897ecf080e6
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/light/archive-box.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#000000" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M20.25 7.5l-.625 10.632a2.25 2.25 0 01-2.247 2.118H6.622a2.25 2.25 0 01-2.247-2.118L3.75 7.5M10 11.25h4M3.375 7.5h17.25c.621 0 1.125-.504 1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125z"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/light/beaker.svg b/apps/vscode-wing/resources/resource-icons/light/beaker.svg
new file mode 100644
index 00000000000..6bd47ac6aa2
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/light/beaker.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#000000" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M9.75 3.104v5.714a2.25 2.25 0 01-.659 1.591L5 14.5M9.75 3.104c-.251.023-.501.05-.75.082m.75-.082a24.301 24.301 0 014.5 0m0 0v5.714c0 .597.237 1.17.659 1.591L19.8 15.3M14.25 3.104c.251.023.501.05.75.082M19.8 15.3l-1.57.393A9.065 9.065 0 0112 15a9.065 9.065 0 00-6.23-.693L5 14.5m14.8.8l1.402 1.402c1.232 1.232.65 3.318-1.067 3.611A48.309 48.309 0 0112 21c-2.773 0-5.491-.235-8.135-.687-1.718-.293-2.3-2.379-1.067-3.61L5 14.5"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/light/bolt.svg b/apps/vscode-wing/resources/resource-icons/light/bolt.svg
new file mode 100644
index 00000000000..52b44d7d5b1
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/light/bolt.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#000000" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 13.5l10.5-11.25L12 10.5h8.25L9.75 21.75 12 13.5H3.75z"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/light/calculator.svg b/apps/vscode-wing/resources/resource-icons/light/calculator.svg
new file mode 100644
index 00000000000..f8c51446893
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/light/calculator.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#000000" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M15.75 15.75V18m-7.5-6.75h.008v.008H8.25v-.008zm0 2.25h.008v.008H8.25V13.5zm0 2.25h.008v.008H8.25v-.008zm0 2.25h.008v.008H8.25V18zm2.498-6.75h.007v.008h-.007v-.008zm0 2.25h.007v.008h-.007V13.5zm0 2.25h.007v.008h-.007v-.008zm0 2.25h.007v.008h-.007V18zm2.504-6.75h.008v.008h-.008v-.008zm0 2.25h.008v.008h-.008V13.5zm0 2.25h.008v.008h-.008v-.008zm0 2.25h.008v.008h-.008V18zm2.498-6.75h.008v.008h-.008v-.008zm0 2.25h.008v.008h-.008V13.5zM8.25 6h7.5v2.25h-7.5V6zM12 2.25c-1.892 0-3.758.11-5.593.322C5.307 2.7 4.5 3.65 4.5 4.757V19.5a2.25 2.25 0 002.25 2.25h10.5a2.25 2.25 0 002.25-2.25V4.757c0-1.108-.806-2.057-1.907-2.185A48.507 48.507 0 0012 2.25z"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/light/clock.svg b/apps/vscode-wing/resources/resource-icons/light/clock.svg
new file mode 100644
index 00000000000..f9ade369484
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/light/clock.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#000000" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 11-18 0 9 9 0 0118 0z"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/light/cloud.svg b/apps/vscode-wing/resources/resource-icons/light/cloud.svg
new file mode 100644
index 00000000000..6ca053e0754
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/light/cloud.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#000000" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M2.25 15a4.5 4.5 0 004.5 4.5H18a3.75 3.75 0 001.332-7.257 3 3 0 00-3.758-3.848 5.25 5.25 0 00-10.233 2.33A4.502 4.502 0 002.25 15z"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/light/cube.svg b/apps/vscode-wing/resources/resource-icons/light/cube.svg
new file mode 100644
index 00000000000..7bd64203b32
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/light/cube.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#000000" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M21 7.5l-9-5.25L3 7.5m18 0l-9 5.25m9-5.25v9l-9 5.25M3 7.5l9 5.25M3 7.5v9l9 5.25m0-9v9"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/light/globe-alt.svg b/apps/vscode-wing/resources/resource-icons/light/globe-alt.svg
new file mode 100644
index 00000000000..4733d467555
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/light/globe-alt.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#000000" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M12 21a9.004 9.004 0 008.716-6.747M12 21a9.004 9.004 0 01-8.716-6.747M12 21c2.485 0 4.5-4.03 4.5-9S14.485 3 12 3m0 18c-2.485 0-4.5-4.03-4.5-9S9.515 3 12 3m0 0a8.997 8.997 0 017.843 4.582M12 3a8.997 8.997 0 00-7.843 4.582m15.686 0A11.953 11.953 0 0112 10.5c-2.998 0-5.74-1.1-7.843-2.918m15.686 0A8.959 8.959 0 0121 12c0 .778-.099 1.533-.284 2.253m0 0A17.919 17.919 0 0112 16.5c-3.162 0-6.133-.815-8.716-2.247m0 0A9.015 9.015 0 013 12c0-1.605.42-3.113 1.157-4.418"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/light/megaphone.svg b/apps/vscode-wing/resources/resource-icons/light/megaphone.svg
new file mode 100644
index 00000000000..8d077b760b5
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/light/megaphone.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#000000" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M10.34 15.84c-.688-.06-1.386-.09-2.09-.09H7.5a4.5 4.5 0 110-9h.75c.704 0 1.402-.03 2.09-.09m0 9.18c.253.962.584 1.892.985 2.783.247.55.06 1.21-.463 1.511l-.657.38c-.551.318-1.26.117-1.527-.461a20.845 20.845 0 01-1.44-4.282m3.102.069a18.03 18.03 0 01-.59-4.59c0-1.586.205-3.124.59-4.59m0 9.18a23.848 23.848 0 018.835 2.535M10.34 6.66a23.847 23.847 0 008.835-2.535m0 0A23.74 23.74 0 0018.795 3m.38 1.125a23.91 23.91 0 011.014 5.395m-1.014 8.855c-.118.38-.245.754-.38 1.125m.38-1.125a23.91 23.91 0 001.014-5.395m0-3.46c.495.413.811 1.035.811 1.73 0 .695-.316 1.317-.811 1.73m0-3.46a24.347 24.347 0 010 3.46"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/light/queue-list.svg b/apps/vscode-wing/resources/resource-icons/light/queue-list.svg
new file mode 100644
index 00000000000..fc0f71ee8d4
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/light/queue-list.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#000000" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 12h16.5m-16.5 3.75h16.5M3.75 19.5h16.5M5.625 4.5h12.75a1.875 1.875 0 010 3.75H5.625a1.875 1.875 0 010-3.75z"/>
+</svg>
diff --git a/apps/vscode-wing/resources/resource-icons/light/redis.svg b/apps/vscode-wing/resources/resource-icons/light/redis.svg
new file mode 100644
index 00000000000..930dc657380
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/light/redis.svg
@@ -0,0 +1,11 @@
+ <svg
+          xmlns="http://www.w3.org/2000/svg"
+          viewBox="0 0 32 32"
+          fill="none"
+          currentColor="#000000"
+        >
+          <path
+            fill="#000000"
+            d="M32 19.1c0 .3-.4.7-1.3 1.1-1.7.9-10.5 4.5-12.4 5.5-1.9 1-3 1-4.4.3-1.5-.7-11-4.5-12.6-5.4-.9-.4-1.3-.7-1.3-1v3.2c0 .3.4.7 1.3 1 1.7.9 11.1 4.7 12.6 5.4 1.5.7 2.5.7 4.4-.3 1.9-1 10.7-4.6 12.4-5.5 1-.4 1.3-.8 1.3-1V19zm0-5.3c0 .4-.4.7-1.3 1.1-1.7 1-10.5 4.6-12.4 5.5-1.9 1-3 1-4.4.3-1.5-.7-11-4.5-12.6-5.3C.4 15 0 14.6 0 14.3v3.2c0 .4.4.7 1.3 1.1l12.6 5.3c1.5.7 2.5.8 4.4-.2 1.9-1 10.7-4.6 12.4-5.5 1-.5 1.3-.8 1.3-1.2v-3.2zm0-5.4c0-.3-.4-.6-1.3-1L18.6 2.8c-1.7-.6-2.4-.6-4.4.1l-13 5c-.8.4-1.2.7-1.2 1v3.3c0 .3.4.6 1.3 1l12.6 5.4c1.5.7 2.5.7 4.4-.3 1.9-1 10.7-4.6 12.5-5.5.8-.5 1.2-.8 1.2-1.1V8.4zm-20.5 3 7.4-1.1-2.3 3.3zm16.4-3-4.9 2-4.4-1.7 4.9-2zm-13-3.1L14.4 4l2.2.9 2.1-.7-.6 1.3 2.2.8-2.8.3-.6 1.5-1-1.6-3.2-.3zM9.6 7.2c2.2 0 4 .7 4 1.5 0 .9-1.9 1.5-4 1.5s-4-.6-4-1.5c0-.8 1.8-1.5 4-1.5z"
+          />
+        </svg>
diff --git a/apps/vscode-wing/resources/resource-icons/light/table-cells.svg b/apps/vscode-wing/resources/resource-icons/light/table-cells.svg
new file mode 100644
index 00000000000..eedec1524f4
--- /dev/null
+++ b/apps/vscode-wing/resources/resource-icons/light/table-cells.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#000000" aria-hidden="true">
+  <path stroke-linecap="round" stroke-linejoin="round" d="M3.375 19.5h17.25m-17.25 0a1.125 1.125 0 01-1.125-1.125M3.375 19.5h7.5c.621 0 1.125-.504 1.125-1.125m-9.75 0V5.625m0 12.75v-1.5c0-.621.504-1.125 1.125-1.125m18.375 2.625V5.625m0 12.75c0 .621-.504 1.125-1.125 1.125m1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125m0 3.75h-7.5A1.125 1.125 0 0112 18.375m9.75-12.75c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125m19.5 0v1.5c0 .621-.504 1.125-1.125 1.125M2.25 5.625v1.5c0 .621.504 1.125 1.125 1.125m0 0h17.25m-17.25 0h7.5c.621 0 1.125.504 1.125 1.125M3.375 8.25c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125m17.25-3.75h-7.5c-.621 0-1.125.504-1.125 1.125m8.625-1.125c.621 0 1.125.504 1.125 1.125v1.5c0 .621-.504 1.125-1.125 1.125m-17.25 0h7.5m-7.5 0c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125M12 10.875v-1.5m0 1.5c0 .621-.504 1.125-1.125 1.125M12 10.875c0 .621.504 1.125 1.125 1.125m-2.25 0c.621 0 1.125.504 1.125 1.125M13.125 12h7.5m-7.5 0c-.621 0-1.125.504-1.125 1.125M20.625 12c.621 0 1.125.504 1.125 1.125v1.5c0 .621-.504 1.125-1.125 1.125m-17.25 0h7.5M12 14.625v-1.5m0 1.5c0 .621-.504 1.125-1.125 1.125M12 14.625c0 .621.504 1.125 1.125 1.125m-2.25 0c.621 0 1.125.504 1.125 1.125m0 1.5v-1.5m0 0c0-.621.504-1.125 1.125-1.125m0 0h7.5"/>
+</svg>
diff --git a/apps/vscode-wing/src/bin-helper.ts b/apps/vscode-wing/src/bin-helper.ts
index 868fd063e39..b2e89159f33 100644
--- a/apps/vscode-wing/src/bin-helper.ts
+++ b/apps/vscode-wing/src/bin-helper.ts
@@ -1,4 +1,4 @@
-import { exec } from "child_process";
+import { exec, execSync } from "child_process";
 import { env } from "process";
 import {
   StatusBarItem,
diff --git a/apps/vscode-wing/src/console.ts b/apps/vscode-wing/src/console.ts
deleted file mode 100644
index f3036f4ad17..00000000000
--- a/apps/vscode-wing/src/console.ts
+++ /dev/null
@@ -1,133 +0,0 @@
-import { spawn } from "child_process";
-import path from "path";
-import {
-  ExtensionContext,
-  WebviewPanel,
-  Uri,
-  ViewColumn,
-  window,
-  workspace,
-} from "vscode";
-import { getWingBinAndArgs } from "./bin-helper";
-import { VIEW_TYPE_CONSOLE } from "./constants";
-
-export class WingConsoleManager {
-  consolePanels: Record<string, WebviewPanel> = {};
-  activeConsolePanel: string | undefined;
-
-  constructor(public readonly context: ExtensionContext) {}
-
-  public async openConsole() {
-    // get the current active file
-    const editor = window.activeTextEditor;
-    if (!editor) {
-      return;
-    }
-    const document = editor.document;
-    if (document.languageId !== "wing") {
-      return;
-    }
-    const uri = document.uri;
-
-    const existingPanel = this.consolePanels[uri.fsPath];
-    if (existingPanel) {
-      existingPanel.reveal();
-      return;
-    }
-
-    const args = await getWingBinAndArgs(this.context);
-    if (!args) {
-      return;
-    }
-
-    const filename = path.basename(uri.fsPath);
-    let panel: WebviewPanel;
-
-    args.push("it", "--no-open", uri.fsPath);
-
-    const cp = spawn(args[0]!, args.slice(1), {
-      stdio: ["ignore", "pipe", "pipe"],
-      windowsHide: true,
-      shell: false,
-    });
-
-    cp.on("error", (err) => {
-      if (err) {
-        void window.showErrorMessage(err.message);
-
-        panel?.dispose();
-      }
-    });
-    cp.stdout?.once("data", (data) => {
-      // get localhost url from stdout
-      const url = data.toString().match(/http:\/\/localhost:\d+/);
-      if (!url) {
-        // there should be an error message in a different event
-        return;
-      }
-
-      const port = parseInt(url[0].split(":")[2]);
-
-      panel = window.createWebviewPanel(
-        VIEW_TYPE_CONSOLE,
-        `${filename} [Console]`,
-        ViewColumn.Beside,
-        {
-          enableScripts: true,
-          enableCommandUris: true,
-          portMapping: [{ webviewPort: port, extensionHostPort: port }],
-        }
-      );
-      panel.iconPath = {
-        light: Uri.joinPath(
-          this.context.extensionUri,
-          "resources",
-          "icon-light.png"
-        ),
-        dark: Uri.joinPath(
-          this.context.extensionUri,
-          "resources",
-          "icon-dark.png"
-        ),
-      };
-
-      this.consolePanels[uri.fsPath] = panel;
-      this.activeConsolePanel = uri.fsPath;
-      panel.onDidChangeViewState(() => {
-        if (panel.active) {
-          this.activeConsolePanel = uri.fsPath;
-        } else if (this.activeConsolePanel === uri.fsPath) {
-          this.activeConsolePanel = undefined;
-        }
-      });
-
-      panel.onDidDispose(() => {
-        delete this.consolePanels[uri.fsPath];
-        this.activeConsolePanel = undefined;
-        cp.kill();
-      });
-      panel.webview.html = `\
-      <!DOCTYPE html>
-        <html lang="en"">
-        <head>
-            <meta charset="UTF-8">
-            <style>
-              body { margin: 0; padding: 0; }
-              iframe { display: block; height: 100vh; width: 100vw; border: none; }
-            </style>
-        </head>
-        <body><iframe src="${url[0]}/"></iframe></body>
-      </html>`;
-    });
-  }
-
-  public async openFile() {
-    if (this.activeConsolePanel) {
-      const document = await workspace.openTextDocument(
-        this.activeConsolePanel
-      );
-
-      await window.showTextDocument(document);
-    }
-  }
-}
diff --git a/apps/vscode-wing/src/console/console-manager.ts b/apps/vscode-wing/src/console/console-manager.ts
new file mode 100644
index 00000000000..6c1856e039f
--- /dev/null
+++ b/apps/vscode-wing/src/console/console-manager.ts
@@ -0,0 +1,274 @@
+import {
+  window,
+  WebviewPanel,
+  commands,
+  OutputChannel,
+  TreeView,
+  ViewColumn,
+  Uri,
+  ExtensionContext,
+} from "vscode";
+
+import {
+  ResourceItem,
+  ResourcesExplorerProvider,
+} from "./explorer-providers/ResourcesExplorerProvider";
+import {
+  TestItem,
+  TestsExplorerProvider,
+} from "./explorer-providers/TestsExplorerProvider";
+import { type Client } from "./services/client";
+import { VIEW_TYPE_CONSOLE } from "../constants";
+
+export interface ConsoleInstance {
+  id: string;
+  wingfile: string;
+  url: string;
+  client: Client;
+  onDidClose: () => void;
+}
+
+export interface ConsoleManager {
+  addInstance: (instance: ConsoleInstance) => Promise<void>;
+  getInstance: (instanceId: string) => ConsoleInstance | undefined;
+  closeInstance: (instanceId: string) => void;
+  setActiveInstance: (instanceId: string) => Promise<void>;
+  activeInstances: () => boolean;
+  getActiveInstanceId: () => string | undefined;
+}
+
+export const createConsoleManager = (
+  context: ExtensionContext,
+  logger: OutputChannel
+): ConsoleManager => {
+  const instances: Record<string, ConsoleInstance> = {};
+  const resourcesExplorer = new ResourcesExplorerProvider();
+  const testsExplorer = new TestsExplorerProvider();
+
+  let activeInstanceId: string | undefined;
+  let webviewPanel: WebviewPanel | undefined;
+  let explorerView: TreeView<ResourceItem> | undefined;
+  let testsExplorerView: TreeView<TestItem> | undefined;
+
+  let timeout: NodeJS.Timeout | undefined;
+  let logsTimestamp: number = 0;
+
+  const registerCommands = () => {
+    commands.registerCommand("wingConsole.openResource", async (resourceId) => {
+      if (!activeInstanceId) {
+        return;
+      }
+      const activePanel = getInstance(activeInstanceId);
+      if (!activePanel) {
+        return;
+      }
+      await activePanel.client.setSelectedNode(resourceId);
+    });
+
+    commands.registerCommand("wingConsole.runTest", async (test: TestItem) => {
+      if (!activeInstanceId) {
+        return;
+      }
+      const activePanel = getInstance(activeInstanceId);
+      if (!activePanel) {
+        return;
+      }
+      const tests = testsExplorer.getTests();
+      testsExplorer.update(
+        tests.map((testItem) => {
+          if (testItem.id === test.id) {
+            return {
+              ...test,
+              status: "running",
+            };
+          }
+          return testItem;
+        })
+      );
+      await activePanel.client.runTest(test.id);
+    });
+
+    commands.registerCommand("wingConsole.runAllTests", async () => {
+      if (!activeInstanceId) {
+        return;
+      }
+      const activePanel = getInstance(activeInstanceId);
+      if (!activePanel) {
+        return;
+      }
+      const tests = testsExplorer.getTests();
+      testsExplorer.update(
+        tests.map((testItem) => {
+          return {
+            ...testItem,
+            status: "running",
+          };
+        })
+      );
+      await activePanel.client.runAllTests();
+    });
+  };
+
+  const updateLogs = async (instance: ConsoleInstance) => {
+    const logs = await instance.client.getLogs({ time: logsTimestamp });
+
+    logs.forEach((log) => {
+      logger.appendLine(`[${log.level}] ${log.message}`);
+    });
+    logsTimestamp = Date.now();
+  };
+
+  const getTheme = () => {
+    const theme = window.activeColorTheme.kind;
+    if (theme === 1) {
+      return "light";
+    }
+    return "dark";
+  };
+
+  const getInstance = (instanceId: string) => {
+    if (!instanceId) {
+      return;
+    }
+    return instances[instanceId];
+  };
+
+  const addInstance = async (instance: ConsoleInstance) => {
+    logger.appendLine(`Wing Console is running at http://${instance.url}`);
+
+    instance.client.onInvalidateQuery({
+      onData: async (key) => {
+        if (activeInstanceId !== instance.id) {
+          return;
+        }
+        if (timeout) {
+          clearTimeout(timeout);
+        }
+        timeout = setTimeout(async () => {
+          if (!key || key === "app.logs") {
+            await updateLogs(instance);
+          }
+          resourcesExplorer.update(await instance.client.listResources());
+          testsExplorer.update(await instance.client.listTests());
+        }, 300);
+      },
+      onError: (err) => {
+        logger.appendLine(err);
+      },
+    });
+    instances[instance.id] = instance;
+
+    await setActiveInstance(instance.id);
+  };
+
+  const setActiveInstance = async (instanceId: string) => {
+    const instance = getInstance(instanceId);
+    if (!instance) {
+      return;
+    }
+
+    if (!webviewPanel) {
+      webviewPanel = window.createWebviewPanel(
+        VIEW_TYPE_CONSOLE,
+        `Console`,
+        ViewColumn.Beside,
+        {
+          enableScripts: true,
+          enableCommandUris: true,
+        }
+      );
+
+      webviewPanel.iconPath = {
+        light: Uri.joinPath(
+          context.extensionUri,
+          "resources",
+          "icon-light.png"
+        ),
+        dark: Uri.joinPath(context.extensionUri, "resources", "icon-dark.png"),
+      };
+
+      webviewPanel.onDidDispose(async () => {
+        resourcesExplorer.clear();
+        testsExplorer.clear();
+        webviewPanel = undefined;
+        activeInstanceId = undefined;
+
+        Object.keys(instances).forEach(async (id) => {
+          await closeInstance(id);
+        });
+      });
+      logger.show();
+    }
+
+    webviewPanel.title = `${instance.wingfile} - [console]`;
+    webviewPanel.webview.html = `
+      <!DOCTYPE html>
+        <html lang="en">
+        <head>
+            <meta charset="UTF-8">
+            <style>
+              body { margin: 0; padding: 0; }
+              iframe { display: block; height: 100vh; width: 100vw; border: none; }
+            </style>
+        </head>
+        <body>
+          <iframe src="http://${instance.url}?layout=4&theme=${getTheme()}"/>
+        </body>
+      </html>`;
+
+    resourcesExplorer.update(await instance.client.listResources());
+    testsExplorer.update(await instance.client.listTests());
+    await updateLogs(instance);
+
+    explorerView = window.createTreeView("consoleExplorer", {
+      treeDataProvider: resourcesExplorer,
+    });
+
+    testsExplorerView = window.createTreeView("consoleTestsExplorer", {
+      treeDataProvider: testsExplorer,
+    });
+
+    context.subscriptions.push(webviewPanel, explorerView, testsExplorerView);
+
+    const node = await resourcesExplorer.getChildren();
+    if (node[0]?.id) {
+      await explorerView?.reveal(new ResourceItem(node[0].id));
+    }
+    activeInstanceId = instanceId;
+  };
+
+  const closeInstance = async (instanceId: string) => {
+    const instance = getInstance(instanceId);
+    if (!instance) {
+      return;
+    }
+    logger.appendLine(`Closing Console instance: '${instance.wingfile}'`);
+
+    instance.client.close();
+    instance.onDidClose();
+    resourcesExplorer.clear();
+    testsExplorer.clear();
+    activeInstanceId = undefined;
+    delete instances[instanceId];
+
+    if (Object.keys(instances).length === 0) {
+      webviewPanel?.dispose();
+      webviewPanel = undefined;
+    }
+  };
+
+  registerCommands();
+
+  return {
+    addInstance,
+    getInstance,
+    closeInstance,
+    setActiveInstance,
+    activeInstances: () => {
+      return Object.keys(instances).length > 0;
+    },
+    getActiveInstanceId: () => {
+      return activeInstanceId;
+    },
+  };
+};
diff --git a/apps/vscode-wing/src/console/explorer-providers/ResourcesExplorerProvider.ts b/apps/vscode-wing/src/console/explorer-providers/ResourcesExplorerProvider.ts
new file mode 100644
index 00000000000..53feaaf76f2
--- /dev/null
+++ b/apps/vscode-wing/src/console/explorer-providers/ResourcesExplorerProvider.ts
@@ -0,0 +1,236 @@
+import path from "path";
+import type { ExplorerItem } from "@wingconsole/server";
+import {
+  TreeItemCollapsibleState,
+  TreeItem,
+  TreeDataProvider,
+  Event,
+  EventEmitter,
+  ProviderResult,
+} from "vscode";
+
+export class ResourcesExplorerProvider
+  implements TreeDataProvider<ResourceItem>
+{
+  private node?: ExplorerItem;
+
+  private _onDidChangeTreeData: EventEmitter<
+    ResourceItem | undefined | null | void
+  > = new EventEmitter<ResourceItem | undefined | null | void>();
+
+  readonly onDidChangeTreeData: Event<ResourceItem | undefined | null | void> =
+    this._onDidChangeTreeData.event;
+
+  constructor(node?: ExplorerItem) {
+    this.node = node;
+  }
+
+  public refresh(): void {
+    this._onDidChangeTreeData.fire();
+  }
+
+  public update(item?: ExplorerItem): void {
+    this.node = item;
+    this.refresh();
+  }
+
+  public clear(): void {
+    this.update();
+  }
+
+  public getTreeItem(element: ResourceItem): TreeItem {
+    return {
+      ...element,
+      command: {
+        command: "wingConsole.openResource",
+        arguments: [element.id],
+        title: "Select Resource",
+      },
+    };
+  }
+
+  private getResource(id: string): ExplorerItem | undefined {
+    if (!this.node) {
+      return undefined;
+    }
+    const searchChild = (node: ExplorerItem): ExplorerItem | undefined => {
+      if (node.id === id) {
+        return node;
+      }
+
+      if (!node.childItems) {
+        return;
+      }
+      for (const child of node.childItems) {
+        const resource = searchChild(child);
+        if (resource) {
+          return resource;
+        }
+      }
+
+      return;
+    };
+
+    return searchChild(this.node);
+  }
+
+  private getParentResource(id: string): ExplorerItem | undefined {
+    if (!this.node) {
+      return;
+    }
+
+    const searchParent = (node: ExplorerItem): ExplorerItem | undefined => {
+      if (!node.childItems) {
+        return;
+      }
+      for (const child of node.childItems) {
+        if (child.id === id) {
+          return node;
+        }
+        const resource = searchParent(child);
+        if (resource) {
+          return resource;
+        }
+      }
+      return;
+    };
+
+    return searchParent(this.node);
+  }
+
+  public getParent(element: ResourceItem): ProviderResult<ResourceItem> {
+    if (!this.node || !element.id) {
+      return null;
+    }
+
+    const parentItem = this.getParentResource(element.id);
+
+    if (!parentItem) {
+      return;
+    }
+
+    return new ResourceItem(
+      parentItem.id,
+      parentItem.label,
+      parentItem.type,
+      TreeItemCollapsibleState.Expanded
+    );
+  }
+
+  public getChildren(element?: ResourceItem): Thenable<ResourceItem[]> {
+    if (!this.node) {
+      return Promise.resolve([]);
+    }
+    if (!element || !element.id) {
+      return Promise.resolve([
+        new ResourceItem(
+          this.node.id,
+          this.node.label,
+          this.node.type,
+          TreeItemCollapsibleState.Expanded
+        ),
+      ]);
+    }
+
+    const childItem = this.getResource(element.id);
+
+    if (!childItem?.childItems) {
+      return Promise.resolve([]);
+    }
+
+    return Promise.resolve(
+      childItem.childItems.map((child: ExplorerItem) => {
+        return new ResourceItem(
+          child.id,
+          child.label,
+          child.type || "",
+          child.childItems?.length && child.childItems.length > 0
+            ? TreeItemCollapsibleState.Expanded
+            : TreeItemCollapsibleState.None
+        );
+      })
+    );
+  }
+}
+
+export class ResourceItem extends TreeItem {
+  constructor(
+    id: string,
+    label?: string,
+    type?: string,
+    state?: TreeItemCollapsibleState
+  ) {
+    super(label || "", state);
+
+    this.id = id;
+    this.tooltip = label;
+
+    this.iconPath = {
+      light: path.join(
+        __filename,
+        "../../resources/resource-icons/light",
+        `${this.getResourceIconName(type, id)}.svg`
+      ),
+      dark: path.join(
+        __filename,
+        "../../resources/resource-icons/dark",
+        `${this.getResourceIconName(type, id)}.svg`
+      ),
+    };
+  }
+
+  private matchTest = (resourceId: string) => {
+    const isTest = /(\/test$|\/test:([^/\\])+$)/;
+    const isTestHandler = /(\/test$|\/test:.*\/Handler$)/;
+
+    return isTest.test(resourceId) || isTestHandler.test(resourceId);
+  };
+
+  private getResourceIconName = (
+    resourceType: string | undefined,
+    resourceId?: string
+  ) => {
+    if (resourceId && this.matchTest(resourceId)) {
+      return "beaker";
+    }
+    switch (resourceType) {
+      case "wingsdk.cloud.Bucket": {
+        return "archive-box";
+      }
+      case "wingsdk.cloud.Function": {
+        return "bolt";
+      }
+      case "wingsdk.cloud.Queue": {
+        return "queue-list";
+      }
+      case "wingsdk.cloud.Website":
+      case "wingsdk.cloud.Endpoint": {
+        return "globe-alt";
+      }
+      case "wingsdk.cloud.Counter": {
+        return "calculator";
+      }
+      case "wingsdk.cloud.Topic": {
+        return "megaphone";
+      }
+      case "wingsdk.cloud.Api": {
+        return "cloud";
+      }
+      case "wingsdk.cloud.Table": {
+        return "table-cells";
+      }
+      case "wingsdk.cloud.Schedule": {
+        return "clock";
+      }
+      case "wingsdk.redis.Redis": {
+        return "redis";
+      }
+      case "wingsdk.cloud.Test": {
+        return "beaker";
+      }
+      default: {
+        return "cube";
+      }
+    }
+  };
+}
diff --git a/apps/vscode-wing/src/console/explorer-providers/TestsExplorerProvider.ts b/apps/vscode-wing/src/console/explorer-providers/TestsExplorerProvider.ts
new file mode 100644
index 00000000000..7e1a8eeacd0
--- /dev/null
+++ b/apps/vscode-wing/src/console/explorer-providers/TestsExplorerProvider.ts
@@ -0,0 +1,83 @@
+import {
+  TreeDataProvider,
+  TreeItem,
+  TreeItemCollapsibleState,
+  Event,
+  EventEmitter,
+  ThemeIcon,
+} from "vscode";
+
+export type TestStatus = "success" | "error" | "running" | "pending";
+
+export class TestsExplorerProvider implements TreeDataProvider<TestItem> {
+  private tests: TestItem[] = [];
+
+  private _onDidChangeTreeData: EventEmitter<
+    TestItem | undefined | null | void
+  > = new EventEmitter<TestItem | undefined | null | void>();
+
+  readonly onDidChangeTreeData: Event<TestItem | undefined | null | void> =
+    this._onDidChangeTreeData.event;
+
+  constructor(tests?: TestItem[]) {
+    this.tests = tests || [];
+  }
+
+  public refresh(): void {
+    this._onDidChangeTreeData.fire();
+  }
+
+  public update(tests: TestItem[]): void {
+    this.tests = tests;
+    this.refresh();
+  }
+
+  public clear(): void {
+    this.update([]);
+  }
+
+  public getTests(): TestItem[] {
+    return this.tests;
+  }
+
+  public getTreeItem(element: TestItem): TreeItem {
+    return element;
+  }
+
+  public getChildren(element?: TestItem): Thenable<TestItem[]> {
+    if (!element) {
+      return Promise.resolve(
+        this.tests.map((test) => {
+          return new TestItem(test.id, test.label, test.time, test.status);
+        })
+      );
+    }
+    return Promise.resolve([]);
+  }
+}
+
+export class TestItem extends TreeItem {
+  constructor(
+    public readonly id: string,
+    public readonly label?: string,
+    public readonly time?: number,
+    public readonly status?: TestStatus
+  ) {
+    super(label || "", TreeItemCollapsibleState.None);
+    this.tooltip = this.label;
+    this.id = id;
+
+    this.description =
+      time && status !== "pending" ? `${status} (${time}ms)` : "";
+
+    let iconName = "issues";
+    if (status === "success") {
+      iconName = "check";
+    } else if (status === "error") {
+      iconName = "error";
+    } else if (status === "running") {
+      iconName = "sync~spin";
+    }
+    this.iconPath = new ThemeIcon(iconName);
+  }
+}
diff --git a/apps/vscode-wing/src/console/index.ts b/apps/vscode-wing/src/console/index.ts
new file mode 100644
index 00000000000..96ba59aa6c6
--- /dev/null
+++ b/apps/vscode-wing/src/console/index.ts
@@ -0,0 +1,117 @@
+import { spawn } from "child_process";
+import path from "path";
+import fetch from "node-fetch";
+
+const globalAny = global as any;
+globalAny.fetch = fetch;
+globalAny.WebSocket = ws;
+
+import { ExtensionContext, window, workspace, OutputChannel } from "vscode";
+import ws from "ws";
+import { type ConsoleManager, createConsoleManager } from "./console-manager";
+import { createClient } from "./services/client";
+import { getWingBinAndArgs } from "../bin-helper";
+
+export class WingConsoleManager {
+  consoleManager: ConsoleManager;
+
+  logger: OutputChannel = window.createOutputChannel("Wing Console");
+
+  constructor(public readonly context: ExtensionContext) {
+    this.consoleManager = createConsoleManager(this.context, this.logger);
+
+    window.onDidChangeActiveTextEditor(async (editor) => {
+      const instanceId = editor?.document.uri.fsPath;
+      if (
+        this.consoleManager.activeInstances() &&
+        this.consoleManager.getActiveInstanceId() !== instanceId
+      ) {
+        await this.openConsole();
+      }
+    });
+
+    window.onDidChangeActiveColorTheme(async () => {
+      const activeInstanceId = this.consoleManager.getActiveInstanceId();
+      if (activeInstanceId) {
+        await this.consoleManager.setActiveInstance(activeInstanceId);
+      }
+    });
+
+    workspace.onDidCloseTextDocument(async (textDocument) => {
+      if (textDocument.languageId !== "wing") {
+        return;
+      }
+      const instance = this.consoleManager.getInstance(textDocument.uri.fsPath);
+      if (instance) {
+        this.consoleManager.closeInstance(instance.id);
+      }
+    });
+  }
+
+  public async openConsole() {
+    // get the current active file
+    const editor = window.activeTextEditor;
+    if (!editor) {
+      return;
+    }
+    const document = editor.document;
+    if (document.languageId !== "wing") {
+      return;
+    }
+    const wingfilePath = document.uri.fsPath;
+    const wingfile = path.basename(wingfilePath);
+
+    if (this.consoleManager.getInstance(wingfilePath)) {
+      await this.consoleManager.setActiveInstance(wingfilePath);
+      return;
+    }
+
+    // TODO: Use createConsoleApp from "bin-helper" instead of spawn to open the console after fixing after fixing https://github.com/winglang/wing/issues/3678
+    const args = await getWingBinAndArgs(this.context);
+    if (!args) {
+      return;
+    }
+
+    args.push("it", "--no-open", wingfilePath);
+
+    const cp = spawn(args[0]!, args.slice(1), {
+      stdio: ["ignore", "pipe", "pipe"],
+      windowsHide: true,
+      shell: false,
+    });
+
+    cp.on("error", async (err) => {
+      if (err) {
+        this.consoleManager.closeInstance(wingfilePath);
+      }
+    });
+    cp.stdout?.once("data", async (data) => {
+      // get localhost url from stdout
+      const urlMatch = data.toString().match(/localhost:\d+/);
+      if (!urlMatch) {
+        // there should be an error message in a different event
+        return;
+      }
+      const url = urlMatch[0];
+
+      await this.consoleManager.addInstance({
+        id: wingfilePath,
+        wingfile,
+        url,
+        client: createClient(url),
+        onDidClose: () => {
+          cp.kill();
+        },
+      });
+    });
+  }
+
+  public async openFile() {
+    const activePanelId = this.consoleManager?.getActiveInstanceId();
+    if (activePanelId) {
+      const document = await workspace.openTextDocument(activePanelId);
+
+      await window.showTextDocument(document);
+    }
+  }
+}
diff --git a/apps/vscode-wing/src/console/services/client.ts b/apps/vscode-wing/src/console/services/client.ts
new file mode 100644
index 00000000000..8a14520cbd0
--- /dev/null
+++ b/apps/vscode-wing/src/console/services/client.ts
@@ -0,0 +1,117 @@
+import {
+  createTRPCProxyClient,
+  httpLink,
+  createWSClient,
+  splitLink,
+  wsLink,
+} from "@trpc/client";
+
+import type { ExplorerItem, Router, LogEntry } from "@wingconsole/server";
+
+import { TestItem } from "../explorer-providers/TestsExplorerProvider";
+
+export interface SubscriptionOptions {
+  onData: (data: any) => void;
+  onError: (error: any) => void;
+}
+
+export interface Client {
+  url: string;
+  getLogs: ({ time }: { time?: number }) => Promise<LogEntry[]>;
+  selectedNode: () => Promise<string | undefined>;
+  setSelectedNode: (resourcePath: string) => Promise<void>;
+  listTests: () => Promise<TestItem[]>;
+  runTest: (resourcePath: string) => Promise<any>;
+  runAllTests: () => Promise<any>;
+  listResources: () => Promise<ExplorerItem>;
+  onInvalidateQuery: (options: SubscriptionOptions) => void;
+  close: () => void;
+}
+
+export const createClient = (host: string): Client => {
+  const url = `${host}/trpc`;
+
+  const wsClient = createWSClient({
+    url: `ws://${url}`,
+  });
+
+  const client = createTRPCProxyClient<Router>({
+    links: [
+      splitLink({
+        condition(op) {
+          return op.type === "subscription";
+        },
+        true: wsLink({
+          client: wsClient,
+        }),
+        false: httpLink({
+          url: `http://${url}`,
+        }),
+      }),
+    ],
+  });
+
+  const getLogs = ({ time }: { time?: number }) => {
+    return client["app.logs"].query({
+      filters: {
+        level: {
+          verbose: true,
+          info: true,
+          warn: true,
+          error: true,
+        },
+        text: "",
+        timestamp: time || 0,
+      },
+    });
+  };
+
+  const selectedNode = () => {
+    return client["app.selectedNode"].query();
+  };
+
+  const setSelectedNode = (resourcePath: string) => {
+    return client["app.selectNode"].mutate({
+      resourcePath,
+    });
+  };
+
+  const listTests = (): Promise<TestItem[]> => {
+    return client["test.list"].query();
+  };
+
+  const runTest = (resourcePath: string) => {
+    return client["test.run"].mutate({
+      resourcePath,
+    });
+  };
+
+  const runAllTests = () => {
+    return client["test.runAll"].mutate();
+  };
+
+  const listResources = () => {
+    return client["app.explorerTree"].query();
+  };
+
+  const onInvalidateQuery = (options: SubscriptionOptions) => {
+    return client["app.invalidateQuery"].subscribe(undefined, options);
+  };
+
+  const close = () => {
+    wsClient.close();
+  };
+
+  return {
+    url,
+    getLogs,
+    selectedNode,
+    setSelectedNode,
+    listTests,
+    runTest,
+    runAllTests,
+    listResources,
+    onInvalidateQuery,
+    close,
+  };
+};
diff --git a/apps/vscode-wing/tsconfig.dev.json b/apps/vscode-wing/tsconfig.dev.json
index 004fedb2c09..2436312dbdf 100644
--- a/apps/vscode-wing/tsconfig.dev.json
+++ b/apps/vscode-wing/tsconfig.dev.json
@@ -8,7 +8,7 @@
     "inlineSourceMap": true,
     "inlineSources": true,
     "lib": [
-      "es2019"
+      "es2021"
     ],
     "module": "CommonJS",
     "noEmitOnError": false,
diff --git a/apps/vscode-wing/tsconfig.json b/apps/vscode-wing/tsconfig.json
index d1a0e703b40..27a7c947243 100644
--- a/apps/vscode-wing/tsconfig.json
+++ b/apps/vscode-wing/tsconfig.json
@@ -10,7 +10,7 @@
     "inlineSourceMap": true,
     "inlineSources": true,
     "lib": [
-      "es2019"
+      "es2021"
     ],
     "module": "CommonJS",
     "noEmitOnError": false,
diff --git a/apps/vscode-wing/tsup.config.ts b/apps/vscode-wing/tsup.config.ts
new file mode 100644
index 00000000000..14ef2c8e9c5
--- /dev/null
+++ b/apps/vscode-wing/tsup.config.ts
@@ -0,0 +1,9 @@
+import { defineConfig } from "tsup";
+
+export default defineConfig({
+  entry: ["src/extension.ts"],
+  outDir: "lib",
+  external: ["vscode"],
+  format: ["cjs"],
+  clean: true,
+});
diff --git a/apps/wing-console/console/app/src/index.ts b/apps/wing-console/console/app/src/index.ts
index d8e96876990..43f5fd11a87 100644
--- a/apps/wing-console/console/app/src/index.ts
+++ b/apps/wing-console/console/app/src/index.ts
@@ -7,6 +7,7 @@ import {
   HostUtils,
   Trace,
   isTermsAccepted,
+  LayoutConfig,
 } from "@wingconsole/server";
 import express from "express";
 
@@ -34,6 +35,7 @@ export interface CreateConsoleAppOptions {
   onTrace?: (trace: Trace) => void;
   onExpressCreated?: CreateConsoleServerOptions["onExpressCreated"];
   requireAcceptTerms?: boolean;
+  layoutConfig?: LayoutConfig;
 }
 
 const staticDir = `${__dirname}/vite`;
diff --git a/apps/wing-console/console/server/src/expressServer.ts b/apps/wing-console/console/server/src/expressServer.ts
index 1d202753b23..ce6d5731601 100644
--- a/apps/wing-console/console/server/src/expressServer.ts
+++ b/apps/wing-console/console/server/src/expressServer.ts
@@ -13,7 +13,11 @@ import type { HostUtils } from "./hostUtils.js";
 import { mergeAllRouters } from "./router/index.js";
 import type { State, Trace } from "./types.js";
 import type { Updater } from "./updater.js";
-import type { RouterContext } from "./utils/createRouter.js";
+import type {
+  LayoutConfig,
+  RouterContext,
+  TestsStateManager,
+} from "./utils/createRouter.js";
 import { getWingVersion } from "./utils/getWingVersion.js";
 import type { LogInterface } from "./utils/LogInterface.js";
 
@@ -34,6 +38,10 @@ export interface CreateExpressServerOptions {
   onExpressCreated?: (app: express.Express) => void;
   wingfile: string;
   requireAcceptTerms?: boolean;
+  layoutConfig?: LayoutConfig;
+  getSelectedNode: () => string | undefined;
+  setSelectedNode: (node: string) => void;
+  testsStateManager: () => TestsStateManager;
 }
 
 export const createExpressServer = async ({
@@ -50,6 +58,10 @@ export const createExpressServer = async ({
   onExpressCreated,
   wingfile,
   requireAcceptTerms = false,
+  layoutConfig,
+  getSelectedNode,
+  setSelectedNode,
+  testsStateManager,
 }: CreateExpressServerOptions) => {
   const app = express();
   app.use(cors());
@@ -76,6 +88,10 @@ export const createExpressServer = async ({
       hostUtils,
       wingfile: wingfile ?? "",
       requireAcceptTerms,
+      layoutConfig,
+      getSelectedNode,
+      setSelectedNode,
+      testsStateManager,
     };
   };
   app.use(
diff --git a/apps/wing-console/console/server/src/index.ts b/apps/wing-console/console/server/src/index.ts
index 643c16f2a36..50a27a3ad73 100644
--- a/apps/wing-console/console/server/src/index.ts
+++ b/apps/wing-console/console/server/src/index.ts
@@ -11,9 +11,19 @@ import type { Trace } from "./types.js";
 import type { State } from "./types.js";
 import type { Updater } from "./updater.js";
 import { createCompiler } from "./utils/compiler.js";
+import {
+  LayoutConfig,
+  TestItem,
+  TestsStateManager,
+} from "./utils/createRouter.js";
 import type { LogInterface } from "./utils/LogInterface.js";
 import { createSimulator } from "./utils/simulator.js";
 
+export type {
+  TestsStateManager,
+  TestStatus,
+  TestItem,
+} from "./utils/createRouter.js";
 export type { Trace, State } from "./types.js";
 export type { LogInterface } from "./utils/LogInterface.js";
 export type { LogEntry, LogLevel } from "./consoleLogger.js";
@@ -28,6 +38,11 @@ export type { MapNode, MapEdge } from "./router/app.js";
 export type { InternalTestResult } from "./router/test.js";
 export type { Column } from "./router/table.js";
 export type { NodeDisplay } from "./utils/constructTreeNodeMap.js";
+export type {
+  LayoutConfig,
+  LayoutComponent,
+  LayoutComponentType,
+} from "./utils/createRouter.js";
 
 export type RouteNames = keyof inferRouterInputs<Router> | undefined;
 
@@ -43,6 +58,7 @@ export interface CreateConsoleServerOptions {
   onTrace?: (trace: Trace) => void;
   onExpressCreated?: (app: ExpressApplication) => void;
   requireAcceptTerms?: boolean;
+  layoutConfig?: LayoutConfig;
 }
 
 export const createConsoleServer = async ({
@@ -55,6 +71,7 @@ export const createConsoleServer = async ({
   onTrace,
   onExpressCreated,
   requireAcceptTerms,
+  layoutConfig,
 }: CreateConsoleServerOptions) => {
   const emitter = new Emittery<{
     invalidateQuery: RouteNames;
@@ -92,6 +109,28 @@ export const createConsoleServer = async ({
   });
 
   let lastErrorMessage = "";
+  let selectedNode = "";
+  let tests: TestItem[] = [];
+
+  const testsStateManager = (): TestsStateManager => {
+    return {
+      getTests: () => {
+        return tests;
+      },
+      setTests: (newTests: TestItem[]) => {
+        tests = newTests;
+      },
+      setTest: (test: TestItem) => {
+        const index = tests.findIndex((t) => t.id === test.id);
+        if (index === -1) {
+          tests.push(test);
+        } else {
+          tests[index] = test;
+        }
+      },
+    };
+  };
+
   let appState: State = "compiling";
   compiler.on("compiling", () => {
     lastErrorMessage = "";
@@ -180,6 +219,14 @@ export const createConsoleServer = async ({
     onExpressCreated,
     wingfile,
     requireAcceptTerms,
+    layoutConfig,
+    getSelectedNode: () => {
+      return selectedNode;
+    },
+    setSelectedNode: (node: string) => {
+      selectedNode = node;
+    },
+    testsStateManager,
   });
 
   const close = async () => {
diff --git a/apps/wing-console/console/server/src/router/app.ts b/apps/wing-console/console/server/src/router/app.ts
index d0d26894a00..94413b1811a 100644
--- a/apps/wing-console/console/server/src/router/app.ts
+++ b/apps/wing-console/console/server/src/router/app.ts
@@ -62,6 +62,11 @@ export const createAppRouter = () => {
     "app.acceptTerms": createProcedure.mutation(() => {
       acceptTerms(true);
     }),
+    "app.layoutConfig": createProcedure.query(async ({ ctx }) => {
+      return {
+        config: ctx.layoutConfig,
+      };
+    }),
     "app.logs": createProcedure
       .input(
         z.object({
@@ -109,6 +114,18 @@ export const createAppRouter = () => {
           input?.showTests,
         );
       }),
+    "app.selectNode": createProcedure
+      .input(
+        z.object({
+          resourcePath: z.string().optional(),
+        }),
+      )
+      .mutation(async ({ ctx, input }) => {
+        ctx.setSelectedNode(input.resourcePath ?? "");
+      }),
+    "app.selectedNode": createProcedure.query(async ({ ctx }) => {
+      return ctx.getSelectedNode();
+    }),
     "app.childRelationships": createProcedure
       .input(
         z.object({
diff --git a/apps/wing-console/console/server/src/router/index.ts b/apps/wing-console/console/server/src/router/index.ts
index 3d7ef525671..6076172ce3b 100644
--- a/apps/wing-console/console/server/src/router/index.ts
+++ b/apps/wing-console/console/server/src/router/index.ts
@@ -1,4 +1,4 @@
-import { mergeRouters } from "../utils/createRouter.js";
+import { mergeRouters, middleware } from "../utils/createRouter.js";
 
 import { createApiRouter } from "./api.js";
 import { createAppRouter } from "./app.js";
diff --git a/apps/wing-console/console/server/src/router/test.ts b/apps/wing-console/console/server/src/router/test.ts
index 739f543208e..0c3d90f8b17 100644
--- a/apps/wing-console/console/server/src/router/test.ts
+++ b/apps/wing-console/console/server/src/router/test.ts
@@ -81,7 +81,20 @@ export const createTestRouter = () => {
   return createRouter({
     "test.list": createProcedure.query(async ({ input, ctx }) => {
       const simulator = await ctx.simulator();
-      return listTests(simulator);
+      const list = await listTests(simulator);
+
+      const testsState = ctx.testsStateManager();
+      const tests = testsState.getTests();
+
+      return list.map((resourcePath) => {
+        const test = tests.find((t) => t.id === resourcePath);
+        return {
+          id: resourcePath,
+          label: getTestName(resourcePath),
+          status: test?.status ?? "pending",
+          time: test?.time ?? 0,
+        };
+      });
     }),
     "test.run": createProcedure
       .input(
@@ -90,18 +103,37 @@ export const createTestRouter = () => {
         }),
       )
       .mutation(async ({ input, ctx }) => {
-        return await runTest(
+        const response = await runTest(
           await ctx.simulator(),
           input.resourcePath,
           ctx.logger,
         );
+
+        const testsState = ctx.testsStateManager();
+        testsState.setTest({
+          id: input.resourcePath,
+          label: getTestName(input.resourcePath),
+          status: response.error ? "error" : "success",
+          time: response.time,
+        });
+
+        return response;
       }),
     "test.runAll": createProcedure.mutation(async ({ ctx }) => {
       const simulator = await ctx.simulator();
+      const testsState = ctx.testsStateManager();
+
       const testList = await listTests(simulator);
       const result: InternalTestResult[] = [];
       for (const resourcePath of testList) {
-        result.push(await runTest(simulator, resourcePath, ctx.logger));
+        const response = await runTest(simulator, resourcePath, ctx.logger);
+        result.push(response);
+        testsState.setTest({
+          id: resourcePath,
+          label: getTestName(resourcePath),
+          status: response.error ? "error" : "success",
+          time: response.time,
+        });
       }
 
       const testPassed = result.filter((r) => r.error === undefined);
diff --git a/apps/wing-console/console/server/src/utils/createRouter.ts b/apps/wing-console/console/server/src/utils/createRouter.ts
index 54870d7f138..10d4b94862b 100644
--- a/apps/wing-console/console/server/src/utils/createRouter.ts
+++ b/apps/wing-console/console/server/src/utils/createRouter.ts
@@ -24,6 +24,51 @@ export type RouterEvents = {
   invalidateQuery: QueryNames;
 };
 
+export type LayoutComponentType = "explorer" | "tests" | "logs";
+
+export interface LayoutComponent {
+  type: LayoutComponentType;
+}
+
+export interface LayoutPanel {
+  hide?: boolean;
+  components?: LayoutComponent[];
+  size?: "small" | "default";
+}
+
+export interface LayoutConfig {
+  header?: {
+    hide?: boolean;
+    showThemeToggle?: boolean;
+  };
+  leftPanel?: LayoutPanel;
+  bottomPanel?: LayoutPanel;
+  statusBar?: {
+    hide?: boolean;
+    showThemeToggle?: boolean;
+  };
+  errorScreen?: {
+    position?: "default" | "bottom";
+    displayTitle?: boolean;
+    displayLinks?: boolean;
+  };
+}
+
+export type TestStatus = "pending" | "running" | "success" | "error";
+
+export interface TestItem {
+  id: string;
+  label: string;
+  status: TestStatus;
+  time?: number;
+}
+
+export interface TestsStateManager {
+  getTests: () => TestItem[];
+  setTests: (tests: TestItem[]) => void;
+  setTest: (test: TestItem) => void;
+}
+
 export interface RouterContext {
   simulator(): Promise<testing.Simulator>;
   appDetails(): Promise<{
@@ -41,9 +86,27 @@ export interface RouterContext {
   hostUtils?: HostUtils;
   wingfile: string;
   requireAcceptTerms?: boolean;
+  layoutConfig?: LayoutConfig;
+  getSelectedNode: () => string | undefined;
+  setSelectedNode: (node: string) => void;
+  testsStateManager: () => TestsStateManager;
 }
 
 const t = initTRPC.context<RouterContext>().create();
 export const createRouter = t.router;
 export const mergeRouters = t.mergeRouters;
-export const createProcedure = t.procedure;
+export const middleware = t.middleware;
+
+const invalidateQueriesAfterMutation = middleware(async (options) => {
+  const result = await options.next();
+
+  if (options.type === "mutation") {
+    options.ctx.emitter.emit("invalidateQuery", undefined);
+  }
+
+  return result;
+});
+
+export const createProcedure = t.procedure.use(
+  invalidateQueriesAfterMutation,
+) as typeof t.procedure;
diff --git a/apps/wing-console/console/ui/package.json b/apps/wing-console/console/ui/package.json
index a30019dcdf6..aca9e5a3c0a 100644
--- a/apps/wing-console/console/ui/package.json
+++ b/apps/wing-console/console/ui/package.json
@@ -71,9 +71,9 @@
     "@vitejs/plugin-react-swc": "^3.3.2",
     "@wingconsole/design-system": "workspace:^",
     "@wingconsole/eslint-plugin": "workspace:^",
-    "@wingconsole/server": "workspace:^",
     "@wingconsole/tsconfig": "workspace:^",
     "@wingconsole/use-loading": "workspace:^",
+    "@wingconsole/server": "workspace:^",
     "autoprefixer": "^10.4.14",
     "bump-pack": "workspace:^",
     "eslint": "^8.42.0",
diff --git a/apps/wing-console/console/ui/src/App.tsx b/apps/wing-console/console/ui/src/App.tsx
index 4962a02a858..5f85720cd72 100644
--- a/apps/wing-console/console/ui/src/App.tsx
+++ b/apps/wing-console/console/ui/src/App.tsx
@@ -37,6 +37,7 @@ export const App = ({ layout, theme, onTrace }: AppProps) => {
     },
   });
 
+  const layoutConfig = trpc["app.layoutConfig"].useQuery();
   const appDetails = trpc["app.details"].useQuery();
   const appState = trpc["app.state"].useQuery();
   const themeMode = trpc["config.getThemeMode"].useQuery();
@@ -50,6 +51,7 @@ export const App = ({ layout, theme, onTrace }: AppProps) => {
             layoutProps={{
               cloudAppState: appState.data ?? "compiling",
               wingVersion: appDetails.data?.wingVersion,
+              layoutConfig: layoutConfig.data?.config,
             }}
           ></LayoutProvider>
         </TestsContextProvider>
diff --git a/apps/wing-console/console/ui/src/Console.tsx b/apps/wing-console/console/ui/src/Console.tsx
index 460a7e5a8e3..8336ffc8a10 100644
--- a/apps/wing-console/console/ui/src/Console.tsx
+++ b/apps/wing-console/console/ui/src/Console.tsx
@@ -11,7 +11,7 @@ import { trpc } from "./services/trpc.js";
 export const Console = ({
   trpcUrl,
   wsUrl,
-  layout = LayoutType.Vscode,
+  layout = LayoutType.Default,
   title,
   theme,
   onTrace,
@@ -56,7 +56,7 @@ export const Console = ({
 
   let windowTitle = title ?? "Wing Console";
 
-  const appMode = layout === LayoutType.Vscode ? "local" : "remote";
+  const appMode = layout === LayoutType.Default ? "local" : "remote";
   return (
     <AppContext.Provider value={{ appMode, title: windowTitle }}>
       <trpc.Provider client={trpcClient} queryClient={queryClient}>
diff --git a/apps/wing-console/console/ui/src/layout/default-layout.tsx b/apps/wing-console/console/ui/src/layout/default-layout.tsx
new file mode 100644
index 00000000000..7357a5ef379
--- /dev/null
+++ b/apps/wing-console/console/ui/src/layout/default-layout.tsx
@@ -0,0 +1,402 @@
+import {
+  SpinnerLoader,
+  LeftResizableWidget,
+  RightResizableWidget,
+  ScrollableArea,
+  TopResizableWidget,
+} from "@wingconsole/design-system";
+import type { State, LayoutConfig, LayoutComponent } from "@wingconsole/server";
+import classNames from "classnames";
+import { useCallback, useEffect, useMemo } from "react";
+
+import { ConsoleLogsFilters } from "../features/console-logs-filters.js";
+import { ConsoleLogs } from "../features/console-logs.js";
+import { MapView } from "../features/map-view.js";
+import { TestsTreeView } from "../features/tests-tree-view.js";
+import { BlueScreenOfDeath } from "../ui/blue-screen-of-death.js";
+import { Explorer } from "../ui/explorer.js";
+import { ResourceMetadata } from "../ui/resource-metadata.js";
+
+import { Header } from "./header.js";
+import { StatusBar } from "./status-bar.js";
+import { TermsAndConditionsModal } from "./terms-and-conditions-modal.js";
+import { useLayout } from "./use-layout.js";
+
+export interface LayoutProps {
+  cloudAppState: State;
+  wingVersion: string | undefined;
+  layoutConfig?: LayoutConfig;
+}
+
+const defaultLayoutConfig: LayoutConfig = {
+  header: {
+    hide: false,
+    showThemeToggle: true,
+  },
+  leftPanel: {
+    components: [
+      {
+        type: "explorer",
+      },
+      {
+        type: "tests",
+      },
+    ],
+  },
+  bottomPanel: {
+    components: [
+      {
+        type: "logs",
+      },
+    ],
+  },
+  statusBar: {
+    hide: false,
+    showThemeToggle: false,
+  },
+  errorScreen: {
+    position: "default",
+    displayTitle: true,
+    displayLinks: true,
+  },
+};
+
+export const DefaultLayout = ({
+  cloudAppState,
+  wingVersion,
+  layoutConfig,
+}: LayoutProps) => {
+  const {
+    items,
+    selectedItems,
+    setSelectedItems,
+    expandedItems,
+    setExpandedItems,
+    expand,
+    expandAll,
+    collapseAll,
+    theme,
+    errorMessage,
+    loading,
+    metadata,
+    setSearchText,
+    selectedLogTypeFilters,
+    setSelectedLogTypeFilters,
+    setLogsTimeFilter,
+    showTests,
+    logsRef,
+    logs,
+    onResourceClick,
+    title,
+    wingfile,
+    termsConfig,
+    acceptTerms,
+  } = useLayout({
+    cloudAppState,
+    defaultLogLevels: ["info", "warn", "error"],
+  });
+
+  useEffect(() => {
+    document.title = title;
+  }, [title]);
+
+  const showTerms = useMemo(() => {
+    if (!termsConfig.data) {
+      return false;
+    }
+    return termsConfig.data.requireAcceptTerms && !termsConfig.data.accepted;
+  }, [termsConfig.data]);
+
+  const layout = useMemo(() => {
+    return {
+      ...defaultLayoutConfig,
+      ...layoutConfig,
+    };
+  }, [layoutConfig]);
+
+  const renderApp = useMemo(() => {
+    return !(
+      layout.errorScreen?.position === "default" && cloudAppState === "error"
+    );
+  }, [layout.errorScreen?.position, cloudAppState]);
+
+  const renderLayoutComponent = useCallback(
+    (component: LayoutComponent) => {
+      switch (component.type) {
+        case "explorer": {
+          return (
+            <div key={component.type} className="flex grow">
+              <Explorer
+                loading={loading}
+                items={items}
+                selectedItems={selectedItems}
+                onSelectedItemsChange={setSelectedItems}
+                expandedItems={expandedItems}
+                onExpandedItemsChange={setExpandedItems}
+                onExpandAll={expandAll}
+                onCollapseAll={collapseAll}
+                data-testid="explorer-tree-menu"
+              />
+            </div>
+          );
+        }
+        case "tests": {
+          return <TestsTreeView key={component.type} />;
+        }
+        case "logs": {
+          return (
+            <div
+              key={component.type}
+              className={classNames("flex-1 flex flex-col min-w-[10rem]")}
+            >
+              <div className="relative h-full flex flex-col gap-2">
+                {loading && (
+                  <div
+                    className={classNames(
+                      "absolute h-full w-full z-50 bg-white/70 dark:bg-slate-600/70",
+                      theme.text2,
+                    )}
+                  />
+                )}
+                <ConsoleLogsFilters
+                  selectedLogTypeFilters={selectedLogTypeFilters}
+                  setSelectedLogTypeFilters={setSelectedLogTypeFilters}
+                  clearLogs={() => setLogsTimeFilter(Date.now())}
+                  isLoading={loading}
+                  onSearch={setSearchText}
+                />
+                <div className="relative h-full">
+                  <ScrollableArea
+                    ref={logsRef}
+                    overflowY
+                    className={classNames("pb-1.5", theme.bg3, theme.text2)}
+                  >
+                    <ConsoleLogs
+                      logs={logs.data ?? []}
+                      onResourceClick={onResourceClick}
+                    />
+                  </ScrollableArea>
+                </div>
+              </div>
+            </div>
+          );
+        }
+      }
+    },
+    [
+      loading,
+      items,
+      selectedItems,
+      expandedItems,
+      logs.data,
+      theme,
+      logsRef,
+      onResourceClick,
+      selectedLogTypeFilters,
+      setSelectedLogTypeFilters,
+      setLogsTimeFilter,
+      setSearchText,
+      expandAll,
+      collapseAll,
+      setSelectedItems,
+      setExpandedItems,
+    ],
+  );
+
+  return (
+    <>
+      {showTerms && (
+        <TermsAndConditionsModal
+          visible={true}
+          onAccept={() => acceptTerms()}
+          license={termsConfig.data?.license ?? ""}
+        />
+      )}
+      <div
+        data-testid="default-layout"
+        className={classNames(
+          "h-full flex flex-col select-none",
+          theme.bg3,
+          theme.text2,
+          showTerms && "blur-sm",
+        )}
+      >
+        {!layout.header?.hide && (
+          <Header
+            title={wingfile.data ?? ""}
+            showThemeToggle={layout.header?.showThemeToggle}
+          />
+        )}
+
+        {cloudAppState === "error" &&
+          layout.errorScreen?.position === "default" && (
+            <div className="flex-1 flex relative">
+              <BlueScreenOfDeath
+                title={"An error has occurred:"}
+                error={errorMessage.data ?? ""}
+                displayLinks={layout.errorScreen?.displayLinks}
+                displayWingTitle={layout.errorScreen?.displayTitle}
+              />
+            </div>
+          )}
+
+        {renderApp && (
+          <>
+            <div className="flex-1 flex relative">
+              {loading && (
+                <div
+                  className={classNames(
+                    "absolute h-full w-full z-50 bg-white/70 dark:bg-slate-600/70",
+                  )}
+                  data-testid="loading-overlay"
+                >
+                  <div className=" absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2">
+                    <SpinnerLoader data-testid="main-view-loader" />
+                  </div>
+                </div>
+              )}
+
+              {!layout.leftPanel?.hide &&
+                layout.leftPanel?.components?.length && (
+                  <RightResizableWidget
+                    className={classNames(
+                      theme.border3,
+                      "h-full flex flex-col w-80 min-w-[10rem] min-h-[10rem] border-r",
+                    )}
+                  >
+                    {layout.leftPanel?.components.map(
+                      (component: LayoutComponent, index: number) => {
+                        const panelComponent = renderLayoutComponent(component);
+
+                        if (index > 0) {
+                          return (
+                            <TopResizableWidget
+                              key={component.type}
+                              className={classNames(
+                                theme.border3,
+                                "h-1/3 border-t",
+                              )}
+                            >
+                              {panelComponent}
+                            </TopResizableWidget>
+                          );
+                        }
+                        return panelComponent;
+                      },
+                    )}
+                  </RightResizableWidget>
+                )}
+
+              <div className="flex-1 flex flex-col">
+                <div className="flex-1 flex">
+                  <div className="flex-1 flex flex-col" data-testid="map-view">
+                    <MapView
+                      showTests={showTests}
+                      selectedNodeId={selectedItems[0]}
+                      onSelectedNodeIdChange={(nodeId) =>
+                        setSelectedItems(nodeId ? [nodeId] : [])
+                      }
+                    />
+                  </div>
+
+                  <LeftResizableWidget
+                    className={classNames(
+                      theme.border3,
+                      "flex-shrink w-80 min-w-[10rem] border-l z-10",
+                      theme.bg4,
+                    )}
+                  >
+                    {metadata.data && (
+                      <ResourceMetadata
+                        node={metadata.data.node}
+                        inbound={metadata.data.inbound}
+                        outbound={metadata.data.outbound}
+                        onConnectionNodeClick={(path) => {
+                          expand(path);
+                          setSelectedItems([path]);
+                        }}
+                      />
+                    )}
+                  </LeftResizableWidget>
+                </div>
+              </div>
+            </div>
+
+            {!layout.bottomPanel?.hide && (
+              <TopResizableWidget
+                className={classNames(
+                  theme.border3,
+                  "border-t relative flex",
+                  theme.bg3,
+                  theme.text2,
+                  "min-h-[5rem]",
+                  (layout.bottomPanel?.size === "small" && "h-[8rem]") ||
+                    "h-[15rem]",
+                )}
+              >
+                {layout.bottomPanel?.components?.map(
+                  (component: LayoutComponent, index: number) => {
+                    const panelComponent = renderLayoutComponent(component);
+                    if (
+                      layout.bottomPanel?.components?.length &&
+                      layout.bottomPanel.components.length > 1 &&
+                      index !== layout.bottomPanel.components.length - 1
+                    ) {
+                      return (
+                        <RightResizableWidget
+                          key={component.type}
+                          className={classNames(
+                            theme.border3,
+                            "h-full w-1/4 flex flex-col min-w-[10rem] min-h-[10rem] border-r",
+                          )}
+                        >
+                          {panelComponent}
+                        </RightResizableWidget>
+                      );
+                    }
+                    return panelComponent;
+                  },
+                )}
+              </TopResizableWidget>
+            )}
+
+            {cloudAppState === "error" &&
+              layout.errorScreen?.position === "bottom" && (
+                <>
+                  <div className="fixed inset-0 flex justify-center items-center z-50 bg-black bg-opacity-40" />
+
+                  <div className="fixed bottom-0 max-h-[80vh] w-full z-50">
+                    <TopResizableWidget
+                      className={classNames(
+                        theme.border3,
+                        "border-t absolute flex",
+                        theme.bg3,
+                        theme.text2,
+                        "min-h-[5rem] h-[30rem]",
+                      )}
+                    >
+                      <BlueScreenOfDeath
+                        title={"An error has occurred:"}
+                        error={errorMessage.data ?? ""}
+                        displayLinks={layout.errorScreen?.displayLinks}
+                        displayWingTitle={layout.errorScreen?.displayTitle}
+                      />
+                    </TopResizableWidget>
+                  </div>
+                </>
+              )}
+          </>
+        )}
+
+        {!layout.statusBar?.hide && (
+          <StatusBar
+            wingVersion={wingVersion}
+            cloudAppState={cloudAppState}
+            isError={cloudAppState === "error"}
+            showThemeToggle={layout.statusBar?.showThemeToggle}
+          />
+        )}
+      </div>
+    </>
+  );
+};
diff --git a/apps/wing-console/console/ui/src/layout/header.tsx b/apps/wing-console/console/ui/src/layout/header.tsx
index a40e15b0027..bf9e64b01b2 100644
--- a/apps/wing-console/console/ui/src/layout/header.tsx
+++ b/apps/wing-console/console/ui/src/layout/header.tsx
@@ -1,28 +1,15 @@
-import { MoonIcon, SunIcon } from "@heroicons/react/24/outline";
 import { useTheme } from "@wingconsole/design-system";
 import classNames from "classnames";
-import { useCallback, useMemo } from "react";
+
+import { ThemeToggle } from "./theme-toggle.js";
 
 export interface HeaderProps {
   title: string;
+  showThemeToggle?: boolean;
 }
 
-export const Header = ({ title }: HeaderProps) => {
-  const { theme, setThemeMode, mode, mediaTheme } = useTheme();
-
-  const currentTheme = useMemo(() => {
-    if (mode === "auto") {
-      return mediaTheme;
-    }
-    return mode;
-  }, [mode, mediaTheme]);
-
-  const toggleThemeMode = useCallback(() => {
-    const newMode =
-      // eslint-disable-next-line unicorn/no-nested-ternary
-      mode === "light" ? "auto" : mode === "auto" ? "dark" : "light";
-    setThemeMode?.(newMode);
-  }, [setThemeMode, mode]);
+export const Header = ({ title, showThemeToggle = true }: HeaderProps) => {
+  const { theme } = useTheme();
 
   return (
     <div
@@ -38,22 +25,7 @@ export const Header = ({ title }: HeaderProps) => {
         <div>{title}</div>
       </div>
       <div className="w-1/3 flex space-x-1 justify-end">
-        <button
-          className={classNames(
-            theme.textInput,
-            "rounded-3xl font-medium flex focus:outline-none",
-            "hover:bg-slate-200 hover:dark:bg-slate-600",
-            "transition-color duration-300 cursor-pointer",
-            "gap-x-1 p-1",
-          )}
-          onClick={toggleThemeMode}
-        >
-          {currentTheme === "light" && <SunIcon className="h-4" />}
-          {currentTheme === "dark" && <MoonIcon className="h-4" />}
-          {mode === "auto" && (
-            <div className="font-light capitalize text-xs">{mode}</div>
-          )}
-        </button>
+        {showThemeToggle && <ThemeToggle />}
       </div>
     </div>
   );
diff --git a/apps/wing-console/console/ui/src/layout/layout-provider.tsx b/apps/wing-console/console/ui/src/layout/layout-provider.tsx
index de5f86525e0..20bc3ed9ecd 100644
--- a/apps/wing-console/console/ui/src/layout/layout-provider.tsx
+++ b/apps/wing-console/console/ui/src/layout/layout-provider.tsx
@@ -1,16 +1,15 @@
 import { createContext } from "react";
 
-import { PlaygroundLayout } from "./playground-layout.js";
-import { TutorialLayout } from "./tutorial-layout.js";
-import { LayoutProps, VscodeLayout } from "./vscode-layout.js";
+import { DefaultLayout, LayoutProps } from "./default-layout.js";
 
 export enum LayoutType {
-  Vscode = 1,
+  Default = 1,
   Playground,
   Tutorial,
+  Vscode,
 }
 
-export const LayoutContext = createContext(LayoutType.Vscode);
+export const LayoutContext = createContext(LayoutType.Default);
 
 export interface LayoutProviderProps {
   layoutType?: LayoutType;
@@ -21,18 +20,84 @@ export function LayoutProvider({
   layoutType,
   layoutProps,
 }: LayoutProviderProps) {
-  let Layout = VscodeLayout;
-  if (layoutType === LayoutType.Playground) {
-    Layout = PlaygroundLayout;
-  } else if (layoutType === LayoutType.Tutorial) {
-    Layout = TutorialLayout;
+  let layoutConfig = layoutProps.layoutConfig;
+  let Layout = DefaultLayout;
+
+  switch (layoutType) {
+    case LayoutType.Playground: {
+      layoutConfig = {
+        header: {
+          hide: true,
+        },
+        leftPanel: {
+          hide: true,
+        },
+        bottomPanel: {
+          components: [
+            {
+              type: "tests",
+            },
+            {
+              type: "logs",
+            },
+          ],
+        },
+      };
+
+      break;
+    }
+    case LayoutType.Tutorial: {
+      layoutConfig = {
+        header: {
+          hide: true,
+        },
+        leftPanel: {
+          hide: true,
+        },
+        bottomPanel: {
+          size: "small",
+          components: [
+            {
+              type: "logs",
+            },
+          ],
+        },
+        errorScreen: {
+          position: "bottom",
+          displayTitle: false,
+          displayLinks: false,
+        },
+        statusBar: {
+          hide: true,
+        },
+      };
+      break;
+    }
+    case LayoutType.Vscode: {
+      layoutConfig = {
+        header: {
+          hide: true,
+        },
+        leftPanel: {
+          hide: true,
+        },
+        bottomPanel: {
+          hide: true,
+        },
+        statusBar: {
+          hide: true,
+        },
+      };
+      break;
+    }
   }
 
   return (
-    <LayoutContext.Provider value={layoutType ?? LayoutType.Vscode}>
+    <LayoutContext.Provider value={layoutType ?? LayoutType.Default}>
       <Layout
         cloudAppState={layoutProps.cloudAppState}
         wingVersion={layoutProps.wingVersion}
+        layoutConfig={layoutConfig}
       />
     </LayoutContext.Provider>
   );
diff --git a/apps/wing-console/console/ui/src/layout/playground-layout.tsx b/apps/wing-console/console/ui/src/layout/playground-layout.tsx
deleted file mode 100644
index 2e5c9de2674..00000000000
--- a/apps/wing-console/console/ui/src/layout/playground-layout.tsx
+++ /dev/null
@@ -1,174 +0,0 @@
-import {
-  SpinnerLoader,
-  LeftResizableWidget,
-  RightResizableWidget,
-  ScrollableArea,
-  TopResizableWidget,
-} from "@wingconsole/design-system";
-import classNames from "classnames";
-
-import { ConsoleLogsFilters } from "../features/console-logs-filters.js";
-import { ConsoleLogs } from "../features/console-logs.js";
-import { MapView } from "../features/map-view.js";
-import { TestsTreeView } from "../features/tests-tree-view.js";
-import { BlueScreenOfDeath } from "../ui/blue-screen-of-death.js";
-import { ResourceMetadata } from "../ui/resource-metadata.js";
-
-import { StatusBar } from "./status-bar.js";
-import { useLayout } from "./use-layout.js";
-import { LayoutProps } from "./vscode-layout.js";
-
-export const PlaygroundLayout = ({
-  cloudAppState,
-  wingVersion,
-}: LayoutProps) => {
-  const {
-    selectedItems,
-    setSelectedItems,
-    expand,
-    theme,
-    errorMessage,
-    loading,
-    metadata,
-    setSearchText,
-    selectedLogTypeFilters,
-    setSelectedLogTypeFilters,
-    setLogsTimeFilter,
-    showTests,
-    logsRef,
-    logs,
-    onResourceClick,
-  } = useLayout({
-    cloudAppState,
-    defaultLogLevels: ["info", "warn", "error"],
-  });
-
-  return (
-    <div className="h-full flex flex-col bg-slate-50 select-none relative">
-      <div className="flex-1 flex relative">
-        {loading && (
-          <div
-            className={classNames(
-              "absolute h-full w-full z-50 bg-white/70 dark:bg-slate-600/70",
-            )}
-          >
-            <div className=" absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2">
-              <SpinnerLoader />
-            </div>
-          </div>
-        )}
-
-        <div className="flex-1 flex flex-col relative">
-          {cloudAppState === "error" && (
-            <div className="bg-opacity-40 bg-black absolute inset-0 z-50" />
-          )}
-
-          <div className="flex-1 flex">
-            <div className="flex-1 flex flex-col">
-              <MapView
-                showMapControls={true}
-                showTests={showTests}
-                selectedNodeId={selectedItems[0]}
-                onSelectedNodeIdChange={(nodeId) =>
-                  setSelectedItems(nodeId ? [nodeId] : [])
-                }
-              />
-            </div>
-
-            <LeftResizableWidget
-              className={classNames(
-                theme.border3,
-                "h-full w-1/4 flex flex-col min-w-[10rem] min-h-[15rem] border-l z-10",
-                theme.bg4,
-              )}
-            >
-              {metadata.data && (
-                <ResourceMetadata
-                  node={metadata.data.node}
-                  inbound={metadata.data.inbound}
-                  outbound={metadata.data.outbound}
-                  onConnectionNodeClick={(path) => {
-                    expand(path);
-                    setSelectedItems([path]);
-                  }}
-                />
-              )}
-            </LeftResizableWidget>
-          </div>
-        </div>
-      </div>
-      {
-        <TopResizableWidget
-          className={classNames(
-            theme.border3,
-            "flex relative border-t border-slate-300 bg-slate-50",
-            {
-              "min-h-[5rem] h-[30rem]": cloudAppState === "error",
-              "min-h-[5rem] h-[15rem]": cloudAppState !== "error",
-            },
-          )}
-        >
-          {cloudAppState === "error" && (
-            <BlueScreenOfDeath
-              title={"An error has occurred:"}
-              error={errorMessage.data ?? ""}
-              displayLinks={false}
-              displayWingTitle={false}
-            />
-          )}
-          <RightResizableWidget
-            className={classNames(
-              theme.border3,
-              "h-full w-1/4 flex flex-col min-w-[10rem] min-h-[10rem] border-r",
-            )}
-          >
-            <TestsTreeView />
-          </RightResizableWidget>
-          <div
-            className={classNames(
-              theme.border3,
-              "flex-1 flex flex-col min-w-[10rem] min-h-[15rem] border-r border-b border-slate-300",
-              theme.bg3,
-              theme.text2,
-            )}
-          >
-            <div className="relative h-full flex flex-col gap-2">
-              {loading && (
-                <div
-                  className={classNames(
-                    "absolute h-full w-full z-50 bg-white/70 dark:bg-slate-600/70",
-                    theme.text2,
-                  )}
-                />
-              )}
-              <ConsoleLogsFilters
-                selectedLogTypeFilters={selectedLogTypeFilters}
-                setSelectedLogTypeFilters={setSelectedLogTypeFilters}
-                clearLogs={() => setLogsTimeFilter(Date.now())}
-                isLoading={loading}
-                onSearch={setSearchText}
-              />
-              <div className="relative h-full">
-                <ScrollableArea
-                  ref={logsRef}
-                  overflowY
-                  className={classNames("pb-1.5", theme.bg3, theme.text2)}
-                >
-                  <ConsoleLogs
-                    logs={logs.data ?? []}
-                    onResourceClick={onResourceClick}
-                  />
-                </ScrollableArea>
-              </div>
-            </div>
-          </div>
-        </TopResizableWidget>
-      }
-      <StatusBar
-        wingVersion={wingVersion}
-        cloudAppState={cloudAppState}
-        isError={cloudAppState === "error"}
-      />
-    </div>
-  );
-};
diff --git a/apps/wing-console/console/ui/src/layout/status-bar.tsx b/apps/wing-console/console/ui/src/layout/status-bar.tsx
index d1635d49217..9caac273b36 100644
--- a/apps/wing-console/console/ui/src/layout/status-bar.tsx
+++ b/apps/wing-console/console/ui/src/layout/status-bar.tsx
@@ -4,16 +4,20 @@ import classNames from "classnames";
 
 import { AutoUpdater } from "../features/auto-updater.js";
 
+import { ThemeToggle } from "./theme-toggle.js";
+
 export interface StatusBarProps {
   wingVersion?: string;
   cloudAppState: State;
   isError?: boolean;
+  showThemeToggle?: boolean;
 }
 
 export const StatusBar = ({
   wingVersion = "",
   cloudAppState,
   isError = false,
+  showThemeToggle = false,
 }: StatusBarProps) => {
   const { theme } = useTheme();
   const loading =
@@ -62,6 +66,7 @@ export const StatusBar = ({
       {/*right side*/}
       <div className="w-full flex space-x-0 justify-end">
         <AutoUpdater />
+        {showThemeToggle && <ThemeToggle />}
       </div>
     </footer>
   );
diff --git a/apps/wing-console/console/ui/src/layout/theme-toggle.tsx b/apps/wing-console/console/ui/src/layout/theme-toggle.tsx
new file mode 100644
index 00000000000..beecb9a227e
--- /dev/null
+++ b/apps/wing-console/console/ui/src/layout/theme-toggle.tsx
@@ -0,0 +1,41 @@
+import { MoonIcon, SunIcon } from "@heroicons/react/24/outline";
+import { useTheme } from "@wingconsole/design-system";
+import classNames from "classnames";
+import { useCallback, useMemo } from "react";
+
+export const ThemeToggle = () => {
+  const { theme, setThemeMode, mode, mediaTheme } = useTheme();
+
+  const currentTheme = useMemo(() => {
+    if (mode === "auto") {
+      return mediaTheme;
+    }
+    return mode;
+  }, [mode, mediaTheme]);
+
+  const toggleThemeMode = useCallback(() => {
+    const newMode =
+      // eslint-disable-next-line unicorn/no-nested-ternary
+      mode === "light" ? "auto" : mode === "auto" ? "dark" : "light";
+    setThemeMode?.(newMode);
+  }, [setThemeMode, mode]);
+
+  return (
+    <button
+      className={classNames(
+        theme.textInput,
+        "rounded-3xl font-medium flex focus:outline-none",
+        "hover:bg-slate-200 hover:dark:bg-slate-600",
+        "transition-color duration-300 cursor-pointer",
+        "gap-x-1 p-1",
+      )}
+      onClick={toggleThemeMode}
+    >
+      {currentTheme === "light" && <SunIcon className="h-4" />}
+      {currentTheme === "dark" && <MoonIcon className="h-4" />}
+      {mode === "auto" && (
+        <div className="font-light capitalize text-xs">{mode}</div>
+      )}
+    </button>
+  );
+};
diff --git a/apps/wing-console/console/ui/src/layout/tutorial-layout.tsx b/apps/wing-console/console/ui/src/layout/tutorial-layout.tsx
deleted file mode 100644
index 54fa036fcc1..00000000000
--- a/apps/wing-console/console/ui/src/layout/tutorial-layout.tsx
+++ /dev/null
@@ -1,153 +0,0 @@
-import {
-  SpinnerLoader,
-  LeftResizableWidget,
-  ScrollableArea,
-  TopResizableWidget,
-} from "@wingconsole/design-system";
-import classNames from "classnames";
-
-import { ConsoleLogsFilters } from "../features/console-logs-filters.js";
-import { ConsoleLogs } from "../features/console-logs.js";
-import { MapView } from "../features/map-view.js";
-import { BlueScreenOfDeath } from "../ui/blue-screen-of-death.js";
-import { ResourceMetadata } from "../ui/resource-metadata.js";
-
-import { useLayout } from "./use-layout.js";
-import { LayoutProps } from "./vscode-layout.js";
-
-export const TutorialLayout = ({ cloudAppState }: LayoutProps) => {
-  const {
-    selectedItems,
-    setSelectedItems,
-    expand,
-    theme,
-    errorMessage,
-    loading,
-    metadata,
-    setSearchText,
-    selectedLogTypeFilters,
-    setSelectedLogTypeFilters,
-    setLogsTimeFilter,
-    showTests,
-    logsRef,
-    logs,
-    onResourceClick,
-  } = useLayout({
-    cloudAppState,
-    defaultLogLevels: ["info", "warn", "error"],
-  });
-
-  return (
-    <div className="h-full flex flex-col bg-slate-50 select-none relative">
-      <div className="flex-1 flex relative">
-        {loading && (
-          <div
-            className={classNames(
-              "absolute h-full w-full z-50 bg-white/70 dark:bg-slate-600/70",
-            )}
-          >
-            <div className=" absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2">
-              <SpinnerLoader />
-            </div>
-          </div>
-        )}
-
-        <div className="flex-1 flex flex-col relative">
-          {cloudAppState === "error" && (
-            <div className="bg-opacity-40 bg-black absolute inset-0 z-50" />
-          )}
-
-          <div className="flex-1 flex">
-            <div className="flex-1 flex flex-col">
-              <MapView
-                showMapControls={false}
-                showTests={showTests}
-                selectedNodeId={selectedItems[0]}
-                onSelectedNodeIdChange={(nodeId) =>
-                  setSelectedItems(nodeId ? [nodeId] : [])
-                }
-              />
-            </div>
-
-            <LeftResizableWidget
-              className={classNames(
-                theme.border3,
-                "h-full w-1/4 flex flex-col min-w-[10rem] min-h-[10rem] border-l z-10",
-                theme.bg4,
-              )}
-            >
-              {metadata.data && (
-                <ResourceMetadata
-                  node={metadata.data.node}
-                  inbound={metadata.data.inbound}
-                  outbound={metadata.data.outbound}
-                  onConnectionNodeClick={(path) => {
-                    expand(path);
-                    setSelectedItems([path]);
-                  }}
-                />
-              )}
-            </LeftResizableWidget>
-          </div>
-        </div>
-      </div>
-      <TopResizableWidget
-        className={classNames(
-          theme.border3,
-          "flex relative border-t border-slate-300 bg-slate-50",
-          {
-            "min-h-[5rem] h-[30rem]": cloudAppState === "error",
-            "min-h-[5rem] h-[8rem]": cloudAppState !== "error",
-          },
-        )}
-      >
-        {cloudAppState === "error" && (
-          <BlueScreenOfDeath
-            title={"An error has occurred:"}
-            error={errorMessage.data ?? ""}
-            displayLinks={false}
-            displayWingTitle={false}
-          />
-        )}
-        <div
-          className={classNames(
-            theme.border3,
-            "flex-1 flex flex-col min-w-[10rem] border-r border-b border-slate-300",
-            theme.bg3,
-            theme.text2,
-          )}
-        >
-          <div className="relative h-full flex flex-col gap-2">
-            {loading && (
-              <div
-                className={classNames(
-                  "absolute h-full w-full z-50 bg-white/70 dark:bg-slate-600/70",
-                  theme.text2,
-                )}
-              />
-            )}
-            <ConsoleLogsFilters
-              selectedLogTypeFilters={selectedLogTypeFilters}
-              setSelectedLogTypeFilters={setSelectedLogTypeFilters}
-              clearLogs={() => setLogsTimeFilter(Date.now())}
-              isLoading={loading}
-              onSearch={setSearchText}
-            />
-            <div className="relative h-full">
-              <ScrollableArea
-                ref={logsRef}
-                overflowY
-                className={classNames("pb-1.5", theme.bg3, theme.text2)}
-              >
-                <ConsoleLogs
-                  logs={logs.data ?? []}
-                  onResourceClick={onResourceClick}
-                />
-              </ScrollableArea>
-            </div>
-          </div>
-        </div>
-      </TopResizableWidget>
-    </div>
-  );
-};
diff --git a/apps/wing-console/console/ui/src/layout/use-layout.tsx b/apps/wing-console/console/ui/src/layout/use-layout.tsx
index 038c897db98..2cf1d48f76a 100644
--- a/apps/wing-console/console/ui/src/layout/use-layout.tsx
+++ b/apps/wing-console/console/ui/src/layout/use-layout.tsx
@@ -1,5 +1,5 @@
 import { useTheme } from "@wingconsole/design-system";
-import { LogEntry, LogLevel, State } from "@wingconsole/server";
+import type { LogEntry, LogLevel, State } from "@wingconsole/server";
 import { useLoading } from "@wingconsole/use-loading";
 import { useEffect, useState, useContext, useRef, useMemo } from "react";
 
diff --git a/apps/wing-console/console/ui/src/layout/vscode-layout.tsx b/apps/wing-console/console/ui/src/layout/vscode-layout.tsx
deleted file mode 100644
index 93789e721a4..00000000000
--- a/apps/wing-console/console/ui/src/layout/vscode-layout.tsx
+++ /dev/null
@@ -1,226 +0,0 @@
-import {
-  SpinnerLoader,
-  LeftResizableWidget,
-  RightResizableWidget,
-  ScrollableArea,
-  TopResizableWidget,
-} from "@wingconsole/design-system";
-import { State } from "@wingconsole/server";
-import classNames from "classnames";
-import { useEffect, useMemo } from "react";
-
-import { ConsoleLogsFilters } from "../features/console-logs-filters.js";
-import { ConsoleLogs } from "../features/console-logs.js";
-import { MapView } from "../features/map-view.js";
-import { TestsTreeView } from "../features/tests-tree-view.js";
-import { BlueScreenOfDeath } from "../ui/blue-screen-of-death.js";
-import { Explorer } from "../ui/explorer.js";
-import { ResourceMetadata } from "../ui/resource-metadata.js";
-
-import { Header } from "./header.js";
-import { StatusBar } from "./status-bar.js";
-import { TermsAndConditionsModal } from "./terms-and-conditions-modal.js";
-import { useLayout } from "./use-layout.js";
-
-export interface LayoutProps {
-  cloudAppState: State;
-  wingVersion: string | undefined;
-}
-
-export const VscodeLayout = ({ cloudAppState, wingVersion }: LayoutProps) => {
-  const {
-    items,
-    selectedItems,
-    setSelectedItems,
-    expandedItems,
-    setExpandedItems,
-    expand,
-    expandAll,
-    collapseAll,
-    theme,
-    errorMessage,
-    loading,
-    metadata,
-    setSearchText,
-    selectedLogTypeFilters,
-    setSelectedLogTypeFilters,
-    setLogsTimeFilter,
-    showTests,
-    logsRef,
-    logs,
-    onResourceClick,
-    title,
-    wingfile,
-    termsConfig,
-    acceptTerms,
-  } = useLayout({
-    cloudAppState,
-    defaultLogLevels: ["info", "warn", "error"],
-  });
-
-  useEffect(() => {
-    document.title = title;
-  }, [title]);
-
-  const showTerms = useMemo(() => {
-    if (!termsConfig.data) {
-      return false;
-    }
-    return termsConfig.data.requireAcceptTerms && !termsConfig.data.accepted;
-  }, [termsConfig.data]);
-
-  return (
-    <>
-      {showTerms && (
-        <TermsAndConditionsModal
-          visible={true}
-          onAccept={() => acceptTerms()}
-          license={termsConfig.data?.license ?? ""}
-        />
-      )}
-      <div
-        data-testid="vscode-layout"
-        className={classNames(
-          "h-full flex flex-col select-none",
-          theme.bg3,
-          theme.text2,
-          showTerms && "blur-sm",
-        )}
-      >
-        <Header title={wingfile.data ?? ""} />
-
-        {cloudAppState === "error" && (
-          <div className="flex-1 flex relative">
-            <BlueScreenOfDeath
-              title={"An error has occurred:"}
-              error={errorMessage.data ?? ""}
-            />
-          </div>
-        )}
-
-        {cloudAppState !== "error" && (
-          <>
-            <div className="flex-1 flex relative">
-              {loading && (
-                <div
-                  className={classNames(
-                    "absolute h-full w-full z-50 bg-white/70 dark:bg-slate-600/70",
-                  )}
-                  data-testid="loading-overlay"
-                >
-                  <div className=" absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2">
-                    <SpinnerLoader data-testid="main-view-loader" />
-                  </div>
-                </div>
-              )}
-
-              <RightResizableWidget
-                className={classNames(
-                  theme.border3,
-                  "h-full flex flex-col w-80 min-w-[10rem] min-h-[10rem] border-r",
-                )}
-              >
-                <div className="flex grow">
-                  <Explorer
-                    loading={loading}
-                    items={items}
-                    selectedItems={selectedItems}
-                    onSelectedItemsChange={setSelectedItems}
-                    expandedItems={expandedItems}
-                    onExpandedItemsChange={setExpandedItems}
-                    onExpandAll={expandAll}
-                    onCollapseAll={collapseAll}
-                    data-testid="explorer-tree-menu"
-                  />
-                </div>
-                <TopResizableWidget
-                  className={classNames(theme.border3, "h-1/3 border-t")}
-                >
-                  <TestsTreeView />
-                </TopResizableWidget>
-              </RightResizableWidget>
-
-              <div className="flex-1 flex flex-col">
-                <div className="flex-1 flex">
-                  <div className="flex-1 flex flex-col" data-testid="map-view">
-                    <MapView
-                      showTests={showTests}
-                      selectedNodeId={selectedItems[0]}
-                      onSelectedNodeIdChange={(nodeId) =>
-                        setSelectedItems(nodeId ? [nodeId] : [])
-                      }
-                    />
-                  </div>
-
-                  <LeftResizableWidget
-                    className={classNames(
-                      theme.border3,
-                      "flex-shrink w-80 min-w-[10rem] border-l z-10",
-                      theme.bg4,
-                    )}
-                  >
-                    {metadata.data && (
-                      <ResourceMetadata
-                        node={metadata.data.node}
-                        inbound={metadata.data.inbound}
-                        outbound={metadata.data.outbound}
-                        onConnectionNodeClick={(path) => {
-                          expand(path);
-                          setSelectedItems([path]);
-                        }}
-                      />
-                    )}
-                  </LeftResizableWidget>
-                </div>
-              </div>
-            </div>
-            <TopResizableWidget
-              className={classNames(
-                theme.border3,
-                "border-t min-h-[5rem] h-[15rem]",
-                theme.bg3,
-                theme.text2,
-              )}
-            >
-              <div className="relative h-full flex flex-col gap-2">
-                {loading && (
-                  <div
-                    className={classNames(
-                      "absolute h-full w-full z-50 bg-white/70 dark:bg-slate-600/70",
-                      theme.text2,
-                    )}
-                  />
-                )}
-                <ConsoleLogsFilters
-                  selectedLogTypeFilters={selectedLogTypeFilters}
-                  setSelectedLogTypeFilters={setSelectedLogTypeFilters}
-                  clearLogs={() => setLogsTimeFilter(Date.now())}
-                  isLoading={loading}
-                  onSearch={setSearchText}
-                />
-                <div className="relative h-full">
-                  <ScrollableArea
-                    ref={logsRef}
-                    overflowY
-                    className={classNames("pb-1.5", theme.bg3, theme.text2)}
-                  >
-                    <ConsoleLogs
-                      logs={logs.data ?? []}
-                      onResourceClick={onResourceClick}
-                    />
-                  </ScrollableArea>
-                </div>
-              </div>
-            </TopResizableWidget>
-          </>
-        )}
-
-        <StatusBar
-          wingVersion={wingVersion}
-          cloudAppState={cloudAppState}
-          isError={cloudAppState === "error"}
-        />
-      </div>
-    </>
-  );
-};
diff --git a/apps/wing-console/console/ui/src/services/trpc.ts b/apps/wing-console/console/ui/src/services/trpc.ts
index 793de09293d..e0f257fe344 100644
--- a/apps/wing-console/console/ui/src/services/trpc.ts
+++ b/apps/wing-console/console/ui/src/services/trpc.ts
@@ -3,23 +3,4 @@ import type { Router } from "@wingconsole/server";
 
 export type { Router } from "@wingconsole/server";
 
-export const trpc = createTRPCReact<Router>({
-  unstable_overrides: {
-    useMutation: {
-      /**
-       * This function is called whenever a `.useMutation` succeeds
-       **/
-      async onSuccess(options) {
-        /**
-         * @note that order here matters:
-         * The order here allows route changes in `onSuccess` without
-         * having a flash of content change whilst redirecting.
-         **/
-        // Calls the `onSuccess` defined in the `useQuery()`-options:
-        await options.originalFn();
-        // Invalidate all queries in the react-query cache:
-        await options.queryClient.invalidateQueries();
-      },
-    },
-  },
-});
+export const trpc = createTRPCReact<Router>();
diff --git a/apps/wing-console/console/ui/src/services/use-explorer.tsx b/apps/wing-console/console/ui/src/services/use-explorer.tsx
index de9516c4957..ea025cca97c 100644
--- a/apps/wing-console/console/ui/src/services/use-explorer.tsx
+++ b/apps/wing-console/console/ui/src/services/use-explorer.tsx
@@ -1,6 +1,6 @@
 import { ResourceIcon } from "@wingconsole/design-system";
 import { ExplorerItem } from "@wingconsole/server";
-import { useEffect } from "react";
+import { useCallback, useEffect } from "react";
 
 import { TreeMenuItem, useTreeMenuItems } from "../ui/use-tree-menu-items.js";
 
@@ -41,13 +41,40 @@ export const useExplorer = () => {
   });
 
   const tree = trpc["app.explorerTree"].useQuery();
+
+  const setSelectedNode = trpc["app.selectNode"].useMutation();
+  const selectedNode = trpc["app.selectedNode"].useQuery();
+
+  const onSelectedItemsChange = useCallback(
+    (selectedItems: string[]) => {
+      if (selectedItems.length === 0 || !selectedItems[0]) {
+        return;
+      }
+      setSelectedItems(selectedItems);
+      setSelectedNode.mutate({
+        resourcePath: selectedItems[0],
+      });
+    },
+    [setSelectedNode, setSelectedItems],
+  );
+
   useEffect(() => {
     if (!tree.data) {
       return;
     }
     setItems([createTreeMenuItemFromExplorerTreeItem(tree.data)]);
-    setSelectedItems(["root"]);
-  }, [tree.data, setItems, setSelectedItems]);
+
+    setSelectedNode.mutate({
+      resourcePath: "root",
+    });
+  }, [tree.data, setItems]);
+
+  useEffect(() => {
+    if (!selectedNode.data) {
+      return;
+    }
+    setSelectedItems([selectedNode.data]);
+  }, [selectedNode.data, setSelectedItems]);
 
   useEffect(() => {
     expandAll();
@@ -56,7 +83,7 @@ export const useExplorer = () => {
   return {
     items,
     selectedItems,
-    setSelectedItems,
+    setSelectedItems: onSelectedItemsChange,
     expandedItems,
     setExpandedItems,
     expand,
diff --git a/apps/wing-console/console/ui/src/services/use-tests.ts b/apps/wing-console/console/ui/src/services/use-tests.ts
index 15365ad1f9f..7d8fe86d3c1 100644
--- a/apps/wing-console/console/ui/src/services/use-tests.ts
+++ b/apps/wing-console/console/ui/src/services/use-tests.ts
@@ -8,45 +8,28 @@ import { trpc } from "./trpc.js";
 
 type RouterOutput = inferRouterOutputs<Router>;
 
-const getTestName = (testPath: string) => {
-  const test = testPath.split("/").pop() ?? testPath;
-  return test.replaceAll("test:", "");
-};
-
 export const useTests = () => {
   const [testList, setTestList] = useState<TestItem[]>([]);
+
   const testListQuery = trpc["test.list"].useQuery();
+
   const runAllTestsMutation = trpc["test.runAll"].useMutation({
     onMutate: () => {
       setAllTestStatus("running");
     },
-    onSuccess: (data) => {
-      onRunTestsSuccess(data);
-    },
   });
 
   const runTestMutation = trpc["test.run"].useMutation({
     onMutate: (data) => {
       setTestStatus(data.resourcePath, "running");
     },
-    onSuccess: (data) => {
-      onRunTestsSuccess([data]);
-    },
   });
 
   useEffect(() => {
     if (!testListQuery.data) {
       return;
     }
-    setTestList(
-      testListQuery.data.map((resourcePath) => {
-        return {
-          id: resourcePath,
-          label: getTestName(resourcePath),
-          status: "pending",
-        };
-      }),
-    );
+    setTestList(testListQuery.data);
   }, [testListQuery.data]);
 
   const runAllTests = () => {
@@ -88,16 +71,6 @@ export const useTests = () => {
     });
   };
 
-  const onRunTestsSuccess = (runOutput: RouterOutput["test.run"][]) => {
-    for (const output of runOutput) {
-      setTestStatus(
-        output.path,
-        output.error ? "error" : "success",
-        output.time,
-      );
-    }
-  };
-
   return {
     testList,
     runAllTests,
diff --git a/apps/wing-console/console/ui/src/ui/test-tree.tsx b/apps/wing-console/console/ui/src/ui/test-tree.tsx
index 1684302e1ce..30de33bb8f9 100644
--- a/apps/wing-console/console/ui/src/ui/test-tree.tsx
+++ b/apps/wing-console/console/ui/src/ui/test-tree.tsx
@@ -70,11 +70,10 @@ export const TestTree = ({
                     label={
                       <div className="flex items-center gap-1">
                         <span className="truncate">{test.label}</span>
-                        {test.time && (
-                          <span className={classNames(theme.text2, "text-xs")}>
-                            {test.time}ms
-                          </span>
-                        )}
+
+                        <span className={classNames(theme.text2, "text-xs")}>
+                          {test.time && test.time > 0 ? `${test.time}ms` : ""}
+                        </span>
                       </div>
                     }
                     secondaryLabel={
diff --git a/apps/wing/package.json b/apps/wing/package.json
index cf0b22a6a6a..28887a9e320 100644
--- a/apps/wing/package.json
+++ b/apps/wing/package.json
@@ -32,6 +32,7 @@
   "dependencies": {
     "@segment/analytics-node": "^1.0.0",
     "@wingconsole/app": "workspace:^",
+    "@wingconsole/server": "workspace:^",
     "@winglang/compiler": "workspace:^",
     "@winglang/sdk": "workspace:^",
     "chalk": "^4.1.2",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 5c30de39c62..56e585be2be 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -185,23 +185,25 @@ importers:
         version: 4.9.4
 
   apps/vscode-wing:
-    dependencies:
-      '@types/vscode':
-        specifier: ^1.70.0
-        version: 1.70.0
-      vscode-languageclient:
-        specifier: ^8.0.2
-        version: 8.0.2
-      which:
-        specifier: ^3.0.0
-        version: 3.0.0
     devDependencies:
+      '@trpc/client':
+        specifier: ^10.30.0
+        version: 10.30.0(@trpc/server@10.30.0)
       '@types/node':
         specifier: ^16
         version: 16.0.0
+      '@types/node-fetch':
+        specifier: ^2.6.4
+        version: 2.6.4
+      '@types/vscode':
+        specifier: ^1.70.0
+        version: 1.70.0
       '@types/which':
         specifier: ^2.0.2
         version: 2.0.2
+      '@types/ws':
+        specifier: ^8.5.5
+        version: 8.5.5
       '@typescript-eslint/eslint-plugin':
         specifier: ^5
         version: 5.59.11(@typescript-eslint/parser@5.59.11)(eslint@8.42.0)(typescript@4.9.4)
@@ -211,9 +213,12 @@ importers:
       '@vscode/vsce':
         specifier: ^2.16.0
         version: 2.16.0
-      esbuild:
-        specifier: ^0.17.4
-        version: 0.17.19
+      '@wingconsole/app':
+        specifier: workspace:^
+        version: link:../wing-console/console/app
+      '@wingconsole/server':
+        specifier: workspace:^
+        version: link:../wing-console/console/server
       eslint:
         specifier: ^8
         version: 8.42.0
@@ -232,9 +237,15 @@ importers:
       eslint-plugin-prettier:
         specifier: ^4.2.1
         version: 4.2.1(eslint-config-prettier@8.8.0)(eslint@8.42.0)(prettier@2.8.8)
+      node-fetch:
+        specifier: '2'
+        version: 2.6.12
       npm-check-updates:
         specifier: ^16
         version: 16.0.0
+      open:
+        specifier: ^8.4.0
+        version: 8.4.0
       prettier:
         specifier: ^2.8.3
         version: 2.8.8
@@ -244,9 +255,21 @@ importers:
       ts-node:
         specifier: ^10.9.1
         version: 10.9.1(@types/node@16.0.0)(typescript@4.9.4)
+      tsup:
+        specifier: ^6.7.0
+        version: 6.7.0(ts-node@10.9.1)(typescript@4.9.4)
       typescript:
         specifier: ^4.9.4
         version: 4.9.4
+      vscode-languageclient:
+        specifier: ^8.0.2
+        version: 8.0.2
+      which:
+        specifier: ^1.3.1
+        version: 1.3.1
+      ws:
+        specifier: ^8.13.0
+        version: 8.13.0
 
   apps/wing:
     dependencies:
@@ -256,6 +279,9 @@ importers:
       '@wingconsole/app':
         specifier: workspace:^
         version: link:../wing-console/console/app
+      '@wingconsole/server':
+        specifier: workspace:^
+        version: link:../wing-console/console/server
       '@winglang/compiler':
         specifier: workspace:^
         version: link:../../libs/wingcompiler
@@ -392,7 +418,7 @@ importers:
         version: 9.0.0
       ts-jest:
         specifier: ^29.0.5
-        version: 29.0.5(@babel/core@7.22.9)(jest@29.3.1)(typescript@4.9.4)
+        version: 29.0.5(@babel/core@7.22.5)(jest@29.3.1)(typescript@4.9.4)
       ts-node:
         specifier: ^10.9.1
         version: 10.9.1(@types/node@16.0.0)(typescript@4.9.4)
@@ -447,7 +473,7 @@ importers:
         version: link:../ui
       autoprefixer:
         specifier: ^10.4.14
-        version: 10.4.14(postcss@8.4.27)
+        version: 10.4.14(postcss@8.4.24)
       bump-pack:
         specifier: workspace:^
         version: link:../../../../tools/bump-pack
@@ -474,7 +500,7 @@ importers:
         version: 3.3.2
       tsup:
         specifier: ^6.7.0
-        version: 6.7.0(postcss@8.4.27)(typescript@5.1.3)
+        version: 6.7.0(postcss@8.4.24)(typescript@5.1.3)
       tsx:
         specifier: ^3.12.7
         version: 3.12.7
@@ -665,7 +691,7 @@ importers:
         version: 4.6.7
       tsup:
         specifier: ^6.7.0
-        version: 6.7.0(postcss@8.4.27)(typescript@5.1.3)
+        version: 6.7.0(postcss@8.4.24)(typescript@5.1.3)
       typescript:
         specifier: ^5.1.3
         version: 5.1.3
@@ -810,7 +836,7 @@ importers:
         version: link:../../packages/use-loading
       autoprefixer:
         specifier: ^10.4.14
-        version: 10.4.14(postcss@8.4.27)
+        version: 10.4.14(postcss@8.4.24)
       bump-pack:
         specifier: workspace:^
         version: link:../../../../tools/bump-pack
@@ -828,7 +854,7 @@ importers:
         version: 3.3.2
       tsup:
         specifier: ^6.7.0
-        version: 6.7.0(postcss@8.4.27)(typescript@5.1.3)
+        version: 6.7.0(postcss@8.4.24)(typescript@5.1.3)
       typescript:
         specifier: ^5.1.3
         version: 5.1.3
@@ -2984,11 +3010,6 @@ packages:
     engines: {node: '>=6.9.0'}
     dev: true
 
-  /@babel/compat-data@7.22.9:
-    resolution: {integrity: sha512-5UamI7xkUcJ3i9qVDS+KFDEK8/7oJ55/sJMB1Ge7IEapr7KfdfV/HErR+koZwOfd+SgtFKOKRhRakdg++DcJpQ==}
-    engines: {node: '>=6.9.0'}
-    dev: true
-
   /@babel/core@7.21.8:
     resolution: {integrity: sha512-YeM22Sondbo523Sz0+CirSPnbj9bG3P0CdHcBZdqUuaeOaYEFbOLoGU7lebvGP6P5J/WE9wOn7u7C4J9HvS1xQ==}
     engines: {node: '>=6.9.0'}
@@ -3035,29 +3056,6 @@ packages:
       - supports-color
     dev: true
 
-  /@babel/core@7.22.9:
-    resolution: {integrity: sha512-G2EgeufBcYw27U4hhoIwFcgc1XU7TlXJ3mv04oOv1WCuo900U/anZSPzEqNjwdjgffkk2Gs0AN0dW1CKVLcG7w==}
-    engines: {node: '>=6.9.0'}
-    dependencies:
-      '@ampproject/remapping': 2.2.1
-      '@babel/code-frame': 7.22.5
-      '@babel/generator': 7.22.9
-      '@babel/helper-compilation-targets': 7.22.9(@babel/core@7.22.9)
-      '@babel/helper-module-transforms': 7.22.9(@babel/core@7.22.9)
-      '@babel/helpers': 7.22.6
-      '@babel/parser': 7.22.7
-      '@babel/template': 7.22.5
-      '@babel/traverse': 7.22.8
-      '@babel/types': 7.22.5
-      convert-source-map: 1.9.0
-      debug: 4.3.4
-      gensync: 1.0.0-beta.2
-      json5: 2.2.3
-      semver: 6.3.1
-    transitivePeerDependencies:
-      - supports-color
-    dev: true
-
   /@babel/generator@7.21.9:
     resolution: {integrity: sha512-F3fZga2uv09wFdEjEQIJxXALXfz0+JaOb7SabvVMmjHxeVTuGW8wgE8Vp1Hd7O+zMTYtcfEISGRzPkeiaPPsvg==}
     engines: {node: '>=6.9.0'}
@@ -3078,16 +3076,6 @@ packages:
       jsesc: 2.5.2
     dev: true
 
-  /@babel/generator@7.22.9:
-    resolution: {integrity: sha512-KtLMbmicyuK2Ak/FTCJVbDnkN1SlT8/kceFTiuDiiRUUSMnHMidxSCdG4ndkTOHHpoomWe/4xkvHkEOncwjYIw==}
-    engines: {node: '>=6.9.0'}
-    dependencies:
-      '@babel/types': 7.22.5
-      '@jridgewell/gen-mapping': 0.3.3
-      '@jridgewell/trace-mapping': 0.3.18
-      jsesc: 2.5.2
-    dev: true
-
   /@babel/helper-annotate-as-pure@7.22.5:
     resolution: {integrity: sha512-LvBTxu8bQSQkcyKOU+a1btnNFQ1dMAd0R6PyW3arXes06F6QLWLIrd681bxRPIXlrMGR3XYnW9JyML7dP3qgxg==}
     engines: {node: '>=6.9.0'}
@@ -3130,20 +3118,6 @@ packages:
       semver: 6.3.0
     dev: true
 
-  /@babel/helper-compilation-targets@7.22.9(@babel/core@7.22.9):
-    resolution: {integrity: sha512-7qYrNM6HjpnPHJbopxmb8hSPoZ0gsX8IvUS32JGVoy+pU9e5N0nLr1VjJoR6kA4d9dmGLxNYOjeB8sUDal2WMw==}
-    engines: {node: '>=6.9.0'}
-    peerDependencies:
-      '@babel/core': ^7.0.0
-    dependencies:
-      '@babel/compat-data': 7.22.9
-      '@babel/core': 7.22.9
-      '@babel/helper-validator-option': 7.22.5
-      browserslist: 4.21.10
-      lru-cache: 5.1.1
-      semver: 6.3.1
-    dev: true
-
   /@babel/helper-create-class-features-plugin@7.22.5(@babel/core@7.21.8):
     resolution: {integrity: sha512-xkb58MyOYIslxu3gKmVXmjTtUPvBU4odYzbiIQbWwLKIHCsx6UGZGX6F1IznMFVnDdirseUZopzN+ZRt8Xb33Q==}
     engines: {node: '>=6.9.0'}
@@ -3290,20 +3264,6 @@ packages:
       - supports-color
     dev: true
 
-  /@babel/helper-module-transforms@7.22.9(@babel/core@7.22.9):
-    resolution: {integrity: sha512-t+WA2Xn5K+rTeGtC8jCsdAH52bjggG5TKRuRrAGNM/mjIbO4GxvlLMFOEz9wXY5I2XQ60PMFsAG2WIcG82dQMQ==}
-    engines: {node: '>=6.9.0'}
-    peerDependencies:
-      '@babel/core': ^7.0.0
-    dependencies:
-      '@babel/core': 7.22.9
-      '@babel/helper-environment-visitor': 7.22.5
-      '@babel/helper-module-imports': 7.22.5
-      '@babel/helper-simple-access': 7.22.5
-      '@babel/helper-split-export-declaration': 7.22.6
-      '@babel/helper-validator-identifier': 7.22.5
-    dev: true
-
   /@babel/helper-optimise-call-expression@7.22.5:
     resolution: {integrity: sha512-HBwaojN0xFRx4yIvpwGqxiV2tUfl7401jlok564NgB9EHS1y6QT17FmKWm4ztqjeVdXLuC4fSvHc5ePpQjoTbw==}
     engines: {node: '>=6.9.0'}
@@ -3381,13 +3341,6 @@ packages:
       '@babel/types': 7.22.5
     dev: true
 
-  /@babel/helper-split-export-declaration@7.22.6:
-    resolution: {integrity: sha512-AsUnxuLhRYsisFiaJwvp1QF+I3KjD5FOxut14q/GzovUe6orHLesW2C7d754kRm53h5gqrz6sFl6sxc4BVtE/g==}
-    engines: {node: '>=6.9.0'}
-    dependencies:
-      '@babel/types': 7.22.5
-    dev: true
-
   /@babel/helper-string-parser@7.22.5:
     resolution: {integrity: sha512-mM4COjgZox8U+JcXQwPijIZLElkgEpO5rsERVDJTc2qfCDfERyob6k5WegS14SX18IIjv+XD+GrqNumY5JRCDw==}
     engines: {node: '>=6.9.0'}
@@ -3425,17 +3378,6 @@ packages:
       - supports-color
     dev: true
 
-  /@babel/helpers@7.22.6:
-    resolution: {integrity: sha512-YjDs6y/fVOYFV8hAf1rxd1QvR9wJe1pDBZ2AREKq/SDayfPzgk0PBnVuTCE5X1acEpMMNOVUqoe+OwiZGJ+OaA==}
-    engines: {node: '>=6.9.0'}
-    dependencies:
-      '@babel/template': 7.22.5
-      '@babel/traverse': 7.22.8
-      '@babel/types': 7.22.5
-    transitivePeerDependencies:
-      - supports-color
-    dev: true
-
   /@babel/highlight@7.22.5:
     resolution: {integrity: sha512-BSKlD1hgnedS5XRnGOljZawtag7H1yPfQp0tdNJCHoH6AZ+Pcm9VvkrK59/Yy593Ypg0zMxH2BxD1VPYUQ7UIw==}
     engines: {node: '>=6.9.0'}
@@ -3460,14 +3402,6 @@ packages:
       '@babel/types': 7.22.5
     dev: true
 
-  /@babel/parser@7.22.7:
-    resolution: {integrity: sha512-7NF8pOkHP5o2vpmGgNGcfAeCvOYhGLyA3Z4eBQkT1RJlWu47n63bCs93QfJ2hIAFCil7L5P2IWhs1oToVgrL0Q==}
-    engines: {node: '>=6.0.0'}
-    hasBin: true
-    dependencies:
-      '@babel/types': 7.22.5
-    dev: true
-
   /@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@7.22.5(@babel/core@7.21.8):
     resolution: {integrity: sha512-NP1M5Rf+u2Gw9qfSO4ihjcTGW5zXTi36ITLd4/EoAcEhIZ0yjMqmftDNl3QC19CX7olhrjpyU454g/2W7X0jvQ==}
     engines: {node: '>=6.9.0'}
@@ -5398,24 +5332,6 @@ packages:
       - supports-color
     dev: true
 
-  /@babel/traverse@7.22.8:
-    resolution: {integrity: sha512-y6LPR+wpM2I3qJrsheCTwhIinzkETbplIgPBbwvqPKc+uljeA5gP+3nP8irdYt1mjQaDnlIcG+dw8OjAco4GXw==}
-    engines: {node: '>=6.9.0'}
-    dependencies:
-      '@babel/code-frame': 7.22.5
-      '@babel/generator': 7.22.9
-      '@babel/helper-environment-visitor': 7.22.5
-      '@babel/helper-function-name': 7.22.5
-      '@babel/helper-hoist-variables': 7.22.5
-      '@babel/helper-split-export-declaration': 7.22.6
-      '@babel/parser': 7.22.7
-      '@babel/types': 7.22.5
-      debug: 4.3.4
-      globals: 11.12.0
-    transitivePeerDependencies:
-      - supports-color
-    dev: true
-
   /@babel/types@7.21.5:
     resolution: {integrity: sha512-m4AfNvVF2mVC/F7fDEdH2El3HzUg9It/XsCxZiOTTA3m3qYfcSVSbTfM6Q9xG+hYDniZssYhlXKKUMD5m8tF4Q==}
     engines: {node: '>=6.9.0'}
@@ -7264,7 +7180,7 @@ packages:
     resolution: {integrity: sha512-YfcB2QrX+Wx1o6LD1G2Y2fhDhOix/bAY/oAnMpHoNLsKkWIRbt1oKLkIFvxBMzLwAEPqnYWguJrYC+J6i4ywbw==}
     engines: {node: '>=12.17'}
     dependencies:
-      bole: 5.0.6
+      bole: 5.0.5
       ndjson: 2.0.0
     dev: false
 
@@ -8858,7 +8774,6 @@ packages:
       '@trpc/server': 10.30.0
     dependencies:
       '@trpc/server': 10.30.0
-    dev: false
 
   /@trpc/react-query@10.30.0(@tanstack/react-query@4.29.12)(@trpc/client@10.30.0)(@trpc/server@10.30.0)(react-dom@18.2.0)(react@18.2.0):
     resolution: {integrity: sha512-bJnCEsuBv/xqnT76Ur8PI3VYjfCE1MYJ6LafT9nL25Pvfq480r0MFEIF0nQ7AWDZ8hZEDE8UZuicGG1ITpyxkQ==}
@@ -9334,7 +9249,7 @@ packages:
 
   /@types/vscode@1.70.0:
     resolution: {integrity: sha512-3/9Fz0F2eBgwciazc94Ien+9u1elnjFg9YAhvAb3qDy/WeFWD9VrOPU7CIytryOVUdbxus8uzL4VZYONA0gDtA==}
-    dev: false
+    dev: true
 
   /@types/which@2.0.2:
     resolution: {integrity: sha512-113D3mDkZDjo+EeUEHCFy0qniNc1ZpecGiAU7WSo7YDoSzolZIQKpYFHrPpjkB2nuyahcKfrmLXeQlh7gqJYdw==}
@@ -10446,7 +10361,7 @@ packages:
     engines: {node: '>=8'}
     dev: true
 
-  /autoprefixer@10.4.14(postcss@8.4.27):
+  /autoprefixer@10.4.14(postcss@8.4.24):
     resolution: {integrity: sha512-FQzyfOsTlwVzjHxKEqRIAdJx9niO6VCBCoEwax/VLSoQF29ggECcPuBqUMZ+u8jCZOPSy8b8/8KnuFbp0SaFZQ==}
     engines: {node: ^10 || ^12 || >=14}
     hasBin: true
@@ -10458,7 +10373,7 @@ packages:
       fraction.js: 4.2.0
       normalize-range: 0.1.2
       picocolors: 1.0.0
-      postcss: 8.4.27
+      postcss: 8.4.24
       postcss-value-parser: 4.2.0
     dev: true
 
@@ -10818,8 +10733,8 @@ packages:
     transitivePeerDependencies:
       - supports-color
 
-  /bole@5.0.6:
-    resolution: {integrity: sha512-HtZbVmxHqreaC29XVvGPShDtL2zSafkLe8vMdvFr4ppvtjrObVxtejoU/3jpRbxzxFeqDLXv5oIxUhSVw1NaAw==}
+  /bole@5.0.5:
+    resolution: {integrity: sha512-0hIw7WGx47i59q7FVPIDgS3Zo7ocisK3RKlNj18luJZvyjoPrDt4f9xTF51Axx92uMfTIjsvsxHowPtEHcQXCA==}
     dependencies:
       fast-safe-stringify: 2.1.1
       individual: 3.0.0
@@ -10897,17 +10812,6 @@ packages:
       pako: 0.2.9
     dev: true
 
-  /browserslist@4.21.10:
-    resolution: {integrity: sha512-bipEBdZfVH5/pwrvqc+Ub0kUPVfGUhlKxbvfD+z1BDnPEO/X98ruXGA1WP5ASpAFKan7Qr6j736IacbZQuAlKQ==}
-    engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
-    hasBin: true
-    dependencies:
-      caniuse-lite: 1.0.30001519
-      electron-to-chromium: 1.4.482
-      node-releases: 2.0.13
-      update-browserslist-db: 1.0.11(browserslist@4.21.10)
-    dev: true
-
   /browserslist@4.21.9:
     resolution: {integrity: sha512-M0MFoZzbUrRU4KNfCrDLnvyE7gub+peetoTid3TBIqtunaDJyXlwhakT+/VkvSXcfIzFfK/nkCs4nmyTmxdNSg==}
     engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
@@ -11164,10 +11068,6 @@ packages:
     resolution: {integrity: sha512-2uDDk+TRiTX5hMcUYT/7CSyzMZxjfGu0vAUjS2g0LSD8UoXOv0LtpH4LxGMemsiPq6LCVIUjNwVM0erkOkGCDA==}
     dev: true
 
-  /caniuse-lite@1.0.30001519:
-    resolution: {integrity: sha512-0QHgqR+Jv4bxHMp8kZ1Kn8CH55OikjKJ6JmKkZYP1F3D7w+lnFXF70nG5eNfsZS89jadi5Ywy5UCSKLAglIRkg==}
-    dev: true
-
   /case@1.6.3:
     resolution: {integrity: sha512-mzDSXIPaFwVDvZAHqZ9VlbyF4yyXRuX6IvB06WvPYkqJVO24kX1PPhv9bfpKNFZyxYFmmgo03HUiD8iklmJYRQ==}
     engines: {node: '>= 0.8.0'}
@@ -12604,10 +12504,6 @@ packages:
     resolution: {integrity: sha512-++DB+9VK8SBJwC+X1zlMfJ1tMA3F0ipi39GdEp+x3cV2TyBihqAgad8cNMWtLDEkbH39nlDQP7PfGrDr3Dr7HA==}
     dev: true
 
-  /electron-to-chromium@1.4.482:
-    resolution: {integrity: sha512-h+UqpfmEr1Qkk0zp7ej/jid7CXoq4m4QzW6wNTb0ELJ/BZCpA4wgUylBIMGCe621tnr4l5VmoHjdoSx2lbnNJA==}
-    dev: true
-
   /elkjs@0.8.2:
     resolution: {integrity: sha512-L6uRgvZTH+4OF5NE/MBbzQx/WYpru1xCBE9respNj6qznEewGUIfhzmm7horWWxbNO2M0WckQypGctR8lH79xQ==}
     dev: false
@@ -16478,7 +16374,7 @@ packages:
       semver: 7.5.3
       semver-intersect: 1.4.0
       stream-json: 1.8.0
-      typescript: 5.1.6
+      typescript: 5.1.3
       workerpool: 6.4.0
       yargs: 17.7.2
     transitivePeerDependencies:
@@ -16581,7 +16477,7 @@ packages:
       semver-intersect: 1.4.0
       sort-json: 2.0.1
       spdx-license-list: 6.6.0
-      typescript: 5.1.6
+      typescript: 5.1.3
       yargs: 17.7.2
     transitivePeerDependencies:
       - supports-color
@@ -17895,10 +17791,6 @@ packages:
     resolution: {integrity: sha512-QzsYKWhXTWx8h1kIvqfnC++o0pEmpRQA/aenALsL2F4pqNVr7YzcdMlDij5WBnwftRbJCNJL/O7zdKaxKPHqgQ==}
     dev: true
 
-  /node-releases@2.0.13:
-    resolution: {integrity: sha512-uYr7J37ae/ORWdZeQ1xxMJe3NtdmqMC/JZK+geofDrkLUApKRHPd18/TxtBOJ4A0/+uUIliorNrfYV6s1b02eQ==}
-    dev: true
-
   /nodemon@2.0.22:
     resolution: {integrity: sha512-B8YqaKMmyuCO7BowF1Z1/mkPqLk6cs/l63Ojtd6otKjMx47Dq1utxfRxcavH1I7VSaL8n5BUaoutadnsX3AAVQ==}
     engines: {node: '>=8.10.0'}
@@ -18832,7 +18724,24 @@ packages:
       camelcase-css: 2.0.1
       postcss: 8.4.24
 
-  /postcss-load-config@3.1.4(postcss@8.4.27):
+  /postcss-load-config@3.1.4(postcss@8.4.24):
+    resolution: {integrity: sha512-6DiM4E7v4coTE4uzA8U//WhtPwyhiim3eyjEMFCnUpzbrkK9wJHgKDT2mR+HbtSrd/NubVaYTOpSpjUl8NQeRg==}
+    engines: {node: '>= 10'}
+    peerDependencies:
+      postcss: '>=8.0.9'
+      ts-node: '>=9.0.0'
+    peerDependenciesMeta:
+      postcss:
+        optional: true
+      ts-node:
+        optional: true
+    dependencies:
+      lilconfig: 2.1.0
+      postcss: 8.4.24
+      yaml: 1.10.2
+    dev: true
+
+  /postcss-load-config@3.1.4(ts-node@10.9.1):
     resolution: {integrity: sha512-6DiM4E7v4coTE4uzA8U//WhtPwyhiim3eyjEMFCnUpzbrkK9wJHgKDT2mR+HbtSrd/NubVaYTOpSpjUl8NQeRg==}
     engines: {node: '>= 10'}
     peerDependencies:
@@ -18845,7 +18754,7 @@ packages:
         optional: true
     dependencies:
       lilconfig: 2.1.0
-      postcss: 8.4.27
+      ts-node: 10.9.1(@types/node@16.0.0)(typescript@4.9.4)
       yaml: 1.10.2
     dev: true
 
@@ -18892,15 +18801,6 @@ packages:
       picocolors: 1.0.0
       source-map-js: 1.0.2
 
-  /postcss@8.4.27:
-    resolution: {integrity: sha512-gY/ACJtJPSmUFPDCHtX78+01fHa64FaU4zaaWfuh1MhGJISufJAH4cun6k/8fwsHYeK4UQmENQK+tRLCFJE8JQ==}
-    engines: {node: ^10 || ^12 || >=14}
-    dependencies:
-      nanoid: 3.3.6
-      picocolors: 1.0.0
-      source-map-js: 1.0.2
-    dev: true
-
   /prebuild-install@7.1.1:
     resolution: {integrity: sha512-jAXscXWMcCK8GgCoHOfIr0ODh5ai8mj63L2nWrjuAgXE6tDyYGnx4/8o/rCgU+B4JSyZBKbeZqzhtwtC3ovxjw==}
     engines: {node: '>=10'}
@@ -19986,11 +19886,6 @@ packages:
     resolution: {integrity: sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==}
     hasBin: true
 
-  /semver@6.3.1:
-    resolution: {integrity: sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==}
-    hasBin: true
-    dev: true
-
   /semver@7.0.0:
     resolution: {integrity: sha512-+GB6zVA9LWh6zovYQLALHwv5rb2PHGlJi3lfiqIHxR0uuwCgefcOJc59v9fv1w8GbStwxuuqqAjI9NMAOOgq1A==}
     hasBin: true
@@ -21015,7 +20910,7 @@ packages:
       yargs-parser: 20.2.9
     dev: true
 
-  /ts-jest@29.0.5(@babel/core@7.22.9)(jest@29.3.1)(typescript@4.9.4):
+  /ts-jest@29.0.5(@babel/core@7.22.5)(jest@29.3.1)(typescript@4.9.4):
     resolution: {integrity: sha512-PL3UciSgIpQ7f6XjVOmbi96vmDHUqAyqDr8YxzopDqX3kfgYtX1cuNeBjP+L9sFXi6nzsGGA6R3fP3DDDJyrxA==}
     engines: {node: ^14.15.0 || ^16.10.0 || >=18.0.0}
     hasBin: true
@@ -21036,7 +20931,7 @@ packages:
       esbuild:
         optional: true
     dependencies:
-      '@babel/core': 7.22.9
+      '@babel/core': 7.22.5
       bs-logger: 0.2.6
       fast-json-stable-stringify: 2.1.0
       jest: 29.3.1(@types/node@16.0.0)(ts-node@10.9.1)
@@ -21125,7 +21020,7 @@ packages:
   /tslib@2.6.0:
     resolution: {integrity: sha512-7At1WUettjcSRHXCyYtTselblcHl9PJFFVKiCAy/bY97+BPZXSQ2wbq0P9s8tK2G7dFQfNnlJnPAiArVBVBsfA==}
 
-  /tsup@6.7.0(postcss@8.4.27)(typescript@5.1.3):
+  /tsup@6.7.0(postcss@8.4.24)(typescript@5.1.3):
     resolution: {integrity: sha512-L3o8hGkaHnu5TdJns+mCqFsDBo83bJ44rlK7e6VdanIvpea4ArPcU3swWGsLVbXak1PqQx/V+SSmFPujBK+zEQ==}
     engines: {node: '>=14.18'}
     hasBin: true
@@ -21149,8 +21044,8 @@ packages:
       execa: 5.1.1
       globby: 11.1.0
       joycon: 3.1.1
-      postcss: 8.4.27
-      postcss-load-config: 3.1.4(postcss@8.4.27)
+      postcss: 8.4.24
+      postcss-load-config: 3.1.4(postcss@8.4.24)
       resolve-from: 5.0.0
       rollup: 3.25.3
       source-map: 0.8.0-beta.0
@@ -21162,6 +21057,42 @@ packages:
       - ts-node
     dev: true
 
+  /tsup@6.7.0(ts-node@10.9.1)(typescript@4.9.4):
+    resolution: {integrity: sha512-L3o8hGkaHnu5TdJns+mCqFsDBo83bJ44rlK7e6VdanIvpea4ArPcU3swWGsLVbXak1PqQx/V+SSmFPujBK+zEQ==}
+    engines: {node: '>=14.18'}
+    hasBin: true
+    peerDependencies:
+      '@swc/core': ^1
+      postcss: ^8.4.12
+      typescript: '>=4.1.0'
+    peerDependenciesMeta:
+      '@swc/core':
+        optional: true
+      postcss:
+        optional: true
+      typescript:
+        optional: true
+    dependencies:
+      bundle-require: 4.0.1(esbuild@0.17.19)
+      cac: 6.7.14
+      chokidar: 3.5.3
+      debug: 4.3.4
+      esbuild: 0.17.19
+      execa: 5.1.1
+      globby: 11.1.0
+      joycon: 3.1.1
+      postcss-load-config: 3.1.4(ts-node@10.9.1)
+      resolve-from: 5.0.0
+      rollup: 3.25.3
+      source-map: 0.8.0-beta.0
+      sucrase: 3.32.0
+      tree-kill: 1.2.2
+      typescript: 4.9.4
+    transitivePeerDependencies:
+      - supports-color
+      - ts-node
+    dev: true
+
   /tsup@6.7.0(typescript@4.9.4):
     resolution: {integrity: sha512-L3o8hGkaHnu5TdJns+mCqFsDBo83bJ44rlK7e6VdanIvpea4ArPcU3swWGsLVbXak1PqQx/V+SSmFPujBK+zEQ==}
     engines: {node: '>=14.18'}
@@ -21186,7 +21117,7 @@ packages:
       execa: 5.1.1
       globby: 11.1.0
       joycon: 3.1.1
-      postcss-load-config: 3.1.4(postcss@8.4.27)
+      postcss-load-config: 3.1.4(postcss@8.4.24)
       resolve-from: 5.0.0
       rollup: 3.25.3
       source-map: 0.8.0-beta.0
@@ -21450,12 +21381,6 @@ packages:
     engines: {node: '>=14.17'}
     hasBin: true
 
-  /typescript@5.1.6:
-    resolution: {integrity: sha512-zaWCozRZ6DLEWAWFrVDz1H6FVXzUSfTy5FUMWsQlU8Ym5JP9eO4xkTIROFCQvhQf61z6O/G6ugw3SgAnvvm+HA==}
-    engines: {node: '>=14.17'}
-    hasBin: true
-    dev: true
-
   /typescript@5.2.0-dev.20230803:
     resolution: {integrity: sha512-DwCyutWHyT7Il7xpJCxtx4/S5F4qjAo2SE6QDRSLhEUtBFGwGHTHCvuyfm9KNrdwn67jGitdlw4gpbSTVVjoww==}
     engines: {node: '>=14.17'}
@@ -21659,17 +21584,6 @@ packages:
     resolution: {integrity: sha512-KK8xQ1mkzZeg9inewmFVDNkg3l5LUhoq9kN6iWYB/CC9YMG8HA+c1Q8HwDe6dEX7kErrEVNVBO3fWsVq5iDgtw==}
     engines: {node: '>=8'}
 
-  /update-browserslist-db@1.0.11(browserslist@4.21.10):
-    resolution: {integrity: sha512-dCwEFf0/oT85M1fHBg4F0jtLwJrutGoHSQXCh7u4o2t1drG+c0a9Flnqww6XUKSfQMPpJBRjU8d4RXB09qtvaA==}
-    hasBin: true
-    peerDependencies:
-      browserslist: '>= 4.21.0'
-    dependencies:
-      browserslist: 4.21.10
-      escalade: 3.1.1
-      picocolors: 1.0.0
-    dev: true
-
   /update-browserslist-db@1.0.11(browserslist@4.21.9):
     resolution: {integrity: sha512-dCwEFf0/oT85M1fHBg4F0jtLwJrutGoHSQXCh7u4o2t1drG+c0a9Flnqww6XUKSfQMPpJBRjU8d4RXB09qtvaA==}
     hasBin: true
@@ -22123,27 +22037,24 @@ packages:
   /vscode-jsonrpc@8.0.2:
     resolution: {integrity: sha512-RY7HwI/ydoC1Wwg4gJ3y6LpU9FJRZAUnTYMXthqhFXXu77ErDd/xkREpGuk4MyYkk4a+XDWAMqe0S3KkelYQEQ==}
     engines: {node: '>=14.0.0'}
-    dev: false
 
   /vscode-languageclient@8.0.2:
     resolution: {integrity: sha512-lHlthJtphG9gibGb/y72CKqQUxwPsMXijJVpHEC2bvbFqxmkj9LwQ3aGU9dwjBLqsX1S4KjShYppLvg1UJDF/Q==}
     engines: {vscode: ^1.67.0}
     dependencies:
       minimatch: 3.1.2
-      semver: 7.5.2
+      semver: 7.5.3
       vscode-languageserver-protocol: 3.17.2
-    dev: false
+    dev: true
 
   /vscode-languageserver-protocol@3.17.2:
     resolution: {integrity: sha512-8kYisQ3z/SQ2kyjlNeQxbkkTNmVFoQCqkmGrzLH6A9ecPlgTbp3wDTnUNqaUxYr4vlAcloxx8zwy7G5WdguYNg==}
     dependencies:
       vscode-jsonrpc: 8.0.2
       vscode-languageserver-types: 3.17.2
-    dev: false
 
   /vscode-languageserver-types@3.17.2:
     resolution: {integrity: sha512-zHhCWatviizPIq9B7Vh9uvrH6x3sK8itC84HkamnBWoDFJtzBf7SWlpLCZUit72b3os45h6RWQNC9xHRDF8dRA==}
-    dev: false
 
   /vscode-languageserver@8.0.2:
     resolution: {integrity: sha512-bpEt2ggPxKzsAOZlXmCJ50bV7VrxwCS5BI4+egUmure/oI/t4OlFzi/YNtVvY24A2UDOZAgwFGgnZPwqSJubkA==}
@@ -22415,7 +22326,6 @@ packages:
     hasBin: true
     dependencies:
       isexe: 2.0.0
-    dev: false
 
   /which@2.0.2:
     resolution: {integrity: sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==}
@@ -22424,14 +22334,6 @@ packages:
     dependencies:
       isexe: 2.0.0
 
-  /which@3.0.0:
-    resolution: {integrity: sha512-nla//68K9NU6yRiwDY/Q8aU6siKlSs64aEC7+IV56QoAuyQT2ovsJcgGYGyqMOmI/CGN1BOR6mM5EN0FBO+zyQ==}
-    engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
-    hasBin: true
-    dependencies:
-      isexe: 2.0.0
-    dev: false
-
   /which@3.0.1:
     resolution: {integrity: sha512-XA1b62dzQzLfaEOSQFTCOd5KFf/1VSzZo7/7TUjnya6u0vGGKzU96UQBZTAThCb2j4/xjBAyii1OhRLJEivHvg==}
     engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}