From d05ad8cc1056c3e1ff92dedb6adb461ea018aa4c Mon Sep 17 00:00:00 2001 From: mehmet-erim Date: Mon, 19 Aug 2019 09:48:19 +0300 Subject: [PATCH 1/8] feature(core): add form-submit.directive move form-keyup-listener.directive logics to form-submit update @ngx-validate/core package version --- .../packages/core/src/lib/core.module.ts | 6 +- .../form-keyup-listener.directive.ts | 23 ------ .../lib/directives/form-submit.directive.ts | 78 +++++++++++++++++++ .../packages/core/src/lib/directives/index.ts | 2 +- .../packages/theme-shared/package.json | 2 +- 5 files changed, 83 insertions(+), 28 deletions(-) delete mode 100644 npm/ng-packs/packages/core/src/lib/directives/form-keyup-listener.directive.ts create mode 100644 npm/ng-packs/packages/core/src/lib/directives/form-submit.directive.ts diff --git a/npm/ng-packs/packages/core/src/lib/core.module.ts b/npm/ng-packs/packages/core/src/lib/core.module.ts index b9979bde06..d967ae74c9 100644 --- a/npm/ng-packs/packages/core/src/lib/core.module.ts +++ b/npm/ng-packs/packages/core/src/lib/core.module.ts @@ -22,7 +22,7 @@ import { EllipsisDirective } from './directives/ellipsis.directive'; import { AutofocusDirective } from './directives/autofocus.directive'; import { InputEventDebounceDirective } from './directives/debounce.directive'; import { ClickEventStopPropagationDirective } from './directives/stop-propagation.directive'; -import { FormKeyupListenerDirective } from './directives/form-keyup-listener.directive'; +import { FormSubmitDirective } from './directives/form-submit.directive'; @NgModule({ imports: [ @@ -40,7 +40,7 @@ import { FormKeyupListenerDirective } from './directives/form-keyup-listener.dir DynamicLayoutComponent, AutofocusDirective, EllipsisDirective, - FormKeyupListenerDirective, + FormSubmitDirective, LocalizationPipe, PermissionDirective, VisibilityDirective, @@ -57,7 +57,7 @@ import { FormKeyupListenerDirective } from './directives/form-keyup-listener.dir DynamicLayoutComponent, AutofocusDirective, EllipsisDirective, - FormKeyupListenerDirective, + FormSubmitDirective, LocalizationPipe, PermissionDirective, VisibilityDirective, diff --git a/npm/ng-packs/packages/core/src/lib/directives/form-keyup-listener.directive.ts b/npm/ng-packs/packages/core/src/lib/directives/form-keyup-listener.directive.ts deleted file mode 100644 index 2c9b5d3410..0000000000 --- a/npm/ng-packs/packages/core/src/lib/directives/form-keyup-listener.directive.ts +++ /dev/null @@ -1,23 +0,0 @@ -import { Directive, ElementRef, EventEmitter, Output, OnDestroy } from '@angular/core'; -import { fromEvent } from 'rxjs'; -import { debounceTime, filter, tap } from 'rxjs/operators'; -import { takeUntilDestroy } from '../utils/rxjs-utils'; - -@Directive({ - selector: 'form[ngSubmit]', -}) -export class FormKeyupListenerDirective implements OnDestroy { - @Output() ngSubmit = new EventEmitter(); - - constructor(private elRef: ElementRef) { - fromEvent(elRef.nativeElement as HTMLElement, 'keyup') - .pipe( - debounceTime(200), - filter((key: KeyboardEvent) => key && key.key === 'Enter'), - takeUntilDestroy(this), - ) - .subscribe(() => this.ngSubmit.emit()); - } - - ngOnDestroy(): void {} -} diff --git a/npm/ng-packs/packages/core/src/lib/directives/form-submit.directive.ts b/npm/ng-packs/packages/core/src/lib/directives/form-submit.directive.ts new file mode 100644 index 0000000000..1672e6099a --- /dev/null +++ b/npm/ng-packs/packages/core/src/lib/directives/form-submit.directive.ts @@ -0,0 +1,78 @@ +import { + Directive, + ElementRef, + OnDestroy, + OnInit, + Self, + ChangeDetectorRef, + HostBinding, + Input, + Output, + EventEmitter, +} from '@angular/core'; +import { FormGroupDirective, FormGroup, FormControl, ɵNgNoValidate } from '@angular/forms'; +import { fromEvent } from 'rxjs'; +import { takeUntilDestroy } from '../utils'; +import { debounceTime, filter } from 'rxjs/operators'; + +type Controls = { [key: string]: FormControl } | FormGroup[]; + +@Directive({ + selector: 'form[ngSubmit][formGroup]', +}) +export class FormSubmitDirective implements OnInit, OnDestroy { + @Input() + noValidateOnSubmit; + + @Input() + allowSubmit: boolean = true; + + constructor( + @Self() private formGroupDirective: FormGroupDirective, + private host: ElementRef, + private cdRef: ChangeDetectorRef, + ) {} + + ngOnInit() { + fromEvent(this.host.nativeElement as HTMLElement, 'keyup') + .pipe( + debounceTime(200), + filter((key: KeyboardEvent) => key && key.key === 'Enter' && this.allowSubmit), + takeUntilDestroy(this), + ) + .subscribe(() => { + this.host.nativeElement.dispatchEvent(new Event('submit', { bubbles: true, cancelable: true })); + }); + + if (this.noValidateOnSubmit || typeof this.noValidateOnSubmit === 'string') { + return; + } + + fromEvent(this.host.nativeElement, 'submit') + .pipe(takeUntilDestroy(this)) + .subscribe(() => { + const { form } = this.formGroupDirective; + + setDirty(form.controls as { [key: string]: FormControl }); + form.markAsDirty(); + + this.cdRef.detectChanges(); + }); + } + + ngOnDestroy(): void {} +} + +function setDirty(controls: Controls) { + if (Array.isArray(controls)) { + controls.forEach(group => { + setDirty(group.controls as { [key: string]: FormControl }); + }); + return; + } + + Object.keys(controls).forEach(key => { + controls[key].markAsDirty(); + controls[key].updateValueAndValidity(); + }); +} diff --git a/npm/ng-packs/packages/core/src/lib/directives/index.ts b/npm/ng-packs/packages/core/src/lib/directives/index.ts index d3da66bed4..336b6ff5ab 100644 --- a/npm/ng-packs/packages/core/src/lib/directives/index.ts +++ b/npm/ng-packs/packages/core/src/lib/directives/index.ts @@ -1,5 +1,5 @@ export * from './autofocus.directive'; export * from './ellipsis.directive'; -export * from './form-keyup-listener.directive'; +export * from './form-submit.directive'; export * from './permission.directive'; export * from './visibility.directive'; diff --git a/npm/ng-packs/packages/theme-shared/package.json b/npm/ng-packs/packages/theme-shared/package.json index a71bc08def..6ed4fbe8eb 100644 --- a/npm/ng-packs/packages/theme-shared/package.json +++ b/npm/ng-packs/packages/theme-shared/package.json @@ -5,7 +5,7 @@ "@abp/ng.core": "^0.8.3", "@angular/cdk": "^8.0.1", "@ng-bootstrap/ng-bootstrap": "^5.1.0", - "@ngx-validate/core": "^0.0.4", + "@ngx-validate/core": "^0.0.5", "bootstrap": "^4.3.1", "font-awesome": "^4.7.0", "ngx-perfect-scrollbar": "^8.0.0", From e8b8117296b6f3e63614bed3ce54f01e19f3a9ca Mon Sep 17 00:00:00 2001 From: mehmet-erim Date: Mon, 19 Aug 2019 11:06:49 +0300 Subject: [PATCH 2/8] refactor: form-submit directive --- .../src/lib/directives/form-submit.directive.ts | 16 ++++++---------- .../src/lib/tenant-management.module.ts | 2 ++ 2 files changed, 8 insertions(+), 10 deletions(-) diff --git a/npm/ng-packs/packages/core/src/lib/directives/form-submit.directive.ts b/npm/ng-packs/packages/core/src/lib/directives/form-submit.directive.ts index 1672e6099a..a3ea93a753 100644 --- a/npm/ng-packs/packages/core/src/lib/directives/form-submit.directive.ts +++ b/npm/ng-packs/packages/core/src/lib/directives/form-submit.directive.ts @@ -22,10 +22,7 @@ type Controls = { [key: string]: FormControl } | FormGroup[]; }) export class FormSubmitDirective implements OnInit, OnDestroy { @Input() - noValidateOnSubmit; - - @Input() - allowSubmit: boolean = true; + notValidateOnSubmit: string | boolean; constructor( @Self() private formGroupDirective: FormGroupDirective, @@ -37,19 +34,18 @@ export class FormSubmitDirective implements OnInit, OnDestroy { fromEvent(this.host.nativeElement as HTMLElement, 'keyup') .pipe( debounceTime(200), - filter((key: KeyboardEvent) => key && key.key === 'Enter' && this.allowSubmit), + filter((key: KeyboardEvent) => key && key.key === 'Enter'), takeUntilDestroy(this), ) .subscribe(() => { this.host.nativeElement.dispatchEvent(new Event('submit', { bubbles: true, cancelable: true })); }); - if (this.noValidateOnSubmit || typeof this.noValidateOnSubmit === 'string') { - return; - } - fromEvent(this.host.nativeElement, 'submit') - .pipe(takeUntilDestroy(this)) + .pipe( + takeUntilDestroy(this), + filter(() => !this.notValidateOnSubmit && typeof this.notValidateOnSubmit !== 'string'), + ) .subscribe(() => { const { form } = this.formGroupDirective; diff --git a/npm/ng-packs/packages/tenant-management/src/lib/tenant-management.module.ts b/npm/ng-packs/packages/tenant-management/src/lib/tenant-management.module.ts index 2850111dcc..fd1e0e72e9 100644 --- a/npm/ng-packs/packages/tenant-management/src/lib/tenant-management.module.ts +++ b/npm/ng-packs/packages/tenant-management/src/lib/tenant-management.module.ts @@ -7,12 +7,14 @@ import { TableModule } from 'primeng/table'; import { TenantsComponent } from './components/tenants/tenants.component'; import { TenantManagementState } from './states/tenant-management.state'; import { TenantManagementRoutingModule } from './tenant-management-routing.module'; +import { NgxValidateCoreModule } from '@ngx-validate/core'; @NgModule({ declarations: [TenantsComponent], imports: [ TenantManagementRoutingModule, NgxsModule.forFeature([TenantManagementState]), + NgxValidateCoreModule, CoreModule, TableModule, ThemeSharedModule, From 52a356f4e27d5550cfe16e21944d60986ef4183d Mon Sep 17 00:00:00 2001 From: TheDiaval Date: Mon, 19 Aug 2019 12:57:27 +0300 Subject: [PATCH 3/8] feature(feature-management): create feature management module --- .../packages/feature-management/README.md | 1 + .../packages/feature-management/karma.conf.js | 32 ++++++ .../feature-management/ng-package.json | 8 ++ .../packages/feature-management/package.json | 4 + .../lib/actions/feature-management.actions.ts | 11 ++ .../src/lib/actions/index.ts | 1 + .../feature-management.component.html | 32 ++++++ .../feature-management.component.ts | 106 ++++++++++++++++++ .../src/lib/components/index.ts | 1 + .../src/lib/feature-management.module.ts | 13 +++ .../src/lib/models/feature-management.ts | 29 +++++ .../src/lib/models/index.ts | 1 + .../services/feature-management.service.ts | 35 ++++++ .../src/lib/services/index.ts | 1 + .../lib/states/feature-management.state.ts | 34 ++++++ .../src/lib/states/index.ts | 1 + .../feature-management/src/public-api.ts | 2 + .../packages/feature-management/src/test.ts | 21 ++++ .../feature-management/tsconfig.lib.json | 26 +++++ .../feature-management/tsconfig.spec.json | 17 +++ .../packages/feature-management/tslint.json | 17 +++ 21 files changed, 393 insertions(+) create mode 100644 npm/ng-packs/packages/feature-management/README.md create mode 100644 npm/ng-packs/packages/feature-management/karma.conf.js create mode 100644 npm/ng-packs/packages/feature-management/ng-package.json create mode 100644 npm/ng-packs/packages/feature-management/package.json create mode 100644 npm/ng-packs/packages/feature-management/src/lib/actions/feature-management.actions.ts create mode 100644 npm/ng-packs/packages/feature-management/src/lib/actions/index.ts create mode 100644 npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.html create mode 100644 npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.ts create mode 100644 npm/ng-packs/packages/feature-management/src/lib/components/index.ts create mode 100644 npm/ng-packs/packages/feature-management/src/lib/feature-management.module.ts create mode 100644 npm/ng-packs/packages/feature-management/src/lib/models/feature-management.ts create mode 100644 npm/ng-packs/packages/feature-management/src/lib/models/index.ts create mode 100644 npm/ng-packs/packages/feature-management/src/lib/services/feature-management.service.ts create mode 100644 npm/ng-packs/packages/feature-management/src/lib/services/index.ts create mode 100644 npm/ng-packs/packages/feature-management/src/lib/states/feature-management.state.ts create mode 100644 npm/ng-packs/packages/feature-management/src/lib/states/index.ts create mode 100644 npm/ng-packs/packages/feature-management/src/public-api.ts create mode 100644 npm/ng-packs/packages/feature-management/src/test.ts create mode 100644 npm/ng-packs/packages/feature-management/tsconfig.lib.json create mode 100644 npm/ng-packs/packages/feature-management/tsconfig.spec.json create mode 100644 npm/ng-packs/packages/feature-management/tslint.json diff --git a/npm/ng-packs/packages/feature-management/README.md b/npm/ng-packs/packages/feature-management/README.md new file mode 100644 index 0000000000..d040ec455a --- /dev/null +++ b/npm/ng-packs/packages/feature-management/README.md @@ -0,0 +1 @@ +

 @abp/ng.feature-management

diff --git a/npm/ng-packs/packages/feature-management/karma.conf.js b/npm/ng-packs/packages/feature-management/karma.conf.js new file mode 100644 index 0000000000..65f905a52e --- /dev/null +++ b/npm/ng-packs/packages/feature-management/karma.conf.js @@ -0,0 +1,32 @@ +// Karma configuration file, see link for more information +// https://karma-runner.github.io/1.0/config/configuration-file.html + +module.exports = function (config) { + config.set({ + basePath: '', + frameworks: ['jasmine', '@angular-devkit/build-angular'], + plugins: [ + require('karma-jasmine'), + require('karma-chrome-launcher'), + require('karma-jasmine-html-reporter'), + require('karma-coverage-istanbul-reporter'), + require('@angular-devkit/build-angular/plugins/karma') + ], + client: { + clearContext: false // leave Jasmine Spec Runner output visible in browser + }, + coverageIstanbulReporter: { + dir: require('path').join(__dirname, '../../coverage/feature-management'), + reports: ['html', 'lcovonly', 'text-summary'], + fixWebpackSourcePaths: true + }, + reporters: ['progress', 'kjhtml'], + port: 9876, + colors: true, + logLevel: config.LOG_INFO, + autoWatch: true, + browsers: ['Chrome'], + singleRun: false, + restartOnFileChange: true + }); +}; diff --git a/npm/ng-packs/packages/feature-management/ng-package.json b/npm/ng-packs/packages/feature-management/ng-package.json new file mode 100644 index 0000000000..0293d70b2e --- /dev/null +++ b/npm/ng-packs/packages/feature-management/ng-package.json @@ -0,0 +1,8 @@ +{ + "$schema": "../../node_modules/ng-packagr/ng-package.schema.json", + "dest": "../../dist/feature-management", + "lib": { + "entryFile": "src/public-api.ts" + }, + "deleteDestPath": false +} diff --git a/npm/ng-packs/packages/feature-management/package.json b/npm/ng-packs/packages/feature-management/package.json new file mode 100644 index 0000000000..f41fd28fa1 --- /dev/null +++ b/npm/ng-packs/packages/feature-management/package.json @@ -0,0 +1,4 @@ +{ + "name": "@abp/ng.feature-management", + "version": "0.0.1" +} diff --git a/npm/ng-packs/packages/feature-management/src/lib/actions/feature-management.actions.ts b/npm/ng-packs/packages/feature-management/src/lib/actions/feature-management.actions.ts new file mode 100644 index 0000000000..dee5da664a --- /dev/null +++ b/npm/ng-packs/packages/feature-management/src/lib/actions/feature-management.actions.ts @@ -0,0 +1,11 @@ +import { FeatureManagement } from '../models'; + +export class GetFeatures { + static readonly type = '[FeatureManagement] Get Features'; + constructor(public payload: FeatureManagement.Provider) {} +} + +export class UpdateFeatures { + static readonly type = '[FeatureManagement] Update Features'; + constructor(public payload: FeatureManagement.Provider & FeatureManagement.Features) {} +} diff --git a/npm/ng-packs/packages/feature-management/src/lib/actions/index.ts b/npm/ng-packs/packages/feature-management/src/lib/actions/index.ts new file mode 100644 index 0000000000..66678fb322 --- /dev/null +++ b/npm/ng-packs/packages/feature-management/src/lib/actions/index.ts @@ -0,0 +1 @@ +export * from './feature-management.actions'; diff --git a/npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.html b/npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.html new file mode 100644 index 0000000000..27cb5728f5 --- /dev/null +++ b/npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.html @@ -0,0 +1,32 @@ + + +

{{ 'AbpTenantManagement::Permission:ManageFeatures' | abpLocalization }}

+
+ + +
+
+
{{ feature.name }}
+
+ +
+
+ +
+
+
+
+ + + + + +
diff --git a/npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.ts b/npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.ts new file mode 100644 index 0000000000..b2ab6e71cf --- /dev/null +++ b/npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.ts @@ -0,0 +1,106 @@ +import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges } from '@angular/core'; +import { Select, Store } from '@ngxs/store'; +import { Observable } from 'rxjs'; +import { GetFeatures, UpdateFeatures } from '../../actions'; +import { FeatureManagement } from '../../models/feature-management'; +import { FeatureManagementState } from '../../states'; +import { FormGroup, FormControl } from '@angular/forms'; +import { pluck, tap } from 'rxjs/operators'; + +@Component({ + selector: 'abp-feature-management', + templateUrl: './feature-management.component.html', +}) +export class FeatureManagementComponent implements OnChanges { + @Input() + providerKey: string; + + @Input() + providerName: string; + + protected _visible; + + @Input() + get visible(): boolean { + return this._visible; + } + + set visible(value: boolean) { + this._visible = value; + this.visibleChange.emit(value); + } + + @Output() + visibleChange = new EventEmitter(); + + @Select(FeatureManagementState.getFeatures) + features$: Observable; + + modalBusy: boolean = false; + + form: FormGroup; + + constructor(private store: Store) {} + + ngOnChanges({ visible }: SimpleChanges): void { + if (!visible) return; + + if (visible.currentValue) { + this.openModal(); + } else if (this.visible && visible.currentValue === false) { + this.visible = false; + } + } + + openModal() { + if (!this.providerKey || !this.providerName) { + throw new Error('Provider Key and Provider Name are required.'); + } + + this.getFeatures(); + } + + getFeatures() { + this.store + .dispatch(new GetFeatures({ providerKey: this.providerKey, providerName: this.providerName })) + .pipe(pluck('FeatureManagementState', 'features')) + .subscribe(features => { + this.buildForm(features); + this.visible = true; + }); + } + + buildForm(features) { + const formGroupObj = {}; + + for (let i = 0; i < features.length; i++) { + formGroupObj[i] = new FormControl(features[i].value === 'false' ? null : features[i].value); + } + + this.form = new FormGroup(formGroupObj); + } + + save() { + this.modalBusy = true; + + let features = this.store.selectSnapshot(FeatureManagementState.getFeatures); + + features = features.map((feature, i) => ({ + name: feature.name, + value: !this.form.value[i] || this.form.value[i] === 'false' ? null : this.form.value[i], + })); + + this.store + .dispatch( + new UpdateFeatures({ + providerKey: this.providerKey, + providerName: this.providerName, + features, + }), + ) + .subscribe(() => { + this.modalBusy = false; + this.visible = false; + }); + } +} diff --git a/npm/ng-packs/packages/feature-management/src/lib/components/index.ts b/npm/ng-packs/packages/feature-management/src/lib/components/index.ts new file mode 100644 index 0000000000..64f8bd0fc5 --- /dev/null +++ b/npm/ng-packs/packages/feature-management/src/lib/components/index.ts @@ -0,0 +1 @@ +export * from './feature-management/feature-management.component'; diff --git a/npm/ng-packs/packages/feature-management/src/lib/feature-management.module.ts b/npm/ng-packs/packages/feature-management/src/lib/feature-management.module.ts new file mode 100644 index 0000000000..ee3eca6d42 --- /dev/null +++ b/npm/ng-packs/packages/feature-management/src/lib/feature-management.module.ts @@ -0,0 +1,13 @@ +import { CoreModule } from '@abp/ng.core'; +import { ThemeSharedModule } from '@abp/ng.theme.shared'; +import { NgModule } from '@angular/core'; +import { FeatureManagementComponent } from './components/feature-management/feature-management.component'; +import { NgxsModule } from '@ngxs/store'; +import { FeatureManagementState } from './states/feature-management.state'; + +@NgModule({ + declarations: [FeatureManagementComponent], + imports: [CoreModule, ThemeSharedModule, NgxsModule.forFeature([FeatureManagementState])], + exports: [FeatureManagementComponent], +}) +export class FeatureManagementModule {} diff --git a/npm/ng-packs/packages/feature-management/src/lib/models/feature-management.ts b/npm/ng-packs/packages/feature-management/src/lib/models/feature-management.ts new file mode 100644 index 0000000000..05a0a28c99 --- /dev/null +++ b/npm/ng-packs/packages/feature-management/src/lib/models/feature-management.ts @@ -0,0 +1,29 @@ +export namespace FeatureManagement { + export interface State { + features: Feature[]; + } + + export interface ValueType { + name: string; + properties: object; + validator: object; + } + + export interface Feature { + name: string; + value: string; + description?: string; + valueType?: ValueType; + depth?: number; + parentName?: string; + } + + export interface Features { + features: Feature[]; + } + + export interface Provider { + providerName: string; + providerKey: string; + } +} diff --git a/npm/ng-packs/packages/feature-management/src/lib/models/index.ts b/npm/ng-packs/packages/feature-management/src/lib/models/index.ts new file mode 100644 index 0000000000..d6ed522ae0 --- /dev/null +++ b/npm/ng-packs/packages/feature-management/src/lib/models/index.ts @@ -0,0 +1 @@ +export * from './feature-management'; diff --git a/npm/ng-packs/packages/feature-management/src/lib/services/feature-management.service.ts b/npm/ng-packs/packages/feature-management/src/lib/services/feature-management.service.ts new file mode 100644 index 0000000000..5f6c0eed6e --- /dev/null +++ b/npm/ng-packs/packages/feature-management/src/lib/services/feature-management.service.ts @@ -0,0 +1,35 @@ +import { Injectable } from '@angular/core'; +import { RestService, Rest } from '@abp/ng.core'; +import { Store } from '@ngxs/store'; +import { Observable } from 'rxjs'; +import { FeatureManagement } from '../models'; + +@Injectable({ + providedIn: 'root', +}) +export class FeatureManagementService { + constructor(private rest: RestService, private store: Store) {} + + getFeatures(params: FeatureManagement.Provider): Observable { + const request: Rest.Request = { + method: 'GET', + url: '/api/abp/features', + params, + }; + return this.rest.request(request); + } + + updateFeatures({ + features, + providerKey, + providerName, + }: FeatureManagement.Provider & FeatureManagement.Features): Observable { + const request: Rest.Request = { + method: 'PUT', + url: '/api/abp/features', + body: { features }, + params: { providerKey, providerName }, + }; + return this.rest.request(request); + } +} diff --git a/npm/ng-packs/packages/feature-management/src/lib/services/index.ts b/npm/ng-packs/packages/feature-management/src/lib/services/index.ts new file mode 100644 index 0000000000..10fceceafe --- /dev/null +++ b/npm/ng-packs/packages/feature-management/src/lib/services/index.ts @@ -0,0 +1 @@ +export * from './feature-management.service'; diff --git a/npm/ng-packs/packages/feature-management/src/lib/states/feature-management.state.ts b/npm/ng-packs/packages/feature-management/src/lib/states/feature-management.state.ts new file mode 100644 index 0000000000..a02e075bdb --- /dev/null +++ b/npm/ng-packs/packages/feature-management/src/lib/states/feature-management.state.ts @@ -0,0 +1,34 @@ +import { Action, Selector, State, StateContext } from '@ngxs/store'; +import { tap } from 'rxjs/operators'; +import { GetFeatures, UpdateFeatures } from '../actions/feature-management.actions'; +import { FeatureManagement } from '../models/feature-management'; +import { FeatureManagementService } from '../services/feature-management.service'; + +@State({ + name: 'FeatureManagementState', + defaults: { features: {} } as FeatureManagement.State, +}) +export class FeatureManagementState { + @Selector() + static getFeatures({ features }: FeatureManagement.State) { + return features; + } + + constructor(private featureManagementService: FeatureManagementService) {} + + @Action(GetFeatures) + getFeatures({ patchState }: StateContext, { payload }: GetFeatures) { + return this.featureManagementService.getFeatures(payload).pipe( + tap(({ features }) => + patchState({ + features, + }), + ), + ); + } + + @Action(UpdateFeatures) + updateFeatures(_, { payload }: UpdateFeatures) { + return this.featureManagementService.updateFeatures(payload); + } +} diff --git a/npm/ng-packs/packages/feature-management/src/lib/states/index.ts b/npm/ng-packs/packages/feature-management/src/lib/states/index.ts new file mode 100644 index 0000000000..5c32d87889 --- /dev/null +++ b/npm/ng-packs/packages/feature-management/src/lib/states/index.ts @@ -0,0 +1 @@ +export * from "./feature-management.state"; diff --git a/npm/ng-packs/packages/feature-management/src/public-api.ts b/npm/ng-packs/packages/feature-management/src/public-api.ts new file mode 100644 index 0000000000..047ac00914 --- /dev/null +++ b/npm/ng-packs/packages/feature-management/src/public-api.ts @@ -0,0 +1,2 @@ +export * from './lib/feature-management.module'; +export * from './lib/components'; diff --git a/npm/ng-packs/packages/feature-management/src/test.ts b/npm/ng-packs/packages/feature-management/src/test.ts new file mode 100644 index 0000000000..978c64fb83 --- /dev/null +++ b/npm/ng-packs/packages/feature-management/src/test.ts @@ -0,0 +1,21 @@ +// This file is required by karma.conf.js and loads recursively all the .spec and framework files + +import 'zone.js/dist/zone'; +import 'zone.js/dist/zone-testing'; +import { getTestBed } from '@angular/core/testing'; +import { + BrowserDynamicTestingModule, + platformBrowserDynamicTesting +} from '@angular/platform-browser-dynamic/testing'; + +declare const require: any; + +// First, initialize the Angular testing environment. +getTestBed().initTestEnvironment( + BrowserDynamicTestingModule, + platformBrowserDynamicTesting() +); +// Then we find all the tests. +const context = require.context('./', true, /\.spec\.ts$/); +// And load the modules. +context.keys().map(context); diff --git a/npm/ng-packs/packages/feature-management/tsconfig.lib.json b/npm/ng-packs/packages/feature-management/tsconfig.lib.json new file mode 100644 index 0000000000..bd23948e59 --- /dev/null +++ b/npm/ng-packs/packages/feature-management/tsconfig.lib.json @@ -0,0 +1,26 @@ +{ + "extends": "../../tsconfig.json", + "compilerOptions": { + "outDir": "../../out-tsc/lib", + "target": "es2015", + "declaration": true, + "inlineSources": true, + "types": [], + "lib": [ + "dom", + "es2018" + ] + }, + "angularCompilerOptions": { + "annotateForClosureCompiler": true, + "skipTemplateCodegen": true, + "strictMetadataEmit": true, + "fullTemplateTypeCheck": true, + "strictInjectionParameters": true, + "enableResourceInlining": true + }, + "exclude": [ + "src/test.ts", + "**/*.spec.ts" + ] +} diff --git a/npm/ng-packs/packages/feature-management/tsconfig.spec.json b/npm/ng-packs/packages/feature-management/tsconfig.spec.json new file mode 100644 index 0000000000..16da33db07 --- /dev/null +++ b/npm/ng-packs/packages/feature-management/tsconfig.spec.json @@ -0,0 +1,17 @@ +{ + "extends": "../../tsconfig.json", + "compilerOptions": { + "outDir": "../../out-tsc/spec", + "types": [ + "jasmine", + "node" + ] + }, + "files": [ + "src/test.ts" + ], + "include": [ + "**/*.spec.ts", + "**/*.d.ts" + ] +} diff --git a/npm/ng-packs/packages/feature-management/tslint.json b/npm/ng-packs/packages/feature-management/tslint.json new file mode 100644 index 0000000000..8c3919ea62 --- /dev/null +++ b/npm/ng-packs/packages/feature-management/tslint.json @@ -0,0 +1,17 @@ +{ + "extends": "../../tslint.json", + "rules": { + "directive-selector": [ + true, + "attribute", + "abp", + "camelCase" + ], + "component-selector": [ + true, + "element", + "abp", + "kebab-case" + ] + } +} From 1fad9230fd78c4e66f0a54046619c4e47f9fec38 Mon Sep 17 00:00:00 2001 From: TheDiaval Date: Mon, 19 Aug 2019 12:58:02 +0300 Subject: [PATCH 4/8] feature(tenant-management): add feature-management modal to tenants component --- .../lib/components/tenants/tenants.component.html | 15 ++++++++++++++- .../lib/components/tenants/tenants.component.ts | 4 ++++ .../src/lib/tenant-management.module.ts | 2 ++ 3 files changed, 20 insertions(+), 1 deletion(-) diff --git a/npm/ng-packs/packages/tenant-management/src/lib/components/tenants/tenants.component.html b/npm/ng-packs/packages/tenant-management/src/lib/components/tenants/tenants.component.html index 9972e10220..cd1abf487d 100644 --- a/npm/ng-packs/packages/tenant-management/src/lib/components/tenants/tenants.component.html +++ b/npm/ng-packs/packages/tenant-management/src/lib/components/tenants/tenants.component.html @@ -71,7 +71,14 @@ ngbDropdownItem (click)="onEditConnectionString(data.id)" > - {{ 'AbpTenantManagement::ConnectionStrings' | abpLocalization }} + {{ 'AbpTenantManagement::Permission:ManageConnectionStrings' | abpLocalization }} + + - + diff --git a/npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.ts b/npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.ts index b2ab6e71cf..38219b2b08 100644 --- a/npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.ts +++ b/npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.ts @@ -11,7 +11,7 @@ import { pluck, tap } from 'rxjs/operators'; selector: 'abp-feature-management', templateUrl: './feature-management.component.html', }) -export class FeatureManagementComponent implements OnChanges { +export class FeatureManagementComponent { @Input() providerKey: string; @@ -28,6 +28,8 @@ export class FeatureManagementComponent implements OnChanges { set visible(value: boolean) { this._visible = value; this.visibleChange.emit(value); + + if (value) this.openModal(); } @Output() @@ -42,16 +44,6 @@ export class FeatureManagementComponent implements OnChanges { constructor(private store: Store) {} - ngOnChanges({ visible }: SimpleChanges): void { - if (!visible) return; - - if (visible.currentValue) { - this.openModal(); - } else if (this.visible && visible.currentValue === false) { - this.visible = false; - } - } - openModal() { if (!this.providerKey || !this.providerName) { throw new Error('Provider Key and Provider Name are required.'); @@ -66,7 +58,6 @@ export class FeatureManagementComponent implements OnChanges { .pipe(pluck('FeatureManagementState', 'features')) .subscribe(features => { this.buildForm(features); - this.visible = true; }); } From baff0c9681402bccb0039fc6b41a6accd9390896 Mon Sep 17 00:00:00 2001 From: mehmet-erim Date: Mon, 19 Aug 2019 14:08:29 +0300 Subject: [PATCH 8/8] feature(tenant-management): add abp/ng.feature-management to package.json --- .../tenant-management/ng-package.json | 2 +- .../packages/tenant-management/package.json | 3 ++- .../account-layout.component.html | 27 +------------------ .../account-layout.component.ts | 2 -- .../empty-layout/empty-layout.component.ts | 1 - 5 files changed, 4 insertions(+), 31 deletions(-) diff --git a/npm/ng-packs/packages/tenant-management/ng-package.json b/npm/ng-packs/packages/tenant-management/ng-package.json index e506119f69..07fbab773b 100644 --- a/npm/ng-packs/packages/tenant-management/ng-package.json +++ b/npm/ng-packs/packages/tenant-management/ng-package.json @@ -4,5 +4,5 @@ "lib": { "entryFile": "src/public-api.ts" }, - "whitelistedNonPeerDependencies": ["@abp/ng.theme.shared"] + "whitelistedNonPeerDependencies": ["@abp/ng.theme.shared", "@abp/ng.feature-management"] } diff --git a/npm/ng-packs/packages/tenant-management/package.json b/npm/ng-packs/packages/tenant-management/package.json index 73347fccd4..0e415b4e80 100644 --- a/npm/ng-packs/packages/tenant-management/package.json +++ b/npm/ng-packs/packages/tenant-management/package.json @@ -2,7 +2,8 @@ "name": "@abp/ng.tenant-management", "version": "0.8.3", "dependencies": { - "@abp/ng.theme.shared": "^0.8.3" + "@abp/ng.theme.shared": "^0.8.3", + "@abp/ng.feature-management": "^0.8.4" }, "publishConfig": { "access": "public" diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/account-layout.component.html b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/account-layout.component.html index 00d209e02a..0680b43f9c 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/account-layout.component.html +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/account-layout.component.html @@ -1,26 +1 @@ - - - - - - - - - + diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/account-layout.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/account-layout.component.ts index e3e4d2db07..7a97b307fa 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/account-layout.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/account-layout.component.ts @@ -8,6 +8,4 @@ import { eLayoutType } from '@abp/ng.core'; export class AccountLayoutComponent { // required for dynamic component static type = eLayoutType.account; - - isCollapsed: boolean = false; } diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/empty-layout/empty-layout.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/empty-layout/empty-layout.component.ts index 77e6f2a8e4..efc65f7598 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/empty-layout/empty-layout.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/empty-layout/empty-layout.component.ts @@ -9,6 +9,5 @@ import { eLayoutType } from '@abp/ng.core'; `, }) export class EmptyLayoutComponent { - // required for dynamic component static type = eLayoutType.empty; }