From f5660be767f8ec93d5be98376aabeb228d1a416b Mon Sep 17 00:00:00 2001 From: nklincoln Date: Wed, 19 Jul 2017 18:06:56 +0100 Subject: [PATCH] add new id card creation flow --- .../add-connection-profile.component.html | 79 +- .../add-connection-profile.component.scss | 139 ++-- .../add-connection-profile.component.spec.ts | 746 ++++-------------- .../add-connection-profile.component.ts | 410 +++------- .../connection-profile.module.ts | 4 +- .../add-identity/add-identity.component.html | 67 +- .../add-identity/add-identity.component.scss | 52 +- .../add-identity.component.spec.ts | 112 ++- .../add-identity/add-identity.component.ts | 83 +- .../src/app/identity/identity.component.html | 5 - .../app/identity/identity.component.spec.ts | 49 -- .../src/app/identity/identity.component.ts | 10 - .../src/app/identity/identity.module.ts | 5 +- .../src/app/login/login.component.html | 29 +- .../src/app/login/login.component.scss | 28 + .../src/app/login/login.component.spec.ts | 570 +++++++------ .../src/app/login/login.component.ts | 52 +- .../src/app/login/login.module.ts | 3 +- .../src/assets/styles/base/_variables.scss | 4 + .../src/assets/svg/action-based/role_24.svg | 20 + 20 files changed, 1088 insertions(+), 1379 deletions(-) create mode 100755 packages/composer-playground/src/assets/svg/action-based/role_24.svg diff --git a/packages/composer-playground/src/app/connection-profile/add-connection-profile/add-connection-profile.component.html b/packages/composer-playground/src/app/connection-profile/add-connection-profile/add-connection-profile.component.html index c05e578f64..b74e1afff1 100644 --- a/packages/composer-playground/src/app/connection-profile/add-connection-profile/add-connection-profile.component.html +++ b/packages/composer-playground/src/app/connection-profile/add-connection-profile/add-connection-profile.component.html @@ -1,44 +1,49 @@ -
-
-

Import/Create a Connection Profile

- -
-
- Upload a Connection Profile from your computer - - Or create a connection profile, select your Blockchain platform: -
-
- - -
- v0.6 Connection Profile. -
-
-
- - -
- v1.0 Connection Profile. -
-
-
+
+

Create ID Card

+
+
SELECT BLOCKCHAIN DEPLOYMENT
+
+
+
+

Create ID for a Blockchain you already use with Composer:

+
+
+ + +

{{ profile.description }}

+
+
+
+
+

Or Create ID for Blockchain you have not connected to before:

+
+
+ + +

Connect to a new v1.0 Blockchain

+
+
+ + +

Connect to a new v0.6 Blockchain

+
+
+
+
+
- - +
diff --git a/packages/composer-playground/src/app/connection-profile/add-connection-profile/add-connection-profile.component.scss b/packages/composer-playground/src/app/connection-profile/add-connection-profile/add-connection-profile.component.scss index 23c8d6d308..7c9285b171 100644 --- a/packages/composer-playground/src/app/connection-profile/add-connection-profile/add-connection-profile.component.scss +++ b/packages/composer-playground/src/app/connection-profile/add-connection-profile/add-connection-profile.component.scss @@ -1,41 +1,71 @@ @import '../../../assets/styles/base/colors'; @import '../../../assets/styles/base/variables'; -.import { - width: 660px; - height: 450px; - +.add-connection { display: flex; flex-direction: column; + background-color: $white; + margin-bottom: $space-large; + margin-top: $space-large; + border:$border-width-small solid $keyline-highlight; + border-radius: $radius-medium; - .file-types-list { - max-height: 200px; - margin-top: 16px; + h1 { + margin-top: $space-medium; + margin-bottom: $space-large; + margin-left: $space-medium; + font-size: 20px; + color: $primary-text; + letter-spacing:0; + text-align:left; + } - .file-types-list-item { - background-color: $third-highlight; - padding: $space-medium; - &:nth-child(even) { - background-color: $white; - } + .profiles { + display: flex; + flex-direction: row; + margin-left: $space-medium; .description { - font-style: italic; - padding-left: 2em; + margin-right: $space-xlarge; + margin-top: $space-small; + font-size: 0.7rem; + color:$tertiary-text; } - label.radio-label { - font-weight: bold; + .create-route { + margin-bottom: $space-large; - &::before { - top: 8px; - } + p { + color:$primary-text; + margin-top: 0; + margin-bottom: 0; + font-weight: 300; + } - &::after { - top: 13px; + .file-types-list { + display: flex; + flex-direction: row; + margin-top: $space-large; + margin-bottom: $space-mlarge; + flex-wrap: wrap; + + .file-types-list-item { + background-color: $white; + padding: $space-medium; + max-width: 25rem; + min-width: 22rem; + + .description { + color:$primary-text; + margin-left: $space-large; + } + + label.radio-label { + font-weight: 600; + } + } } } - } } section { @@ -49,71 +79,8 @@ color: $secondary-text; } - .chosen-file { - flex: 1; - display: flex; - flex-direction: column; - background-color: $third-highlight; - padding: $space-medium; - - .title { - font-weight: bold; - } - - .file-info { - display: flex; - justify-content: space-between; - border-bottom: 1px solid $fifth-highlight; - padding-bottom: $space-medium; - align-items: center; - - svg { - fill: $first-highlight; - width: 76px; - height: 76px; - margin-right: $space-medium; - } - - .file-title { - display: flex; - flex-direction: column; - justify-content: center; - - span { - color: $primary-text; - font-style: italic; - } - } - } - - .file-content { - margin-top: $space-medium; - flex: 1; - display: flex; - justify-content: space-between; - - .network-part { - margin-bottom: $space-smedium; - } - } - } - - .github-spinner { - height: 200px; - width: 465px; - display: flex; - align-items: center; - justify-content: center; - - .circle-path { - stroke: $first-highlight; - } - } - form { - max-height: 200px; overflow-y: auto; - margin-top: $space-medium; } } } diff --git a/packages/composer-playground/src/app/connection-profile/add-connection-profile/add-connection-profile.component.spec.ts b/packages/composer-playground/src/app/connection-profile/add-connection-profile/add-connection-profile.component.spec.ts index 4a1319108c..187443e3f6 100644 --- a/packages/composer-playground/src/app/connection-profile/add-connection-profile/add-connection-profile.component.spec.ts +++ b/packages/composer-playground/src/app/connection-profile/add-connection-profile/add-connection-profile.component.spec.ts @@ -13,678 +13,242 @@ import { BusinessNetworkDefinition, AdminConnection } from 'composer-admin'; import { AlertService } from '../../basic-modals/alert.service'; import { AdminService } from '../../services/admin.service'; import { ConnectionProfileService } from '../../services/connectionprofile.service'; +import { IdentityService } from '../../services/identity.service'; import { BehaviorSubject, Subject } from 'rxjs/Rx'; import * as sinon from 'sinon'; import { expect } from 'chai'; -class MockAdminService { - getAdminConnection(): AdminConnection { - return new AdminConnection(); - } - - ensureConnection(): Promise { - return new Promise((resolve, reject) => { - resolve(true); - }); - } - - deploy(): Promise { - return new Promise((resolve, reject) => { - resolve(new BusinessNetworkDefinition('org-acme-biznet@0.0.1', 'Acme Business Network')); - }); - } - - update(): Promise { - return new Promise((resolve, reject) => { - resolve(new BusinessNetworkDefinition('org-acme-biznet@0.0.1', 'Acme Business Network')); - }); - } - - generateDefaultBusinessNetwork(): BusinessNetworkDefinition { - return new BusinessNetworkDefinition('org-acme-biznet@0.0.1', 'Acme Business Network'); - } - - isInitialDeploy(): boolean { - return true; - } -} - -class MockAlertService { - public errorStatus$: Subject = new BehaviorSubject(null); - public busyStatus$: Subject = new BehaviorSubject(null); -} - -class MockConnectionProfileService { - getAllProfiles(): Promise { - return new Promise((resolve, reject) => { - resolve({profile0: 'a', profile2: 'c', profile1: 'b'}); - }); - } -} - -@Directive({ - selector: '[fileDragDrop]' -}) -class MockDragDropDirective { - @Output() - public fileDragDropFileAccepted: EventEmitter = new EventEmitter(); - @Output() - public fileDragDropFileRejected: EventEmitter = new EventEmitter(); - @Output() - public fileDragDropDragOver: EventEmitter = new EventEmitter(); - @Output() - public fileDragDropDragLeave: EventEmitter = new EventEmitter(); - - @Input() - public supportedFileTypes: string[] = []; - @Input() - maxFileSize: number = 0; -} - -@Directive({ - selector: 'file-importer' -}) -class MockFileImporterDirective { - @Output() - public fileAccepted: EventEmitter = new EventEmitter(); - - @Output() - public fileRejected: EventEmitter = new EventEmitter(); - - @Input() - public expandInput: boolean = false; - - @Input() - public svgName: string = '#icon-BNA_Upload'; - - @Input() - public maxFileSize: number = 0; - - @Input() - public supportedFileTypes: string[] = []; -} - describe('AddConnectionProfileComponent', () => { - let sandbox; + let component: AddConnectionProfileComponent; let fixture: ComponentFixture; - const NAME = 'New Profile'; - const DESC = 'Test Description'; - const MS_URL = 'msurl'; - const PEER_URL = 'peerurl'; - const EH_URL = 'ehurl'; - const KEY_VAL_STORE = 'kvs'; - const DEPLOY_TIME = 100; - const WAIT_TIME = 999; - const TIMEOUT = 134; - const CERT = 'cert'; - const CERT_PATH = 'certpath'; - const PEERS = ['peers']; - const ORDERERS = ['orderers']; - const CA = 'ca'; - const CHANNEL = 'channel'; - const MSPID = 'mspID'; + let mockConnectionProfileService; + let mockIdentityService; + let mockAlertService; beforeEach(() => { + + mockConnectionProfileService = sinon.createStubInstance(ConnectionProfileService); + mockIdentityService = sinon.createStubInstance(IdentityService); + mockAlertService = sinon.createStubInstance(AlertService); + mockAlertService.successStatus$ = {next: sinon.stub()}; + mockAlertService.busyStatus$ = {next: sinon.stub()}; + mockAlertService.errorStatus$ = {next: sinon.stub()}; + TestBed.configureTestingModule({ declarations: [ - AddConnectionProfileComponent, MockDragDropDirective, MockFileImporterDirective + AddConnectionProfileComponent ], imports: [ FormsModule ], providers: [ - {provide: AlertService, useClass: MockAlertService}, - NgbActiveModal, - {provide: AdminService, useClass: MockAdminService}, - {provide: ConnectionProfileService, useClass: MockConnectionProfileService} + {provide: AlertService, useValue: mockAlertService}, + {provide: ConnectionProfileService, useValue: mockConnectionProfileService}, + {provide: IdentityService, useValue: mockIdentityService} ] }); - sandbox = sinon.sandbox.create(); fixture = TestBed.createComponent(AddConnectionProfileComponent); component = fixture.componentInstance; }); - afterEach(() => { - sandbox.restore(); - }); - - describe('#removeFile', () => { - it('should reset current settings when removeFile is called', () => { - component.removeFile(); - expect(component.expandInput).to.be.false; - expect(component.currentFile).to.be.null; - expect(component.currentFileName).to.be.null; - expect(component.version).to.equal(''); - }); - }); + describe('#ngOnInit', () => { + it('should call updateConnectionProfiles', () => { + let updateConnectionProfilesStub = sinon.stub(component, 'updateConnectionProfiles'); - describe('#fileDetected', () => { - it('should change this.expandInput to true', () => { - component.fileDetected(); - expect(component.expandInput).to.be.true; - }); - }); + component['ngOnInit'](); - describe('#fileLeft', () => { - it('should change this.expectedInput to false', () => { - component.fileLeft(); - expect(component.expandInput).to.be.false; + updateConnectionProfilesStub.should.have.been.called; }); }); - describe('#fileAccepted', () => { - - it('should call this.createProfile', fakeAsync(() => { - let b = new Blob(['/**Connection Profile*/'], {type: 'json'}); - let file = new File([b], 'New Profile.json'); - - let createMock = sandbox.stub(component, 'createProfile'); - let dataBufferMock = sandbox.stub(component, 'getDataBuffer') - .returns(Promise.resolve('some data')); - - component.fileAccepted(file); - tick(); - createMock.called; - })); + describe('updateConnectionProfiles', () => { + it('should update all connection profiles', fakeAsync(() => { + mockConnectionProfileService.getAllProfiles.returns(Promise.resolve({myProfile: {name: 'myProfile'}})); - it('should call this.fileRejected when there is an error reading the file', fakeAsync(() => { - let b = new Blob(['/**CTO File*/'], {type: 'text/plain'}); - let file = new File([b], 'newfile.cto'); + mockIdentityService.getIdentities.returns(Promise.resolve(['bob'])); - let createMock = sandbox.stub(component, 'fileRejected'); - let dataBufferMock = sandbox.stub(component, 'getDataBuffer') - .returns(Promise.reject('some data')); + component.updateConnectionProfiles(); - component.fileAccepted(file); tick(); - createMock.called; - })); - - it('should throw when given incorrect file type', fakeAsync(() => { - - let b = new Blob(['/**PNG File*/'], {type: 'text/plain'}); - let file = new File([b], 'newfile.png'); - - let createMock = sandbox.stub(component, 'fileRejected'); - let dataBufferMock = sandbox.stub(component, 'getDataBuffer') - .returns(Promise.resolve('some data')); - - component.fileAccepted(file); - tick(); - createMock.called; - })); - }); - - describe('#fileRejected', () => { - it('should return an error status', async(() => { - component.fileRejected('long reason to reject file'); - - component['alertService'].errorStatus$.subscribe( - (message) => { - expect(message).to.be.equal('long reason to reject file'); - } - ); + mockConnectionProfileService.getAllProfiles.should.have.been.called; + mockIdentityService.getIdentities.should.have.been.calledWith('myProfile'); + component['connectionProfiles'].should.deep.equal([{ + name: 'myProfile', + profile: {name: 'myProfile'}, + default: false, + description: 'Default connection profile', + identities: [{ + userId: 'bob', + businessNetwork: 'org-acme-biznet' + }] + }]); })); }); - describe('#getDataBuffer', () => { - let file; - let mockFileReadObj; - let mockBuffer; - let mockFileRead; - let content; - - beforeEach(() => { - content = 'hello world'; - let data = new Blob([content], {type: 'text/plain'}); - file = new File([data], 'mock.bna'); - - mockFileReadObj = { - readAsArrayBuffer: sandbox.stub(), - result: content, - onload: sinon.stub(), - onerror: sinon.stub() - }; - - mockFileRead = sinon.stub(window, 'FileReader'); - mockFileRead.returns(mockFileReadObj); + describe('#generateProfileName', () => { + it('should generate a base name', () => { + component['generateProfileName']().should.equal('New Connection Profile'); }); - afterEach(() => { - mockFileRead.restore(); + it('should generate an incremented base name if one exists already', () => { + component['connectionProfiles'] = ['New Connection Profile', 'New Connection Profile1']; + component['generateProfileName']().should.equal('New Connection Profile2'); }); - it('should return data from a file', () => { - let promise = component.getDataBuffer(file); - mockFileReadObj.onload(); - return promise - .then((data) => { - data.toString().should.equal(content); - }); - }); - - it('should give error in promise chain', () => { - let promise = component.getDataBuffer(file); - mockFileReadObj.onerror('error'); - return promise - .then((data) => { - data.should.be.null; - }) - .catch((err) => { - err.should.equal('error'); - }); + it('should generate an incremented base name accounting for skipped indicies', () => { + component['connectionProfiles'] = ['New Connection Profile', 'New Connection Profile1', 'New Connection Profile2', 'New Connection Profile4']; + component['generateProfileName']().should.equal('New Connection Profile3'); }); }); - describe('#createProfile', () => { - let V06_INPUT = { - description: DESC, - type: 'hlf', - membershipServicesURL: MS_URL, - peerURL: PEER_URL, - eventHubURL: EH_URL, - keyValStore: KEY_VAL_STORE, - deployWaitTime: DEPLOY_TIME, - invokeWaitTime: WAIT_TIME, - certificate: CERT, - certificatePath: CERT_PATH - }; - - let V1_INPUT = { - description: DESC, - type: 'hlfv1', - orderers: ORDERERS, - ca: CA, - peers: PEERS, - keyValStore: KEY_VAL_STORE, - timeout: TIMEOUT, - channel: CHANNEL, - mspID: MSPID, - }; - - let BAD_INPUT = 'This is not valid input'; - - let INVALID_VERSION = { - description: 'test', - type: 'hlfv100', - }; - - it('should process json data for v0.6 hlf', fakeAsync(() => { - let createMock = sandbox.stub(component, 'setV06Defaults').returns(Promise.resolve('some data')); - let addMock = sandbox.stub(component, 'addConnectionProfile'); - let data = JSON.stringify(V06_INPUT); - component.createProfile(data); - tick(); - createMock.should.have.been.called; - component['addConnectionProfileDescription'].should.equal(DESC); - component['addConnectionProfileType'].should.equal('hlf'); - component['addConnectionProfileMembershipServicesURL'].should.equal(MS_URL); - component['addConnectionProfilePeerURL'].should.equal(PEER_URL); - component['addConnectionProfileEventHubURL'].should.equal(EH_URL); - component['addConnectionProfileKeyValStore'].should.equal(KEY_VAL_STORE); - component['addConnectionProfileDeployWaitTime'].should.equal(DEPLOY_TIME); - component['addConnectionProfileInvokeWaitTime'].should.equal(WAIT_TIME); - component['addConnectionProfileCertificate'].should.equal(CERT); - component['addConnectionProfileCertificatePath'].should.equal(CERT_PATH); - addMock.should.have.been.called; - })); - - it('should process json data for v1 hlf', fakeAsync(() => { - let createMock = sandbox.stub(component, 'setV1Defaults').returns(Promise.resolve('some data')); - let addMock = sandbox.stub(component, 'addConnectionProfile'); - let data = JSON.stringify(V1_INPUT); - component.createProfile(data); - tick(); - createMock.should.have.been.called; - component['addConnectionProfileDescription'].should.equal(DESC); - component['addConnectionProfileType'].should.equal('hlfv1'); - component['addConnectionProfileOrderers'].should.deep.equal(ORDERERS); - component['addConnectionProfileCertificateAuthority'].should.equal(CA); - component['addConnectionProfilePeers'].should.deep.equal(PEERS); - component['addConnectionProfileKeyValStore'].should.equal(KEY_VAL_STORE); - component['addConnectionProfileChannel'].should.equal(CHANNEL); - component['addConnectionProfileMspId'].should.equal(MSPID); - component['addConnectionProfileTimeout'].should.equal(TIMEOUT); - addMock.should.have.been.called; - })); + describe('#retrieveConnectionProfileByName', () => { + it('should retrieve a profile by name if it exists', fakeAsync(() => { + let myProfile = {myProfile: {profile: 'myProfile'}}; + mockConnectionProfileService.getAllProfiles.returns(Promise.resolve(myProfile)); - it('should throw an error for bad input', fakeAsync(() => { - try { - component.createProfile(BAD_INPUT); - } catch (e) { - e.message.should.contain('Parse error'); - } + component['retrieveConnectionProfileByName']('myProfile') + .then((result) => { + result.should.deep.equal({profile: 'myProfile'}); + }) + .catch((error) => { + fail('should not error'); + }); })); - it('should throw an error for an invalid type', fakeAsync(() => { - let data = JSON.stringify(INVALID_VERSION); - try { - component.createProfile(data); - } catch (e) { - e.message.should.contain('Invalid type in profile'); - } + it('should return an error if a profile by name does not exist', fakeAsync(() => { + let myProfile = [{myProfile: {name: 'myProfile'}}]; + mockConnectionProfileService.getAllProfiles.returns(Promise.resolve(myProfile)); + component['retrieveConnectionProfileByName']('notThisProfile') + .then((result) => { + fail('should throw error'); + }) + .catch((error) => { + error.toString().should.equal('Error: Unknown connection profile name: notThisProfile'); + }); })); }); - describe('#changeCurrentFileType', () => { - let TEST_DESC = 'Test Description'; - beforeEach(() => { - component['addConnectionProfileDescription'] = TEST_DESC; - }); + describe('#setConnectionProfile', () => { + it('should be able to set default v1 profile', fakeAsync(() => { + let updateConnectionProfilesStub = sinon.stub(component, 'updateConnectionProfiles'); + updateConnectionProfilesStub.returns(Promise.resolve({})); - it('should deal with the version being 0.6', fakeAsync(() => { - let setMock = sandbox.stub(component, 'setV06Defaults').returns(Promise.resolve()); - component['version'] = 'v06'; - component.changeCurrentFileType(); - tick(); - setMock.should.have.been.called; - expect(component.currentFile).to.be.null; - component['newConnectionProfile'].type.should.equal('hlf'); - component['newConnectionProfile'].description.should.equal(TEST_DESC); - })); + component.setConnectionProfile('_$v1'); - it('should deal with the addConnectionProfileType being hlf ', fakeAsync(() => { - let setMock = sandbox.stub(component, 'setV06Defaults').returns(Promise.resolve()); - component['addConnectionProfileType'] = 'hlf'; - component.changeCurrentFileType(); tick(); - setMock.should.have.been.called; - expect(component.currentFile).to.be.null; - component['newConnectionProfile'].type.should.equal('hlf'); - component['newConnectionProfile'].description.should.equal(TEST_DESC); - })); - it('should deal with the version being v1', fakeAsync(() => { - let setMock = sandbox.stub(component, 'setV1Defaults').returns(Promise.resolve()); - component['version'] = 'v1'; - component.changeCurrentFileType(); + let profile = { description: 'A description for a V1 Profile', + type: 'hlfv1', + orderers: [{ + url: 'grpc://localhost:7050', + cert: '' + }], + ca: { + url: 'http://localhost:7054', + name: '' + }, + peers: [{ + requestURL: 'grpc://localhost:7051', + eventURL: 'grpc://localhost:7053', + cert: '' + }], + keyValStore: '/tmp/keyValStore', + channel: 'composerchannel', + mspID: 'Org1MSP', + timeout: 300 + }; + + let expectedConstruct = {name: 'New Connection Profile', + profile: profile, + default: false }; + + component['connectionProfile'].should.deep.equal(expectedConstruct); + })); + + it('should be able to set default v0.6 profile', fakeAsync(() => { + let updateConnectionProfilesStub = sinon.stub(component, 'updateConnectionProfiles'); + updateConnectionProfilesStub.returns(Promise.resolve({})); + + component.setConnectionProfile('_$v06'); + tick(); - setMock.should.have.been.called; - expect(component.currentFile).to.be.null; - component['newConnectionProfile'].type.should.equal('hlfv1'); - component['newConnectionProfile'].description.should.equal(TEST_DESC); - })); - it('should throw an error when no version or connection type', fakeAsync(() => { - component['version'] = 'BAD'; - try { - component.changeCurrentFileType(); - } catch (e) { - e.message.should.contain('Unsupported version'); - } - })); - }); + let profile = { + description: 'A description for a V0.6 Profile', + type: 'hlf', + membershipServicesURL: 'grpc://localhost:7054', + peerURL: 'grpc://localhost:7051', + eventHubURL: 'grpc://localhost:7053', + keyValStore: '/tmp/keyValStore', + deployWaitTime: 5 * 60, + invokeWaitTime: 30, + certificate: null, + certificatePath: null + }; - describe('#setV06Defaults', () => { - it('should create a new profile and set defaults for a v0.6 fabric', fakeAsync(() => { - let mockUpdate = sandbox.stub(component, 'updateConnectionProfiles').returns(Promise.resolve()); - component['connectionProfiles'] = []; - component.setV06Defaults().then(() => { - component['addConnectionProfileName'].should.equal('New Connection Profile'); - verifyUnchangeableDefaults(); - }); - })); + let expectedConstruct = {name: 'New Connection Profile', + profile: profile, + default: false }; - it('should create a new profile with a new name and set defaults for a v0.6 fabric', fakeAsync(() => { - let mockUpdate = sandbox.stub(component, 'updateConnectionProfiles').returns(Promise.resolve()); - component['connectionProfiles'] = [{name: 'New Connection Profile'}]; - component.setV06Defaults().then(() => { - component['addConnectionProfileName'].should.equal('New Connection Profile 2'); - verifyUnchangeableDefaults(); - }); + component['connectionProfile'].should.deep.equal(expectedConstruct); })); - function verifyUnchangeableDefaults() { - component['addConnectionProfileDescription'].should.equal('A description for a V0.6 Profile'); - component['addConnectionProfileType'].should.equal('hlf'); - component['addConnectionProfilePeerURL'].should.equal('grpc://localhost:7051'); - component['addConnectionProfileMembershipServicesURL'].should.equal('grpc://localhost:7054'); - component['addConnectionProfileEventHubURL'].should.equal('grpc://localhost:7053'); - component['addConnectionProfileKeyValStore'].should.equal('/tmp/keyValStore'); - component['addConnectionProfileDeployWaitTime'].should.equal(300); - component['addConnectionProfileInvokeWaitTime'].should.equal(30); - expect(component['addConnectionProfileCertificate']).to.be.null; - expect(component['addConnectionProfileCertificatePath']).to.be.null; - } - }); + it('should be able to set named profile', fakeAsync(() => { + let updateConnectionProfilesStub = sinon.stub(component, 'updateConnectionProfiles'); + updateConnectionProfilesStub.returns(Promise.resolve({})); - describe('#setV1Defaults', () => { + let targetProfile = { name: 'Pingu', type: 'Penguin'}; - it('should create a new profile and set defaults for a v1 fabric 1', fakeAsync(() => { - let mockUpdate = sandbox.stub(component, 'updateConnectionProfiles').returns(Promise.resolve()); - component['connectionProfiles'] = []; - component.setV1Defaults(); - tick(); + let retrieveConnectionProfileByNameStub = sinon.stub(component, 'retrieveConnectionProfileByName'); + retrieveConnectionProfileByNameStub.returns(targetProfile); - component['addConnectionProfileName'].should.equal('New Connection Profile'); - verifyUnchangeableDefaults(); - })); + component.setConnectionProfile('selectMe'); - it('should create a new profile and set defaults for a v1 fabric 2', fakeAsync(() => { - let mockUpdate = sandbox.stub(component, 'updateConnectionProfiles').returns(Promise.resolve()); - component['connectionProfiles'] = [{name: 'New Connection Profile'}]; - component.setV1Defaults(); tick(); - component['addConnectionProfileName'].should.equal('New Connection Profile 2'); - verifyUnchangeableDefaults(); - })); - function verifyUnchangeableDefaults() { - component['addConnectionProfileDescription'].should.equal('A description for a V1 Profile'); - component['addConnectionProfileType'].should.equal('hlfv1'); - component['addConnectionProfileOrderers'].should.deep.equal([{ - url: 'grpc://localhost:7050', - cert: '' - }]); + let expectedConstruct = {name: 'selectMe', + profile: targetProfile, + default: true }; - component['addConnectionProfileCertificateAuthority'].url.should.equal('http://localhost:7054'); - component['addConnectionProfileCertificateAuthority'].name.should.equal(''); - component['addConnectionProfilePeers'].should.deep.equal([{ - requestURL: 'grpc://localhost:7051', - eventURL: 'grpc://localhost:7053', - cert: '' - }]); - component['addConnectionProfileKeyValStore'].should.equal('/tmp/keyValStore'); - component['addConnectionProfileChannel'].should.equal('composerchannel'); - component['addConnectionProfileMspId'].should.equal('Org1MSP'); - component['addConnectionProfileTimeout'].should.equal(300); - } - - }); - - describe('#updateConnectionProfiles', () => { - - it('should update/refresh the list of connection profiles', fakeAsync(() => { - component.updateConnectionProfiles().then(() => { - component['connectionProfiles'].should.deep.equal([ - {name: 'profile0', profile: 'a', default: false}, - {name: 'profile1', profile: 'b', default: false}, - {name: 'profile2', profile: 'c', default: false} - ]); - }); + component['connectionProfile'].should.deep.equal(expectedConstruct); })); }); - describe('#addConnectionProfile', () => { - let mockModalSpy; - - beforeEach(inject([NgbActiveModal], (activeModal: NgbActiveModal) => { - mockModalSpy = sinon.spy(activeModal, 'close'); - - component['addConnectionProfileName'] = NAME; - component['addConnectionProfileDescription'] = DESC; - component['addConnectionProfileMembershipServicesURL'] = MS_URL; - component['addConnectionProfilePeerURL'] = PEER_URL; - component['addConnectionProfileEventHubURL'] = EH_URL; - component['addConnectionProfileKeyValStore'] = KEY_VAL_STORE; - component['addConnectionProfileDeployWaitTime'] = DEPLOY_TIME; - component['addConnectionProfileInvokeWaitTime'] = WAIT_TIME; - component['addConnectionProfileCertificate'] = CERT; - component['addConnectionProfileCertificatePath'] = CERT_PATH; - component['addConnectionProfileOrderers'] = ORDERERS; - component['addConnectionProfileCertificateAuthority'] = CA; - component['addConnectionProfilePeers'] = PEERS; - component['addConnectionProfileChannel'] = CHANNEL; - component['addConnectionProfileMspId'] = MSPID; - component['addConnectionProfileTimeout'] = TIMEOUT; - })); + describe('#dismiss', () => { + it('should trigger cancelAdd.emit ', () => { + let spy = sinon.spy(component.cancelAdd, 'emit'); - it('should deal with the version being 0.6 and a certificate', () => { - let EXP = { - default: false, - name: 'New Profile', - profile: { - certificate: CERT + '\n', - certificatePath: CERT_PATH, - deployWaitTime: DEPLOY_TIME, - description: DESC, - eventHubURL: EH_URL, - invokeWaitTime: WAIT_TIME, - keyValStore: KEY_VAL_STORE, - membershipServicesURL: MS_URL, - peerURL: PEER_URL, - type: 'hlf' - } - }; - - component['version'] = 'v06'; - component.addConnectionProfile(); - mockModalSpy.should.have.been.calledWith(EXP); - }); - - it('should deal with the version being 0.6 and without a certificate', () => { - component['addConnectionProfileCertificate'] = null; + component.dismiss(); - let EXP = { - default: false, - name: 'New Profile', - profile: { - certificate: null, - certificatePath: CERT_PATH, - deployWaitTime: DEPLOY_TIME, - description: DESC, - eventHubURL: EH_URL, - invokeWaitTime: WAIT_TIME, - keyValStore: KEY_VAL_STORE, - membershipServicesURL: MS_URL, - peerURL: PEER_URL, - type: 'hlf' - } - }; - - component['version'] = 'v06'; - component.addConnectionProfile(); - mockModalSpy.should.have.been.calledWith(EXP); + spy.should.have.been.calledWith(true); }); + }); - it('should deal with the version being 1', () => { - let EXP = { - default: false, - name: 'New Profile', - profile: { - ca: CA, - channel: CHANNEL, - timeout: TIMEOUT, - description: DESC, - keyValStore: KEY_VAL_STORE, - mspID: MSPID, - orderers: [{url: 'orderers', cert: ''}], - peers: PEERS, - type: 'hlfv1' - } - }; - - component['version'] = 'v1'; - component.addConnectionProfile(); - mockModalSpy.should.have.been.calledWith(EXP); - }); - - it('should deal with the version being 0.6 and with a certificate just whitespace', () => { - component['addConnectionProfileCertificate'] = ' '; - - let EXP = { - default: false, - name: 'New Profile', - profile: { - certificate: ' ', - certificatePath: CERT_PATH, - deployWaitTime: DEPLOY_TIME, - description: DESC, - eventHubURL: EH_URL, - invokeWaitTime: WAIT_TIME, - keyValStore: KEY_VAL_STORE, - membershipServicesURL: MS_URL, - peerURL: PEER_URL, - type: 'hlf' - } - }; - - component['version'] = 'v06'; - component.addConnectionProfile(); - mockModalSpy.should.have.been.calledWith(EXP); - }); + describe('#initiateAddToProfile', () => { + it('should trigger profileToUse.emit with the connection profile name', () => { + component['connectionProfile'] = {name: 'bob'}; + let spy = sinon.spy(component.profileToUse, 'emit'); - it('should deal with the version being 0.6 and with a certificate with new line char', () => { - component['addConnectionProfileCertificate'] = 'bob \n'; + component.initiateAddToProfile(); - let EXP = { - default: false, - name: 'New Profile', - profile: { - certificate: 'bob \n', - certificatePath: CERT_PATH, - deployWaitTime: DEPLOY_TIME, - description: DESC, - eventHubURL: EH_URL, - invokeWaitTime: WAIT_TIME, - keyValStore: KEY_VAL_STORE, - membershipServicesURL: MS_URL, - peerURL: PEER_URL, - type: 'hlf' - } - }; - - component['version'] = 'v06'; - component.addConnectionProfile(); - mockModalSpy.should.have.been.calledWith(EXP); + spy.should.have.been.calledWith('bob'); }); + }); - it('should deal with the version being 1 with object orderers', () => { - component['addConnectionProfileOrderers'] = [{url: 'http://localhost', cert: 'bob'}]; + describe('#initiateAddWithProfile', () => { + it('should trigger profileToEdit.emit with the connection profile', () => { + let myProfile = {name: 'bob', penguins : ['pingu', 'poppy']}; + component['connectionProfile'] = myProfile; + let spy = sinon.spy(component.profileToEdit, 'emit'); - let EXP = { - default: false, - name: 'New Profile', - profile: { - ca: CA, - channel: CHANNEL, - timeout: TIMEOUT, - description: DESC, - keyValStore: KEY_VAL_STORE, - mspID: MSPID, - orderers: [{url: 'http://localhost', cert: 'bob'}], - peers: PEERS, - type: 'hlfv1' - } - }; - - component['version'] = 'v1'; - component.addConnectionProfile(); - mockModalSpy.should.have.been.calledWith(EXP); - }); + component.initiateAddWithProfile(); - it('should deal with an invalid version', () => { - try { - component['version'] = 'badversion'; - component.addConnectionProfile(); - } catch (e) { - e.message.should.contain('Unknown connection profile version selected'); - } + spy.should.have.been.calledWith(myProfile); }); }); }); diff --git a/packages/composer-playground/src/app/connection-profile/add-connection-profile/add-connection-profile.component.ts b/packages/composer-playground/src/app/connection-profile/add-connection-profile/add-connection-profile.component.ts index 6cf6b29b3b..2d71da89cf 100644 --- a/packages/composer-playground/src/app/connection-profile/add-connection-profile/add-connection-profile.component.ts +++ b/packages/composer-playground/src/app/connection-profile/add-connection-profile/add-connection-profile.component.ts @@ -1,331 +1,165 @@ -import { Component, Input } from '@angular/core'; -import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'; +import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; -import { BusinessNetworkDefinition } from 'composer-common'; import { AlertService } from '../../basic-modals/alert.service'; import { ConnectionProfileService } from '../../services/connectionprofile.service'; +import { IdentityService } from '../../services/identity.service'; @Component({ selector: 'add-connection-profile', templateUrl: './add-connection-profile.component.html', styleUrls: ['./add-connection-profile.component.scss'.toString()] }) -export class AddConnectionProfileComponent { +export class AddConnectionProfileComponent implements OnInit { - @Input() businessNetwork: BusinessNetworkDefinition; + @Input() connectionProfiles: any = []; + @Output() profileToUse = new EventEmitter(); + @Output() profileToEdit = new EventEmitter(); + @Output() cancelAdd = new EventEmitter(); - currentFile = null; - currentFileName = null; - version = ''; + private newDefault = true; - expandInput: boolean = false; - - maxFileSize: number = 5242880; - supportedFileTypes: string[] = ['.json']; - - error = null; - - private connectionProfiles: any = []; - private newConnectionProfile: any; - private addConnectionProfileName: string = null; - private addConnectionProfileDescription: string = null; - private addConnectionProfileType: string = null; - private addConnectionProfilePeerURL: string = null; - private addConnectionProfileMembershipServicesURL: string = null; - private addConnectionProfileEventHubURL: string = null; - private addConnectionProfileKeyValStore: string = null; - private addConnectionProfileDeployWaitTime: number = null; - private addConnectionProfileInvokeWaitTime: number = null; - private addConnectionProfileTimeout: number = null; - private addConnectionProfileCertificate: string = null; - private addConnectionProfileCertificatePath: string = null; - - // V1 attributes - private addConnectionProfileOrderers: any[] = null; - private addConnectionProfilePeers: any[] = null; - private addConnectionProfileCertificateAuthority: any = null; - private addConnectionProfileChannel: string = null; - private addConnectionProfileMspId: string = null; + // Common attributes + private connectionProfile: any = null; constructor(private alertService: AlertService, - public activeModal: NgbActiveModal, - private connectionProfileService: ConnectionProfileService) { - } - - removeFile() { - this.expandInput = false; - this.currentFile = null; - this.currentFileName = null; - this.version = ''; - } - - fileDetected() { - this.expandInput = true; - } - - fileLeft() { - this.expandInput = false; + private connectionProfileService: ConnectionProfileService, + private identityService: IdentityService) { } - fileAccepted(file: File) { - let type = file.name.substr(file.name.lastIndexOf('.') + 1); - this.getDataBuffer(file) - .then((data) => { - if (type === 'json') { - this.expandInput = true; - this.createProfile(data); - } else { - throw new Error('Unexpected File Type'); - } - }) - .catch((err) => { - this.fileRejected(err); - }); + ngOnInit() { + return this.updateConnectionProfiles(); } - getDataBuffer(file: File) { - return new Promise((resolve, reject) => { - let fileReader = new FileReader(); - fileReader.readAsArrayBuffer(file); - fileReader.onload = () => { - let dataBuffer = Buffer.from(fileReader.result); - resolve(dataBuffer); - }; - fileReader.onerror = (err) => { - reject(err); - }; + updateConnectionProfiles(): Promise { + return this.connectionProfileService.getAllProfiles() + .then((profiles) => { + let newConnectionProfiles = []; + let keys = Object.keys(profiles).sort(); + keys.forEach((key) => { + return this.identityService.getIdentities(key) + .then((identities) => { + let identityList = []; + identities.forEach((identity) => { + identityList.push({ + userId: identity, + businessNetwork: 'org-acme-biznet' + }); + }); + + let connectionProfile = profiles[key]; + newConnectionProfiles.push({ + name: key, + profile: connectionProfile, + default: key === '$default', + description: 'Default connection profile', + identities: identityList + }); + }); + }); + this.connectionProfiles = newConnectionProfiles; }); } - createProfile(profileBuffer) { + generateProfileName(): string { + let connectionProfileBase = 'New Connection Profile'; + let connectionProfileName = connectionProfileBase; + let increment = 1; - let profileData; - // Converts buffer to string - try { - profileData = JSON.parse(profileBuffer.toString()); - } catch (e) { - throw new Error('Parse error: ' + e.message); + while ( this.connectionProfiles.findIndex((cp) => cp === connectionProfileName) !== -1 ) { + connectionProfileName = connectionProfileBase + increment; + increment++; } - // Set defaults - if (profileData.type === 'hlf') { - return this.setV06Defaults().then(() => { - this.addConnectionProfileDescription = profileData.description; - this.addConnectionProfileType = profileData.type; - this.addConnectionProfileMembershipServicesURL = profileData.membershipServicesURL; - this.addConnectionProfilePeerURL = profileData.peerURL; - this.addConnectionProfileEventHubURL = profileData.eventHubURL; - this.addConnectionProfileKeyValStore = profileData.keyValStore; - this.addConnectionProfileDeployWaitTime = profileData.deployWaitTime; - this.addConnectionProfileInvokeWaitTime = profileData.invokeWaitTime; - this.addConnectionProfileCertificate = profileData.certificate; - this.addConnectionProfileCertificatePath = profileData.certificatePath; - this.addConnectionProfile(); - }); - } else if (profileData.type === 'hlfv1') { - return this.setV1Defaults().then(() => { - this.addConnectionProfileDescription = profileData.description; - this.addConnectionProfileType = profileData.type; - this.addConnectionProfileOrderers = profileData.orderers; + return connectionProfileName; + } - this.addConnectionProfileCertificateAuthority = profileData.ca; - this.addConnectionProfilePeers = profileData.peers; - this.addConnectionProfileKeyValStore = profileData.keyValStore; - this.addConnectionProfileChannel = profileData.channel; - this.addConnectionProfileMspId = profileData.mspID; - this.addConnectionProfileTimeout = profileData.timeout; - this.addConnectionProfile(); + retrieveConnectionProfileByName(name: string): Promise { + return this.connectionProfileService.getAllProfiles() + .then((connectionProfiles) => { + let newConnectionProfile; + let keys = Object.keys(connectionProfiles).sort(); + keys.forEach((key) => { + if (key === name) { + newConnectionProfile = connectionProfiles[key]; + } }); - } else { - throw new Error('Invalid type in profile: ' + profileData.type); - } - } + if (newConnectionProfile) { + return newConnectionProfile; - fileRejected(reason: string) { - this.alertService.errorStatus$.next(reason); + } else { + throw new Error('Unknown connection profile name: ' + name); + } + }); } - changeCurrentFileType() { - this.currentFile = null; - - if (this.version === 'v06' || this.addConnectionProfileType === 'hlf') { - return this.setV06Defaults().then(() => { - this.newConnectionProfile = { - description: this.addConnectionProfileDescription, + setConnectionProfile(name: string) { + return this.updateConnectionProfiles().then(() => { + let profile; + if (name.valueOf() === '_$v06') { + // Wish to work with new V06 + this.newDefault = true; + profile = { + description: 'A description for a V0.6 Profile', type: 'hlf', - membershipServicesURL: this.addConnectionProfileMembershipServicesURL, - peerURL: this.addConnectionProfilePeerURL, - eventHubURL: this.addConnectionProfileEventHubURL, - keyValStore: this.addConnectionProfileKeyValStore, - deployWaitTime: this.addConnectionProfileDeployWaitTime, - invokeWaitTime: this.addConnectionProfileInvokeWaitTime, - certificate: this.addConnectionProfileCertificate, - certificatePath: this.addConnectionProfileCertificatePath + membershipServicesURL: 'grpc://localhost:7054', + peerURL: 'grpc://localhost:7051', + eventHubURL: 'grpc://localhost:7053', + keyValStore: '/tmp/keyValStore', + deployWaitTime: 5 * 60, + invokeWaitTime: 30, + certificate: null, + certificatePath: null }; - }); - - } else if (this.version === 'v1') { - - return this.setV1Defaults().then(() => { - this.newConnectionProfile = { - description: this.addConnectionProfileDescription, + } else if (name.valueOf() === '_$v1') { + // Wish to work with new V1 + this.newDefault = true; + profile = { + description: 'A description for a V1 Profile', type: 'hlfv1', - orderers: this.addConnectionProfileOrderers, - ca: this.addConnectionProfileCertificateAuthority, - peers: this.addConnectionProfilePeers, - keyValStore: this.addConnectionProfileKeyValStore, - channel: this.addConnectionProfileChannel, - mspID: this.addConnectionProfileMspId, - timeout: this.addConnectionProfileTimeout, + orderers: [{ + url: 'grpc://localhost:7050', + cert: '' + }], + ca: { + url: 'http://localhost:7054', + name: '' + }, + peers: [{ + requestURL: 'grpc://localhost:7051', + eventURL: 'grpc://localhost:7053', + cert: '' + }], + keyValStore: '/tmp/keyValStore', + channel: 'composerchannel', + mspID: 'Org1MSP', + timeout: 5 * 60, }; - }); - } else { - throw new Error('Unsupported version'); - } - } - - addConnectionProfile(): void { - let connectionProfile; - - if (this.version === 'v06' || this.addConnectionProfileType === 'hlf') { - // Do we have a connection profile certificate? - if (this.addConnectionProfileCertificate) { - // That isn't just whitespace? - if (this.addConnectionProfileCertificate.trim()) { - let end = this.addConnectionProfileCertificate.slice(-1); - if (end !== '\n') { - this.addConnectionProfileCertificate += '\n'; - } - } - } - connectionProfile = { - description: this.addConnectionProfileDescription, - type: 'hlf', - membershipServicesURL: this.addConnectionProfileMembershipServicesURL, - peerURL: this.addConnectionProfilePeerURL, - eventHubURL: this.addConnectionProfileEventHubURL, - keyValStore: this.addConnectionProfileKeyValStore, - deployWaitTime: this.addConnectionProfileDeployWaitTime, - invokeWaitTime: this.addConnectionProfileInvokeWaitTime, - certificate: this.addConnectionProfileCertificate, - certificatePath: this.addConnectionProfileCertificatePath - }; - } else if (this.version === 'v1' || this.addConnectionProfileType === 'hlfv1') { - - // If the orderers are a list of strings, we need to convert it to a list of objects. - // Doing this allows the rest of the code to work as usual - let newOrderersList = []; - for (let x = 0; x < this.addConnectionProfileOrderers.length; x++) { - if (typeof this.addConnectionProfileOrderers[x] === 'string') { - newOrderersList.push({url: this.addConnectionProfileOrderers[x], cert: ''}); - } else { - newOrderersList.push(this.addConnectionProfileOrderers[x]); - } + } else { + // Wish to work with existing + this.newDefault = false; + // Retrieve details + profile = this.retrieveConnectionProfileByName(name); } - - connectionProfile = { - description: this.addConnectionProfileDescription, - type: 'hlfv1', - orderers: newOrderersList, - ca: this.addConnectionProfileCertificateAuthority, - peers: this.addConnectionProfilePeers, - keyValStore: this.addConnectionProfileKeyValStore, - channel: this.addConnectionProfileChannel, - mspID: this.addConnectionProfileMspId, - timeout: this.addConnectionProfileTimeout + return profile; + }) + .then((profile) => { + this.connectionProfile = { + name: this.newDefault ? this.generateProfileName() : name, + profile: profile, + default: this.newDefault ? false : true, }; - } else { - throw new Error('Unknown connection profile version selected'); - } - - let completeConnectionProfile = { - name: this.addConnectionProfileName, - profile: connectionProfile, - default: this.addConnectionProfileName === '$default' - }; - this.activeModal.close(completeConnectionProfile); - - } - - setV06Defaults(): Promise { - return this.updateConnectionProfiles().then(() => { - let connectionProfileBase = 'New Connection Profile'; - let connectionProfileName = connectionProfileBase; - let counter = 1; - - while (this.connectionProfiles.some((cp) => { - return cp.name === connectionProfileName; - })) { - counter++; - connectionProfileName = connectionProfileBase + ' ' + counter; - } - - this.addConnectionProfileName = connectionProfileName; - this.addConnectionProfileDescription = 'A description for a V0.6 Profile'; - this.addConnectionProfileType = 'hlf'; - this.addConnectionProfilePeerURL = 'grpc://localhost:7051'; - this.addConnectionProfileMembershipServicesURL = 'grpc://localhost:7054'; - this.addConnectionProfileEventHubURL = 'grpc://localhost:7053'; - this.addConnectionProfileKeyValStore = '/tmp/keyValStore'; - this.addConnectionProfileDeployWaitTime = 5 * 60; - this.addConnectionProfileInvokeWaitTime = 30; - this.addConnectionProfileCertificate = null; - this.addConnectionProfileCertificatePath = null; }); } - setV1Defaults(): Promise { - return this.updateConnectionProfiles().then(() => { - let connectionProfileBase = 'New Connection Profile'; - let connectionProfileName = connectionProfileBase; - let counter = 1; - - while (this.connectionProfiles.some((cp) => { - return cp.name === connectionProfileName; - })) { - counter++; - connectionProfileName = connectionProfileBase + ' ' + counter; - } - - this.addConnectionProfileName = connectionProfileName; - this.addConnectionProfileDescription = 'A description for a V1 Profile'; - this.addConnectionProfileType = 'hlfv1'; - this.addConnectionProfileOrderers = [{ - url: 'grpc://localhost:7050', - cert: '' - }]; - - this.addConnectionProfileCertificateAuthority = { - url: 'http://localhost:7054', - name: '' - }; - this.addConnectionProfilePeers = [{ - requestURL: 'grpc://localhost:7051', - eventURL: 'grpc://localhost:7053', - cert: '' - }]; - this.addConnectionProfileKeyValStore = '/tmp/keyValStore'; - this.addConnectionProfileChannel = 'composerchannel'; - this.addConnectionProfileMspId = 'Org1MSP'; - this.addConnectionProfileTimeout = 5 * 60; - }); + dismiss() { + this.cancelAdd.emit(true); + } + initiateAddToProfile() { + this.profileToUse.emit(this.connectionProfile.name); } - updateConnectionProfiles(): Promise { - let newConnectionProfiles = []; - return this.connectionProfileService.getAllProfiles() - .then((connectionProfiles) => { - let keys = Object.keys(connectionProfiles).sort(); - keys.forEach((key) => { - let connectionProfile = connectionProfiles[key]; - newConnectionProfiles.push({ - name: key, - profile: connectionProfile, - default: key === '$default' - }); - }); - this.connectionProfiles = newConnectionProfiles; - }); + initiateAddWithProfile() { + this.profileToEdit.emit(this.connectionProfile); } } diff --git a/packages/composer-playground/src/app/connection-profile/connection-profile.module.ts b/packages/composer-playground/src/app/connection-profile/connection-profile.module.ts index 8038d42217..2540f92f80 100644 --- a/packages/composer-playground/src/app/connection-profile/connection-profile.module.ts +++ b/packages/composer-playground/src/app/connection-profile/connection-profile.module.ts @@ -11,10 +11,10 @@ import { FileImporterModule } from '../common/file-importer/file-importer.module @NgModule({ imports: [CommonModule, FormsModule, NgbModule, ReactiveFormsModule, FileImporterModule], - entryComponents: [AddCertificateComponent, AddConnectionProfileComponent, ViewCertificateComponent], + entryComponents: [AddCertificateComponent, ViewCertificateComponent], declarations: [ConnectionProfileComponent, AddCertificateComponent, AddConnectionProfileComponent, ViewCertificateComponent], providers: [], - exports: [ConnectionProfileComponent] + exports: [ConnectionProfileComponent, AddConnectionProfileComponent] }) export class ConnectionProfileModule { diff --git a/packages/composer-playground/src/app/identity/add-identity/add-identity.component.html b/packages/composer-playground/src/app/identity/add-identity/add-identity.component.html index d4e29f6cda..625f24ed23 100644 --- a/packages/composer-playground/src/app/identity/add-identity/add-identity.component.html +++ b/packages/composer-playground/src/app/identity/add-identity/add-identity.component.html @@ -1,32 +1,49 @@
-
-

Add Identity

- -
-
-

Add an existing ID to your wallet

- -
-
- - -
- -
- - -
-
+

Create ID Card

+
+
PROVIDE SECURITY CREDENTIALS
+
+
+

You must provide one of two types of information to create an ID card:

+
+
+ + +

These can be created when accessing a business network.

+
+
+ + +

Required here are public and private certificate files.

+
+
+
+
+

An ID and Secret must be created by someone who already has access to the Business Network you are connecting to.

+
+
+ + +
+
+ + +
+
+ + +
+
+
+
- -
+ + diff --git a/packages/composer-playground/src/app/identity/add-identity/add-identity.component.scss b/packages/composer-playground/src/app/identity/add-identity/add-identity.component.scss index c87aae3ad0..2c8132d4a7 100644 --- a/packages/composer-playground/src/app/identity/add-identity/add-identity.component.scss +++ b/packages/composer-playground/src/app/identity/add-identity/add-identity.component.scss @@ -1,10 +1,53 @@ @import '../../../assets/styles/base/colors'; @import '../../../assets/styles/base/variables'; +@import '../../connection-profile/add-connection-profile/add-connection-profile.component'; -add-identity-modal { - .add-identity { - p { - color: $secondary-text; +.add-identity { + + // Take main styling from add-connection-profile + @extend .add-connection; + + .profiles { + .create-route { + margin-right: $space-xlarge; + margin-bottom: $space-mlarge; + border-bottom: $border-width-small solid $fourth-highlight; + } + } + + .noCerts { + display: flex; + flex-direction: column; + margin-bottom: $space-large; + margin-right: $space-xlarge; + + .option { + display: flex; + flex-direction: row; + align-content: center; + margin-top: $space-medium; + } + + p { + color:$primary-text; + line-height:19px; + margin-top: 0; + margin-bottom: 0; + font-weight: 300; + } + } + + label { + display: flex; + align-self: center; + min-width: 10rem; + } + + input[type='text'], input[type='password'] { + display: flex; + align-self: center; + color:$primary-text; + margin-bottom: 0; } footer { @@ -15,4 +58,3 @@ add-identity-modal { width: 100%; } } -} diff --git a/packages/composer-playground/src/app/identity/add-identity/add-identity.component.spec.ts b/packages/composer-playground/src/app/identity/add-identity/add-identity.component.spec.ts index cd4d801f05..306ede97a2 100644 --- a/packages/composer-playground/src/app/identity/add-identity/add-identity.component.spec.ts +++ b/packages/composer-playground/src/app/identity/add-identity/add-identity.component.spec.ts @@ -12,6 +12,7 @@ import { Wallet } from 'composer-common'; import { AddIdentityComponent } from './add-identity.component'; import { ConnectionProfileService } from '../../services/connectionprofile.service'; import { WalletService } from '../../services/wallet.service'; +import { AlertService } from '../../basic-modals/alert.service'; describe('AddIdentityComponent', () => { let sandbox; @@ -21,19 +22,25 @@ describe('AddIdentityComponent', () => { let mockActiveModal; let mockConnectionProfileService; let mockWalletService; + let mockAlertService; beforeEach(() => { mockActiveModal = sinon.createStubInstance(NgbActiveModal); mockConnectionProfileService = sinon.createStubInstance(ConnectionProfileService); mockWalletService = sinon.createStubInstance(WalletService); + mockAlertService = sinon.createStubInstance(AlertService); + + mockAlertService.successStatus$ = {next: sinon.stub()}; + mockAlertService.busyStatus$ = {next: sinon.stub()}; + mockAlertService.errorStatus$ = {next: sinon.stub()}; TestBed.configureTestingModule({ imports: [FormsModule], declarations: [AddIdentityComponent], providers: [ - {provide: NgbActiveModal, useValue: mockActiveModal}, {provide: ConnectionProfileService, useValue: mockConnectionProfileService}, - {provide: WalletService, useValue: mockWalletService} + {provide: WalletService, useValue: mockWalletService}, + {provide: AlertService, useValue: mockAlertService} ] }) .compileComponents(); @@ -59,8 +66,10 @@ describe('AddIdentityComponent', () => { mockWalletService.getWallet.returns(mockWallet); }); - it('should add an identity to the wallet', fakeAsync(() => { + it('should add an identity to the wallet and inform success', fakeAsync(() => { mockWallet.contains.returns(Promise.resolve(false)); + mockWallet.add.returns(Promise.resolve()); + let spy = sinon.spy(component.identityAdded, 'emit'); component.addIdentity(); @@ -68,11 +77,18 @@ describe('AddIdentityComponent', () => { mockWallet.update.should.not.have.been.called; mockWallet.add.should.have.been.called.once; - // TODO called with? + mockAlertService.successStatus$.next.should.have.been.calledWith({ + title: 'ID Card Added', + text: 'The ID card was successfully added to My Wallet.', + icon: '#icon-role_24' + }); + spy.should.have.been.calledWith({success: true}); })); it('should update an identity in the wallet', fakeAsync(() => { mockWallet.contains.returns(Promise.resolve(true)); + mockWallet.update.returns(Promise.resolve()); + let spy = sinon.spy(component.identityAdded, 'emit'); component.addIdentity(); @@ -80,11 +96,17 @@ describe('AddIdentityComponent', () => { mockWallet.add.should.not.have.been.called; mockWallet.update.should.have.been.called.once; - // TODO called with? + mockAlertService.successStatus$.next.should.have.been.calledWith({ + title: 'ID Card Updated', + text: 'The ID card was successfully updated within My Wallet.', + icon: '#icon-role_24' + }); + spy.should.have.been.calledWith({success: true}); })); - it('should handle an error', fakeAsync(() => { + it('should handle an error and inform the user', fakeAsync(() => { mockWallet.contains.returns(Promise.reject('test error')); + let spy = sinon.spy(component.identityAdded, 'emit'); component.addIdentity(); @@ -92,8 +114,82 @@ describe('AddIdentityComponent', () => { mockWallet.add.should.not.have.been.called; mockWallet.update.should.not.have.been.called; - mockActiveModal.dismiss.should.have.been.called.once; - // TODO called with? + component['addInProgress'].should.be.false; + mockAlertService.errorStatus$.next.should.have.been.calledWith('test error'); + spy.should.have.been.calledWith({success: false}); })); }); + + describe('#validContents', () => { + + it('should not enable validation if trying to set certificates', () => { + // Certs path + component['useCerts'] = true; + component['validContents']().should.be.false; + }); + + it('should not validate if a userID field is empty when specifying user ID/Secret', () => { + // Secret/ID path + component['useCerts'] = false; + component['addInProgress'] = false; + component['userId'] = null; + component['userSecret'] = 'mySecret'; + component['busNetName'] = 'myName'; + + component['validContents']().should.be.false; + }); + + it('should not validate if a userSecret field is empty when specifying user ID/Secret', () => { + // Secret/ID path + component['useCerts'] = false; + component['addInProgress'] = false; + component['userId'] = 'myID'; + component['userSecret'] = null; + component['busNetName'] = 'myName'; + + component['validContents']().should.be.false; + }); + + it('should validate if a Business Network Name field is empty when specifying user ID/Secret', () => { + // Secret/ID path + component['useCerts'] = false; + component['addInProgress'] = false; + component['userId'] = 'myID'; + component['userSecret'] = 'mySecret'; + component['busNetName'] = null; + + component['validContents']().should.be.true; + }); + + it('should validate if all text fields are added when specifying user ID/Secret', () => { + // Secret/ID path + component['useCerts'] = false; + component['addInProgress'] = false; + component['userId'] = 'myID'; + component['userSecret'] = 'mySecret'; + component['busNetName'] = 'myName'; + + component['validContents']().should.be.true; + }); + }); + + describe('#useCertificates', () => { + it('should set flag to false when passed false', () => { + component['useCertificates'](false); + component['useCerts'].should.be.false; + }); + + it('should set flag to true when passed true', () => { + component['useCertificates'](true); + component['useCerts'].should.be.true; + }); + }); + + describe('#close', () => { + it('should emit on close', () => { + let spy = sinon.spy(component.cancelAdd, 'emit'); + component['close'](); + spy.should.have.been.calledWith(true); + }); + }); }); diff --git a/packages/composer-playground/src/app/identity/add-identity/add-identity.component.ts b/packages/composer-playground/src/app/identity/add-identity/add-identity.component.ts index befe72f471..7cd05fb94a 100644 --- a/packages/composer-playground/src/app/identity/add-identity/add-identity.component.ts +++ b/packages/composer-playground/src/app/identity/add-identity/add-identity.component.ts @@ -1,48 +1,95 @@ -import { Component } from '@angular/core'; -import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'; - +import { Component, Input, Output, EventEmitter } from '@angular/core'; import { ConnectionProfileService } from '../../services/connectionprofile.service'; +import { AlertService } from '../../basic-modals/alert.service'; import { WalletService } from '../../services/wallet.service'; @Component({ - selector: 'add-identity-modal', + selector: 'add-identity', templateUrl: './add-identity.component.html', styleUrls: ['./add-identity.component.scss'.toString()] }) export class AddIdentityComponent { - private userID: string = null; + @Input() targetProfileName: string; + @Output() identityAdded = new EventEmitter(); + @Output() cancelAdd = new EventEmitter(); + + private userId: string = null; private userSecret: string = null; + private busNetName: string = null; private addInProgress: boolean = false; + private useCerts: boolean = false; constructor(private connectionProfileService: ConnectionProfileService, private walletService: WalletService, - private activeModal: NgbActiveModal) { + private alertService: AlertService) { } - addIdentity() { - this.addInProgress = true; + close() { + this.cancelAdd.emit(true); + } - let connectionProfile = this.connectionProfileService.getCurrentConnectionProfile(); - let wallet = this.walletService.getWallet(connectionProfile); + useCertificates(option: boolean) { + this.useCerts = option; + } - return wallet.contains(this.userID) + validContents(): boolean { + if (this.useCerts) { + return false; + } else { + return ((this.userId !== null && this.userId.length !== 0 && + this.userSecret !== null && this.userSecret.length !== 0) || + this.addInProgress); + } + } + + addIdentity() { + this.addInProgress = true; + let wallet = this.walletService.getWallet(this.targetProfileName); + return wallet.contains(this.userId) .then((contains) => { if (contains) { - return wallet.update(this.userID, this.userSecret); + this.alertService.busyStatus$.next({ + title: 'Updating ID card', + text: 'updating the ID card ' + this.userId + }); + return wallet.update(this.userId, this.userSecret) + .then(() => { + this.alertService.busyStatus$.next(null); + this.alertService.successStatus$.next({ + title: 'ID Card Updated', + text: 'The ID card was successfully updated within My Wallet.', + icon: '#icon-role_24' + }); + this.addInProgress = false; + this.identityAdded.emit({success: true}); + }); + } else { - return wallet.add(this.userID, this.userSecret); + this.alertService.busyStatus$.next({ + title: 'Adding ID card', + text: 'adding ID card ' + this.userId + }); + return wallet.add(this.userId, this.userSecret) + .then(() => { + this.alertService.busyStatus$.next(null); + this.alertService.successStatus$.next({ + title: 'ID Card Added', + text: 'The ID card was successfully added to My Wallet.', + icon: '#icon-role_24' + }); + this.addInProgress = false; + this.identityAdded.emit({success: true}); + }); } }) - .then(() => { - this.addInProgress = false; - this.activeModal.close(); - }) .catch((error) => { - this.activeModal.dismiss(error); + this.alertService.busyStatus$.next(null); + this.alertService.errorStatus$.next(error); this.addInProgress = false; + this.identityAdded.emit({success: false}); }); } } diff --git a/packages/composer-playground/src/app/identity/identity.component.html b/packages/composer-playground/src/app/identity/identity.component.html index e8672d73ac..bdab6bc88e 100644 --- a/packages/composer-playground/src/app/identity/identity.component.html +++ b/packages/composer-playground/src/app/identity/identity.component.html @@ -2,11 +2,6 @@

My Wallet

- - - diff --git a/packages/composer-playground/src/app/identity/identity.component.spec.ts b/packages/composer-playground/src/app/identity/identity.component.spec.ts index 5f6a7f684d..9e40c6ac95 100644 --- a/packages/composer-playground/src/app/identity/identity.component.spec.ts +++ b/packages/composer-playground/src/app/identity/identity.component.spec.ts @@ -120,55 +120,6 @@ describe(`IdentityComponent`, () => { })); }); - describe('addId', () => { - it('should add the id', fakeAsync(() => { - mockModal.open = sinon.stub().returns({ - result: Promise.resolve() - }); - - let mockLoadIdentities = sinon.stub(component, 'loadIdentities'); - - component.addId(); - - tick(); - - mockLoadIdentities.should.have.been.called; - mockModal.open.should.have.been.called; - })); - - it('should handle an error', fakeAsync(() => { - mockModal.open = sinon.stub().returns({ - result: Promise.reject('some error') - }); - - let mockLoadIdentities = sinon.stub(component, 'loadIdentities'); - - component.addId(); - - tick(); - - mockAlertService.errorStatus$.next.should.have.been.called; - mockLoadIdentities.should.not.have.been.called; - mockModal.open.should.have.been.called; - })); - - it('should handle escape being pressed', fakeAsync(() => { - mockModal.open = sinon.stub().returns({ - result: Promise.reject(1) - }); - - let mockLoadIdentities = sinon.stub(component, 'loadIdentities'); - - component.addId(); - - tick(); - - mockAlertService.errorStatus$.next.should.not.have.been.called; - mockLoadIdentities.should.not.have.been.called; - mockModal.open.should.have.been.called; - })); - }); - describe('issueNewId', () => { beforeEach(() => { mockModal.open.reset(); diff --git a/packages/composer-playground/src/app/identity/identity.component.ts b/packages/composer-playground/src/app/identity/identity.component.ts index cd7b0f5c4e..0f675b70c8 100644 --- a/packages/composer-playground/src/app/identity/identity.component.ts +++ b/packages/composer-playground/src/app/identity/identity.component.ts @@ -51,16 +51,6 @@ export class IdentityComponent implements OnInit { }); } - addId() { - this.modalService.open(AddIdentityComponent).result.then((result) => { - return this.loadIdentities(); - }, (reason) => { - if (reason && reason !== 1) { // someone hasn't pressed escape - this.alertService.errorStatus$.next(reason); - } - }); - } - issueNewId() { this.modalService.open(IssueIdentityComponent).result.then((result) => { if (result) { diff --git a/packages/composer-playground/src/app/identity/identity.module.ts b/packages/composer-playground/src/app/identity/identity.module.ts index 83aec6a91b..edabbd5a0e 100644 --- a/packages/composer-playground/src/app/identity/identity.module.ts +++ b/packages/composer-playground/src/app/identity/identity.module.ts @@ -15,9 +15,10 @@ import { FooterModule } from '../footer/footer.module'; @NgModule({ imports: [CommonModule, FormsModule, NgbModule, FileImporterModule, IdentityRoutingModule, FooterModule], - entryComponents: [AddIdentityComponent, IdentityIssuedComponent, IssueIdentityComponent], + entryComponents: [IdentityIssuedComponent, IssueIdentityComponent], declarations: [AddIdentityComponent, IdentityIssuedComponent, IssueIdentityComponent, IdentityComponent], - providers: [] + providers: [], + exports: [AddIdentityComponent] }) export class IdentityModule { diff --git a/packages/composer-playground/src/app/login/login.component.html b/packages/composer-playground/src/app/login/login.component.html index 8c8db5f584..1245dc383d 100644 --- a/packages/composer-playground/src/app/login/login.component.html +++ b/packages/composer-playground/src/app/login/login.component.html @@ -1,11 +1,13 @@
-
-

My Wallet

- +
My Wallet
+
-
+ +
@@ -43,13 +45,24 @@

Identities for {{connectionProfile.name === '$default' ? 'Web Browser' : con My Wallet

-
- -
+
+ +
+
+ +
+
+ +
diff --git a/packages/composer-playground/src/app/login/login.component.scss b/packages/composer-playground/src/app/login/login.component.scss index cc99322663..bab30a58b0 100644 --- a/packages/composer-playground/src/app/login/login.component.scss +++ b/packages/composer-playground/src/app/login/login.component.scss @@ -6,7 +6,17 @@ app-login { background-color: $fourth-highlight; section.header { + display: flex; padding: $space-large $space-large $space-medium $space-large; + align-items: center; + + div.left-align { + flex: 1; + } + + div.right-align { + margin-right: $space-medium; + } } section.main-view { @@ -64,6 +74,24 @@ app-login { } } } + + section.edit-connection-profile { + padding: $space-large ; + height: calc(100vh - 63px); + overflow-y: auto; + + .header { + button { + .rotate { + transform: rotate(-180deg); + } + + span { + margin-left: $space-smedium + } + } + } + } } diff --git a/packages/composer-playground/src/app/login/login.component.spec.ts b/packages/composer-playground/src/app/login/login.component.spec.ts index 8aa1080f8e..e4cf2881f5 100644 --- a/packages/composer-playground/src/app/login/login.component.spec.ts +++ b/packages/composer-playground/src/app/login/login.component.spec.ts @@ -69,8 +69,8 @@ class RouterStub { selector: 'connection-profile', template: '' }) -class MockConnectionProfileComponent { +class MockConnectionProfileComponent { @Input() public connectionProfile; @Output() @@ -97,288 +97,384 @@ class MockFooterComponent { } +@Component({ + selector: 'add-connection-profile', + template: '' +}) +class MockAddConnectionProfileComponent { + @Input() + public connectionProfiles; + @Output() + public profileToUse: EventEmitter = new EventEmitter(); + @Output() + public profileToEdit: EventEmitter = new EventEmitter(); + @Output() + public cancelAdd: EventEmitter = new EventEmitter(); +} + +@Component({ + selector: 'add-identity', + template: '' +}) +class MockAddIdentityComponent { + @Input() + public targetProfileName; + @Output() + public identityAdded: EventEmitter = new EventEmitter(); + @Output() + public cancelAdd: EventEmitter = new EventEmitter(); +} + +@Component({ + selector: 'identity-card', + template: '' +}) +class MockIdentityCardComponent { + @Input() identity: any; +} + describe(`LoginComponent`, () => { - @Component({ - selector: 'identity-card', - template: '' - }) - class MockIdentityCardComponent { - @Input() identity: any; - } - describe(`LoginComponent`, () => { - - let component: LoginComponent; - let fixture: ComponentFixture; - - let mockAdminService; - let mockIdentityService; - let mockClientService; - let mockConnectionProfileService; - let mockInitializationService; - let routerStub; - let mockAlertService; - let mockWalletService; - let mockModal; - let mockDrawer; - - beforeEach(() => { - - mockIdentityService = sinon.createStubInstance(IdentityService); - mockClientService = sinon.createStubInstance(ClientService); - mockConnectionProfileService = sinon.createStubInstance(ConnectionProfileService); - mockAdminService = sinon.createStubInstance(AdminService); - mockInitializationService = sinon.createStubInstance(InitializationService); - mockAlertService = sinon.createStubInstance(AlertService); - mockWalletService = sinon.createStubInstance(WalletService); - mockDrawer = sinon.createStubInstance(DrawerService); - mockModal = sinon.createStubInstance(NgbModal); - - routerStub = new RouterStub(); - - mockAlertService.successStatus$ = {next: sinon.stub()}; - mockAlertService.busyStatus$ = {next: sinon.stub()}; - mockAlertService.errorStatus$ = {next: sinon.stub()}; - - mockWalletService.removeFromWallet = sinon.stub().returns(Promise.resolve(true)); - - TestBed.configureTestingModule({ - declarations: [ - LoginComponent, - MockConnectionProfileComponent, - MockIdentityCardComponent, - MockImportComponent, - MockFooterComponent - ], - providers: [ - {provide: IdentityService, useValue: mockIdentityService}, - {provide: ClientService, useValue: mockClientService}, - {provide: ConnectionProfileService, useValue: mockConnectionProfileService}, - {provide: Router, useValue: routerStub}, - {provide: AdminService, useValue: mockAdminService}, - {provide: InitializationService, useValue: mockInitializationService}, - {provide: AlertService, useValue: mockAlertService}, - {provide: WalletService, useValue: mockWalletService}, - {provide: DrawerService, useValue: mockDrawer}, - {provide: NgbModal, useValue: mockModal} - ] - }); + let component: LoginComponent; + let fixture: ComponentFixture; + + let mockAdminService; + let mockIdentityService; + let mockClientService; + let mockConnectionProfileService; + let mockInitializationService; + let routerStub; + let mockAlertService; + let mockWalletService; + let mockModal; + let mockDrawer; + + beforeEach(() => { + + mockIdentityService = sinon.createStubInstance(IdentityService); + mockClientService = sinon.createStubInstance(ClientService); + mockConnectionProfileService = sinon.createStubInstance(ConnectionProfileService); + mockAdminService = sinon.createStubInstance(AdminService); + mockInitializationService = sinon.createStubInstance(InitializationService); + mockAlertService = sinon.createStubInstance(AlertService); + mockWalletService = sinon.createStubInstance(WalletService); + mockDrawer = sinon.createStubInstance(DrawerService); + mockModal = sinon.createStubInstance(NgbModal); + + routerStub = new RouterStub(); + + mockAlertService.successStatus$ = {next: sinon.stub()}; + mockAlertService.busyStatus$ = {next: sinon.stub()}; + mockAlertService.errorStatus$ = {next: sinon.stub()}; + + mockWalletService.removeFromWallet = sinon.stub().returns(Promise.resolve(true)); + + TestBed.configureTestingModule({ + declarations: [ + LoginComponent, + MockConnectionProfileComponent, + MockIdentityCardComponent, + MockFooterComponent, + MockAddConnectionProfileComponent, + MockImportComponent, + MockAddIdentityComponent + ], + providers: [ + {provide: IdentityService, useValue: mockIdentityService}, + {provide: ClientService, useValue: mockClientService}, + {provide: ConnectionProfileService, useValue: mockConnectionProfileService}, + {provide: Router, useValue: routerStub}, + {provide: AdminService, useValue: mockAdminService}, + {provide: InitializationService, useValue: mockInitializationService}, + {provide: AlertService, useValue: mockAlertService}, + {provide: WalletService, useValue: mockWalletService}, + {provide: DrawerService, useValue: mockDrawer}, + {provide: NgbModal, useValue: mockModal} + ] + }); - fixture = TestBed.createComponent(LoginComponent); + fixture = TestBed.createComponent(LoginComponent); + component = fixture.componentInstance; + }); - component = fixture.componentInstance; + describe('ngOnInit', () => { + it('should create the component', () => { + component.should.be.ok; }); - describe('ngOnInit', () => { - it('should create the component', () => { - component.should.be.ok; - }); + it('should load identities', fakeAsync(() => { + mockInitializationService.initialize.returns(Promise.resolve()); + let loadConnectionProfilesStub = sinon.stub(component, 'loadConnectionProfiles'); + component.ngOnInit(); - it('should load identities', fakeAsync(() => { - mockInitializationService.initialize.returns(Promise.resolve()); - let loadConnectionProfilesStub = sinon.stub(component, 'loadConnectionProfiles'); - component.ngOnInit(); + tick(); - tick(); + mockInitializationService.initialize.should.have.been.called; + loadConnectionProfilesStub.should.have.been.called; + })); + }); - mockInitializationService.initialize.should.have.been.called; - loadConnectionProfilesStub.should.have.been.called; - })); - }); + describe('loadConnectionProfiles', () => { + it('should load the connection profile', fakeAsync(() => { + mockConnectionProfileService.getAllProfiles.returns(Promise.resolve({myProfile: {name: 'myProfile'}})); - describe('loadConnectionProfiles', () => { - it('should load the connection profile', fakeAsync(() => { - mockConnectionProfileService.getAllProfiles.returns(Promise.resolve({myProfile: {name: 'myProfile'}})); + mockIdentityService.getIdentities.returns(Promise.resolve(['bob'])); - mockIdentityService.getIdentities.returns(Promise.resolve(['bob'])); + component.loadConnectionProfiles(); - component.loadConnectionProfiles(); + tick(); - tick(); + mockConnectionProfileService.getAllProfiles.should.have.been.called; - mockConnectionProfileService.getAllProfiles.should.have.been.called; + mockIdentityService.getIdentities.should.have.been.calledWith('myProfile'); + component['connectionProfiles'].should.deep.equal([{ + name: 'myProfile', + profile: {name: 'myProfile'}, + default: false, + description: 'Default connection profile', + identities: [{ + userId: 'bob', + businessNetwork: 'org-acme-biznet' + }] + }]); + })); + }); - mockIdentityService.getIdentities.should.have.been.calledWith('myProfile'); + describe('changeIdentity', () => { + it('should change identity', fakeAsync(() => { + mockAdminService.list.returns(Promise.resolve(['myNetwork'])); + mockClientService.ensureConnected.returns(Promise.resolve()); - component['connectionProfiles'].should.deep.equal([{ - name: 'myProfile', - profile: {name: 'myProfile'}, - default: false, - identities: [{ - userId: 'bob', - businessNetwork: 'org-acme-biznet' - }] - }]); - })); - }); + component.changeIdentity('myProfile', 'bob'); + + tick(); - describe('changeIdentity', () => { - it('should change identity', fakeAsync(() => { - mockAdminService.list.returns(Promise.resolve(['myNetwork'])); - mockClientService.ensureConnected.returns(Promise.resolve()); + mockConnectionProfileService.setCurrentConnectionProfile.should.have.been.calledWith('myProfile'); + mockIdentityService.setCurrentIdentity.should.have.been.calledWith('bob'); + mockAdminService.list.should.have.been.called; + mockClientService.ensureConnected.should.have.been.calledWith('myNetwork', true); - component.changeIdentity('myProfile', 'bob'); + mockIdentityService.setLoggedIn.should.have.been.calledWith(true); + routerStub.navigate.should.have.been.calledWith(['editor']); + })); - tick(); + it('should handle error', fakeAsync(() => { + mockAdminService.list.returns(Promise.reject('some error')); + mockClientService.ensureConnected.returns(Promise.resolve()); - mockConnectionProfileService.setCurrentConnectionProfile.should.have.been.calledWith('myProfile'); - mockIdentityService.setCurrentIdentity.should.have.been.calledWith('bob'); - mockAdminService.list.should.have.been.called; - mockClientService.ensureConnected.should.have.been.calledWith('myNetwork', true); + component.changeIdentity('myProfile', 'bob'); - mockIdentityService.setLoggedIn.should.have.been.calledWith(true); - routerStub.navigate.should.have.been.calledWith(['editor']); - })); + tick(); - it('should handle error', fakeAsync(() => { - mockAdminService.list.returns(Promise.reject('some error')); - mockClientService.ensureConnected.returns(Promise.resolve()); + mockConnectionProfileService.setCurrentConnectionProfile.should.have.been.calledWith('myProfile'); + mockIdentityService.setCurrentIdentity.should.have.been.calledWith('bob'); + mockAdminService.list.should.have.been.called; + mockClientService.ensureConnected.should.not.have.been.called; - component.changeIdentity('myProfile', 'bob'); + mockIdentityService.setLoggedIn.should.not.have.been.called; + routerStub.navigate.should.not.have.been.called; + mockAlertService.errorStatus$.next.should.have.been.calledWith('some error'); + })); + }); - tick(); + describe('editConnectionProfile', () => { + it('should edit the connection profile', () => { + component.should.be.ok; + component.editConnectionProfile('myProfile'); + + component['editingConnectionProfile'].should.equal('myProfile'); + }); + }); - mockConnectionProfileService.setCurrentConnectionProfile.should.have.been.calledWith('myProfile'); - mockIdentityService.setCurrentIdentity.should.have.been.calledWith('bob'); - mockAdminService.list.should.have.been.called; - mockClientService.ensureConnected.should.not.have.been.called; + describe('finishedEditingConnectionProfile', () => { + it('should close editing connection profile screen if not adding ID with connection profile', () => { + let loadConnectionProfilesStub = sinon.stub(component, 'loadConnectionProfiles'); - mockIdentityService.setLoggedIn.should.not.have.been.called; - routerStub.navigate.should.not.have.been.called; + component.finishedEditingConnectionProfile({update : true}); - mockAlertService.errorStatus$.next.should.have.been.calledWith('some error'); - })); + should.not.exist(component['editingConectionProfile']); + loadConnectionProfilesStub.should.have.been.called; }); - describe('editConnectionProfile', () => { - it('should edit the connection profile', () => { - component.should.be.ok; - component.editConnectionProfile('myProfile'); + it('should close editing connection profile screen if cancelling while adding ID with connection profile', () => { + let loadConnectionProfilesStub = sinon.stub(component, 'loadConnectionProfiles'); + let addIdToExistingProfileStub = sinon.stub(component, 'addIdToExistingProfile'); + component['creatingIdWithProfile'] = true; - component['editingConectionProfile'].should.equal('myProfile'); - }); + component.finishedEditingConnectionProfile({update : false}); + + should.not.exist(component['editingConectionProfile']); + loadConnectionProfilesStub.should.have.been.called; + addIdToExistingProfileStub.should.not.have.been.called; }); - describe('finishedEditingConnectionProfile', () => { - it('should close editing connection profile screen', () => { - let loadConnectionProfilesStub = sinon.stub(component, 'loadConnectionProfiles'); - component.finishedEditingConnectionProfile(); + it('should pass connection profile to addIdToExistingProfile if successfull and addding ID with connection profile', () => { + let loadConnectionProfilesStub = sinon.stub(component, 'loadConnectionProfiles'); + let addIdToExistingProfileNameStub = sinon.stub(component, 'addIdToExistingProfileName'); + component['creatingIdWithProfile'] = true; - should.not.exist(component['editingConectionProfile']); - loadConnectionProfilesStub.should.have.been.called; - }); + component.finishedEditingConnectionProfile({update : true, connectionProfile : { name: 'bob' }}); + + should.not.exist(component['editingConectionProfile']); + loadConnectionProfilesStub.should.not.have.been.called; + addIdToExistingProfileNameStub.should.have.been.calledWith('bob'); }); + }); - describe('removeIdentity', () => { - it('should open the delete-confirm modal', fakeAsync(() => { - mockModal.open = sinon.stub().returns({ - componentInstance: {}, - result: Promise.resolve(0) - }); - - component.removeIdentity('profile', 'name'); - tick(); - mockModal.open.should.have.been.called; - })); - - it('should open delete-confirm modal and handle error', fakeAsync(() => { - mockModal.open = sinon.stub().returns({ - componentInstance: {}, - result: Promise.reject('some error') - }); - - component.removeIdentity('profile', 'name'); - tick(); - mockAlertService.busyStatus$.next.should.have.been.called; - mockAlertService.errorStatus$.next.should.have.been.called; - })); - - it('should open delete-confirm modal and handle cancel', fakeAsync(() => { - mockModal.open = sinon.stub().returns({ - componentInstance: {}, - result: Promise.reject(null) - }); - - component.removeIdentity('profile', 'name'); - tick(); - mockAlertService.busyStatus$.next.should.not.have.been.called; - mockAlertService.errorStatus$.next.should.not.have.been.called; - })); - - it('should refresh the connection profiles after successfully calling walletService.removeFromWallet()', fakeAsync(() => { - mockModal.open = sinon.stub().returns({ - componentInstance: {}, - result: Promise.resolve(true) - }); - - component.loadConnectionProfiles = sinon.stub(); - - component.removeIdentity('profile', 'name'); - tick(); - - // check services called - component.loadConnectionProfiles.should.have.been.called; - mockAlertService.busyStatus$.next.should.have.been.called; - mockAlertService.successStatus$.next.should.have.been.called; - - mockAlertService.errorStatus$.next.should.not.have.been.called; - })); - - it('should handle errors when calling walletService.removeFromWallet()', fakeAsync(() => { - mockModal.open = sinon.stub().returns({ - componentInstance: {}, - result: Promise.resolve(true) - }); - - component.loadConnectionProfiles = sinon.stub(); - mockWalletService.removeFromWallet = sinon.stub().returns(Promise.reject('some error')); - - component.removeIdentity('profile', 'name'); - tick(); - - // check services called - mockAlertService.busyStatus$.next.should.have.been.called; - mockAlertService.errorStatus$.next.should.have.been.called; - - mockAlertService.successStatus$.next.should.not.have.been.called; - component.loadConnectionProfiles.should.not.have.been.called; - })); + describe('createIdCard', () => { + it('should open the ID card screen', () => { + component['createIdCard'](); + component['showSubScreen'].should.be.true; + component['creatingIdCard'].should.be.true; }); + }); - describe('closeSubView', () => { - it('should close the subview', () => { - component['showSubScreen'] = true; - component['showDeployNetwork'] = true; - component['editingConnectionProfile'] = {profile: 'myProfile'}; - component.closeSubView(); + describe('addIdToExistingProfileName', () => { + it('should set the target profile name and open the ID edit panel', () => { + component['addIdToExistingProfileName']('bob'); - component['showSubScreen'].should.equal(false); - should.not.exist(component['editingConectionProfile']); - component['showDeployNetwork'].should.equal(false); - }); + component['targetProfileName'].should.be.equal('bob'); + component['creatingIdCard'].should.be.false; + component['editingIdCard'].should.be.true; }); + }); - describe('deployNetwork', () => { - it('should deploy a new business network', () => { - component.deployNetwork({name: 'bob'}); - mockConnectionProfileService.setCurrentConnectionProfile.should.have.been.calledWith('bob'); + describe('addIdToNewProfile', () => { + it('should set the connection profile to edit and set the creatingIdWithProfile boolean', () => { + let myProfile = { wow: 'such profile', avarian: 'penguin' }; - mockIdentityService.setCurrentIdentity.should.have.been.calledWith('admin'); - component['showSubScreen'].should.equal(true); - component['showDeployNetwork'].should.equal(true); - }); + component['addIdToNewProfile'](myProfile); + + component['editingConnectionProfile'].should.be.deep.equal(myProfile); + component['creatingIdCard'].should.be.false; + component['creatingIdWithProfile'].should.be.true; }); + }); - describe('finishedDeploying', () => { - it('should finish deploying', () => { - component['showSubScreen'] = true; + describe('completeCardAddition', () => { + it('should close the subscreen and refresh connection profiles', () => { + let loadConnectionProfilesStub = sinon.stub(component, 'loadConnectionProfiles'); + let closeSubViewStub = sinon.stub(component, 'closeSubView'); - component['showDeployNetwork'] = true; - component.finishedDeploying(); + component['completeCardAddition'](); - component['showSubScreen'].should.equal(false); - component['showDeployNetwork'].should.equal(false); + component['editingIdCard'].should.be.false; + component['showSubScreen'].should.be.false; + should.not.exist(component['editingConectionProfile']); + loadConnectionProfilesStub.should.have.been.called; + closeSubViewStub.should.have.been.called; + }); + }); + + describe('removeIdentity', () => { + it('should open the delete-confirm modal', fakeAsync(() => { + mockModal.open = sinon.stub().returns({ + componentInstance: {}, + result: Promise.resolve(0) }); + + component.removeIdentity('profile', 'name'); + tick(); + mockModal.open.should.have.been.called; + })); + + it('should open delete-confirm modal and handle error', fakeAsync(() => { + mockModal.open = sinon.stub().returns({ + componentInstance: {}, + result: Promise.reject('some error') + }); + + component.removeIdentity('profile', 'name'); + tick(); + mockAlertService.busyStatus$.next.should.have.been.called; + mockAlertService.errorStatus$.next.should.have.been.called; + })); + + it('should open delete-confirm modal and handle cancel', fakeAsync(() => { + mockModal.open = sinon.stub().returns({ + componentInstance: {}, + result: Promise.reject(null) + }); + + component.removeIdentity('profile', 'name'); + tick(); + mockAlertService.busyStatus$.next.should.not.have.been.called; + mockAlertService.errorStatus$.next.should.not.have.been.called; + })); + + it('should refresh the connection profiles after successfully calling walletService.removeFromWallet()', fakeAsync(() => { + mockModal.open = sinon.stub().returns({ + componentInstance: {}, + result: Promise.resolve(true) + }); + + component.loadConnectionProfiles = sinon.stub(); + + component.removeIdentity('profile', 'name'); + tick(); + + // check services called + component.loadConnectionProfiles.should.have.been.called; + mockAlertService.busyStatus$.next.should.have.been.called; + mockAlertService.successStatus$.next.should.have.been.called; + + mockAlertService.errorStatus$.next.should.not.have.been.called; + })); + + it('should handle errors when calling walletService.removeFromWallet()', fakeAsync(() => { + mockModal.open = sinon.stub().returns({ + componentInstance: {}, + result: Promise.resolve(true) + }); + + component.loadConnectionProfiles = sinon.stub(); + mockWalletService.removeFromWallet = sinon.stub().returns(Promise.reject('some error')); + + component.removeIdentity('profile', 'name'); + tick(); + + // check services called + mockAlertService.busyStatus$.next.should.have.been.called; + mockAlertService.errorStatus$.next.should.have.been.called; + + mockAlertService.successStatus$.next.should.not.have.been.called; + component.loadConnectionProfiles.should.not.have.been.called; + })); + }); + + describe('closeSubView', () => { + it('should close the subview', () => { + component['showSubScreen'] = true; + component['showDeployNetwork'] = true; + component['editingConnectionProfile'] = {profile: 'myProfile'}; + component.closeSubView(); + + component['showSubScreen'].should.equal(false); + should.not.exist(component['editingConectionProfile']); + component['showDeployNetwork'].should.equal(false); + }); + }); + + describe('deployNetwork', () => { + it('should deploy a new business network', () => { + component.deployNetwork({name: 'bob'}); + mockConnectionProfileService.setCurrentConnectionProfile.should.have.been.calledWith('bob'); + + mockIdentityService.setCurrentIdentity.should.have.been.calledWith('admin'); + component['showSubScreen'].should.equal(true); + component['showDeployNetwork'].should.equal(true); + }); + }); + + describe('finishedDeploying', () => { + it('should finish deploying', () => { + component['showSubScreen'] = true; + + component['showDeployNetwork'] = true; + component.finishedDeploying(); + + component['showSubScreen'].should.equal(false); + component['showDeployNetwork'].should.equal(false); }); }); }); diff --git a/packages/composer-playground/src/app/login/login.component.ts b/packages/composer-playground/src/app/login/login.component.ts index fdd1fd1835..92933ab745 100644 --- a/packages/composer-playground/src/app/login/login.component.ts +++ b/packages/composer-playground/src/app/login/login.component.ts @@ -22,9 +22,14 @@ import { ImportIdentityComponent } from './import-identity'; export class LoginComponent implements OnInit { private connectionProfiles = []; - private editingConectionProfile = null; - private showSubScreen: boolean = false; private showDeployNetwork: boolean = false; + private editingConnectionProfile = null; + private targetProfileName: string = null; + private addIdCard: boolean = false; + private creatingIdCard: boolean = false; + private editingIdCard: boolean = false; + private creatingIdWithProfile: boolean = false; + private showSubScreen: boolean = false; constructor(private identityService: IdentityService, private router: Router, @@ -67,6 +72,7 @@ export class LoginComponent implements OnInit { name: key, profile: connectionProfile, default: key === '$default', + description: 'Default connection profile', identities: identityList }); }); @@ -95,19 +101,49 @@ export class LoginComponent implements OnInit { editConnectionProfile(connectionProfile): void { this.showSubScreen = true; - this.editingConectionProfile = connectionProfile; + this.editingConnectionProfile = connectionProfile; } - finishedEditingConnectionProfile(): Promise { - this.showSubScreen = false; - delete this.editingConectionProfile; - return this.loadConnectionProfiles(); + finishedEditingConnectionProfile(result): Promise { + if (result.update === false || !this.creatingIdWithProfile) { + this.closeSubView(); + return this.loadConnectionProfiles(); + } else { + delete this.editingConnectionProfile; + this.addIdToExistingProfileName(result.connectionProfile.name); + } } closeSubView(): void { this.showSubScreen = false; - delete this.editingConectionProfile; this.showDeployNetwork = false; + this.creatingIdCard = false; + this.editingIdCard = false; + this.creatingIdWithProfile = false; + delete this.editingConnectionProfile; + delete this.targetProfileName; + } + + createIdCard(): void { + this.showSubScreen = true; + this.creatingIdCard = true; + } + + addIdToExistingProfileName(connectionProfileName): void { + this.targetProfileName = connectionProfileName; + this.creatingIdCard = false; + this.editingIdCard = true; + } + + addIdToNewProfile(connectionProfile): void { + this.editingConnectionProfile = connectionProfile; + this.creatingIdCard = false; + this.creatingIdWithProfile = true; + } + + completeCardAddition() { + this.closeSubView(); + return this.loadConnectionProfiles(); } deployNetwork(connectionProfile) { diff --git a/packages/composer-playground/src/app/login/login.module.ts b/packages/composer-playground/src/app/login/login.module.ts index beee766b8a..df64eeba15 100644 --- a/packages/composer-playground/src/app/login/login.module.ts +++ b/packages/composer-playground/src/app/login/login.module.ts @@ -12,9 +12,10 @@ import { FileImporterModule } from '../common/file-importer/file-importer.module import { ConnectionProfileModule } from '../connection-profile/connection-profile.module'; import { ImportModule } from '../import/import.module'; import { FooterModule } from '../footer/footer.module'; +import { IdentityModule } from '../identity/identity.module'; @NgModule({ - imports: [CommonModule, FormsModule, NgbModule, LoginRoutingModule, ConnectionProfileModule, FooterModule, FileImporterModule, DrawerModule, ImportModule], + imports: [CommonModule, FormsModule, NgbModule, LoginRoutingModule, ConnectionProfileModule, FooterModule, FileImporterModule, DrawerModule, ImportModule, IdentityModule], entryComponents: [IdentityCardComponent], declarations: [LoginComponent, IdentityCardComponent] }) diff --git a/packages/composer-playground/src/assets/styles/base/_variables.scss b/packages/composer-playground/src/assets/styles/base/_variables.scss index ff698a1944..3e74d8a28a 100644 --- a/packages/composer-playground/src/assets/styles/base/_variables.scss +++ b/packages/composer-playground/src/assets/styles/base/_variables.scss @@ -18,9 +18,13 @@ $space-xsmall: 2px; $space-small: 4px; $space-smedium: 8px; $space-medium: 16px; +$space-mlarge: 24px; $space-large: 32px; $space-xlarge: 64px; +// Radius +$radius-medium: 4px; + // Animation @mixin transition($properties...) { transition-property: $properties; diff --git a/packages/composer-playground/src/assets/svg/action-based/role_24.svg b/packages/composer-playground/src/assets/svg/action-based/role_24.svg new file mode 100755 index 0000000000..042905bddb --- /dev/null +++ b/packages/composer-playground/src/assets/svg/action-based/role_24.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + +