Add handlers for websocket connection error and closed

Signed-off-by: Ann Shumilova <[email protected]>

dashboard/src/app/projects/create-project/create-project.controller.ts

@@ -76,6 +76,8 @@ export class CreateProjectController {
   readyToGoStack: any;
   stackLibraryUser: any;
   isCustomStack: boolean;
+  isHandleClose: boolean;
+  connectionClosed: Function;
 
   workspaceResourceForm: ng.IFormController;
   workspaceInformationForm: ng.IFormController;
@@ -228,6 +230,21 @@ export class CreateProjectController {
     cheAPI.cheWorkspace.getWorkspaces();
 
     $rootScope.showIDE = false;
+
+    this.isHandleClose = true;
+    this.connectionClosed = () => {
+      if (!this.isHandleClose) {
+        return;
+      }
+
+      this.$mdDialog.show(
+        this.$mdDialog.alert()
+          .title('Connection error')
+          .content('Unable to track the workspace status due to connection closed error. Please, try again or restart the page.')
+          .ariaLabel('Workspace start')
+          .ok('OK')
+      );
+    }
   }
 
   /**
@@ -509,7 +526,10 @@ export class CreateProjectController {
       });
     }
 
+
+
     let startWorkspacePromise = this.cheAPI.getWorkspace().startWorkspace(workspace.id, workspace.config.defaultEnv);
+    bus.onClose(this.connectionClosed);
     startWorkspacePromise.then(() => {
       // update list of workspaces
       // for new workspace to show in recent workspaces
@@ -808,6 +828,7 @@ export class CreateProjectController {
    * Cleanup the websocket elements after actions are finished
    */
   cleanupChannels(websocketStream: any, workspaceBus: any, bus: any, channel: any): void {
+    this.isHandleClose = false;
     if (websocketStream != null) {
       websocketStream.close();
     }
@@ -879,6 +900,7 @@ export class CreateProjectController {
     websocketStream.onOpen(() => {
       let bus = this.cheAPI.getWebsocket().getExistingBus(websocketStream);
       this.createProjectInWorkspace(workspaceId, projectName, projectData, bus, websocketStream, workspaceBus);
+      bus.onClose(this.connectionClosed);
     });
 
     // on error, retry to connect or after a delay, abort
@@ -1495,4 +1517,5 @@ export class CreateProjectController {
     let environmentManager = this.cheEnvironmentRegistry.getEnvironmentManager(recipeType);
     workspace.environments[workspace.defaultEnv] = environmentManager.getEnvironment(environment, this.getStackMachines(environment));
   }
+
 }

dashboard/src/components/api/che-websocket.factory.ts

@@ -177,6 +177,24 @@ class MessageBus { // jshint ignore:line
     this.send(new MessageBuilder().ping().build());
   }
 
+  /**
+   * Handles websocket closed event.
+   *
+   * @param callback
+   */
+  onClose(callback: Function) {
+    this.datastream.onClose(callback);
+  }
+
+  /**
+   * Handles websocket error event.
+   *
+   * @param callback
+   */
+  onError(callback: Function) {
+    this.datastream.onError(callback);
+  }
+
   /**
    * Restart ping timer (cancel previous and start again).
    */

dashboard/src/components/api/che-workspace.factory.ts

@@ -550,8 +550,7 @@ export class CheWorkspace {
         } else if (message.eventType === 'SNAPSHOT_CREATING') {
           this.getWorkspaceById(workspaceId).status = 'SNAPSHOTTING';
         } else if (message.eventType === 'SNAPSHOT_CREATED') {
-          // snapshot can be created for RUNNING workspace only. As far as snapshot creation is only the events, not the state,
-          // we introduced SNAPSHOT_CREATING status to be handled by UI, though it is fake one, and end of it is indicated by SNAPSHOT_CREATED.
+          // snapshot can be created for RUNNING workspace only.
           this.getWorkspaceById(workspaceId).status = 'RUNNING';
         }