diff --git a/src/ui_ng/lib/package.json b/src/ui_ng/lib/package.json index c54f1e16f..8ac07e5ba 100644 --- a/src/ui_ng/lib/package.json +++ b/src/ui_ng/lib/package.json @@ -1,6 +1,6 @@ { "name": "harbor-ui", - "version": "0.6.22", + "version": "0.6.24", "description": "Harbor shared UI components based on Clarity and Angular4", "scripts": { "start": "ng serve --host 0.0.0.0 --port 4500 --proxy-config proxy.config.json", diff --git a/src/ui_ng/lib/pkg/package.json b/src/ui_ng/lib/pkg/package.json index 129332a39..15eeef28a 100644 --- a/src/ui_ng/lib/pkg/package.json +++ b/src/ui_ng/lib/pkg/package.json @@ -1,6 +1,6 @@ { "name": "harbor-ui", - "version": "0.6.22", + "version": "0.6.24", "description": "Harbor shared UI components based on Clarity and Angular4", "author": "VMware", "module": "index.js", diff --git a/src/ui_ng/lib/src/config/config.ts b/src/ui_ng/lib/src/config/config.ts index decc1fd95..f3b80b8d7 100644 --- a/src/ui_ng/lib/src/config/config.ts +++ b/src/ui_ng/lib/src/config/config.ts @@ -65,6 +65,10 @@ export class Configuration { ldap_uid: StringValueItem; ldap_url: StringValueItem; ldap_verify_cert: BoolValueItem; + uaa_client_id: StringValueItem; + uaa_client_secret?: StringValueItem; + uaa_endpoint: StringValueItem; + uaa_verify_cert: BoolValueItem; email_host: StringValueItem; email_identity: StringValueItem; email_from: StringValueItem; @@ -91,6 +95,10 @@ export class Configuration { this.ldap_uid = new StringValueItem("", true); this.ldap_url = new StringValueItem("", true); this.ldap_verify_cert = new BoolValueItem(true, true); + this.uaa_client_id = new StringValueItem("", true); + this.uaa_client_secret = new StringValueItem("", true); + this.uaa_endpoint = new StringValueItem("", true); + this.uaa_verify_cert = new BoolValueItem(false, true); this.email_host = new StringValueItem("", true); this.email_identity = new StringValueItem("", true); this.email_from = new StringValueItem("", true); diff --git a/src/ui_ng/lib/tslint.json b/src/ui_ng/lib/tslint.json index eb187d020..283c238ec 100644 --- a/src/ui_ng/lib/tslint.json +++ b/src/ui_ng/lib/tslint.json @@ -9,18 +9,15 @@ "check-space" ], "curly": true, - "eofline": true, - "forin": true, + "eofline": false, + "forin": false, "indent": [ true, "spaces" ], "label-position": true, "label-undefined": true, - "max-line-length": [ - false, - 140 - ], + "max-line-length": false, "member-access": false, "member-ordering": [ true, @@ -74,7 +71,8 @@ ], "quotemark": [ true, - "single" + "double", + "avoid-escape" ], "radix": true, "semicolon": [ diff --git a/src/ui_ng/package.json b/src/ui_ng/package.json index d4255e7ca..809a8b4b3 100644 --- a/src/ui_ng/package.json +++ b/src/ui_ng/package.json @@ -31,7 +31,7 @@ "clarity-icons": "^0.10.17", "clarity-ui": "^0.10.17", "core-js": "^2.4.1", - "harbor-ui": "0.6.23", + "harbor-ui": "0.6.24", "intl": "^1.2.5", "mutationobserver-shim": "^0.3.2", "ngx-cookie": "^1.0.0", diff --git a/src/ui_ng/src/app/account/account-settings/account-settings-modal.component.html b/src/ui_ng/src/app/account/account-settings/account-settings-modal.component.html index f46d45058..36d754823 100644 --- a/src/ui_ng/src/app/account/account-settings/account-settings-modal.component.html +++ b/src/ui_ng/src/app/account/account-settings/account-settings-modal.component.html @@ -1,6 +1,6 @@

{{'PROFILE.TITLE' | translate}}

- +
diff --git a/src/ui_ng/src/app/account/account-settings/account-settings-modal.component.ts b/src/ui_ng/src/app/account/account-settings/account-settings-modal.component.ts index 1640700ac..acdd89867 100644 --- a/src/ui_ng/src/app/account/account-settings/account-settings-modal.component.ts +++ b/src/ui_ng/src/app/account/account-settings/account-settings-modal.component.ts @@ -240,8 +240,13 @@ export class AccountSettingsModalComponent implements OnInit, AfterViewChecked { }); } - confirm($event: any): void { - if(this.RenameOnGoing) { + confirmNo($event: any): void { + if (this.RenameOnGoing) { + this.RenameOnGoing = false; + } + } + confirmYes($event: any): void { + if (this.RenameOnGoing) { this.confirmRename(); this.RenameOnGoing = false; } diff --git a/src/ui_ng/src/app/config/auth/config-auth.component.html b/src/ui_ng/src/app/config/auth/config-auth.component.html index 8a20c9ec4..867e540f5 100644 --- a/src/ui_ng/src/app/config/auth/config-auth.component.html +++ b/src/ui_ng/src/app/config/auth/config-auth.component.html @@ -165,7 +165,7 @@ - {{'CONFIG.TOOLTIP.SELF_REGISTRATION_ENABLE' | translate}} + {{'CONFIG.TOOLTIP.SELF_REGISTRATION_ENABLE' | translate}} {{'CONFIG.TOOLTIP.SELF_REGISTRATION_DISABLE' | translate}} diff --git a/src/ui_ng/src/app/config/auth/config-auth.component.ts b/src/ui_ng/src/app/config/auth/config-auth.component.ts index 23bb78790..bba1d4ab5 100644 --- a/src/ui_ng/src/app/config/auth/config-auth.component.ts +++ b/src/ui_ng/src/app/config/auth/config-auth.component.ts @@ -19,15 +19,16 @@ import { Configuration } from 'harbor-ui'; @Component({ selector: 'config-auth', - templateUrl: "config-auth.component.html", + templateUrl: 'config-auth.component.html', styleUrls: ['../config.component.css'] }) export class ConfigurationAuthComponent implements OnChanges { changeSub: Subscription; - @Input("allConfig") currentConfig: Configuration = new Configuration(); + @Input('allConfig') currentConfig: Configuration = new Configuration(); - @ViewChild("authConfigFrom") authForm: NgForm; + @ViewChild('authConfigFrom') authForm: NgForm; + constructor() { } ngOnChanges(): void { if ( this.currentConfig && this.currentConfig.auth_mode && @@ -36,14 +37,12 @@ export class ConfigurationAuthComponent implements OnChanges { } } - get checkboxenable(){ + get checkable(){ return this.currentConfig && this.currentConfig.self_registration && this.currentConfig.self_registration.value === true; } - constructor() { } - public get showLdap(): boolean { return this.currentConfig && this.currentConfig.auth_mode && @@ -62,6 +61,10 @@ export class ConfigurationAuthComponent implements OnChanges { } } + public isValid(): boolean { + return this.authForm && this.authForm.valid; + } + setVerifyCertValue($event: any) { this.currentConfig.ldap_verify_cert.value = $event; } @@ -70,16 +73,12 @@ export class ConfigurationAuthComponent implements OnChanges { return !(prop && prop.editable); } - public isValid(): boolean { - return this.authForm && this.authForm.valid; - } - handleOnChange($event: any): void { if ($event && $event.target && $event.target["value"]) { let authMode = $event.target["value"]; if (authMode === 'ldap_auth' || authMode === 'uaa_auth') { if (this.currentConfig.self_registration.value) { - this.currentConfig.self_registration.value = false;//uncheck + this.currentConfig.self_registration.value = false; // uncheck } } } diff --git a/src/ui_ng/src/app/config/config.component.1.html b/src/ui_ng/src/app/config/config.component.1.html deleted file mode 100644 index a4be64f0c..000000000 --- a/src/ui_ng/src/app/config/config.component.1.html +++ /dev/null @@ -1,62 +0,0 @@ -
-

{{'CONFIG.TITLE' | translate }}

- - - {{'CONFIG.AUTH' | translate }} - {{'CONFIG.REPLICATION' | translate }} - {{'CONFIG.EMAIL' | translate }} - {{'CONFIG.SYSTEM' | translate }} - - - - - - -
-
- - - - - {{'CONFIG.TOOLTIP.VERIFY_REMOTE_CERT' | translate }} - - -
-
- - - - - - -
-
-
- - - - - {{'CONFIG.TOOLTIP.TOKEN_EXPIRATION' | translate}} - -
-
-
- - -
- - - - - -
-
\ No newline at end of file diff --git a/src/ui_ng/src/app/config/config.component.ts b/src/ui_ng/src/app/config/config.component.ts index 24ce587c8..325d1d12c 100644 --- a/src/ui_ng/src/app/config/config.component.ts +++ b/src/ui_ng/src/app/config/config.component.ts @@ -1,24 +1,23 @@ // Copyright (c) 2017 VMware, Inc. All Rights Reserved. // -// Licensed under the Apache License, Version 2.0 (the "License"); +// Licensed under the Apache License, Version 2.0 (the 'License'); // you may not use this file except in compliance with the License. // You may obtain a copy of the License at // // http://www.apache.org/licenses/LICENSE-2.0 // // Unless required by applicable law or agreed to in writing, software -// distributed under the License is distributed on an "AS IS" BASIS, +// distributed under the License is distributed on an 'AS IS' BASIS, // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. import { Component, OnInit, OnDestroy, ViewChild } from '@angular/core'; -import { Router } from '@angular/router'; import { ConfigurationService } from './config.service'; -import { ConfirmationTargets, ConfirmationState } from '../shared/shared.const';; +import { ConfirmationTargets, ConfirmationState } from '../shared/shared.const'; import { ConfirmationDialogService } from '../shared/confirmation-dialog/confirmation-dialog.service'; import { Subscription } from 'rxjs/Subscription'; -import { ConfirmationMessage } from '../shared/confirmation-dialog/confirmation-message' +import { ConfirmationMessage } from '../shared/confirmation-dialog/confirmation-message'; import { ConfigurationAuthComponent } from './auth/config-auth.component'; import { ConfigurationEmailComponent } from './email/config-email.component'; @@ -29,24 +28,22 @@ import { MessageHandlerService } from '../shared/message-handler/message-handler import { Configuration, StringValueItem, - ComplexValueItem, SystemSettingsComponent, VulnerabilityConfigComponent, - ClairDBStatus } from 'harbor-ui'; -const fakePass = "aWpLOSYkIzJTTU4wMDkx"; +const fakePass = 'aWpLOSYkIzJTTU4wMDkx'; const TabLinkContentMap = { - "config-auth": "authentication", - "config-replication": "replication", - "config-email": "email", - "config-system": "system_settings", - "config-vulnerability": "vulnerability" + 'config-auth': 'authentication', + 'config-replication': 'replication', + 'config-email': 'email', + 'config-system': 'system_settings', + 'config-vulnerability': 'vulnerability' }; @Component({ selector: 'config', - templateUrl: "config.component.html", + templateUrl: 'config.component.html', styleUrls: ['config.component.css'] }) export class ConfigurationComponent implements OnInit, OnDestroy { @@ -99,36 +96,36 @@ export class ConfigurationComponent implements OnInit, OnDestroy { let properties = []; switch (this.currentTabId) { - case "config-auth": + case 'config-auth': for (let prop in allChanges) { - if (prop.startsWith("ldap_")) { + if (prop.startsWith('ldap_')) { return allChanges; } } - properties = ["auth_mode", "project_creation_restriction", "self_registration"]; + properties = ['auth_mode', 'project_creation_restriction', 'self_registration']; break; - case "config-email": + case 'config-email': for (let prop in allChanges) { - if (prop.startsWith("email_")) { + if (prop.startsWith('email_')) { return allChanges; } } return null; - case "config-replication": - properties = ["verify_remote_cert"]; + case 'config-replication': + properties = ['verify_remote_cert']; break; - case "config-system": - properties = ["token_expiration"]; + case 'config-system': + properties = ['token_expiration']; break; - case "config-vulnerability": - properties = ["scan_all_policy"]; + case 'config-vulnerability': + properties = ['scan_all_policy']; break; default: return null; } for (let prop in allChanges) { - if (properties.indexOf(prop) != -1) { + if (properties.indexOf(prop) !== -1) { return allChanges; } } @@ -137,8 +134,8 @@ export class ConfigurationComponent implements OnInit, OnDestroy { } ngOnInit(): void { - //First load - //Double confirm the current use has admin role + // First load + // Double confirm the current use has admin role let currentUser = this.session.getCurrentUser(); if (currentUser && currentUser.has_admin_role > 0) { this.retrieveConfig(); @@ -150,8 +147,8 @@ export class ConfigurationComponent implements OnInit, OnDestroy { if (confirmation.source === ConfirmationTargets.CONFIG) { this.reset(confirmation.data); } else if (confirmation.source === ConfirmationTargets.CONFIG_TAB) { - this.reset(confirmation.data["changes"]); - this.currentTabId = confirmation.data["tabId"]; + this.reset(confirmation.data['changes']); + this.currentTabId = confirmation.data['tabId']; } } }); @@ -200,7 +197,7 @@ export class ConfigurationComponent implements OnInit, OnDestroy { public get showLdapServerBtn(): boolean { return this.currentTabId === 'config-auth' && this.allConfig.auth_mode && - this.allConfig.auth_mode.value === "ldap_auth"; + this.allConfig.auth_mode.value === 'ldap_auth'; } public get hideMailTestingSpinner(): boolean { @@ -218,7 +215,7 @@ export class ConfigurationComponent implements OnInit, OnDestroy { } public tabLinkClick(tabLink: string) { - //Whether has unsaved changes in current tab + // Whether has unsaved changes in current tab let changes = this.hasUnsavedChangesOfCurrentTab(); if (!changes) { this.currentTabId = tabLink; @@ -229,18 +226,18 @@ export class ConfigurationComponent implements OnInit, OnDestroy { } /** - * + * * Save the changed values - * + * * @memberOf ConfigurationComponent */ public save(): void { let changes = this.getChanges(); if (!this.isEmpty(changes)) { - //Fix policy parameters issue - let scanningAllPolicy = changes["scan_all_policy"]; + // Fix policy parameters issue + let scanningAllPolicy = changes['scan_all_policy']; if (scanningAllPolicy && - scanningAllPolicy.type !== "daily" && + scanningAllPolicy.type !== 'daily' && scanningAllPolicy.parameters) { delete (scanningAllPolicy.parameters); } @@ -249,32 +246,32 @@ export class ConfigurationComponent implements OnInit, OnDestroy { this.configService.saveConfiguration(changes) .then(response => { this.onGoing = false; - //API should return the updated configurations here - //Unfortunately API does not do that - //To refresh the view, we can clone the original data copy - //or force refresh by calling service. - //HERE we choose force way + // API should return the updated configurations here + // Unfortunately API does not do that + // To refresh the view, we can clone the original data copy + // or force refresh by calling service. + // HERE we choose force way this.retrieveConfig(); - //Reload bootstrap option - this.appConfigService.load().catch(error => console.error("Failed to reload bootstrap option with error: ", error)); + // Reload bootstrap option + this.appConfigService.load().catch(error => console.error('Failed to reload bootstrap option with error: ', error)); - this.msgHandler.showSuccess("CONFIG.SAVE_SUCCESS"); + this.msgHandler.showSuccess('CONFIG.SAVE_SUCCESS'); }) .catch(error => { this.onGoing = false; this.msgHandler.handleError(error); }); } else { - //Inprop situation, should not come here - console.error("Save obort becasue nothing changed"); + // Inprop situation, should not come here + console.error('Save obort becasue nothing changed'); } } /** - * + * * Discard current changes if have and reset - * + * * @memberOf ConfigurationComponent */ public cancel(): void { @@ -282,98 +279,98 @@ export class ConfigurationComponent implements OnInit, OnDestroy { if (!this.isEmpty(changes)) { this.confirmUnsavedChanges(changes); } else { - //Invalid situation, should not come here - console.error("Nothing changed"); + // Invalid situation, should not come here + console.error('Nothing changed'); } } /** - * + * * Test the connection of specified mail server - * - * + * + * * @memberOf ConfigurationComponent */ public testMailServer(): void { if (this.testingMailOnGoing) { - return;//Should not come here + return; // Should not come here } let mailSettings = {}; for (let prop in this.allConfig) { - if (prop.startsWith("email_")) { + if (prop.startsWith('email_')) { mailSettings[prop] = this.allConfig[prop].value; } } - //Confirm port is number - mailSettings["email_port"] = +mailSettings["email_port"]; + // Confirm port is number + mailSettings['email_port'] = +mailSettings['email_port']; let allChanges = this.getChanges(); - let password = allChanges["email_password"] + let password = allChanges['email_password']; if (password) { - mailSettings["email_password"] = password; + mailSettings['email_password'] = password; } else { - delete mailSettings["email_password"]; + delete mailSettings['email_password']; } this.testingMailOnGoing = true; this.configService.testMailServer(mailSettings) .then(response => { this.testingMailOnGoing = false; - this.msgHandler.showSuccess("CONFIG.TEST_MAIL_SUCCESS"); + this.msgHandler.showSuccess('CONFIG.TEST_MAIL_SUCCESS'); }) .catch(error => { this.testingMailOnGoing = false; let err = error._body; if (!err) { - err = "UNKNOWN"; + err = 'UNKNOWN'; } - this.msgHandler.showError("CONFIG.TEST_MAIL_FAILED", { 'param': err }); + this.msgHandler.showError('CONFIG.TEST_MAIL_FAILED', { 'param': err }); }); } public testLDAPServer(): void { if (this.testingLDAPOnGoing) { - return;//Should not come here + return; // Should not come here } let ldapSettings = {}; for (let prop in this.allConfig) { - if (prop.startsWith("ldap_")) { + if (prop.startsWith('ldap_')) { ldapSettings[prop] = this.allConfig[prop].value; } } let allChanges = this.getChanges(); - let ldapSearchPwd = allChanges["ldap_search_password"]; + let ldapSearchPwd = allChanges['ldap_search_password']; if (ldapSearchPwd) { ldapSettings['ldap_search_password'] = ldapSearchPwd; } else { delete ldapSettings['ldap_search_password']; } - //Fix: Confirm ldap scope is number + // Fix: Confirm ldap scope is number ldapSettings['ldap_scope'] = +ldapSettings['ldap_scope']; this.testingLDAPOnGoing = true; this.configService.testLDAPServer(ldapSettings) .then(respone => { this.testingLDAPOnGoing = false; - this.msgHandler.showSuccess("CONFIG.TEST_LDAP_SUCCESS"); + this.msgHandler.showSuccess('CONFIG.TEST_LDAP_SUCCESS'); }) .catch(error => { this.testingLDAPOnGoing = false; let err = error._body; if (!err) { - err = "UNKNOWN"; + err = 'UNKNOWN'; } - this.msgHandler.showError("CONFIG.TEST_LDAP_FAILED", { 'param': err }); + this.msgHandler.showError('CONFIG.TEST_LDAP_FAILED', { 'param': err }); }); } confirmUnsavedChanges(changes: any) { let msg = new ConfirmationMessage( - "CONFIG.CONFIRM_TITLE", - "CONFIG.CONFIRM_SUMMARY", - "", + 'CONFIG.CONFIRM_TITLE', + 'CONFIG.CONFIRM_SUMMARY', + '', changes, ConfirmationTargets.CONFIG ); @@ -383,12 +380,12 @@ export class ConfigurationComponent implements OnInit, OnDestroy { confirmUnsavedTabChanges(changes: any, tabId: string) { let msg = new ConfirmationMessage( - "CONFIG.CONFIRM_TITLE", - "CONFIG.CONFIRM_SUMMARY", - "", + 'CONFIG.CONFIRM_TITLE', + 'CONFIG.CONFIRM_SUMMARY', + '', { - "changes": changes, - "tabId": tabId + 'changes': changes, + 'tabId': tabId }, ConfirmationTargets.CONFIG_TAB ); @@ -402,12 +399,12 @@ export class ConfigurationComponent implements OnInit, OnDestroy { .then((configurations: Configuration) => { this.onGoing = false; - //Add two password fields + // Add two password fields configurations.email_password = new StringValueItem(fakePass, true); configurations.ldap_search_password = new StringValueItem(fakePass, true); - configurations.uaa_client_secret = new StringValueItem(fakePass, false); + configurations.uaa_client_secret = new StringValueItem(fakePass, true); this.allConfig = configurations; - //Keep the original copy of the data + // Keep the original copy of the data this.originalCopy = this.clone(configurations); }) .catch(error => { @@ -417,12 +414,12 @@ export class ConfigurationComponent implements OnInit, OnDestroy { } /** - * + * * Get the changed fields and return a map - * + * * @private * @returns {*} - * + * * @memberOf ConfigurationComponent */ getChanges(): { [key: string]: any | any[] } { @@ -435,13 +432,13 @@ export class ConfigurationComponent implements OnInit, OnDestroy { if (field && field.editable) { if (!this.compareValue(field.value, this.allConfig[prop].value)) { changes[prop] = this.allConfig[prop].value; - //Number - if (typeof field.value === "number") { + // Number + if (typeof field.value === 'number') { changes[prop] = +changes[prop]; } - //Trim string value - if (typeof field.value === "string") { + // Trim string value + if (typeof field.value === 'string') { changes[prop] = ('' + changes[prop]).trim(); } } @@ -451,44 +448,44 @@ export class ConfigurationComponent implements OnInit, OnDestroy { return changes; } - //private + // private compareValue(a: any, b: any): boolean { - if ((a && !b) || (!a && b)) return false; - if (!a && !b) return true; + if ((a && !b) || (!a && b)) { return false; }; + if (!a && !b) { return true; }; return JSON.stringify(a) === JSON.stringify(b); } - //private + // private isEmpty(obj: any): boolean { - return !obj || JSON.stringify(obj) === "{}"; + return !obj || JSON.stringify(obj) === '{}'; } /** - * + * * Deep clone the configuration object - * + * * @private * @param {Configuration} src * @returns {Configuration} - * + * * @memberOf ConfigurationComponent */ clone(src: Configuration): Configuration { if (!src) { - return new Configuration();//Empty + return new Configuration(); // Empty } return JSON.parse(JSON.stringify(src)); } /** - * + * * Reset the configuration form - * + * * @private * @param {*} changes - * + * * @memberOf ConfigurationComponent */ reset(changes: any): void { @@ -496,11 +493,10 @@ export class ConfigurationComponent implements OnInit, OnDestroy { for (let prop in changes) { if (this.originalCopy[prop]) { this.allConfig[prop] = this.clone(this.originalCopy[prop]); - //this.allConfig[prop] = Object.assign({}, this.originalCopy[prop]); } } } else { - //force reset + // force reset this.retrieveConfig(); } } @@ -508,4 +504,4 @@ export class ConfigurationComponent implements OnInit, OnDestroy { disabled(prop: any): boolean { return !(prop && prop.editable); } -} \ No newline at end of file +} diff --git a/src/ui_ng/src/app/shared/inline-alert/inline-alert.component.ts b/src/ui_ng/src/app/shared/inline-alert/inline-alert.component.ts index ee2b595a1..7c0f43b34 100644 --- a/src/ui_ng/src/app/shared/inline-alert/inline-alert.component.ts +++ b/src/ui_ng/src/app/shared/inline-alert/inline-alert.component.ts @@ -35,6 +35,7 @@ export class InlineAlertComponent { blinking: boolean = false; @Output() confirmEvt = new EventEmitter(); + @Output() closeEvt = new EventEmitter(); constructor(private translate: TranslateService) { } @@ -82,9 +83,10 @@ export class InlineAlertComponent { this.useAppLevelStyle = false; } - //Close alert + // Close alert public close(): void { this.alertClose = true; + this.closeEvt.emit(true); } public blink() { diff --git a/src/ui_ng/tslint.json b/src/ui_ng/tslint.json index 473840f1e..90fd0a727 100644 --- a/src/ui_ng/tslint.json +++ b/src/ui_ng/tslint.json @@ -9,18 +9,15 @@ "check-space" ], "curly": true, - "eofline": true, - "forin": true, + "eofline": false, + "forin": false, "indent": [ true, "spaces" ], "label-position": true, "label-undefined": true, - "max-line-length": [ - false, - 140 - ], + "max-line-length": false, "member-access": false, "member-ordering": [ true, @@ -74,7 +71,8 @@ ], "quotemark": [ true, - "single" + "double", + "avoid-escape" ], "radix": true, "semicolon": [