feat(orb-ui): Expose warning sink messages (#2735)

* feat(orb-ui): Expose warning sink messages * remove sink details scss
orb-community · Oct 9, 2023 · 86360e3 · 86360e3
1 parent e475f4b
commit 86360e3
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 2 deletions.
diff --git a/ui/src/app/@theme/styles/_overrides.scss b/ui/src/app/@theme/styles/_overrides.scss
@@ -214,6 +214,15 @@
   &offline, &none {
     color: #969fb9;
   }
+  &provisioning {
+    color: #3089fc;
+  }
+  &provioning_error {
+    color: #df316f;
+  }
+  &warning {
+    color: #f2c94c;
+  }
 }
 .orb-service-background- {
   &new, &unknown {

diff --git a/ui/src/app/common/interfaces/orb/sink.interface.ts b/ui/src/app/common/interfaces/orb/sink.interface.ts
@@ -16,6 +16,9 @@ export enum SinkStates {
   error = 'error',
   idle = 'idle',
   unknown = 'unknown',
+  provisioning = 'provisioning',
+  provisioning_error = 'provisioning_error',
+  warning = 'warning',
 }
 
 /**

diff --git a/ui/src/app/shared/components/orb/sink/sink-details/sink-details.component.html b/ui/src/app/shared/components/orb/sink/sink-details/sink-details.component.html
@@ -41,8 +41,9 @@
           </div> 
           <div class="flex-row">
             <label class="summary-accent">Status</label>
-            <p *ngIf="sink?.state !== sinkStates.error" class="orb-service-{{sink?.state}}"> {{ sink?.state | titlecase }} </p>
-            <p *ngIf="sink?.state === sinkStates.error" class="orb-service-{{sink?.state}}"> {{ sink?.state | titlecase }} {{ sink?.error | titlecase }} </p>
+            <p *ngIf="sink?.state !== sinkStates.error && sink?.state !== sinkStates.warning" class="orb-service-{{sink?.state}}"> {{ sink?.state | titlecase }} </p>
+            <p *ngIf="sink?.state === sinkStates.error" class="orb-service-{{sink?.state}}"> {{ sink?.state | titlecase }} {{ sink?.error }} </p>
+            <p *ngIf="sink?.state === sinkStates.warning" class="orb-service-{{sink?.state}}"> {{ sink?.state | titlecase }} {{ sink?.error }} </p>
           </div>
           <div class="flex-row">
             <label class="summary-accent">Tags</label>