Merge pull request #45 from mdrillin/DataServiceWizard

Addition of Dataservice Wizard
teiid · Nov 1, 2017 · c58e11a · c58e11a
2 parents 043be97 + e2cb4bd
commit c58e11a
Show file tree

Hide file tree

Showing 38 changed files with 1,887 additions and 6 deletions.
diff --git a/ngapp/src/app/activities/add-activity-wizard/add-activity-wizard.component.ts b/ngapp/src/app/activities/add-activity-wizard/add-activity-wizard.component.ts
@@ -239,6 +239,7 @@ export class AddActivityWizardComponent implements OnInit {
           self.step2bConfig.nextEnabled = false;
         },
         (error) => {
+          self.logger.error("[AddActivityWizardComponent] Error: %o", error);
           self.createComplete = true;
           self.createSuccessful = false;
         }

diff --git a/ngapp/src/app/app-routing.module.ts b/ngapp/src/app/app-routing.module.ts
@@ -20,13 +20,15 @@ import { NgModule } from "@angular/core";
 import { RouterModule } from "@angular/router";
 import { Routes } from "@angular/router";
 import { ConnectionsConstants } from "@connections/shared/connections-constants";
+import { DataservicesConstants } from "@dataservices/shared/dataservices-constants";
 import { environment } from "@environments/environment";
 import { PageNotFoundComponent } from "@shared/page-not-found/page-not-found.component";
 
 const appRoutes: Routes = [
   { path: "", redirectTo: environment.homePagePath, pathMatch: "full" },
   { path: ConnectionsConstants.connectionsRootRoute, loadChildren: "@connections/connections.module#ConnectionsModule" },
   { path: ActivitiesConstants.activitiesRootRoute, loadChildren: "@activities/activities.module#ActivitiesModule" },
+  { path: DataservicesConstants.dataservicesRootRoute, loadChildren: "@dataservices/dataservices.module#DataservicesModule" },
   { path: "**", component: PageNotFoundComponent }, // always last
 ];
 

diff --git a/ngapp/src/app/app.module.ts b/ngapp/src/app/app.module.ts
@@ -25,6 +25,8 @@ import { AppComponent } from "@app/app.component";
 import { ConnectionsRoutingModule } from "@connections/connections-routing.module";
 import { ConnectionsModule } from "@connections/connections.module";
 import { CoreModule } from "@core/core.module";
+import { DataservicesModule } from "@dataservices/dataservices.module";
+import { DataservicesRoutingModule } from "@dataservices/dataservices-routing.module";
 import { SharedModule } from "@shared/shared.module";
 
 @NgModule({
@@ -36,10 +38,12 @@ import { SharedModule } from "@shared/shared.module";
     BrowserModule,
     ConnectionsModule,
     CoreModule,
+    DataservicesModule,
     RouterModule,
     SharedModule,
     ActivitiesRoutingModule,
     ConnectionsRoutingModule,
+    DataservicesRoutingModule,
     AppRoutingModule // last so its routes are check after all other routes
   ],
   providers: [],

diff --git a/ngapp/src/app/connections/add-connection-wizard/add-connection-wizard.component.ts b/ngapp/src/app/connections/add-connection-wizard/add-connection-wizard.component.ts
@@ -285,6 +285,7 @@ export class AddConnectionWizardComponent implements OnInit {
           self.step3bConfig.nextEnabled = false;
         },
         (error) => {
+          self.logger.error("[AddConnectionWizardComponent] Error: %o", error);
           self.createComplete = true;
           self.createSuccessful = false;
         }

diff --git a/ngapp/src/app/connections/add-connection/add-connection.component.html b/ngapp/src/app/connections/add-connection/add-connection.component.html
@@ -1,8 +1,8 @@
 <div style="margin-left: 150px">
   <div id="connections-breadcrumb-bar">
     <app-breadcrumbs>
-      <li i18n="@@activitiesCards.connections" app-breadcrumb label="Connections" icon="plug" [route]="[ connectionsLink ]"></li>
-      <li i18n="@@activitiesCards.addConnection" app-breadcrumb label="Add Connection" icon="plus" class="active"></li>
+      <li i18n="@@connectionsCards.connections" app-breadcrumb label="Connections" icon="plug" [route]="[ connectionsLink ]"></li>
+      <li i18n="@@connectionsCards.addConnection" app-breadcrumb label="Add Connection" icon="plus" class="active"></li>
     </app-breadcrumbs>
   </div>
   <div class="container-fluid" *ngIf="!pageError">

diff --git a/ngapp/src/app/connections/connections.component.spec.ts b/ngapp/src/app/connections/connections.component.spec.ts
@@ -107,7 +107,7 @@ describe("ConnectionsComponent", () => {
     component.filterConnections();
     fixture.detectChanges();
 
-    // Now expect 0 activities match
+    // Now expect 0 connections match
     connections = component.filteredConnections;
     expect(connections.length).toEqual(0);
   });

diff --git a/ngapp/src/app/core/api.service.ts b/ngapp/src/app/core/api.service.ts
@@ -15,7 +15,6 @@
  * limitations under the License.
  */
 
-import { Injectable } from "@angular/core";
 import { Headers, RequestOptions, Response } from "@angular/http";
 import { LoggerService } from "@core/logger.service";
 import "rxjs/add/observable/throw";

diff --git a/ngapp/src/app/core/vertical-nav/vertical-nav.component.html b/ngapp/src/app/core/vertical-nav/vertical-nav.component.html
@@ -6,6 +6,11 @@
       <span class="fa fa-fw fa-cog"></span>
       <div i18n="@@verticalNav.activities">Activities</div>
     </div>
+    <div id="studio-nav-item-dataservices" class="studio-nav-item" [class.active]="currentMenu === menuTypes.Dataservices"
+         (click)="onDataservicesClick()">
+      <span class="fa fa-fw fa-table"></span>
+      <div i18n="@@verticalNav.dataservices">DataServices</div>
+    </div>
     <div id="studio-nav-item-connections" class="studio-nav-item" [class.active]="currentMenu === menuTypes.Connections"
          (click)="onConnectionsClick()">
       <span class="fa fa-fw fa-plug"></span>

diff --git a/ngapp/src/app/core/vertical-nav/vertical-nav.component.ts b/ngapp/src/app/core/vertical-nav/vertical-nav.component.ts
@@ -19,13 +19,14 @@ import { ActivitiesConstants } from "@activities/shared/activities-constants";
 import { Component, OnInit } from "@angular/core";
 import { NavigationEnd, Router } from "@angular/router";
 import { ConnectionsConstants } from "@connections/shared/connections-constants";
+import { DataservicesConstants } from "@dataservices/shared/dataservices-constants";
 import { LoggerService } from "@core/logger.service";
 
 /**
  * Models the menus off the main left-hand vertical nav.
  */
 enum VerticalNavType {
-  Home, Activities, Connections
+  Home, Activities, Connections, Dataservices
 }
 
 @Component({
@@ -79,7 +80,18 @@ export class VerticalNavComponent implements OnInit {
     });
   }
 
-   /**
+  /**
+   * Called when the user clicks the vertical menu Dataservices item.
+   */
+  public onDataservicesClick(): void {
+    this.currentMenu = VerticalNavType.Dataservices;
+    const link: string[] = [ DataservicesConstants.dataservicesRootPath ];
+    this.router.navigate(link).then(() => {
+      // nothing to do
+    });
+  }
+
+  /**
     * Called when the user clicks the vertical menu shade (the grey shaded area behind the submenu div that
     * is displayed when a sub-menu is selected).  Clicking the shade makes the sub-menu div go away.
     */

diff --git a/ngapp/src/app/dataservices/add-dataservice-wizard/add-dataservice-wizard.component.css b/ngapp/src/app/dataservices/add-dataservice-wizard/add-dataservice-wizard.component.css
@@ -0,0 +1,5 @@
+.wizard-pf-failed-icon {
+  color: #9c3535;
+  font-size: 67px;
+  line-height: 67px;
+}
diff --git a/ngapp/src/app/dataservices/add-dataservice-wizard/add-dataservice-wizard.component.html b/ngapp/src/app/dataservices/add-dataservice-wizard/add-dataservice-wizard.component.html
@@ -0,0 +1,78 @@
+<pfng-wizard #wizard
+             [config]="wizardConfig"
+             (onCancel)="cancelClicked($event)"
+             (onNext)="nextClicked($event)"
+             (onStepChange)="stepChanged($event)">
+  <!-- ------------------------- -->
+  <!-- Step 1 : Basic Properties -->
+  <!-- ------------------------- -->
+  <pfng-wizard-step [config]="step1Config">
+    <h3><i>{{ step1InstructionMessage }}</i></h3>
+    <div *ngIf="!connectionsLoaded">
+      <div class="spinner spinner-lg blank-slate-pf-icon"></div>
+    </div>
+    <form [formGroup]=basicPropertyForm class="form-horizontal" *ngIf="connectionsLoaded">
+      <div [ngClass]="nameValid ? 'form-group' : 'form-group has-error'">
+        <label class="col-sm-2 control-label">Name</label>
+        <div class="col-sm-5">
+          <input class="form-control" formControlName="name" title="">
+          <div class="help-block" *ngIf="!nameValid">{{ getBasicPropertyErrorMessage("name") }}</div>
+        </div>
+      </div>
+      <div [ngClass]="connectionValid ? 'form-group' : 'form-group has-error'">
+        <label class="col-sm-2 control-label">Connection</label>
+        <div class="col-sm-5">
+          <select class="form-control" formControlName="connection" title="">
+            <option value="" selected hidden>-- Select a Connection ---</option>
+            <option *ngFor="let connection of connectionNames" [value]="connection">{{ connection }}</option>
+          </select>
+          <div class="help-block" *ngIf="!connectionValid">{{ getBasicPropertyErrorMessage("connection") }}</div>
+        </div>
+      </div>
+    </form>
+  </pfng-wizard-step>
+  <!-- -------------------------- -->
+  <!-- Step 2 : Review and Create -->
+  <!-- -------------------------- -->
+  <pfng-wizard-step [config]="step2Config">
+    <!-- Step 2A: Review -->
+    <pfng-wizard-substep [config]="step2aConfig">
+      <h3><i>{{ step2InstructionMessage }}</i></h3>
+      <h4>Dataservice Properties:</h4>
+      <form class="form-horizontal">
+        <div class="form-group">
+          <label class="col-sm-2 control-label">Name:</label>
+          <label class="col-sm-10">{{ dataserviceName }}</label>
+        </div>
+        <div class="form-group">
+          <label class="col-sm-2 control-label">Connection:</label>
+          <label class="col-sm-5">{{ connectionName }}</label>
+        </div>
+      </form>
+    </pfng-wizard-substep>
+    <!-- Step 2B: Create -->
+    <pfng-wizard-substep [config]="step2bConfig" (onShow)="createDataservice()">
+      <div class="wizard-pf-contents">
+        <!-- In progress -->
+        <div class="wizard-pf-process blank-slate-pf" *ngIf="!createComplete">
+          <div class="spinner spinner-lg blank-slate-pf-icon"></div>
+          <h3 class="blank-slate-pf-main-action">Creation in progress</h3>
+          <p class="blank-slate-pf-secondary-action">The dataservice is being created. </p>
+        </div>
+        <!-- Create Successful -->
+        <div class="wizard-pf-complete blank-slate-pf" *ngIf="createComplete && createSuccessful">
+          <div class="wizard-pf-success-icon"><span class="glyphicon glyphicon-ok-circle"></span></div>
+          <h3 class="blank-slate-pf-main-action">Creation was successful</h3>
+          <p class="blank-slate-pf-secondary-action">The dataservice was created successfully. Click on the button to see all dataservices.</p>
+          <a class="btn btn-lg btn-primary" [routerLink]="[dataserviceSummaryLink]">View All Dataservices</a>
+        </div>
+        <!-- Create Failed -->
+        <div class="wizard-pf-complete blank-slate-pf" *ngIf="createComplete && !createSuccessful">
+          <div class="wizard-pf-failed-icon"><span class="glyphicon glyphicon-remove-circle"></span></div>
+          <h3 class="blank-slate-pf-main-action">Creation failed</h3>
+          <p class="blank-slate-pf-secondary-action">The dataservice creation failed.  Correct any properties and retry.</p>
+        </div>
+      </div>
+    </pfng-wizard-substep>
+  </pfng-wizard-step>
+</pfng-wizard>
diff --git a/ngapp/src/app/dataservices/add-dataservice-wizard/add-dataservice-wizard.component.spec.ts b/ngapp/src/app/dataservices/add-dataservice-wizard/add-dataservice-wizard.component.spec.ts
@@ -0,0 +1,42 @@
+import { async, ComponentFixture, TestBed } from "@angular/core/testing";
+
+import { FormsModule, ReactiveFormsModule } from "@angular/forms";
+import { RouterTestingModule } from "@angular/router/testing";
+import { DataserviceService } from "@dataservices/shared/dataservice.service";
+import { MockDataserviceService } from "@dataservices/shared/mock-dataservice.service";
+import { CoreModule } from "@core/core.module";
+import { PropertyFormPropertyComponent } from "@shared/property-form/property-form-property/property-form-property.component";
+import { PropertyFormComponent } from "@shared/property-form/property-form.component";
+import { PatternFlyNgModule } from "patternfly-ng";
+import { AddDataserviceWizardComponent } from "./add-dataservice-wizard.component";
+import { ConnectionService } from "@connections/shared/connection.service";
+import { MockConnectionService } from "@connections/shared/mock-connection.service";
+
+describe("AddDataserviceWizardComponent", () => {
+  let component: AddDataserviceWizardComponent;
+  let fixture: ComponentFixture<AddDataserviceWizardComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [ CoreModule, FormsModule, PatternFlyNgModule, ReactiveFormsModule, RouterTestingModule ],
+      declarations: [ AddDataserviceWizardComponent, PropertyFormComponent, PropertyFormPropertyComponent ],
+      providers: [
+        { provide: DataserviceService, useClass: MockDataserviceService },
+        { provide: ConnectionService, useClass: MockConnectionService },
+      ]
+    })
+    .compileComponents().then(() => {
+      // nothing to do
+    });
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AddDataserviceWizardComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it("should be created", () => {
+    expect(component).toBeTruthy();
+  });
+});