Merge branch 'dev' of https://github.com/abpframework/abp into dev

npm/ng-packs/packages/account/src/lib/components/register/register.component.ts

@@ -47,7 +47,7 @@ export class RegisterComponent {
       userName: this.form.get('username').value,
       password: this.form.get('password').value,
       emailAddress: this.form.get('email').value,
-      appName: 'angular',
+      appName: 'Angular',
     } as RegisterRequest;
 
     this.accountService

npm/ng-packs/packages/account/src/lib/services/account.service.ts

@@ -25,6 +25,6 @@ export class AccountService {
       body,
     };
 
-    return this.rest.request<RegisterRequest, RegisterResponse>(request, { throwErr: true });
+    return this.rest.request<RegisterRequest, RegisterResponse>(request, { skipHandleError: true });
   }
 }

npm/ng-packs/packages/core/src/lib/directives/form-submit.directive.ts

@@ -1,19 +1,18 @@
 import {
+  ChangeDetectorRef,
   Directive,
   ElementRef,
+  EventEmitter,
+  Input,
   OnDestroy,
   OnInit,
-  Self,
-  ChangeDetectorRef,
-  HostBinding,
-  Input,
   Output,
-  EventEmitter,
+  Self,
 } from '@angular/core';
-import { FormGroupDirective, FormGroup, FormControl, ɵNgNoValidate } from '@angular/forms';
+import { FormControl, FormGroup, FormGroupDirective } from '@angular/forms';
 import { fromEvent } from 'rxjs';
-import { takeUntilDestroy } from '../utils';
 import { debounceTime, filter } from 'rxjs/operators';
+import { takeUntilDestroy } from '../utils';
 
 type Controls = { [key: string]: FormControl } | FormGroup[];
 
@@ -24,6 +23,11 @@ export class FormSubmitDirective implements OnInit, OnDestroy {
   @Input()
   notValidateOnSubmit: string | boolean;
 
+  @Output()
+  ngSubmit = new EventEmitter();
+
+  executedNgSubmit: boolean = false;
+
   constructor(
     @Self() private formGroupDirective: FormGroupDirective,
     private host: ElementRef<HTMLFormElement>,
@@ -31,6 +35,11 @@ export class FormSubmitDirective implements OnInit, OnDestroy {
   ) {}
 
   ngOnInit() {
+    this.formGroupDirective.ngSubmit.pipe(takeUntilDestroy(this)).subscribe(() => {
+      this.markAsDirty();
+      this.executedNgSubmit = true;
+    });
+
     fromEvent(this.host.nativeElement as HTMLElement, 'keyup')
       .pipe(
         debounceTime(200),
@@ -38,7 +47,11 @@ export class FormSubmitDirective implements OnInit, OnDestroy {
         takeUntilDestroy(this),
       )
       .subscribe(() => {
-        this.host.nativeElement.dispatchEvent(new Event('submit', { bubbles: true, cancelable: true }));
+        if (!this.executedNgSubmit) {
+          this.host.nativeElement.dispatchEvent(new Event('submit', { bubbles: true, cancelable: true }));
+        }
+
+        this.executedNgSubmit = false;
       });
 
     fromEvent(this.host.nativeElement, 'submit')
@@ -47,16 +60,22 @@ export class FormSubmitDirective implements OnInit, OnDestroy {
         filter(() => !this.notValidateOnSubmit && typeof this.notValidateOnSubmit !== 'string'),
       )
       .subscribe(() => {
-        const { form } = this.formGroupDirective;
-
-        setDirty(form.controls as { [key: string]: FormControl });
-        form.markAsDirty();
-
-        this.cdRef.detectChanges();
+        if (!this.executedNgSubmit) {
+          this.markAsDirty();
+        }
       });
   }
 
   ngOnDestroy(): void {}
+
+  markAsDirty() {
+    const { form } = this.formGroupDirective;
+
+    setDirty(form.controls as { [key: string]: FormControl });
+    form.markAsDirty();
+
+    this.cdRef.detectChanges();
+  }
 }
 
 function setDirty(controls: Controls) {

npm/ng-packs/packages/core/src/lib/models/rest.ts

@@ -2,7 +2,7 @@ import { HttpHeaders, HttpParams } from '@angular/common/http';
 
 export namespace Rest {
   export interface Config {
-    throwErr?: boolean;
+    skipHandleError?: boolean;
     observe?: Observe;
   }
 

npm/ng-packs/packages/core/src/lib/pipes/localization.pipe.ts

@@ -2,22 +2,26 @@ import { Pipe, PipeTransform, OnDestroy } from '@angular/core';
 import { Store } from '@ngxs/store';
 import { ConfigState } from '../states';
 import { takeUntilDestroy } from '../utils';
-import { distinctUntilChanged } from 'rxjs/operators';
+import { distinctUntilChanged, takeUntil } from 'rxjs/operators';
+import { Subject } from 'rxjs';
 
 @Pipe({
   name: 'abpLocalization',
   pure: false, // required to update the value
 })
 export class LocalizationPipe implements PipeTransform, OnDestroy {
-  initialized: boolean = false;
+  initialValue: string = '';
 
   value: string;
 
+  destroy$ = new Subject();
+
   constructor(private store: Store) {}
 
-  transform(value: string, ...interpolateParams: string[]): string {
-    if (!this.initialized) {
-      this.initialized = true;
+  transform(value: string = '', ...interpolateParams: string[]): string {
+    if (this.initialValue !== value) {
+      this.initialValue = value;
+      this.destroy$.next();
 
       this.store
         .select(
@@ -27,6 +31,7 @@ export class LocalizationPipe implements PipeTransform, OnDestroy {
           ),
         )
         .pipe(
+          takeUntil(this.destroy$),
           takeUntilDestroy(this),
           distinctUntilChanged(),
         )

npm/ng-packs/packages/core/src/lib/plugins/config.plugin.ts

@@ -58,6 +58,7 @@ function transformRoutes(routes: Routes = [], wrappers: ABP.FullRoute[] = []): a
 
       if (transformed.length === length) {
         transformed.push({
+          ...route.data.routes,
           path: route.path,
           name: snq(() => route.data.routes.name, route.path),
           children: route.data.routes.children || [],

npm/ng-packs/packages/core/src/lib/services/profile.service.ts

@@ -28,13 +28,13 @@ export class ProfileService {
     return this.rest.request<Profile.Response, Profile.Response>(request);
   }
 
-  changePassword(body: Profile.ChangePasswordRequest, throwErr: boolean = false): Observable<null> {
+  changePassword(body: Profile.ChangePasswordRequest, skipHandleError: boolean = false): Observable<null> {
     const request: Rest.Request<Profile.ChangePasswordRequest> = {
       method: 'POST',
       url: '/api/identity/my-profile/change-password',
       body,
     };
 
-    return this.rest.request<Profile.ChangePasswordRequest, null>(request, { throwErr });
+    return this.rest.request<Profile.ChangePasswordRequest, null>(request, { skipHandleError });
   }
 }

npm/ng-packs/packages/core/src/lib/services/rest.service.ts

@@ -16,17 +16,17 @@ export class RestService {
   handleError(err: any): Observable<any> {
     this.store.dispatch(new RestOccurError(err));
     console.error(err);
-    return NEVER;
+    return throwError(err);
   }
 
   request<T, R>(request: HttpRequest<T> | Rest.Request<T>, config: Rest.Config = {}, api?: string): Observable<R> {
-    const { observe = Rest.Observe.Body, throwErr } = config;
+    const { observe = Rest.Observe.Body, skipHandleError } = config;
     const url = api || this.store.selectSnapshot(ConfigState.getApiUrl()) + request.url;
     const { method, ...options } = request;
     return this.http.request<T>(method, url, { observe, ...options } as any).pipe(
       observe === Rest.Observe.Body ? take(1) : null,
       catchError(err => {
-        if (throwErr) {
+        if (skipHandleError) {
           return throwError(err);
         }
 

npm/ng-packs/packages/theme-basic/src/lib/theme-basic.module.ts

@@ -1,22 +1,20 @@
 import { CoreModule } from '@abp/ng.core';
+import { ThemeSharedModule } from '@abp/ng.theme.shared';
 import { NgModule } from '@angular/core';
 import { NgbCollapseModule, NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap';
-import { ChangePasswordComponent } from './components/change-password/change-password.component';
+import { NgxValidateCoreModule } from '@ngx-validate/core';
+import { NgxsModule } from '@ngxs/store';
+import { ToastModule } from 'primeng/toast';
 import { AccountLayoutComponent } from './components/account-layout/account-layout.component';
 import { ApplicationLayoutComponent } from './components/application-layout/application-layout.component';
 import { EmptyLayoutComponent } from './components/empty-layout/empty-layout.component';
 import { LayoutComponent } from './components/layout/layout.component';
-import { ProfileComponent } from './components/profile/profile.component';
-import { ThemeSharedModule } from '@abp/ng.theme.shared';
-import { ToastModule } from 'primeng/toast';
-import { NgxValidateCoreModule } from '@ngx-validate/core';
-import { NgxsModule } from '@ngxs/store';
 import { LayoutState } from './states/layout.state';
 
 export const LAYOUTS = [ApplicationLayoutComponent, AccountLayoutComponent, EmptyLayoutComponent];
 
 @NgModule({
-  declarations: [...LAYOUTS, LayoutComponent, ChangePasswordComponent, ProfileComponent],
+  declarations: [...LAYOUTS, LayoutComponent],
   imports: [
     CoreModule,
     ThemeSharedModule,

npm/ng-packs/packages/theme-basic/src/lib/components/change-password/change-password.component.ts → npm/ng-packs/packages/theme-shared/src/lib/components/change-password/change-password.component.ts

@@ -1,5 +1,4 @@
 import { ChangePassword } from '@abp/ng.core';
-import { ToasterService } from '@abp/ng.theme.shared';
 import {
   Component,
   EventEmitter,
@@ -16,6 +15,7 @@ import { comparePasswords } from '@ngx-validate/core';
 import { Store } from '@ngxs/store';
 import snq from 'snq';
 import { finalize } from 'rxjs/operators';
+import { ToasterService } from '../../services/toaster.service';
 
 const { minLength, required } = Validators;
 

npm/ng-packs/packages/theme-shared/src/lib/components/confirmation/confirmation.component.ts

@@ -27,7 +27,13 @@ import { Toaster } from '../../models/toaster';
           <button *ngIf="!message.hideCancelBtn" type="button" class="btn btn-secondary" (click)="close(reject)">
             {{ message.cancelCopy || 'AbpIdentity::Cancel' | abpLocalization }}
           </button>
-          <button *ngIf="!message.hideYesBtn" type="button" class="btn btn-secondary" (click)="close(confirm)">
+          <button
+            *ngIf="!message.hideYesBtn"
+            type="button"
+            class="btn btn-secondary"
+            (click)="close(confirm)"
+            autofocus
+          >
             <span>{{ message.yesCopy || 'AbpIdentity::Yes' | abpLocalization }}</span>
           </button>
         </div>

npm/ng-packs/packages/theme-shared/src/lib/components/index.ts

@@ -1,5 +1,7 @@
 export * from './button/button.component';
+export * from './change-password/change-password.component';
 export * from './confirmation/confirmation.component';
 export * from './loader-bar/loader-bar.component';
 export * from './modal/modal.component';
+export * from './profile/profile.component';
 export * from './toast/toast.component';

npm/ng-packs/packages/theme-shared/src/lib/components/loader-bar/loader-bar.component.ts

@@ -1,6 +1,6 @@
 import { StartLoader, StopLoader } from '@abp/ng.core';
 import { Component, Input, OnDestroy } from '@angular/core';
-import { NavigationEnd, NavigationStart, Router } from '@angular/router';
+import { NavigationEnd, NavigationStart, Router, NavigationError } from '@angular/router';
 import { takeUntilDestroy } from '@ngx-validate/core';
 import { Actions, ofActionSuccessful } from '@ngxs/store';
 import { filter } from 'rxjs/operators';
@@ -45,7 +45,10 @@ export class LoaderBarComponent implements OnDestroy {
 
     router.events
       .pipe(
-        filter(event => event instanceof NavigationStart || event instanceof NavigationEnd),
+        filter(
+          event =>
+            event instanceof NavigationStart || event instanceof NavigationEnd || event instanceof NavigationError,
+        ),
         takeUntilDestroy(this),
       )
       .subscribe(event => {

npm/ng-packs/packages/theme-shared/src/lib/theme-shared.module.ts

@@ -15,6 +15,8 @@ import styles from './contants/styles';
 import { ErrorHandler } from './handlers/error.handler';
 import { ButtonComponent } from './components/button/button.component';
 import { ValidationErrorComponent } from './components/errors/validation-error.component';
+import { ChangePasswordComponent } from './components/change-password/change-password.component';
+import { ProfileComponent } from './components/profile/profile.component';
 
 export function appendScript(injector: Injector) {
   const fn = function() {
@@ -61,8 +63,19 @@ export function appendScript(injector: Injector) {
     ErrorComponent,
     LoaderBarComponent,
     ValidationErrorComponent,
+    ChangePasswordComponent,
+    ProfileComponent,
+  ],
+  exports: [
+    NgbModalModule,
+    ButtonComponent,
+    ConfirmationComponent,
+    ToastComponent,
+    ModalComponent,
+    LoaderBarComponent,
+    ChangePasswordComponent,
+    ProfileComponent,
   ],
-  exports: [NgbModalModule, ButtonComponent, ConfirmationComponent, ToastComponent, ModalComponent, LoaderBarComponent],
   entryComponents: [ErrorComponent, ValidationErrorComponent],
 })
 export class ThemeSharedModule {