typescript RX-reselect3.ts

Posted 2021-05-21

@Injectable()
class TodosQuery {

  getVisibilityFilter$ = this.store.select(state => state.visibilityFilter);
  getTodos$ = this.store.select(state => state.todos);
  getKeyword$ = this.store.select(state => state.keyword);  

  getVisibleTodos$ = Observable.combineLatest(
    getVisibilityFilter$, getTodos$, this.calcVisibleTodos
  )

  private calcVisibleTodos = (visibilityFilter, todos) => {
      switch (visibilityFilter) {
        case 'SHOW_ALL':
          return todos
        case 'SHOW_COMPLETED':
          return todos.filter(t => t.completed)
        case 'SHOW_ACTIVE':
          return todos.filter(t => !t.completed)
      }
  }

  getVisibleTodosFilteredByKeyword$ = Observable.combineLatest(
    getVisibleTodos$, getKeyword$,
    (visibleTodos, keyword) => visibleTodos.filter(
      todo => todo.text.includes(keyword)
    )
  )

  constructor(private store: Store<AppState>) {}
    
}