fix: UI should distinguish pending from offline

Author: starpit

Diff for: plugins/plugin-codeflare/src/tray/watchers/profile/status.ts

@@ -41,11 +41,18 @@ export default class ProfileStatusWatcher {
       ? "pending"
       : this.headReadiness === "error" || this.workerReadiness === "error"
       ? "error"
+      : this.isOffline(this.headReadiness) && this.isOffline(this.workerReadiness)
+      ? "offline"
       : !this.isReady(this.headReadiness) && !this.isReady(this.workerReadiness)
       ? "pending"
       : "success"
   }
 
+  private isOffline(readiness: string) {
+    const match = readiness.match(/^(\d)+\/(\d)+$/)
+    return match && match[1] === "0"
+  }
+
   private isReady(readiness: string) {
     const match = readiness.match(/^(\d)+\/(\d)+$/)
     return match && match[1] === match[2]

Diff for: plugins/plugin-codeflare/web/scss/components/ProfileExplorer/_index.scss

@@ -67,6 +67,10 @@
       background-color: var(--color-warning);
     }
 
+    &--offline {
+      background-color: var(--color-red);
+    }
+
     &--success {
       background-color: var(--color-ok);
     }