From 888fc21218ae55fa2611b1c63964ac341fb57884 Mon Sep 17 00:00:00 2001 From: Meina Zhou Date: Tue, 4 Sep 2018 15:01:50 +0800 Subject: [PATCH 01/20] upgrade to angular 6 Signed-off-by: Meina Zhou --- .gitignore | 5 - CONTRIBUTING.md | 2 +- make/dev/nodeclarity/angular-cli.json | 9 +- src/ui_ng/angular.json | 154 + src/ui_ng/browserslist | 11 + src/ui_ng/karma.conf.js | 17 +- src/ui_ng/lib/README.md | 14 +- src/ui_ng/lib/ng-package.json | 3 +- src/ui_ng/lib/package.json | 40 +- src/ui_ng/lib/src/app.module.ts | 2 +- src/ui_ng/lib/src/channel/channel.service.ts | 4 +- .../confirmation-dialog.component.ts | 4 +- .../create-edit-endpoint.component.ts | 2 +- .../create-edit-label.component.ts | 5 +- .../create-edit-rule.component.html | 4 +- .../create-edit-rule.component.ts | 16 +- .../filter-label.component.ts | 9 +- .../lib/src/endpoint/endpoint.component.ts | 9 +- .../lib/src/error-handler/error-handler.ts | 12 +- src/ui_ng/lib/src/filter/filter.component.ts | 8 +- .../lib/src/gridview/grid-view.component.html | 2 +- .../lib/src/gridview/grid-view.component.ts | 4 +- src/ui_ng/lib/src/harbor-library.module.ts | 12 +- .../chart-detail/chart-detail.component.ts | 5 +- .../src/helm-chart/helm-chart.component.html | 4 +- .../src/helm-chart/helm-chart.component.ts | 14 +- .../helm-chart-version.component.html | 2 +- .../versions/helm-chart-version.component.ts | 20 +- src/ui_ng/lib/src/i18n/i18n-config.ts | 8 +- src/ui_ng/lib/src/i18n/local-json.loader.ts | 11 +- .../inline-alert/inline-alert.component.ts | 3 +- .../job-log-viewer.component.spec.ts | 2 +- .../src/label-piece/label-piece.component.ts | 4 +- .../list-replication-rule.component.ts | 15 +- src/ui_ng/lib/src/log/recent-log.component.ts | 4 +- .../lib/src/operation/operation.component.ts | 6 +- .../lib/src/operation/operation.service.ts | 4 +- .../lib/src/project-policy-config/index.ts | 2 +- .../project-policy-config.component.ts | 6 +- .../src/replication/replication.component.ts | 13 +- .../repository-gridview.component.spec.ts | 17 +- .../repository-gridview.component.ts | 15 +- .../repository/repository.component.spec.ts | 3 +- .../src/repository/repository.component.ts | 2 +- src/ui_ng/lib/src/service.config.ts | 48 +- .../lib/src/service/RequestQueryParams.ts | 6 +- .../lib/src/service/access-log.service.ts | 25 +- .../lib/src/service/configuration.service.ts | 11 +- src/ui_ng/lib/src/service/endpoint.service.ts | 45 +- .../lib/src/service/helm-chart.service.ts | 106 +- src/ui_ng/lib/src/service/interface.ts | 62 +- src/ui_ng/lib/src/service/job-log.service.ts | 19 +- src/ui_ng/lib/src/service/label.service.ts | 2 +- src/ui_ng/lib/src/service/project.service.ts | 51 +- .../lib/src/service/replication.service.ts | 55 +- .../lib/src/service/repository.service.ts | 32 +- src/ui_ng/lib/src/service/scanning.service.ts | 25 +- .../lib/src/service/system-info.service.ts | 6 +- src/ui_ng/lib/src/service/tag.service.ts | 35 +- src/ui_ng/lib/src/shared/shared.const.ts | 10 +- src/ui_ng/lib/src/shared/shared.module.ts | 11 +- src/ui_ng/lib/src/shared/shared.utils.ts | 4 +- src/ui_ng/lib/src/tag/tag.component.spec.ts | 3 +- src/ui_ng/lib/src/tag/tag.component.ts | 37 +- .../ngx-clipboard/clipboard.directive.ts | 4 +- src/ui_ng/lib/src/utils.ts | 74 +- .../result-bar-chart.component.ts | 7 +- .../result-tip.component.ts | 10 +- src/ui_ng/package-lock.json | 6708 ++++++++++------ src/ui_ng/package.json | 91 +- .../password-setting.service.ts | 2 +- .../password-setting/password-setting.ts | 4 +- .../app/account/sign-in/sign-in.service.ts | 4 +- .../app/account/sign-up/sign-up.component.ts | 2 +- src/ui_ng/src/app/app-config.service.ts | 6 +- src/ui_ng/src/app/app-config.ts | 2 +- src/ui_ng/src/app/app.component.spec.ts | 2 +- .../global-search/global-search.component.ts | 13 +- .../global-search/global-search.service.ts | 10 +- .../global-search/search-result.component.ts | 2 +- .../app/base/global-search/search-results.ts | 2 +- .../global-search/search-trigger.service.ts | 2 +- .../harbor-shell/harbor-shell.component.ts | 2 +- .../app/config/auth/config-auth.component.ts | 4 +- src/ui_ng/src/app/config/config.component.ts | 16 +- src/ui_ng/src/app/config/config.service.ts | 4 +- .../config/email/config-email.component.ts | 2 +- src/ui_ng/src/app/core/core.module.ts | 2 +- .../app/global-message/message.component.ts | 2 +- .../src/app/global-message/message.service.ts | 2 +- .../add-group-modal.component.ts | 13 +- src/ui_ng/src/app/group/group.component.ts | 29 +- src/ui_ng/src/app/group/group.service.ts | 63 +- src/ui_ng/src/app/log/audit-log.component.ts | 2 +- src/ui_ng/src/app/log/audit-log.service.ts | 24 +- .../chart-detail/chart-detail.component.ts | 1 + .../create-project.component.ts | 10 +- .../list-charts/list-charts.component.ts | 1 - .../list-project/list-project.component.ts | 11 +- .../member/add-group/add-group.component.ts | 39 +- .../member/add-member/add-member.component.ts | 20 +- .../app/project/member/member.component.ts | 15 +- .../src/app/project/member/member.service.ts | 28 +- .../project-routing-resolver.service.ts | 4 +- src/ui_ng/src/app/project/project.service.ts | 46 +- .../replication/replication-page.component.ts | 2 +- .../total-replication-page.component.ts | 2 +- .../repository/repository-page.component.ts | 2 +- .../tag-repository.component.ts | 2 +- .../repository/top-repo/top-repo.component.ts | 2 +- .../top-repo/top-repository.service.ts | 12 +- .../confirmation-dialog.component.html | 4 +- .../confirmation-dialog.component.ts | 2 +- .../confirmation-dialog.service.ts | 2 +- .../list-project-ro.component.ts | 2 +- .../list-repository-ro.component.ts | 12 +- .../message-handler.service.ts | 2 +- src/ui_ng/src/app/shared/session.service.ts | 16 +- src/ui_ng/src/app/shared/shared.module.ts | 2 +- src/ui_ng/src/app/shared/shared.utils.ts | 38 +- .../src/app/shared/sign-in-credential.ts | 4 +- .../statictics/statistic-handler.service.ts | 2 +- .../statictics/statistics-panel.component.ts | 2 +- .../shared/statictics/statistics.service.ts | 6 +- .../change-password.component.ts | 4 +- src/ui_ng/src/app/user/user.component.ts | 10 +- src/ui_ng/src/app/user/user.service.ts | 6 +- src/ui_ng/src/app/user/user.ts | 4 +- src/ui_ng/src/main-aot.ts | 11 +- src/ui_ng/src/tsconfig.app.json | 25 + src/ui_ng/src/tsconfig.spec.json | 19 + src/ui_ng/tsconfig.json | 30 + src/ui_ng/yarn.lock | 6743 ----------------- 133 files changed, 5530 insertions(+), 9824 deletions(-) create mode 100644 src/ui_ng/angular.json create mode 100644 src/ui_ng/browserslist create mode 100644 src/ui_ng/src/tsconfig.app.json create mode 100644 src/ui_ng/src/tsconfig.spec.json create mode 100644 src/ui_ng/tsconfig.json delete mode 100644 src/ui_ng/yarn.lock diff --git a/.gitignore b/.gitignore index 0242d17a1777..d950a8eba5d7 100644 --- a/.gitignore +++ b/.gitignore @@ -41,14 +41,9 @@ src/ui_ng/typings/ src/ui_ng/src/**/*.js src/ui_ng/src/**/*.js.map -src/ui_ng/src/**/*.json **/npm*.log -src/ui_ng/aot/**/*.js -src/ui_ng/aot/**/*.js.map -src/ui_ng/aot/**/*.json - **/*ngsummary.json **/*ngfactory.ts **/aot diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 67d5235f77c4..cc16894ec41f 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -95,7 +95,7 @@ The folder graph below shows the structure of the source code folder `harbor/src │   └── views ├── ui_ng # The code of harbor web UI │   ├── e2e -│   ├── lib # Source code of harbor-ui npm library which includes the main UI components of web UI +│   ├── lib # Source code of @harbor/ui npm library which includes the main UI components of web UI │   └── src # General web page UI code of Harbor └── vendor # Go code dependencies ├── github.com diff --git a/make/dev/nodeclarity/angular-cli.json b/make/dev/nodeclarity/angular-cli.json index a69da931f531..96a2529e9be7 100644 --- a/make/dev/nodeclarity/angular-cli.json +++ b/make/dev/nodeclarity/angular-cli.json @@ -17,20 +17,21 @@ "prefix": "app", "mobile": false, "styles": [ - "../node_modules/clarity-icons/clarity-icons.min.css", - "../node_modules/clarity-ui/clarity-ui.min.css", "../node_modules/prismjs/themes/prism-solarizedlight.css", + "../node_modules/@clr/icons/clr-icons.min.css", + "../node_modules/@clr/ui/clr-ui.min.css", "styles.css" ], "scripts": [ "../node_modules/core-js/client/shim.min.js", "../node_modules/mutationobserver-shim/dist/mutationobserver.min.js", "../node_modules/@webcomponents/custom-elements/custom-elements.min.js", - "../node_modules/clarity-icons/clarity-icons.min.js", "../node_modules/web-animations-js/web-animations.min.js", "../node_modules/marked/lib/marked.js", "../node_modules/prismjs/prism.js", - "../node_modules/prismjs/components/prism-yaml.min.js" + "../node_modules/prismjs/components/prism-yaml.min.js", + "../node_modules/@clr/icons/clr-icons.min.js", + "../node_modules/web-animations-js/web-animations.min.js" ], "environmentSource": "environments/environment.ts", "environments": { diff --git a/src/ui_ng/angular.json b/src/ui_ng/angular.json new file mode 100644 index 000000000000..fb967db37bcd --- /dev/null +++ b/src/ui_ng/angular.json @@ -0,0 +1,154 @@ +{ + "$schema": "./node_modules/@angular/cli/lib/config/schema.json", + "version": 1, + "newProjectRoot": "projects", + "projects": { + "clarity-seed": { + "root": "", + "sourceRoot": "src", + "projectType": "application", + "architect": { + "build": { + "builder": "@angular-devkit/build-angular:browser", + "options": { + "outputPath": "dist", + "index": "src/index.html", + "main": "src/main.ts", + "tsConfig": "src/tsconfig.app.json", + "assets": [ + "src/images", + "src/favicon.ico", + "src/setting.json" + ], + "styles": [ + "node_modules/@clr/icons/clr-icons.min.css", + "node_modules/@clr/ui/clr-ui.min.css", + "node_modules/prismjs/themes/prism-solarizedlight.css", + "src/styles.css" + ], + "scripts": [ + "node_modules/core-js/client/shim.min.js", + "node_modules/mutationobserver-shim/dist/mutationobserver.min.js", + "node_modules/@webcomponents/custom-elements/custom-elements.min.js", + "node_modules/@clr/icons/clr-icons.min.js", + "node_modules/web-animations-js/web-animations.min.js", + "node_modules/marked/lib/marked.js", + "node_modules/prismjs/prism.js", + "node_modules/prismjs/components/prism-yaml.min.js" + ] + }, + "configurations": { + "production": { + "optimization": true, + "outputHashing": "all", + "sourceMap": false, + "extractCss": true, + "namedChunks": false, + "aot": true, + "extractLicenses": true, + "vendorChunk": false, + "buildOptimizer": true, + "fileReplacements": [ + { + "replace": "src/environments/environment.ts", + "with": "src/environments/environment.prod.ts" + } + ] + } + } + }, + "serve": { + "builder": "@angular-devkit/build-angular:dev-server", + "options": { + "browserTarget": "clarity-seed:build" + }, + "configurations": { + "production": { + "browserTarget": "clarity-seed:build:production" + } + } + }, + "extract-i18n": { + "builder": "@angular-devkit/build-angular:extract-i18n", + "options": { + "browserTarget": "clarity-seed:build" + } + }, + "test": { + "builder": "@angular-devkit/build-angular:karma", + "options": { + "tsConfig": "src/tsconfig.spec.json", + "main": "src/test.ts", + "karmaConfig": "./karma.conf.js", + "scripts": [ + "node_modules/core-js/client/shim.min.js", + "node_modules/mutationobserver-shim/dist/mutationobserver.min.js", + "node_modules/@webcomponents/custom-elements/custom-elements.min.js", + "node_modules/@clr/icons/clr-icons.min.js", + "node_modules/web-animations-js/web-animations.min.js", + "node_modules/marked/lib/marked.js", + "node_modules/prismjs/prism.js", + "node_modules/prismjs/components/prism-yaml.min.js" + ], + "styles": [ + "node_modules/@clr/icons/clr-icons.min.css", + "node_modules/@clr/ui/clr-ui.min.css", + "node_modules/prismjs/themes/prism-solarizedlight.css", + "src/styles.css" + ], + "assets": [ + "src/images", + "src/favicon.ico", + "src/setting.json" + ] + } + }, + "lint": { + "builder": "@angular-devkit/build-angular:tslint", + "options": { + "tsConfig": [ + "src/tsconfig.app.json", + "src/tsconfig.spec.json", + "lib/src/tsconfig.json" + ], + "exclude": [ + "**/node_modules/**" + ], + "fix":true + } + } + } + }, + "clarity-seed-e2e": { + "root": "e2e", + "sourceRoot": "e2e", + "projectType": "application", + "architect": { + "e2e": { + "builder": "@angular-devkit/build-angular:protractor", + "options": { + "protractorConfig": "./protractor.config.js", + "devServerTarget": "clarity-seed:serve" + } + }, + "lint": { + "builder": "@angular-devkit/build-angular:tslint", + "options": { + "tsConfig": [], + "exclude": [] + } + } + } + } + }, + "defaultProject": "clarity-seed", + "schematics": { + "@schematics/angular:component": { + "prefix": "app", + "styleext": "scss" + }, + "@schematics/angular:directive": { + "prefix": "app" + } + } +} \ No newline at end of file diff --git a/src/ui_ng/browserslist b/src/ui_ng/browserslist new file mode 100644 index 000000000000..37371cb04b9f --- /dev/null +++ b/src/ui_ng/browserslist @@ -0,0 +1,11 @@ +# This file is currently used by autoprefixer to adjust CSS to support the below specified browsers +# For additional information regarding the format and rule options, please see: +# https://github.com/browserslist/browserslist#queries +# +# For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed + +> 0.5% +last 2 versions +Firefox ESR +not dead +not IE 9-11 \ No newline at end of file diff --git a/src/ui_ng/karma.conf.js b/src/ui_ng/karma.conf.js index 60f16373c525..ff2fed30fa0b 100644 --- a/src/ui_ng/karma.conf.js +++ b/src/ui_ng/karma.conf.js @@ -3,34 +3,31 @@ module.exports = function (config) { config.set({ - basePath: '', - frameworks: ['jasmine', '@angular/cli'], + basePath: '/', + frameworks: ['jasmine', '@angular-devkit/build-angular'], plugins: [ require('karma-jasmine'), require('karma-chrome-launcher'), require('karma-mocha-reporter'), require('karma-remap-istanbul'), - require('@angular/cli/plugins/karma') + require('@angular-devkit/build-angular/plugins/karma') ], files: [ {pattern: './src/test.ts', watched: false} ], preprocessors: { - './src/test.ts': ['@angular/cli'] + }, mime: { 'text/x-typescript': ['ts', 'tsx'] }, remapIstanbulReporter: { - reports: { + dir: require('path').join(__dirname, 'coverage'), reports: { html: 'coverage', lcovonly: './coverage/coverage.lcov' } }, - angularCli: { - config: './angular-cli.json', - environment: 'dev' - }, + reporters: config.angularCli && config.angularCli.codeCoverage ? ['mocha', 'karma-remap-istanbul'] : ['mocha'], @@ -47,4 +44,4 @@ module.exports = function (config) { }, singleRun: true }); -}; +}; \ No newline at end of file diff --git a/src/ui_ng/lib/README.md b/src/ui_ng/lib/README.md index d35b1ec6a87d..80139a294842 100644 --- a/src/ui_ng/lib/README.md +++ b/src/ui_ng/lib/README.md @@ -11,9 +11,9 @@ Wrap the following Harbor UI components into a sharable library and published as * Vulnerability scanning result bar chart and list view (Embedded in tag management view) * Registry(Harbor) related configuration options -The Harbor UI library is built on **[Angular ](https://angular.io/)** 4.x and **[Clarity ](https://vmware.github.io/clarity/)** 0.9.x . +The Harbor UI library is built on **[Angular ](https://angular.io/)** 6.x and **[Clarity ](https://vmware.github.io/clarity/)** 0.12.x . -The library is published to the public npm repository with name **[harbor-ui](https://www.npmjs.com/package/harbor-ui)**. +The library is published to the public npm repository with name **[@harbor/ui](https://www.npmjs.com/package/@harbor/ui)**. ## Build & Test Build library with command: @@ -28,7 +28,7 @@ npm run test Install the package ``` -npm install harbor-ui[@version] +npm install @harbor/ui[@version] ``` ## Usage @@ -36,16 +36,16 @@ npm install harbor-ui[@version] Execute install command to add dependency to package.json ``` -npm install harbor-ui --save +npm install @harbor/ui //OR -npm install harbor-ui@0.2.x --save +npm install @harbor/ui@1.0.0 ``` The latest version of the library will be installed. **Import the library module into the root Angular module** ``` -import { HarborLibraryModule } from 'harbor-ui'; +import { HarborLibraryModule } from '@harbor/ui'; @NgModule({ declarations: [...], @@ -252,7 +252,7 @@ This component provides some options for registry(Harbor) related configurations All the related configurations are defined in the **HarborModuleConfig** interface. **1. config** -The base configuration for the module. Mainly used to define the relevant endpoints of services which are in charge of retrieving data from backend APIs. It's a 'OpaqueToken' and defined by 'IServiceConfig' interface. If **config** is not set, the default value will be used. +The base configuration for the module. Mainly used to define the relevant endpoints of services which are in charge of retrieving data from backend APIs. It's a 'InjectionToken' and defined by 'IServiceConfig' interface. If **config** is not set, the default value will be used. ``` export const DefaultServiceConfig: IServiceConfig = { systemInfoEndpoint: "/api/systeminfo", diff --git a/src/ui_ng/lib/ng-package.json b/src/ui_ng/lib/ng-package.json index 86cdaec4329a..da8da8c2ed8e 100644 --- a/src/ui_ng/lib/ng-package.json +++ b/src/ui_ng/lib/ng-package.json @@ -5,7 +5,8 @@ "externals": { "@ngx-translate/core": "ngx-translate-core", "@ngx-translate/core/index": "ngx-translate-core", - "ngx-markdown": "ngx-markdown" + "ngx-markdown": "ngx-markdown", + "rxjs-compat":"rxjs-compat" } } } \ No newline at end of file diff --git a/src/ui_ng/lib/package.json b/src/ui_ng/lib/package.json index 11e8f19084fd..0e437705f7e7 100644 --- a/src/ui_ng/lib/package.json +++ b/src/ui_ng/lib/package.json @@ -1,8 +1,8 @@ { - "name": "harbor-ui", - "version": "0.7.19-dev.9", - "description": "Harbor shared UI components based on Clarity and Angular4", - "author": "VMware", + "name": "@harbor/ui", + "version": "1.0.0-rc2", + "description": "Harbor shared UI components based on Clarity and Angular6", + "author": "CNCF", "module": "index.js", "main": "bundles/harborui.umd.min.js", "jsnext:main": "index.js", @@ -10,7 +10,7 @@ "keywords": [ "Harbor", "Clarity", - "Angular4" + "Angular6" ], "license": "Apache 2.0", "repository": { @@ -19,29 +19,31 @@ }, "homepage": "https://github.com/vmware/harbor#readme", "peerDependencies": { - "@angular/animations": "^4.3.0", - "@angular/common": "^4.3.0", - "@angular/compiler": "^4.3.0", - "@angular/core": "^4.3.0", - "@angular/forms": "^4.3.0", - "@angular/http": "^4.3.0", - "@angular/platform-browser": "^4.3.0", - "@angular/platform-browser-dynamic": "^4.3.0", - "@angular/router": "^4.3.0", + "@angular/animations": "^6.0.0", + "@angular/common": "^6.0.0", + "@angular/compiler": "^6.0.0", + "@angular/core": "^6.0.0", + "@angular/forms": "^6.0.0", + "@angular/http": "^6.0.0", + "@angular/platform-browser": "^6.0.0", + "@angular/platform-browser-dynamic": "^6.0.0", + "@angular/router": "^6.0.0", "@ngx-translate/core": "^6.0.0", "@ngx-translate/http-loader": "0.0.3", "@webcomponents/custom-elements": "^1.0.0", - "clarity-angular": "^0.10.17", - "clarity-icons": "^0.10.17", - "clarity-ui": "^0.10.17", + "@clr/angular": "^0.12.0", + "@clr/ui": "^0.12.0", + "@clr/icons": "^0.12.0", "core-js": "^2.4.1", "intl": "^1.2.5", "mutationobserver-shim": "^0.3.2", "ngx-cookie": "^1.0.0", "ngx-markdown": "^1.5.1", - "rxjs": "^5.0.1", + "rxjs": "^6.2.2", "ts-helpers": "^1.1.1", "web-animations-js": "^2.2.1", - "zone.js": "^0.8.4" + "zone.js": "^0.8.4", + "tslib": "^1.9.0" + } } \ No newline at end of file diff --git a/src/ui_ng/lib/src/app.module.ts b/src/ui_ng/lib/src/app.module.ts index f6d9797baa7b..2fb7010e262a 100644 --- a/src/ui_ng/lib/src/app.module.ts +++ b/src/ui_ng/lib/src/app.module.ts @@ -3,7 +3,7 @@ import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { HttpModule } from '@angular/http'; -import { ClarityModule } from 'clarity-angular'; +import { ClarityModule } from '@clr/angular'; import { HarborLibraryModule } from './harbor-library.module'; @NgModule({ diff --git a/src/ui_ng/lib/src/channel/channel.service.ts b/src/ui_ng/lib/src/channel/channel.service.ts index e9035fad88d9..06a2ad99465a 100644 --- a/src/ui_ng/lib/src/channel/channel.service.ts +++ b/src/ui_ng/lib/src/channel/channel.service.ts @@ -12,9 +12,7 @@ // See the License for the specific language governing permissions and // limitations under the License. import { Injectable } from '@angular/core'; -import { Subject } from 'rxjs/Subject'; -// tslint:disable-next-line:no-unused-variable -import { Observable } from "rxjs/Observable"; +import { Subject} from "rxjs"; @Injectable() export class ChannelService { diff --git a/src/ui_ng/lib/src/confirmation-dialog/confirmation-dialog.component.ts b/src/ui_ng/lib/src/confirmation-dialog/confirmation-dialog.component.ts index 69ca9c226ad5..e845fe012c66 100644 --- a/src/ui_ng/lib/src/confirmation-dialog/confirmation-dialog.component.ts +++ b/src/ui_ng/lib/src/confirmation-dialog/confirmation-dialog.component.ts @@ -56,9 +56,9 @@ export class ConfirmationDialogComponent { colorChange(list: BatchInfo) { if (!list.loading && !list.errorState) { return 'green'; - }else if (!list.loading && list.errorState) { + } else if (!list.loading && list.errorState) { return 'red'; - }else { + } else { return '#666'; } } diff --git a/src/ui_ng/lib/src/create-edit-endpoint/create-edit-endpoint.component.ts b/src/ui_ng/lib/src/create-edit-endpoint/create-edit-endpoint.component.ts index cf828c03c5ba..b23d991b6308 100644 --- a/src/ui_ng/lib/src/create-edit-endpoint/create-edit-endpoint.component.ts +++ b/src/ui_ng/lib/src/create-edit-endpoint/create-edit-endpoint.component.ts @@ -21,7 +21,7 @@ import { OnDestroy } from "@angular/core"; import { NgForm } from "@angular/forms"; -import { Subscription } from "rxjs/Subscription"; +import { Subscription } from "rxjs"; import { TranslateService } from "@ngx-translate/core"; import { EndpointService } from "../service/endpoint.service"; diff --git a/src/ui_ng/lib/src/create-edit-label/create-edit-label.component.ts b/src/ui_ng/lib/src/create-edit-label/create-edit-label.component.ts index a6fa8d9d694e..c1fef31d158a 100644 --- a/src/ui_ng/lib/src/create-edit-label/create-edit-label.component.ts +++ b/src/ui_ng/lib/src/create-edit-label/create-edit-label.component.ts @@ -30,7 +30,8 @@ import { toPromise, clone, compareValue } from "../utils"; import { LabelService } from "../service/label.service"; import { ErrorHandler } from "../error-handler/error-handler"; import { NgForm } from "@angular/forms"; -import { Subject } from "rxjs/Subject"; +import { Subject } from "rxjs"; +import { debounceTime } from "rxjs/operators"; import { LabelColor } from "../shared/shared.const"; @Component({ @@ -64,7 +65,7 @@ export class CreateEditLabelComponent implements OnInit, OnDestroy { ) {} ngOnInit(): void { - this.nameChecker.debounceTime(500).subscribe((name: string) => { + this.nameChecker.pipe(debounceTime(500)).subscribe((name: string) => { toPromise( this.labelService.getLabels(this.scope, this.projectId, name) ) diff --git a/src/ui_ng/lib/src/create-edit-rule/create-edit-rule.component.html b/src/ui_ng/lib/src/create-edit-rule/create-edit-rule.component.html index c312f8714c49..7ea13cf34ef9 100644 --- a/src/ui_ng/lib/src/create-edit-rule/create-edit-rule.component.html +++ b/src/ui_ng/lib/src/create-edit-rule/create-edit-rule.component.html @@ -58,7 +58,7 @@ -