feat(service-offering): show all service offerings even those which d…

…on't fit resources (#1299)

PR close #1229

src/app/app-routing.module.ts

@@ -57,7 +57,7 @@ const routes: Routes = [
         path: '**',
         redirectTo: 'instances'
       }
-    ]
+    ],
   },
   {
     path: '**',

src/app/home/home.component.ts

@@ -30,7 +30,7 @@ export class HomeComponent extends WithUnsubscribe() implements OnInit {
 
     this.auth.loggedIn.pipe(
       takeUntil(this.unsubscribe$),
-      filter(isLoggedIn => !!isLoggedIn))
+      filter(isLoggedIn => isLoggedIn))
       .subscribe(() => {
         this.store.dispatch(new authActions.LoadUserAccountRequest({
           name: this.auth.user.account,

src/app/reducers/vm/redux/vm-creation.effects.ts

@@ -44,6 +44,7 @@ import * as fromTemplates from '../../templates/redux/template.reducers';
 import * as fromVMs from './vm.reducers';
 import * as fromVMModule from '../../../vm/selectors';
 import { KeyboardLayout } from '../../../shared/types';
+import { ComputeOfferingViewModel } from '../../../vm/view-models';
 
 interface VmCreationParams {
   affinityGroupNames?: string;
@@ -160,11 +161,14 @@ export class VirtualMachineCreationEffects {
       this.store.pipe(select(fromDiskOfferings.selectAll)),
       this.store.pipe(select(configSelectors.get('defaultComputeOffering')))
     ),
-    map((
-      [action, vmCreationState, zones, templates, serviceOfferings, diskOfferings, defaultComputeOfferings]: [
-        vmActions.VmFormUpdate, VmCreationState, Zone[], BaseTemplateModel[], ServiceOffering[], DiskOffering[],
-        DefaultComputeOffering[]
-        ]) => {
+    map(([action, vmCreationState, zones, templates, serviceOfferings, diskOfferings, defaultComputeOfferings]: [
+      vmActions.VmFormUpdate,
+      VmCreationState, Zone[],
+      BaseTemplateModel[],
+      ComputeOfferingViewModel[],
+      DiskOffering[],
+      DefaultComputeOffering[]
+      ]) => {
 
       if (action.payload.zone) {
         let updates = {};
@@ -670,10 +674,10 @@ export class VirtualMachineCreationEffects {
   }
 
   private getPreselectedOffering(
-    offerings: ServiceOffering[],
+    offerings: ComputeOfferingViewModel[],
     zone: Zone,
     defaultComputeOfferingConfiguration: DefaultComputeOffering[]
-  ): ServiceOffering {
+  ): ComputeOfferingViewModel {
     const firstOffering = offerings[0];
     const configForCurrentZone = defaultComputeOfferingConfiguration.find(config => config.zoneId === zone.id);
     if (!configForCurrentZone) {

src/app/service-offering/custom-service-offering/custom-service-offering.component.html

@@ -47,6 +47,10 @@ <h5>{{ 'SERVICE_OFFERING.CUSTOM_SERVICE_OFFERING.MEMORY' | translate }}</h5>
     </mat-form-field>
   </div>
 
+  <span class="error-message" *ngIf="!offering.isAvailableByResources">
+    {{ 'ERRORS.COMPUTE_OFFERING.RESOURCE_LIMIT_EXCEEDED' | translate }}
+  </span>
+
   <div class="mat-dialog-actions">
     <button
       mat-button
@@ -60,7 +64,7 @@ <h5>{{ 'SERVICE_OFFERING.CUSTOM_SERVICE_OFFERING.MEMORY' | translate }}</h5>
       mat-button
       color="primary"
       type="submit"
-      [disabled]="!hardwareForm.valid"
+      [disabled]="!hardwareForm.valid || !offering.isAvailableByResources"
     >
       {{ 'COMMON.CONFIRM' | translate }}
     </button>

src/app/service-offering/custom-service-offering/custom-service-offering.component.scss

@@ -9,3 +9,8 @@ h5 {
     margin-top: 0;
   }
 }
+
+.error-message {
+  color: #f44336;
+  font-size: 13px;
+}

src/app/service-offering/custom-service-offering/custom-service-offering.component.ts

@@ -1,25 +1,29 @@
-import { Component, Inject } from '@angular/core';
+import { Component, Inject, OnInit } from '@angular/core';
 import { FormControl, FormGroup, Validators } from '@angular/forms'
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
 
 import { ComputeOfferingViewModel } from '../../vm/view-models';
+import { Account } from '../../shared/models';
 
 @Component({
   selector: 'cs-custom-service-offering',
   templateUrl: 'custom-service-offering.component.html',
   styleUrls: ['custom-service-offering.component.scss']
 })
-export class CustomServiceOfferingComponent {
+export class CustomServiceOfferingComponent implements OnInit {
   public offering: ComputeOfferingViewModel;
   public hardwareForm: FormGroup;
+  public account: Account;
 
   constructor(
     @Inject(MAT_DIALOG_DATA) data,
-    public dialogRef: MatDialogRef<CustomServiceOfferingComponent>,
+    public dialogRef: MatDialogRef<CustomServiceOfferingComponent>
   ) {
-    const { offering } = data;
-    this.offering = offering;
+    this.offering = data.offering;
+    this.account = data.account;
+  }
 
+  public ngOnInit() {
     this.createForm();
   }
 
@@ -37,9 +41,12 @@ export class CustomServiceOfferingComponent {
   private createForm() {
     // input text=number provide all other validation for current restrictions
     this.hardwareForm = new FormGroup({
-      cpuNumber: new FormControl(this.offering.cpunumber, Validators.required),
-      cpuSpeed: new FormControl(this.offering.cpuspeed, Validators.required),
-      memory: new FormControl(this.offering.memory, Validators.required),
+      cpuNumber: new FormControl(
+        { value: this.offering.cpunumber, disabled: !this.offering.isAvailableByResources }, Validators.required),
+      cpuSpeed: new FormControl(
+        { value: this.offering.cpuspeed, disabled: !this.offering.isAvailableByResources }, Validators.required),
+      memory: new FormControl(
+        { value: this.offering.memory, disabled: !this.offering.isAvailableByResources }, Validators.required),
     });
   }
 }

src/app/service-offering/service-offering-dialog/service-offering-dialog.component.html

@@ -14,6 +14,7 @@ <h3 class="mat-dialog-title">
       [classes]="classes"
       [selectedClasses]="selectedClasses"
       [query]="query"
+      [account]="account"
       [offeringList]="serviceOfferings"
       [selectedOffering]="serviceOffering"
       [showFields]="showFields"
@@ -25,7 +26,12 @@ <h3 class="mat-dialog-title">
       *ngIf="showRebootMessage"
     >{{ "SERVICE_OFFERING.VM_WILL_BE_RESTARTED" | translate }}
     </div>
+    <span class="error-message" *ngIf="!serviceOffering?.isAvailableByResources && isSelectedOfferingViewMode()">
+      {{ 'ERRORS.COMPUTE_OFFERING.RESOURCE_LIMIT_EXCEEDED' | translate }}
+    </span>
   </div>
+
+
   <div class="mat-dialog-actions">
     <div>
       <button mat-button color="primary" (click)="showFields = !showFields">

src/app/service-offering/service-offering-dialog/service-offering-dialog.component.scss

@@ -20,3 +20,8 @@
   flex-direction: column;
   text-align: right;
 }
+
+.error-message {
+  color: #f44336;
+  font-size: 13px;
+}

src/app/service-offering/service-offering-dialog/service-offering-dialog.component.ts

@@ -24,6 +24,7 @@ export class ServiceOfferingDialogComponent implements OnInit, OnChanges {
   @Input() public virtualMachine: VirtualMachine;
   @Input() public groupings: Array<any>;
   @Input() public query: string;
+  @Input() public account: Account;
   @Input() public isVmRunning: boolean;
   @Output() public onServiceOfferingChange = new EventEmitter<ComputeOfferingViewModel>();
   @Output() public onServiceOfferingUpdate = new EventEmitter<ComputeOfferingViewModel>();
@@ -69,6 +70,7 @@ export class ServiceOfferingDialogComponent implements OnInit, OnChanges {
   public isSubmitButtonDisabled(): boolean {
     const isOfferingNotSelected = !this.serviceOffering;
     const isNoOfferingsInCurrentViewMode = !this.serviceOfferings.length;
+    const isNotEnoughResourcesForCurrentOffering = this.serviceOffering && !this.serviceOffering.isAvailableByResources;
     const isSelectedOfferingFromDifferentViewMode = this.serviceOffering
       && this.serviceOffering.iscustomized !== (this.viewMode === ServiceOfferingType.custom);
     const isSelectedOfferingDoNotHaveParams = this.serviceOffering
@@ -81,7 +83,18 @@ export class ServiceOfferingDialogComponent implements OnInit, OnChanges {
       || isNoOfferingsInCurrentViewMode
       || isSelectedOfferingFromDifferentViewMode
       || isSelectedOfferingDoNotHaveParams
-      || isSelectedOfferingDifferentFromCurrent;
+      || isSelectedOfferingDifferentFromCurrent
+      || isNotEnoughResourcesForCurrentOffering;
+  }
+
+  public isSelectedOfferingViewMode(): boolean {
+    if (this.serviceOffering && this.serviceOffering.iscustomized && this.viewMode === ServiceOfferingType.custom) {
+      return true;
+    }
+    if (this.serviceOffering && !this.serviceOffering.iscustomized && this.viewMode === ServiceOfferingType.fixed) {
+      return true;
+    }
+    return false;
   }
 
   private isSelectedOfferingDifferent(): boolean {
@@ -98,5 +111,4 @@ export class ServiceOfferingDialogComponent implements OnInit, OnChanges {
 
     return isDifferentOfferingId || isSameCustomOfferingWithDifferentParams;
   }
-
 }

src/app/service-offering/service-offering-list/service-offering-list.component.html

@@ -80,7 +80,6 @@ <h5>{{ getDescription(group.soClass) | translate }}</h5>
 
       </table>
     </div>
-
   </ng-container>
 </div>
 

src/app/service-offering/service-offering-list/service-offering-list.component.ts

@@ -5,7 +5,7 @@ import { Observable } from 'rxjs';
 import { filter } from 'rxjs/operators';
 
 import { classesFilter } from '../../reducers/service-offerings/redux/service-offerings.reducers';
-import { ComputeOfferingClass, ServiceOffering } from '../../shared/models';
+import { Account, ComputeOfferingClass, ServiceOffering } from '../../shared/models';
 import { CustomServiceOfferingComponent } from '../custom-service-offering/custom-service-offering.component';
 import { Language } from '../../shared/types';
 import { ComputeOfferingViewModel } from '../../vm/view-models';
@@ -20,9 +20,10 @@ export class ServiceOfferingListComponent implements OnChanges {
   @Input() public classes: Array<ComputeOfferingClass>;
   @Input() public selectedClasses: Array<string>;
   @Input() public query: string;
-  @Input() public selectedOffering: ServiceOffering;
+  @Input() public selectedOffering: ComputeOfferingViewModel;
   @Input() public isLoading = false;
   @Input() public showFields: boolean;
+  @Input() public account: Account;
   @Output() public selectedOfferingChange = new EventEmitter<ComputeOfferingViewModel>();
 
   public list: Array<{ soClass: ComputeOfferingClass, items: MatTableDataSource<ComputeOfferingViewModel> }>;
@@ -61,7 +62,8 @@ export class ServiceOfferingListComponent implements OnChanges {
     return this.dialog.open(CustomServiceOfferingComponent, {
       width: '370px',
       data: {
-        offering
+        offering,
+        account: this.account
       }
     }).afterClosed();
 
@@ -100,7 +102,7 @@ export class ServiceOfferingListComponent implements OnChanges {
     }
   }
 
-  public filterOfferings(list: ServiceOffering[], soClass: ComputeOfferingClass) {
+  public filterOfferings(list: ComputeOfferingViewModel[], soClass: ComputeOfferingClass) {
     const classesMap = [soClass].reduce((m, i) => ({ ...m, [i.id]: i }), {});
     return list.filter(offering => classesFilter(offering, this.classes, classesMap));
   }

src/app/shared/actions/volume-actions/volume-resize.container.ts

@@ -32,7 +32,7 @@ export class VolumeResizeContainerComponent implements OnInit {
 
   public volume: Volume;
 
-  public maxSize = 2;
+  public maxSize = '2';
 
   constructor(
     public authService: AuthService,
@@ -51,7 +51,7 @@ export class VolumeResizeContainerComponent implements OnInit {
       take(1),
       filter(account => !!account))
       .subscribe((account: Account) => {
-        this.maxSize = Number(account.primarystorageavailable);
+        this.maxSize = account.primarystorageavailable;
       });
   }
 

src/app/shared/models/account-user.model.ts

@@ -8,22 +8,22 @@ export interface AccountUser extends BaseModelInterface {
   firstname: string;
   lastname: string;
   email: string;
-  password?: string;
   created: string;
   state: string;
   account: string;
   accounttype: number;
-  roleid: string;
   roletype: AccountType;
   rolename: AccountType;
+  roleid: string;
   domain: string;
   domainid: string;
   timezone: string;
   accountid: string;
   iscallerchilddomain: boolean;
   isdefault: boolean;
-  secretkey: string;
-  apikey: string;
+  password?: string;
+  apikey?: string;
+  secretkey?: string;
 }
 
 export interface ApiKeys {

src/app/shared/models/account.model.ts

@@ -41,55 +41,55 @@ export class AccountData {
 
 export interface Account extends BaseModelInterface {
   accounttype: AccountType;
-  cpuavailable: number;
-  cpulimit: number;
+  cpuavailable: string;
+  cpulimit: string;
   cputotal: number;
   domain: string;
-  fullDomain: string;
   domainid: string;
   id: string;
-  ipavailable: number;
-  iplimit: number;
+  ipavailable: string;
+  iplimit: string;
   iptotal: number;
   isdefault: false;
-  memoryavailable: number;
-  memorylimit: number;
+  memoryavailable: string;
+  memorylimit: string;
   memorytotal: number;
   name: string;
-  networkavailable: number;
-  networklimit: number;
+  networkavailable: string;
+  networklimit: string;
   networktotal: number;
   primarystorageavailable: string;
-  primarystoragelimit: number;
+  primarystoragelimit: string;
   primarystoragetotal: number;
-  role: string;
   roleid: string;
   rolename: string;
   roletype: string;
-  receivedbytes: number;
-  sentbytes: number;
-  secondarystorageavailable: number;
-  secondarystoragelimit: number;
+  receivedbytes?: number;
+  sentbytes?: number;
+  secondarystorageavailable: string;
+  secondarystoragelimit: string;
   secondarystoragetotal: number;
-  snapshotavailable: number;
-  snapshotlimit: number;
+  snapshotavailable: string;
+  snapshotlimit: string;
   snapshottotal: number;
   state: string;
-  templateavailable: number;
-  templatelimit: number;
+  templateavailable: string;
+  templatelimit: string;
   templatetotal: number;
   user: Array<AccountUser>;
-  vmavailable: number;
-  vmlimit: number;
+  vmavailable: string;
+  vmlimit: string;
   vmrunning: number;
   vmstopped: number;
   vmtotal: number;
-  volumeavailable: number;
-  volumelimit: number;
+  volumeavailable: string;
+  volumelimit: string;
   volumetotal: number;
-  vpcavailable: number;
-  vpclimit: number;
+  vpcavailable: string;
+  vpclimit: string;
   vpctotal: number;
+  role?: string;
+  fullDomain?: string;
 }
 
 export const isAdmin = (account: Account) => account.accounttype !== AccountType.User;

src/app/shared/models/config/index.ts

@@ -9,3 +9,4 @@ export * from './image-group.model';
 export * from './service-offering-availability.interface';
 export * from './offering-compatibility-policy.interface';
 export * from './sidenav-config-element.interface';
+export * from './custom-compute-offering-parameters.interface';