Feat: visualize instance running state in sidebar

assets/gui/css/alas.css

@@ -331,6 +331,20 @@ pre.rich-traceback-code {
     }
 }
 
+/* State animations for aside instance icons */
+.aside-icon-warning {
+    animation: aside-icon-blink 1s ease-in-out infinite;
+}
+
+.aside-icon-updating {
+    animation: aside-icon-blink 1.5s ease-in-out infinite;
+}
+
+@keyframes aside-icon-blink {
+    0%, 100% { opacity: 1; }
+    50% { opacity: 0.3; }
+}
+
 #pywebio-scope-contents {
     margin-top: 0;
     overflow-y: auto;

assets/gui/css/dark-alas.css

@@ -95,6 +95,19 @@ textarea {
     fill: #c9d1d9;
 }
 
+/* State colors for aside instance icons */
+.aside-icon.aside-icon-run > path {
+    fill: #5cb85c;
+}
+
+.aside-icon.aside-icon-warning > path {
+    fill: #ff6b6b;
+}
+
+.aside-icon.aside-icon-updating > path {
+    fill: #5cb85c;
+}
+
 .container-log {
     background-color: #2f3136 !important;
     border: 1px solid #21262d;

assets/gui/css/light-alas.css

@@ -100,6 +100,19 @@ textarea {
     fill: #2c2c2c;
 }
 
+/* State colors for aside instance icons */
+.aside-icon.aside-icon-run > path {
+    fill: #28a745;
+}
+
+.aside-icon.aside-icon-warning > path {
+    fill: #dc3545;
+}
+
+.aside-icon.aside-icon-updating > path {
+    fill: #28a745;
+}
+
 .container-log {
     background-color: white !important;
     border: 1px solid lightgrey;

module/webui/app.py

@@ -128,6 +128,12 @@ class AlasGUI(Frame):
     ALAS_ARGS: Dict[str, Dict[str, Dict[str, Dict[str, str]]]]
     theme = "default"
     _log = RichLog
+    # state 2 (inactive) is unmapped to keep default aside-icon color
+    ASIDE_ICON_STATE_CLASS = {
+        1: "aside-icon-run",
+        3: "aside-icon-warning",
+        4: "aside-icon-updating",
+    }
 
     def initial(self) -> None:
         self.ALAS_MENU = read_file(filepath_args("menu", self.alas_mod))
@@ -186,8 +192,16 @@ class AlasGUI(Frame):
 
         def update(name, seq):
             with use_scope(f"alas-instance-{seq}", clear=True):
-                icon_html = Icon.RUN
                 rendered_state = ProcessManager.get_manager(inst).state
+                # Inject state class for color and animation
+                state_class = self.ASIDE_ICON_STATE_CLASS.get(rendered_state, "")
+                icon_html = Icon.RUN
+                if state_class:
+                    icon_html = icon_html.replace(
+                        'class="aside-icon icon-run"',
+                        f'class="aside-icon icon-run {state_class}"',
+                        1,
+                    )
                 if rendered_state == 1 and self.af_flag:
                     icon_html = icon_html[:31] + ' anim-rotate' + icon_html[31:]
                 put_icon_buttons(