import { AuthService } from './../shared/services/auth.service' ; import { ChangeDetectionStrategy , ChangeDetectorRef , Component , HostBinding , ViewChild } from '@angular/core' ; import { PlatformService } from './../shared/services/platform.service' ; import { MatExpansionPanel , MatSnackBar } from '@angular/material' ; import { FormControl , FormGroup , Validators } from '@angular/forms' ; @ Component ( { selector : 'pm-account' , templateUrl : './account.component.html' , styleUrls : [ './account.component.scss' ] , changeDetection : ChangeDetectionStrategy . OnPush } ) export class AccountComponent { @ HostBinding ( 'class.card-float-container' ) readonly containerClass = true ; @ ViewChild ( 'passwordPanel' ) readonly passwordPanel : MatExpansionPanel ; @ ViewChild ( 'profilePanel' ) readonly profilePanel : MatExpansionPanel ; @ ViewChild ( 'socialPanel' ) readonly socialPanel : MatExpansionPanel ; public readonly detailForm = new FormGroup ( { displayName : new FormControl ( '' , [ Validators . required ] ) , email : new FormControl ( '' , [ Validators . required ] ) , phoneNumber : new FormControl ( '' , [ Validators . required ] ) } ) ; public readonly passForm = new FormGroup ( { currentPassword : new FormControl ( '' , [ Validators . required ] ) , newPassword : new FormControl ( '' , [ Validators . required ] ) } ) ; public readonly user$ = this . auth . user$ ; constructor ( private auth , private snackBar , ps , private cd ) { } openSnackBar ( message , action = 'dismiss' ) { this . snackBar . open ( message , action , { duration : 2000 , horizontalPosition : 'right' , verticalPosition : 'top' } ) ; } updateDetail ( ) { this . auth . updateProfile ( this . detailForm . value . displayName ) . take ( 1 ) . subscribe ( ( ) => { this . openSnackBar ( 'name updated' ) ; } , err => { console . log ( err ) ; } ) ; } updatePassword ( ) { const permuteError = ( err ? ) => { this . passwordError = err ; this . cd . markForCheck ( ) ; } ; this . auth . updateEmailPassword ( this . passForm . value . currentPassword , this . passForm . value . newPassword ) . take ( 1 ) . subscribe ( res => { permuteError ( ) ; this . passForm . reset ( ) ; this . openSnackBar ( 'password updated' ) ; } , err => { permuteError ( err . message ) ; } ) ; } passwordError : string | undefined ; }