ecabs-components 0.0.1

package/lib/base/validation/validation.component.ts

@@ -0,0 +1,171 @@
+import {
+  Component,
+  OnInit,
+  Input,
+  OnChanges,
+  SimpleChanges,
+} from '@angular/core';
+
+@Component({
+  selector: 'app-validations-messages',
+  templateUrl: './validation.component.html',
+  styleUrls: ['./validation.component.scss'],
+})
+export class ValidationComponent implements OnInit, OnChanges {
+  @Input() element!: any;
+  @Input() label!: string;
+  @Input() showValidationOnNotTouched = false;
+  @Input() updatedErrors!: { type: string; message: string }[];
+  errorMessages: any[]=[];
+
+  private _messages: any = {};
+
+  get messages(): any {
+    if (this.element) {
+      for (const errorKey in this.element.errors) {
+        for (const key in this.element.errors[errorKey]) {
+          if (this._messages[errorKey]) {
+            this._messages[errorKey] = this._messages[errorKey].replace(
+              `[${key}]`,
+              this.element.errors[errorKey][key]
+            );
+          }
+        }
+      }
+    }
+
+    return this._messages;
+  }
+
+  set messages(m) {
+    this._messages = m;
+  }
+
+  constructor() {
+    // this.errorMessages = [
+    //   {
+    //     type: 'required',
+    //     message: this.translateService.instant(
+    //       'FORMS.VALIDATION.LABEL_REQUIRED'
+    //     ),
+    //   },
+    //   {
+    //     type: 'minlength',
+    //     message: this.translateService.instant('FORMS.VALIDATION.MIN_LENGTH'),
+    //   },
+    //   {
+    //     type: 'maxlength',
+    //     message: this.translateService.instant('FORMS.VALIDATION.MAX_LENGTH'),
+    //   },
+    //   {
+    //     type: 'min',
+    //     message: this.translateService.instant('FORMS.VALIDATION.MIN'),
+    //   },
+    //   {
+    //     type: 'max',
+    //     message: this.translateService.instant('FORMS.VALIDATION.MAX'),
+    //   },
+    //   {
+    //     type: 'minValue',
+    //     message: this.translateService.instant('FORMS.VALIDATION.MIN_VALUE'),
+    //   },
+    //   {
+    //     type: 'maxValue',
+    //     message: this.translateService.instant('FORMS.VALIDATION.MAX_VALUE'),
+    //   },
+    //   {
+    //     type: 'validatePhoneNumber',
+    //     message: this.translateService.instant(
+    //       'FORMS.VALIDATION.VALIDATE_PHONE_NUMBER'
+    //     ),
+    //   },
+    //   {
+    //     type: 'pastDate',
+    //     message: this.translateService.instant('FORMS.VALIDATION.PAST_DATE'),
+    //   },
+    //   {
+    //     type: 'affectsError',
+    //     message: this.translateService.instant(
+    //       'FORMS.VALIDATION.AFFECTS_ERROR'
+    //     ),
+    //   },
+    //   {
+    //     type: 'moreThan',
+    //     message: this.translateService.instant('FORMS.VALIDATION.MORE_THAN'),
+    //   },
+    //   {
+    //     type: 'lessThan',
+    //     message: this.translateService.instant('FORMS.VALIDATION.LESS_THAN'),
+    //   },
+    //   {
+    //     type: 'iban',
+    //     message: this.translateService.instant('FORMS.VALIDATION.INVALID'),
+    //   },
+    //   {
+    //     type: 'email',
+    //     message: this.translateService.instant('FORMS.VALIDATION.EMAIL'),
+    //   },
+    //   {
+    //     type: 'numberMoreThan',
+    //     message: this.translateService.instant(
+    //       'FORMS.VALIDATION.VALUE_MORE_THAN'
+    //     ),
+    //   },
+    //   {
+    //     type: 'numberLessThan',
+    //     message: this.translateService.instant(
+    //       'FORMS.VALIDATION.VALUE_LESS_THAN'
+    //     ),
+    //   },
+    //   {
+    //     type: 'outOfRange',
+    //     message: this.translateService.instant('FORMS.VALIDATION.OUT_OF_RANGE'),
+    //   },
+    //   {
+    //     type: 'iban',
+    //     message: this.translateService.instant('FORMS.VALIDATION.IBAN'),
+    //   },
+    //   {
+    //     type: 'timeIsAfter',
+    //     message: this.translateService.instant(
+    //       'FORMS.VALIDATION.LESS_THAN_TIME'
+    //     ),
+    //   },
+    // ];
+  }
+
+  ngOnChanges(changes: SimpleChanges): void {
+    const { updatedErrors } = changes;
+
+    if (
+      updatedErrors &&
+      updatedErrors.currentValue &&
+      updatedErrors.currentValue.length > 0
+    ) {
+      for (const error of updatedErrors.currentValue) {
+        this.messages[error.type] = error.message;
+      }
+    }
+  }
+
+  ngOnInit(): void {
+    for (const error of this.errorMessages) {
+      this.messages[error.type] = this.replaceTokens(error.message);
+    }
+  }
+
+  replaceTokens(message: string): string {
+    let retMessage: string;
+    if (this.label) {
+      retMessage = message.replace('[label]', this.label);
+    } else {
+      retMessage = message;
+    }
+
+    return retMessage;
+  }
+
+  getMessageDetail(key: any): string {
+    return this.messages[key];
+  }
+}

package/lib/base/validation/validation.module.d.ts

@@ -0,0 +1,10 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./validation.component";
+import * as i2 from "@angular/common";
+import * as i3 from "@angular/forms";
+import * as i4 from "@angular/material/form-field";
+export declare class ValidationModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<ValidationModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ValidationModule, [typeof i1.ValidationComponent], [typeof i2.CommonModule, typeof i3.FormsModule, typeof i4.MatFormFieldModule], [typeof i1.ValidationComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<ValidationModule>;
+}

package/lib/base/validation/validation.module.ts

@@ -0,0 +1,12 @@
+import { NgModule } from '@angular/core';
+import { ValidationComponent } from './validation.component';
+import { FormsModule } from '@angular/forms';
+import { CommonModule } from '@angular/common';
+import { MatFormFieldModule } from '@angular/material/form-field';
+
+@NgModule({
+  declarations: [ValidationComponent],
+  imports: [CommonModule, FormsModule, MatFormFieldModule],
+  exports: [ValidationComponent],
+})
+export class ValidationModule {}

package/lib/ecabs-buttons/ecabs-buttons.component.d.ts

@@ -0,0 +1,21 @@
+import { OnChanges, OnInit, SimpleChanges } from '@angular/core';
+import { ThemePalette } from '@angular/material/core';
+import * as i0 from "@angular/core";
+export declare class ButtonsComponent implements OnInit, OnChanges {
+    label: string;
+    disabled: boolean;
+    loading: boolean;
+    form: string;
+    size: 'default' | 'large';
+    type: 'button' | 'submit';
+    raised: boolean;
+    stroked: boolean;
+    full: boolean;
+    color: ThemePalette | 'success';
+    borderWidth: string;
+    classAttr: string;
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ButtonsComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ButtonsComponent, "ecabs-buttons", never, { "label": "label"; "disabled": "disabled"; "loading": "loading"; "form": "form"; "size": "size"; "type": "type"; "raised": "raised"; "stroked": "stroked"; "full": "full"; "color": "color"; }, {}, never, ["mat-icon", "*"], false>;
+}

package/lib/ecabs-buttons/ecabs-buttons.component.html

@@ -0,0 +1,18 @@
+<button
+  mat-button
+  [ngClass]="{
+    '!w-full': full,
+    'mat-stroked-button': stroked,
+    'mat-raised-button': raised
+  }"
+  [color]="color"
+  [disabled]="disabled"
+  [type]="type"
+  [attr.form]="form"
+>
+  <ecabs-loading-spinner size="tiny" *ngIf="loading"></ecabs-loading-spinner>
+  <ng-container *ngIf="!loading">
+    <ng-content select="mat-icon"></ng-content>
+    <ng-content></ng-content>
+  </ng-container>
+</button>

package/lib/ecabs-buttons/ecabs-buttons.component.ts

@@ -0,0 +1,54 @@
+import { Component, HostBinding, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core';
+import { ThemePalette } from '@angular/material/core';
+
+@Component({
+  selector: 'ecabs-buttons',
+  templateUrl: './ecabs-buttons.component.html',
+})
+export class ButtonsComponent implements OnInit, OnChanges {
+  @Input()
+  label!: string;
+
+  @Input()
+  disabled!: boolean;
+
+  @Input()
+  loading!: boolean;
+
+  @Input()
+  form!: string;
+
+  @Input()
+  size: 'default' | 'large' = 'default';
+
+  @Input()
+  type: 'button' | 'submit' = 'button';
+
+  @Input() raised = false;
+  @Input() stroked = false;
+  @Input() full = false;
+  @Input()
+  color: ThemePalette | 'success' = 'primary';
+
+  @HostBinding('style.width')
+  borderWidth = '';
+  @HostBinding('class')
+  classAttr = '';
+
+  ngOnInit(): void {
+    if (this.full) {
+      this.borderWidth = '100%';
+    }
+  }
+
+  ngOnChanges(changes: SimpleChanges): void {
+    const disabled = changes['disabled']?.currentValue !== undefined ? changes['disabled'].currentValue : this.disabled;
+    const loading = changes['loading']?.currentValue !== undefined ? changes['loading'].currentValue : this.loading;
+
+    if (disabled || loading) {
+      this.classAttr = 'pointer-events-none';
+    } else {
+      this.classAttr = '';
+    }
+  }
+}

package/lib/ecabs-buttons/ecabs-buttons.module.d.ts

@@ -0,0 +1,11 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./ecabs-buttons.component";
+import * as i2 from "@angular/common";
+import * as i3 from "@angular/material/button";
+import * as i4 from "../ecabs-loading/ecabs-loading.module";
+import * as i5 from "@angular/material/icon";
+export declare class EcabsButtonsModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<EcabsButtonsModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<EcabsButtonsModule, [typeof i1.ButtonsComponent], [typeof i2.CommonModule, typeof i3.MatButtonModule, typeof i4.EcabsLoadingModule, typeof i5.MatIconModule], [typeof i1.ButtonsComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<EcabsButtonsModule>;
+}

package/lib/ecabs-buttons/ecabs-buttons.module.ts

@@ -0,0 +1,13 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { ButtonsComponent } from './ecabs-buttons.component';
+import { MatButtonModule } from '@angular/material/button';
+import { MatIconModule } from '@angular/material/icon';
+import { EcabsLoadingModule } from '../ecabs-loading/ecabs-loading.module';
+
+@NgModule({
+  declarations: [ButtonsComponent],
+  imports: [CommonModule, MatButtonModule, EcabsLoadingModule, MatIconModule],
+  exports: [ButtonsComponent],
+})
+export class EcabsButtonsModule {}

package/lib/ecabs-input/ecabs-input.component.d.ts

@@ -0,0 +1,27 @@
+import { AfterViewInit, EventEmitter, Injector, OnInit } from '@angular/core';
+import { ControlValueAccessor } from '@angular/forms';
+import ElementBaseComponent from '../base/element-base';
+import * as i0 from "@angular/core";
+export declare class EcabsInputComponent extends ElementBaseComponent implements ControlValueAccessor, AfterViewInit, OnInit {
+    private injector;
+    digitsOnly: boolean;
+    allowDecimal: boolean;
+    allowHyphen: boolean;
+    max: number;
+    step: number;
+    onblur: EventEmitter<any>;
+    val: string | number;
+    get value(): string | number;
+    set value(val: string | number);
+    constructor(injector: Injector);
+    ngOnInit(): void;
+    ngAfterViewInit(): void;
+    onChange: any;
+    onTouch: any;
+    writeValue(value: any): void;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    blurChange(e: any): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<EcabsInputComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<EcabsInputComponent, "ecabs-input", never, { "digitsOnly": "digitsOnly"; "allowDecimal": "allowDecimal"; "allowHyphen": "allowHyphen"; "max": "max"; "step": "step"; }, { "onblur": "onblur"; }, never, ["mat-icon", ".suffix"], false>;
+}

package/lib/ecabs-input/ecabs-input.component.html

@@ -0,0 +1,26 @@
+<app-element-wrapper [data]="getData()">
+  <div class="form-field__input--wrapper">
+    <input
+      appDigitsOnly
+      [digitsOnly]="digitsOnly"
+      [decimal]="allowDecimal"
+      [allowHyphen]="allowHyphen"
+      class="form-field__input"
+      [type]="type"
+      [id]="name"
+      [(ngModel)]="value"
+      [placeholder]="placeholder"
+      (blur)="onTouch()"
+      [disabled]="disabled"
+      [maxlength]="maxLength"
+      [max]="max"
+      [step]="step"
+      (blur)="blurChange($event)"
+    />
+
+    <div class="form-field__input--suffix" *ngIf="type !== 'number'">
+      <ng-content select="mat-icon"></ng-content>
+      <ng-content select=".suffix"></ng-content>
+    </div>
+  </div>
+</app-element-wrapper>

package/lib/ecabs-input/ecabs-input.component.ts

@@ -0,0 +1,83 @@
+import { AfterViewInit, Component, EventEmitter, Injector, Input, OnInit, Output } from '@angular/core';
+import { ControlValueAccessor, UntypedFormControl, NgControl, NG_VALUE_ACCESSOR } from '@angular/forms';
+import ElementBaseComponent from '../base/element-base';
+
+@Component({
+  selector: 'ecabs-input',
+  templateUrl: './ecabs-input.component.html',
+  providers: [
+    {
+      provide: NG_VALUE_ACCESSOR,
+      useExisting: EcabsInputComponent,
+      multi: true,
+    },
+  ],
+})
+export class EcabsInputComponent
+  extends ElementBaseComponent
+  implements ControlValueAccessor, AfterViewInit, OnInit
+{
+  @Input()
+  digitsOnly!: boolean;
+
+  @Input()
+  allowDecimal!: boolean;
+
+  @Input()
+  allowHyphen!: boolean;
+
+  @Input() max!: number;
+  @Input() step!: number;
+
+  @Output() onblur = new EventEmitter<any>();
+  val!: string | number;
+
+  get value(): string | number {
+    return this.val;
+  }
+
+  set value(val) {
+    if (val !== undefined && this.val !== val) {
+      this.val = val;
+      this.onChange(val);
+      this.onTouch(val);
+    }
+  }
+
+  constructor(private injector: Injector) {
+    super();
+  }
+
+  ngOnInit(): void {
+    if (this.type === 'number') {
+      this.digitsOnly = true;
+    }
+  }
+
+  ngAfterViewInit(): void {
+    const ngControl: NgControl = this.injector.get(NgControl, null) as NgControl;
+    if (ngControl) {
+      this.control = ngControl.control as UntypedFormControl;
+    }
+  }
+
+  onChange: any = () => {};
+
+  onTouch: any = () => {};
+
+  writeValue(value: any): void {
+    this.value = value;
+  }
+
+  registerOnChange(fn: any): void {
+    this.onChange = fn;
+  }
+
+  registerOnTouched(fn: any): void {
+    this.onTouch = fn;
+  }
+
+  blurChange(e:any): void {
+    this.onblur.emit(e);
+  }
+}

package/lib/ecabs-input/ecabs-input.module.d.ts

@@ -0,0 +1,12 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./ecabs-input.component";
+import * as i2 from "../base/directives/digits-only.directive";
+import * as i3 from "@angular/common";
+import * as i4 from "@angular/material/input";
+import * as i5 from "../base/element-wrapper/element-wrapper.module";
+import * as i6 from "@angular/forms";
+export declare class EcabsInputModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<EcabsInputModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<EcabsInputModule, [typeof i1.EcabsInputComponent, typeof i2.DigitsOnlyDirective], [typeof i3.CommonModule, typeof i4.MatInputModule, typeof i5.ElementWrapperModule, typeof i6.FormsModule], [typeof i1.EcabsInputComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<EcabsInputModule>;
+}

package/lib/ecabs-input/ecabs-input.module.ts

@@ -0,0 +1,14 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { EcabsInputComponent } from './ecabs-input.component';
+import { MatInputModule } from '@angular/material/input';
+import { ElementWrapperModule } from '../base/element-wrapper/element-wrapper.module';
+import { FormsModule } from '@angular/forms';
+import { DigitsOnlyDirective } from '../base/directives/digits-only.directive';
+
+@NgModule({
+  declarations: [EcabsInputComponent, DigitsOnlyDirective],
+  imports: [CommonModule, MatInputModule, ElementWrapperModule, FormsModule],
+  exports: [EcabsInputComponent],
+})
+export class EcabsInputModule {}

package/lib/ecabs-loading/ecabs-loading.component.d.ts

@@ -0,0 +1,8 @@
+import * as i0 from "@angular/core";
+export declare class EcabsLoadingComponent {
+    loading: boolean;
+    backgroundColor: string;
+    size: 'large' | 'medium' | 'tiny';
+    static ɵfac: i0.ɵɵFactoryDeclaration<EcabsLoadingComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<EcabsLoadingComponent, "ecabs-ecabs-loading", never, { "loading": "loading"; "backgroundColor": "backgroundColor"; "size": "size"; }, {}, never, never, false>;
+}

package/lib/ecabs-loading/ecabs-loading.component.html

@@ -0,0 +1,7 @@
+<div
+  class="flex absolute left-0 top-0 right-0 bottom-0 z-50 items-center justify-center"
+  [ngStyle]="{ backgroundColor: backgroundColor }"
+  *ngIf="loading"
+>
+  <ecabs-loading-spinner [size]="size" *ngIf="loading"></ecabs-loading-spinner>
+</div>

package/lib/ecabs-loading/ecabs-loading.component.spec.ts

@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { LoadingComponent } from './loading.component';
+
+describe('LoadingComponent', () => {
+  let component: LoadingComponent;
+  let fixture: ComponentFixture<LoadingComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [LoadingComponent],
+    }).compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(LoadingComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/lib/ecabs-loading/ecabs-loading.component.ts

@@ -0,0 +1,11 @@
+import { Component, Input } from '@angular/core';
+
+@Component({
+  selector: 'ecabs-ecabs-loading',
+  templateUrl: './ecabs-loading.component.html',
+})
+export class EcabsLoadingComponent {
+  @Input() loading = false;
+  @Input() backgroundColor = 'white';
+  @Input() size: 'large' | 'medium' | 'tiny' = 'medium';
+}

package/lib/ecabs-loading/ecabs-loading.module.d.ts

@@ -0,0 +1,9 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./ecabs-loading.component";
+import * as i2 from "./spinner/spinner.component";
+import * as i3 from "@angular/common";
+export declare class EcabsLoadingModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<EcabsLoadingModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<EcabsLoadingModule, [typeof i1.EcabsLoadingComponent, typeof i2.EcabsSpinnerComponent], [typeof i3.CommonModule], [typeof i1.EcabsLoadingComponent, typeof i2.EcabsSpinnerComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<EcabsLoadingModule>;
+}

package/lib/ecabs-loading/ecabs-loading.module.ts

@@ -0,0 +1,11 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { EcabsLoadingComponent } from './ecabs-loading.component';
+import { EcabsSpinnerComponent } from './spinner/spinner.component';
+
+@NgModule({
+  declarations: [EcabsLoadingComponent, EcabsSpinnerComponent],
+  imports: [CommonModule],
+  exports: [EcabsLoadingComponent, EcabsSpinnerComponent],
+})
+export class EcabsLoadingModule {}

package/lib/ecabs-loading/spinner/spinner.component.d.ts

@@ -0,0 +1,6 @@
+import * as i0 from "@angular/core";
+export declare class EcabsSpinnerComponent {
+    size: 'large' | 'medium' | 'tiny';
+    static ɵfac: i0.ɵɵFactoryDeclaration<EcabsSpinnerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<EcabsSpinnerComponent, "ecabs-loading-spinner", never, { "size": "size"; }, {}, never, never, false>;
+}

package/lib/ecabs-loading/spinner/spinner.component.html

@@ -0,0 +1,5 @@
+<div class="loadingio-spinner-rolling {{ size }}">
+  <div class="ldio-inner">
+    <div></div>
+  </div>
+</div>

package/lib/ecabs-loading/spinner/spinner.component.scss

@@ -0,0 +1,61 @@
+:host {
+  line-height: 0;
+}
+@keyframes ldio-inner {
+  0% {
+    transform: translate(-50%, -50%) rotate(0deg);
+  }
+  100% {
+    transform: translate(-50%, -50%) rotate(360deg);
+  }
+}
+
+.loadingio-spinner-rolling {
+  width: 27px;
+  height: 27px;
+  display: inline-block;
+  overflow: hidden;
+  background: none;
+  .ldio-inner {
+    width: 100%;
+    height: 100%;
+    position: relative;
+    transform: translateZ(0) scale(1);
+    backface-visibility: hidden;
+    transform-origin: 0 0;
+    div {
+      position: absolute;
+      width: 9px;
+      height: 9px;
+      border: 4px solid #85a2b6;
+      border-top-color: transparent;
+      border-radius: 50%;
+      animation: ldio-inner 1s linear infinite;
+      top: 14px;
+      left: 14px;
+      box-sizing: content-box;
+    }
+  }
+  &.medium {
+    width: 40px;
+    height: 40px;
+    .ldio-inner div {
+      width: 20px;
+      height: 20px;
+      border-width: 6px;
+      top: 19px;
+      left: 19px;
+    }
+  }
+  &.large {
+    width: 60px;
+    height: 60px;
+    .ldio-inner div {
+      width: 35px;
+      height: 35px;
+      border-width: 9px;
+      top: 29px;
+      left: 29px;
+    }
+  }
+}

package/lib/ecabs-loading/spinner/spinner.component.spec.ts

@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { SpinnerComponent } from './spinner.component';
+
+describe('SpinnerComponent', () => {
+  let component: SpinnerComponent;
+  let fixture: ComponentFixture<SpinnerComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [SpinnerComponent],
+    }).compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SpinnerComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});