Made save button disabled if nothing changed

src/app/shell/personal-cabinet/provider/create-provider/create-provider.component.ts

@@ -1,13 +1,23 @@
 import { STEPPER_GLOBAL_OPTIONS } from '@angular/cdk/stepper';
-import { AfterViewChecked, AfterViewInit, ChangeDetectorRef, Component, OnDestroy, OnInit, ViewChild } from '@angular/core';
+import {
+  AfterViewChecked,
+  AfterViewInit,
+  ChangeDetectorRef,
+  Component,
+  OnDestroy,
+  OnInit,
+  ViewChild
+} from '@angular/core';
 import { FormControl, FormGroup } from '@angular/forms';
 import { MatDialog } from '@angular/material/dialog';
 import { MatStepper } from '@angular/material/stepper';
 import { ActivatedRoute, Params, Router } from '@angular/router';
 import { Store } from '@ngxs/store';
 import { takeUntil } from 'rxjs/operators';
 
-import { ConfirmationModalWindowComponent } from 'shared/components/confirmation-modal-window/confirmation-modal-window.component';
+import {
+  ConfirmationModalWindowComponent
+} from 'shared/components/confirmation-modal-window/confirmation-modal-window.component';
 import { Constants } from 'shared/constants/constants';
 import { NavBarName } from 'shared/enum/enumUA/navigation-bar';
 import { ModalConfirmationType } from 'shared/enum/modal-confirmation';

src/app/shell/personal-cabinet/shared-cabinet/user-config/user-config-edit/user-config-edit.component.html

@@ -88,7 +88,7 @@ <h3 class="wrapper-title">{{ 'FORMS.HEADERS.EDIT_PERSONAL_INFORMATION' | transla
     </div>
     <div fxLayout="row" fxLayoutAlign="center center" class="footer">
       <button mat-raised-button class="btn btn-cancel" (click)="onCancel()">{{ 'BUTTONS.CANCEL' | translate }}</button>
-      <button [disabled]="!userEditFormGroup.valid || isDispatching" class="btn" mat-button type="submit" (click)="onSubmit()">
+      <button [disabled]="!this.userEditFormGroup.dirty || !userEditFormGroup.valid || isDispatching" class="btn" mat-button type="submit" (click)="onSubmit()">
         {{ 'BUTTONS.SAVE' | translate }}
       </button>
     </div>

src/app/shell/personal-cabinet/shared-cabinet/user-config/user-config.component.ts

@@ -16,23 +16,23 @@ import { environment } from '../../../../../environments/environment';
   styleUrls: ['./user-config.component.scss']
 })
 export class UserConfigComponent implements OnInit, OnDestroy {
-  readonly gender = Gender;
-  readonly phonePrefix = Constants.PHONE_PREFIX;
-  readonly dateFormat = Constants.SHORT_DATE_FORMAT;
-  readonly role = Role;
+  public readonly gender = Gender;
+  public readonly phonePrefix = Constants.PHONE_PREFIX;
+  public readonly dateFormat = Constants.SHORT_DATE_FORMAT;
+  public readonly role = Role;
 
   @Select(RegistrationState.user)
-  user$: Observable<User>;
+  public user$: Observable<User>;
   @Select(RegistrationState.role)
-  role$: Observable<Role>;
+  public role$: Observable<Role>;
 
-  authServer: string = environment.stsServer;
-  culture: string = localStorage.getItem('ui-culture');
-  link: string;
+  public authServer: string = environment.stsServer;
+  public culture: string = localStorage.getItem('ui-culture');
+  public link: string;
 
   constructor(private store: Store) {}
 
-  ngOnInit(): void {
+  public ngOnInit(): void {
     this.store.dispatch(
       new PushNavPath({
         name: NavBarName.PersonalInformation,
@@ -42,11 +42,11 @@ export class UserConfigComponent implements OnInit, OnDestroy {
     );
   }
 
-  onRedirect(link: string): void {
+  public onRedirect(link: string): void {
     window.open(`${this.authServer + link}?culture=${this.culture}&ui-culture=${this.culture}`, link, 'height=500,width=500');
   }
 
-  ngOnDestroy(): void {
+  public ngOnDestroy(): void {
     this.store.dispatch(new PopNavPath());
   }
 }