import { Component , ElementRef } from '@angular/core' ; import { Observable } from 'rxjs' ; import { DiscoveryTagsService , DiscoveryTag } from './tags.service' ; const noOp = ( ) => { } ; @ Component ( { selector : 'm-discovery__tagSettings' , templateUrl : './settings.component.html' , } ) export class DiscoveryTagSettingsComponent { tags$ : Observable < DiscoveryTag [ ] > = this . service . tags$ ; defaults$ : Observable < DiscoveryTag [ ] > = this . service . defaults$ ; inProgress$ : Observable < boolean > = this . service . inProgress$ ; saving$ : Observable < boolean > = this . service . saving$ ; onDismissIntent : ( ) => void = noOp ; onSaveIntent : ( tags : DiscoveryTag [ ] ) => void = noOp ; param onDismissIntent set opts ( { onSave , onDismissIntent } ) { this . onDismissIntent = onDismissIntent || noOp ; this . onSaveIntent = onSave || noOp ; } constructor ( private service ) { } ngOnInit ( ) { if ( ! this . service . trending$ . value . length ) this . service . loadTags ( ) ; } async onSave ( e ) { await this . service . saveTags ( ) ; this . onDismissIntent ( ) ; this . onSaveIntent ( this . service . tags$ . value ) ; } onKeypress ( input , e ) { if ( e . keyCode !== 13 ) return ; e . preventDefault ( ) ; const tag = { value : input . value , } ; this . addTag ( tag ) ; input . value = '' ; } addTag ( tag ) { return this . service . addTag ( tag ) ; } removeTag ( tag ) { return this . service . removeTag ( tag ) ; } }