Merge pull request #328 from apache/DLAB-1075

[DLAB-1075]: Added possibility to stop project with related instances…
diff --git a/infrastructure-provisioning/src/general/scripts/aws/zeppelin_configure.py b/infrastructure-provisioning/src/general/scripts/aws/zeppelin_configure.py
index ed445bf..890025d 100644
--- a/infrastructure-provisioning/src/general/scripts/aws/zeppelin_configure.py
+++ b/infrastructure-provisioning/src/general/scripts/aws/zeppelin_configure.py
@@ -321,9 +321,9 @@
                "Action": "Create new notebook server",
                "exploratory_url": [
                    {"description": "Apache Zeppelin",
-                    "url": zeppelin_notebook_acces_url}#,
-                   #{"description": "Ungit",
-                   # "url": zeppelin_ungit_acces_url},
+                    "url": zeppelin_notebook_acces_url},
+                   {"description": "Ungit",
+                    "url": zeppelin_ungit_acces_url}#,
                    #{"description": "Apache Zeppelin (via tunnel)",
                    # "url": zeppelin_ip_url},
                    #{"description": "Ungit (via tunnel)",
diff --git a/services/billing-aws/src/main/java/com/epam/dlab/mongo/MongoConstants.java b/services/billing-aws/src/main/java/com/epam/dlab/mongo/MongoConstants.java
index 4e9de76..68c56cd 100644
--- a/services/billing-aws/src/main/java/com/epam/dlab/mongo/MongoConstants.java
+++ b/services/billing-aws/src/main/java/com/epam/dlab/mongo/MongoConstants.java
@@ -53,7 +53,7 @@
 
     /** Collection billingTotal. */
 	String COLLECTION_BILLING_TOTAL = "billingTotal";
-	String FIELD_USAGE_DATE_START = "usage_date_start";
-	String FIELD_USAGE_DATE_END = "usage_date_end";
+	String FIELD_USAGE_DATE_START = "from";
+	String FIELD_USAGE_DATE_END = "to";
 	String BILLING_DATA_COLLECTION = "BillingData";
 }
diff --git a/services/billing-gcp/src/main/java/com/epam/dlab/billing/gcp/service/BillingServiceImpl.java b/services/billing-gcp/src/main/java/com/epam/dlab/billing/gcp/service/BillingServiceImpl.java
index cfcfbf4..6a104ca 100644
--- a/services/billing-gcp/src/main/java/com/epam/dlab/billing/gcp/service/BillingServiceImpl.java
+++ b/services/billing-gcp/src/main/java/com/epam/dlab/billing/gcp/service/BillingServiceImpl.java
@@ -85,6 +85,7 @@
 			final Stream<BillingData> billableEdges = projectRepository.findAll()
 					.stream()
 					.map(Project::getName)
+					.map(String::toLowerCase)
 					.flatMap(project -> edgeBillingDataStream(project, sbn));
 
 			final Map<String, BillingData> billableResources = Stream.of(billableUserInstances, billableEdges,
diff --git a/services/self-service/src/main/java/com/epam/dlab/backendapi/dao/BaseBillingDAO.java b/services/self-service/src/main/java/com/epam/dlab/backendapi/dao/BaseBillingDAO.java
index d475eed..ea0cf06 100644
--- a/services/self-service/src/main/java/com/epam/dlab/backendapi/dao/BaseBillingDAO.java
+++ b/services/self-service/src/main/java/com/epam/dlab/backendapi/dao/BaseBillingDAO.java
@@ -104,7 +104,7 @@
 		pipeline.add(sortCriteria());
 		final Map<String, ShapeInfo> shapes = getShapes(filter.getShapes());
 		return prepareReport(filter.getStatuses(), !filter.getShapes().isEmpty(),
-				getCollection(BILLING).aggregate(pipeline), shapes, isFullReport); //TODO add shapes
+				getCollection(BILLING).aggregate(pipeline), shapes, isFullReport);
 	}
 
 	private Document prepareReport(List<UserInstanceStatus> statuses, boolean filterByShape,
diff --git a/services/self-service/src/main/java/com/epam/dlab/backendapi/resources/KeycloakResource.java b/services/self-service/src/main/java/com/epam/dlab/backendapi/resources/KeycloakResource.java
index 9d4d66c..e719215 100644
--- a/services/self-service/src/main/java/com/epam/dlab/backendapi/resources/KeycloakResource.java
+++ b/services/self-service/src/main/java/com/epam/dlab/backendapi/resources/KeycloakResource.java
@@ -19,7 +19,7 @@
 
 @Path("/oauth")
 public class KeycloakResource {
-	private static final String LOGIN_URI_FORMAT = "%s/realms/%s/protocol/openid-connect/auth?client_id=%s" +
+	private static final String LOGIN_URI_FORMAT = "%s/realms/%s/protocol/openid-connect/auth?client_id=%s&redirect_uri=%s" +
 			"&response_type=code";
 	private static final String KEYCLOAK_LOGOUT_URI_FORMAT = "%s/realms/%s/protocol/openid-connect/logout" +
 			"?redirect_uri=";
@@ -43,7 +43,8 @@
 				format(LOGIN_URI_FORMAT,
 						keycloakConfiguration.getAuthServerUrl(),
 						keycloakConfiguration.getRealm(),
-						keycloakConfiguration.getResource());
+						keycloakConfiguration.getResource(),
+						redirectUri);
 		logoutUri =
 				format(KEYCLOAK_LOGOUT_URI_FORMAT,
 						keycloakConfiguration.getAuthServerUrl(),
@@ -52,8 +53,8 @@
 
 	@GET
 	@Produces(MediaType.TEXT_PLAIN)
-	public Response getLoginUri() {
-		return Response.ok(loginUri)
+	public Response getLoginUri() throws URISyntaxException {
+		return Response.ok(new URI(loginUri).toString())
 				.build();
 	}
 
diff --git a/services/self-service/src/main/java/com/epam/dlab/backendapi/service/KeycloakServiceImpl.java b/services/self-service/src/main/java/com/epam/dlab/backendapi/service/KeycloakServiceImpl.java
index aaf6c02..dffd112 100644
--- a/services/self-service/src/main/java/com/epam/dlab/backendapi/service/KeycloakServiceImpl.java
+++ b/services/self-service/src/main/java/com/epam/dlab/backendapi/service/KeycloakServiceImpl.java
@@ -20,11 +20,13 @@
 	private static final String URI = "/realms/%s/protocol/openid-connect/token";
 	private final Client httpClient;
 	private final KeycloakConfiguration conf;
+	private final String redirectUri;
 
 	@Inject
 	public KeycloakServiceImpl(Client httpClient, SelfServiceApplicationConfiguration conf) {
 		this.httpClient = httpClient;
 		this.conf = conf.getKeycloakConfiguration();
+		this.redirectUri = conf.getKeycloakConfiguration().getRedirectUri();
 	}
 
 	@Override
@@ -55,7 +57,8 @@
 	private Form accessTokenRequestForm(String code) {
 		return new Form()
 				.param("grant_type", "authorization_code")
-				.param("code", code);
+				.param("code", code)
+				.param("redirect_uri", redirectUri);
 	}
 
 	private Form refreshTokenRequestForm(String refreshToken) {
diff --git a/services/self-service/src/main/java/com/epam/dlab/backendapi/servlet/guacamole/GuacamoleSecurityFilter.java b/services/self-service/src/main/java/com/epam/dlab/backendapi/servlet/guacamole/GuacamoleSecurityFilter.java
index b94058c..447de12 100644
--- a/services/self-service/src/main/java/com/epam/dlab/backendapi/servlet/guacamole/GuacamoleSecurityFilter.java
+++ b/services/self-service/src/main/java/com/epam/dlab/backendapi/servlet/guacamole/GuacamoleSecurityFilter.java
@@ -42,7 +42,6 @@
 		} else {
 			response.sendError(HttpServletResponse.SC_UNAUTHORIZED);
 		}
-		filterChain.doFilter(servletRequest, servletResponse);
 
 	}
 
diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/management/endpoints/endpoints.component.html b/services/self-service/src/main/resources/webapp/src/app/administration/management/endpoints/endpoints.component.html
index 5c30647..735bf16 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/management/endpoints/endpoints.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/management/endpoints/endpoints.component.html
@@ -47,8 +47,7 @@
                   <input type="text" formControlName="url" placeholder="Enter endpoint url">
                   <span class="error"
                     *ngIf="!createEndpointForm?.controls.url.valid && createEndpointForm.controls.url.touched">
-                    Endpoint url can only contain letters, numbers, hyphens, underscores, slashes and should end with
-                    slash
+                    Endpoint url should end with slash
                   </span>
                 </div>
               </div>
diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.html b/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.html
index 31aa49e..3f8beb5 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.html
@@ -121,8 +121,8 @@
     </ng-container>
 
     <ng-container matColumnDef="actions">
-      <th mat-header-cell *matHeaderCellDef class="actions"></th>
-      <td mat-cell *matCellDef="let element" class="actions settings">
+      <th mat-header-cell *matHeaderCellDef class=""></th>
+      <td mat-cell *matCellDef="let element" class=" settings">
         <span #settings class="actions" (click)="actions.toggle($event, settings)" *ngIf="element.type !== 'edge node'"
           [ngClass]="{ 'disabled'
             : element.status !== 'running' && element.status !== 'stopped' && element.status !== 'stopping' && element.status !== 'failed' }"></span>
diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.scss b/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.scss
index 511b4e1..996d0c0 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/management/management-grid/management-grid.component.scss
@@ -31,7 +31,7 @@
     }
 
     .shape {
-      width: 15% !important;
+      width: 16% !important;
     }
 
     .status {
@@ -47,7 +47,7 @@
       padding: 5px;
     }
 
-    .actions {
+    .actions-col {
       width: 10%;
     }
 
@@ -66,6 +66,10 @@
 table {
   width: 100%;
 
+  td {
+    padding: 5px;
+  }
+
   .header-row {
     .label {
       display: inline-block;
diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/project/project-form/project-form.component.ts b/services/self-service/src/main/resources/webapp/src/app/administration/project/project-form/project-form.component.ts
index 6823de3..009456c 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/project/project-form/project-form.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/project/project-form/project-form.component.ts
@@ -152,18 +152,22 @@
   }
 
   public editSpecificProject(item: Project) {
+    let endpoints = item.endpoints.map((item: any) => item.name);
 
     this.projectForm = this._fb.group({
       'key': [''],
       'name': [item.name, Validators.required],
-      'endpoints': [item.endpoints.map((item: any) => item.name)],
+      'endpoints': [endpoints],
       'tag': [item.tag, Validators.required],
       'groups': [item.groups, Validators.required]
     });
   }
 
   isDisabled(endpoint: any): boolean {
-    return this.item && this.item.endpoints.includes(endpoint);
+    if (this.item) {
+      const endpoints = this.item.endpoints.map((item: any) => item.name);
+      return endpoints.includes(endpoint);
+    }
   }
 
   private getLabel(file: File): string {
diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.html b/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.html
index af03f2c..3e39df2 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.html
@@ -33,7 +33,10 @@
   </ng-container>
 
   <ng-container matColumnDef="endpoints">
-    <th mat-header-cell *matHeaderCellDef class="endpoints"> Endpoints </th>
+    <th mat-header-cell *matHeaderCellDef class="endpoints">
+      <span class="label-1"> Endpoint </span>
+      <span class="label-2"> Endpoint status </span>
+    </th>
     <td mat-cell *matCellDef="let element" class="source endpoints">
       <!-- <mat-chip-list>
         <mat-chip *ngFor="let endpoint of element.endpoints">{{ endpoint }}</mat-chip>
diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.scss b/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.scss
index 6328c3b..81ffcf9 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/project/project-list/project-list.component.scss
@@ -31,7 +31,12 @@
 
   .endpoints {
     width: 25%;
-    padding: 10px 0;
+    padding: 15px 0;
+
+    .label-1 {
+      display: inline-block;
+      width: 50%;
+    }
   }
 
   .groups {
diff --git a/services/self-service/src/main/resources/webapp/src/app/administration/roles/roles.component.html b/services/self-service/src/main/resources/webapp/src/app/administration/roles/roles.component.html
index fcba45d..100406a 100644
--- a/services/self-service/src/main/resources/webapp/src/app/administration/roles/roles.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/administration/roles/roles.component.html
@@ -46,6 +46,19 @@
         </div>
       </mat-step>
       <mat-step>
+        <ng-template matStepLabel>Users</ng-template>
+        <div class="inner-step mat-reset">
+          <input type="text" placeholder="Enter user login" [(ngModel)]="setupUser">
+        </div>
+        <div class="text-center m-bott-10">
+          <button mat-raised-button matStepperPrevious class="butt"><i
+              class="material-icons">keyboard_arrow_left</i>Back</button>
+          <button mat-raised-button (click)="resetDialog()" class="butt">Cancel</button>
+          <button mat-raised-button (click)="manageAction('create', 'group')" class="butt butt-success"
+            [disabled]="!setupGroup || setupGroupName.errors?.patterns || setupGroupName.errors?.duplicate || !setupRoles.length > 0">Create</button>
+        </div>
+      </mat-step>
+      <mat-step>
         <ng-template matStepLabel>Roles</ng-template>
         <div class="inner-step mat-reset">
           <div class="selector-wrapper">
@@ -78,19 +91,6 @@
               class="material-icons">keyboard_arrow_right</i></button>
         </div>
       </mat-step>
-      <mat-step>
-        <ng-template matStepLabel>Users</ng-template>
-        <div class="inner-step mat-reset">
-          <input type="text" placeholder="Enter user login" [(ngModel)]="setupUser">
-        </div>
-        <div class="text-center m-bott-10">
-          <button mat-raised-button matStepperPrevious class="butt"><i
-              class="material-icons">keyboard_arrow_left</i>Back</button>
-          <button mat-raised-button (click)="resetDialog()" class="butt">Cancel</button>
-          <button mat-raised-button (click)="manageAction('create', 'group')" class="butt butt-success"
-            [disabled]="!setupGroup || setupGroupName.errors?.patterns || setupGroupName.errors?.duplicate || !setupRoles.length > 0">Create</button>
-        </div>
-      </mat-step>
     </mat-horizontal-stepper>
   </mat-card>
   <mat-divider></mat-divider>
diff --git a/services/self-service/src/main/resources/webapp/src/app/reporting/reporting-grid/reporting-grid.component.html b/services/self-service/src/main/resources/webapp/src/app/reporting/reporting-grid/reporting-grid.component.html
index dbaef33..ac576ca 100644
--- a/services/self-service/src/main/resources/webapp/src/app/reporting/reporting-grid/reporting-grid.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/reporting/reporting-grid/reporting-grid.component.html
@@ -215,7 +215,8 @@
       class="filter-row"></tr>
     <tr mat-row *matRowDef="let row; columns: displayedColumns;" class="DATA"></tr>
 
-    <tr [hidden]="!reportData?.length" mat-footer-row *matFooterRowDef="displayedColumns; sticky: true"></tr>
+    <tr [hidden]="!reportData?.length" mat-footer-row *matFooterRowDef="displayedColumns; sticky: true"
+      class="header-row"></tr>
     <tr [hidden]="reportData?.length" mat-footer-row *matFooterRowDef="['placeholder']"></tr>
   </table>
 </section>
diff --git a/services/self-service/src/main/resources/webapp/src/app/reporting/reporting-grid/reporting-grid.component.scss b/services/self-service/src/main/resources/webapp/src/app/reporting/reporting-grid/reporting-grid.component.scss
index c918b41..2ceff2b 100644
--- a/services/self-service/src/main/resources/webapp/src/app/reporting/reporting-grid/reporting-grid.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/reporting/reporting-grid/reporting-grid.component.scss
@@ -39,6 +39,10 @@
 
     td {
       font-size: 13px;
+
+      &.info {
+        z-index: 1 !important;
+      }
     }
 
     &.filter-row {
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.ts b/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.ts
index df58386..bcb5d61 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resource-create-dialog/computational-resource-create-dialog.component.ts
@@ -234,7 +234,7 @@
 
   private providerMaxLength(control) {
     if (DICTIONARY.cloud_provider !== 'aws')
-      return control.value.length <= 10 ? null : { valid: false };
+      return control.value.length <= DICTIONARY.max_cluster_name_length ? null : { valid: false };
   }
 
   private getTemplates(project, endpoint) {
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resources-list/computational-resources-list.component.scss b/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resources-list/computational-resources-list.component.scss
index d82adc5..76dc045 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resources-list/computational-resources-list.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/computational/computational-resources-list/computational-resources-list.component.scss
@@ -20,6 +20,7 @@
 .source {
   .no-details {
     color: #bdc9d5;
+    padding-left: 10px;
   }
 
   .resource-wrap {
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html
index 53002c0..71615f4 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html
@@ -140,7 +140,7 @@
             </span>
           </td>
 
-          <td class="actions-col settings">
+          <td class="settings">
             <span #settings (click)="actions.toggle($event, settings)" class="actions"
               [ngClass]="{ 'disabled': element.status.toLowerCase() === 'creating' }">
             </span>
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.scss b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.scss
index bcc7579..64004d3 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.scss
@@ -25,11 +25,16 @@
   width: 100%;
 
   .header-row {
+    th {
+      padding: 5px;
+    }
+
     .label {
       display: inline-block;
       padding-top: 10px;
       vertical-align: super !important;
       padding-left: 5px;
+      font-size: 12px;
     }
   }
 
@@ -80,19 +85,13 @@
     padding-left: 24px;
   }
 
-  .status-col {
-    width: 14%;
-    // padding: 5px;
-  }
-
+  .status-col,
   .shape-col {
     width: 14%;
-    // padding: 5px;
   }
 
   .tag-col {
     width: 10%;
-    // padding: 5px;
 
     mat-chip {
       min-height: 20px;
@@ -109,7 +108,6 @@
 
   .resources-col {
     width: 28%;
-    // padding: 5px;
   }
 
   .cost-col {
@@ -268,24 +266,25 @@
 
 .settings {
   position: relative;
+  text-align: right;
+  min-width: 5%;
+
+  .actions {
+    background-image: url(../../../assets/svg/settings_icon.svg);
+    width: 16px;
+    height: 16px;
+    display: inline-block;
+    text-align: center;
+    cursor: pointer;
+  }
+
+  .disabled {
+    opacity: 0.4;
+    cursor: not-allowed;
+    pointer-events: none;
+  }
 }
 
-.settings .disabled {
-  opacity: 0.4;
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.settings .actions {
-  background-image: url(../../../assets/svg/settings_icon.svg);
-  width: 16px;
-  height: 16px;
-  display: inline-block;
-  text-align: center;
-  cursor: pointer;
-  position: absolute;
-  right: 15px;
-}
 
 .data-grid .list-menu li {
   font-size: 14px;
diff --git a/services/self-service/src/main/resources/webapp/src/dictionary/aws.dictionary.ts b/services/self-service/src/main/resources/webapp/src/dictionary/aws.dictionary.ts
index cf27936..fd767e7 100644
--- a/services/self-service/src/main/resources/webapp/src/dictionary/aws.dictionary.ts
+++ b/services/self-service/src/main/resources/webapp/src/dictionary/aws.dictionary.ts
@@ -34,6 +34,7 @@
     'total_instance_number': 'total_instance_number',
     'spot_instance': 'Spot instance',
     'cluster_version': 'emr_version',
+    'max_cluster_name_length': 64,
     'billing': {
         'resourceName': 'resource_name',
         'cost': 'cost',
diff --git a/services/self-service/src/main/resources/webapp/src/dictionary/azure.dictionary.ts b/services/self-service/src/main/resources/webapp/src/dictionary/azure.dictionary.ts
index b8779b6..fd178c5 100644
--- a/services/self-service/src/main/resources/webapp/src/dictionary/azure.dictionary.ts
+++ b/services/self-service/src/main/resources/webapp/src/dictionary/azure.dictionary.ts
@@ -35,6 +35,7 @@
 
     'spot_instance': 'Low-priority virtual machines',
     'cluster_version': '',
+    'max_cluster_name_length': 10,
     'billing': {
         'resourceName': 'resourceName',
         'cost': 'costString',
diff --git a/services/self-service/src/main/resources/webapp/src/dictionary/gcp.dictionary.ts b/services/self-service/src/main/resources/webapp/src/dictionary/gcp.dictionary.ts
index b5a928c..3d6f26e 100644
--- a/services/self-service/src/main/resources/webapp/src/dictionary/gcp.dictionary.ts
+++ b/services/self-service/src/main/resources/webapp/src/dictionary/gcp.dictionary.ts
@@ -36,6 +36,7 @@
 
     'spot_instance': 'Preemptible worker nodes',
     'cluster_version': 'dataproc_version',
+    'max_cluster_name_length': 9,
     'billing': {
         'resourceName': 'resource_name',
         'cost': 'cost',
diff --git a/services/self-service/src/main/resources/webapp/src/styles.scss b/services/self-service/src/main/resources/webapp/src/styles.scss
index 98697ec..9cc4a59 100644
--- a/services/self-service/src/main/resources/webapp/src/styles.scss
+++ b/services/self-service/src/main/resources/webapp/src/styles.scss
@@ -106,19 +106,23 @@
 .starting,
 .installed,
 .active,
-.activating {
+.activating,
+.connected {
   color: #49af38;
 }
 
 .stopped,
 .stopping,
 .deactivating,
-.not_active {
+.not_active,
+.disconnecting,
+.disconnected {
   color: #f7b500;
 }
 
 .creating,
 .configuring,
+.connecting,
 .reconfiguring,
 .installing,
 .reuploading,