import { Observable } from 'rxjs' ; import { scan } from 'rxjs/operators' ; import { BusService , Message } from './bus.service' ; export abstract class ColorComponent { abstract color : string ; messages$ : Observable < string [ ] > ; constructor ( private bus ) { /** Messages displayed by this component */ this . messages$ = bus . messages$ . pipe ( scan ( ( messages , m ) => { if ( m . type === 'clear' && ( ! m . sender || m . sender === this . color ) ) { return [ ] ; } else if ( m . sender === this . color ) { return messages ; } else { return messages . concat ( m . payload as string ) ; } } , [ ] as string [ ] ) ) ; } send ( ) { this . bus . send ( { type : 'hello' , sender : this . color , payload : 'Hello from ' + this . color } ) ; } clear ( ) { this . bus . send ( { type : 'clear' , sender : this . color } ) ; } }