rename ui project from client-franfurt to designer-client

Issue-ID: CCSDK-1981
Signed-off-by: Ahmed Abbas <ahmad.helmy@orange.com>
Change-Id: Ic53ea9cf4a48d0ba60f91aa27960e05c77ae9b07

4 files changed, 172 insertions, 0 deletions

diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.css b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.css
new file mode 100644
index 000000000..e69de29bb
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.css
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html
new file mode 100644
index 000000000..18428d4b4
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html
@@ -0,0 +1,104 @@
+<div class="row packages-card">
+    <div class="col-lg-3 col-md-6">
+        <!--Add Package Card-->
+        <div class="card addPaackage-card">
+            <div class="card-body text-center">
+                <img src="/assets/img/icon-addPackage.svg">
+            </div>
+            <div class="card-footer row">
+                <div class="col">
+                    <a href="#" role="button" aria-pressed="true" class="btn-create-package float">Create Package
+                    </a>
+                </div>
+                <div class="col">
+                    <a href="#" role="button" aria-pressed="true" class="btn-import-package float">Import Package
+                    </a>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="col-lg-3 col-md-6" *ngFor="let bluePrint of viewedPackages">
+
+        <!--Card 1-->
+        <div>
+            <div class="card">
+                <div class="card-body">
+                    <div class="row">
+                        <div class="col-9 pr-0">
+                            <h5 class="card-title" [routerLink]="['/packages/package', bluePrint.id]" (click)="testDispatch(bluePrint)">
+                                <img class="icon-deployed" src="/assets/img/icon-deploy.svg">
+                                {{bluePrint.artifactName}}
+                            </h5>
+
+                        </div>
+                        <div class="col-3">
+
+                            <div class="dropdown">
+                                <input class="dropdown-toggle" type="text">
+                                <div class="dropdown-text">
+                                    <img src="/assets/img/icon-menuDots.svg" title="Actions">
+                                </div>
+                                <ul class="dropdown-content">
+                                    <li class="action-clone">
+                                        <a href="#">Clone</a>
+                                    </li>
+                                    <li class="action-archive">
+                                        <a href="#">Archive</a>
+                                    </li>
+                                    <li class="action-delete">
+                                        <a href="#">Delete</a>
+                                    </li>
+                                </ul>
+                            </div>
+
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            <p class="mb-0">Last modified {{ bluePrint.createdDate | date:'short' }}
+                         </p>
+                         <p>By {{bluePrint.updatedBy}}</p>
+                            <ul class="package-contributers">
+                                <li>
+                                    <button type="button" class="border-fade" data-toggle="tooltip"
+                                            data-placement="bottom"
+                                            title="User name">
+                                        <img src="/assets/img/img-user1.jpeg">
+                                    </button>
+                                </li>
+                                <li>
+                                    <button type="button" data-toggle="tooltip" data-placement="bottom"
+                                            title="User name">
+                                        <img src="/assets/img/img-user2.jpg">
+                                    </button>
+                                </li>
+                                <li>
+                                    <button type="button" data-toggle="tooltip" data-placement="bottom"
+                                            title="User name">
+                                        <img src="/assets/img/img-user3.jpg">
+                                    </button>
+                                </li>
+                                <li>
+                                    <a href="">5 contributors</a>
+                                </li>
+                            </ul>
+                        </div>
+                    </div>
+                    <div class="card-footer">
+                        <div class="row">
+                            <div class="col">
+                                <button type="button" class="btn btn-card-topology">Topology View
+                                </button>
+                            </div>
+                            <div class="col">
+                                <button type="button" class="btn btn-card-config">Configuration</button>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+            </div>
+
+        </div>
+    </div>
+</div>
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.spec.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.spec.ts
new file mode 100644
index 000000000..f45f25996
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.spec.ts
@@ -0,0 +1,36 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PackageListComponent } from './package-list.component';
+import { PackagesStore } from '../../packages.store';
+import { getBluePrintPageMock } from '../../blueprint.page.mock';
+import { of } from 'rxjs';
+
+describe('PackageListComponent', () => {
+  let component: PackageListComponent;
+  let fixture: ComponentFixture<PackageListComponent>;
+  let store: Partial<PackagesStore>;
+
+  beforeEach(async(() => {
+
+    store = { state$: of(getBluePrintPageMock()) };
+
+    TestBed.configureTestingModule({
+      declarations: [ PackageListComponent ],
+      providers: [{ provide: PackagesStore, useValue: store }]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(PackageListComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+
+  // TODO create another test with store in mind
+});
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.ts
new file mode 100644
index 000000000..c7ec0af20
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.ts
@@ -0,0 +1,32 @@
+import {Component, OnInit} from '@angular/core';
+import {BlueprintModel} from '../../model/BluePrint.model';
+import {PackagesStore} from '../../packages.store';
+
+@Component({
+    selector: 'app-packages-list',
+    templateUrl: './package-list.component.html',
+    styleUrls: ['./package-list.component.css']
+})
+export class PackageListComponent implements OnInit {
+
+    viewedPackages: BlueprintModel[] = [];
+
+
+    constructor(private packagesStore: PackagesStore) {
+        console.log('PackageListComponent');
+        this.packagesStore.state$.subscribe(state => {
+            console.log(state);
+            if (state.page) {
+                this.viewedPackages = state.page.content;
+            }
+        });
+    }
+
+    ngOnInit() {
+        this.packagesStore.getAll();
+    }
+
+    testDispatch(bluePrint: BlueprintModel) {
+        console.log(bluePrint.id);
+    }
+}