From d860ef4b235f048323371a6f42c6b4fc9ca9486b Mon Sep 17 00:00:00 2001
From: Justin Grote <JustinGrote@users.noreply.github.com>
Date: Fri, 16 Jan 2026 13:45:35 -0800
Subject: [PATCH 1/2] Modernize and streamline status bar visual appearance

- Reduce clutter by using icons and moving detailed info to tooltips
- Add spin animation for start/stop
- Add color indicator for started/stopped
---
 src/common/VSCStatusBarItem.ts | 59 +++++++++++++++++++++++-----------
 1 file changed, 40 insertions(+), 19 deletions(-)

diff --git a/src/common/VSCStatusBarItem.ts b/src/common/VSCStatusBarItem.ts
index 925ac53cb..0ee7310b1 100644
--- a/src/common/VSCStatusBarItem.ts
+++ b/src/common/VSCStatusBarItem.ts
@@ -1,4 +1,4 @@
-import { StatusBarItem } from "vscode";
+import { StatusBarItem, ThemeColor } from "vscode";
 
 import IVSCServerManagerEventsHandler from "./IVSCServerManagerEventsHandler";
 import { ServerStatus } from "./ServerBase";
@@ -6,20 +6,41 @@ import VSCServerManagerBase from "./VSCServerManagerBase";
 
 export default class VSCStatusBarItem
   implements IVSCServerManagerEventsHandler {
+  private readonly icon: string;
+  private readonly offlineColor = new ThemeColor("statusBarItem.offlineForeground");
+
   constructor(
     public readonly serverManager: VSCServerManagerBase,
     public readonly statusBarItem: StatusBarItem
   ) {
-    this.statusBarItem.text = `[${serverManager.name}]`;
+    // Determine icon based on service name
+    if (serverManager.name.includes("Blob")) {
+      this.icon = "$(file-binary)";
+    } else if (serverManager.name.includes("Queue")) {
+      this.icon = "$(list-ordered)";
+    } else if (serverManager.name.includes("Table")) {
+      this.icon = "$(table)";
+    } else {
+      this.icon = "$(server)";
+    }
+    this.initialize(this.serverManager);
+  }
+
+  public initialize(serverManager: VSCServerManagerBase): void {
+    this.statusBarItem.text = this.icon;
+    this.statusBarItem.backgroundColor = undefined;
+    this.statusBarItem.color = this.offlineColor;
     this.statusBarItem.command = serverManager.getStartCommand();
-    this.statusBarItem.tooltip = `Start ${serverManager.name}`;
+    this.statusBarItem.tooltip = `${serverManager.name} - Click to start`;
     this.statusBarItem.show();
   }
 
   public onStart(serverManager: VSCServerManagerBase): void {
-    this.statusBarItem.text = `[${serverManager.name}] Starting...`;
+    this.statusBarItem.text = "$(sync~spin)";
+    this.statusBarItem.backgroundColor = undefined;
+    this.statusBarItem.color = undefined;
     this.statusBarItem.command = undefined;
-    this.statusBarItem.tooltip = ``;
+    this.statusBarItem.tooltip = `${serverManager.name} - Starting...`;
     this.statusBarItem.show();
   }
 
@@ -50,18 +71,17 @@ export default class VSCStatusBarItem
 
   public onStartSuccess(serverManager: VSCServerManagerBase): void {
     const server = serverManager.getServer()!;
-    this.statusBarItem.text = `[${
-      serverManager.name
-    }] Running on ${server.getHttpServerAddress()}`;
+    this.statusBarItem.text = this.icon;
+    this.statusBarItem.color = new ThemeColor("ports.iconRunningProcessForeground");
     this.statusBarItem.command = serverManager.getCloseCommand();
-    this.statusBarItem.tooltip = `Close ${serverManager.name}`;
+    this.statusBarItem.tooltip = `${serverManager.name} - Running on ${server.getHttpServerAddress()}\nClick to close`;
     this.statusBarItem.show();
   }
 
   public onClean(serverManager: VSCServerManagerBase): void {
-    this.statusBarItem.text = `[${serverManager.name}] Cleaning`;
+    this.statusBarItem.text = "$(sync~spin)";
     this.statusBarItem.command = undefined;
-    this.statusBarItem.tooltip = ``;
+    this.statusBarItem.tooltip = `${serverManager.name} - Cleaning`;
     this.statusBarItem.show();
   }
 
@@ -91,16 +111,15 @@ export default class VSCStatusBarItem
   }
 
   public onCleanSuccess(serverManager: VSCServerManagerBase): void {
-    this.statusBarItem.text = `[${serverManager.name}]`;
-    this.statusBarItem.command = serverManager.getStartCommand();
-    this.statusBarItem.tooltip = `Start ${serverManager.name}`;
-    this.statusBarItem.show();
+    this.initialize(serverManager);
   }
 
   public onClose(serverManager: VSCServerManagerBase): void {
-    this.statusBarItem.text = `[${serverManager.name}] Closing...`;
+    this.statusBarItem.text = "$(sync~spin)";
+    this.statusBarItem.backgroundColor = undefined;
+    this.statusBarItem.color = undefined;
     this.statusBarItem.command = undefined;
-    this.statusBarItem.tooltip = ``;
+    this.statusBarItem.tooltip = `${serverManager.name} - Closing...`;
     this.statusBarItem.show();
   }
 
@@ -130,9 +149,11 @@ export default class VSCStatusBarItem
   }
 
   public onCloseSuccess(serverManager: VSCServerManagerBase): void {
-    this.statusBarItem.text = `[${serverManager.name}]`;
+    this.statusBarItem.text = this.icon;
+    this.statusBarItem.backgroundColor = undefined;
+    this.statusBarItem.color = this.offlineColor;
     this.statusBarItem.command = serverManager.getStartCommand();
-    this.statusBarItem.tooltip = `Start ${serverManager.name}`;
+    this.statusBarItem.tooltip = `${serverManager.name} - Click to start`;
     this.statusBarItem.show();
   }
 }

From f37b769232c560e6d127fb1978140643159912f6 Mon Sep 17 00:00:00 2001
From: Justin Grote <JustinGrote@users.noreply.github.com>
Date: Fri, 16 Jan 2026 13:47:29 -0800
Subject: [PATCH 2/2] Add changelog for status bar changes

---
 ChangeLog.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/ChangeLog.md b/ChangeLog.md
index c29751d9c..1e7aca388 100644
--- a/ChangeLog.md
+++ b/ChangeLog.md
@@ -8,6 +8,7 @@ General:
 
 - Performance improvements for internal metadata access using in-memory metadata store
 - Fix building failure on Node 22 platform.
+- Modernize and improve status bar icons
 
 ## 2025.07 Version 3.35.0