interface State { songs: Song[]; activeSongId: number | null; isLoading: boolean; } const initialState: State = { songs: [], activeSongId: null, isLoading: false, }; export const songsFeature = createFeature({ name: 'songs', reducer: createReducer( initialState, on(** **. */), on(** **. */) ), }); const { name, =/ feature name reducer, =/ feature reducer selectSongsState, =/ feature selector selectSongs, =/ selector for `songs` property selectActiveSongId, =/ selector for `activeSongId` property selectIsLoading, =/ selector for `isLoading` property } = songsFeature; songs.module.ts import { StoreModule } from '@ngrx/store'; import { songsFeature } from './songs.reducer'; @NgModule({ imports: [ StoreModule.forFeature(songsFeature), ], }) export class SongsModule {} songs.selectors.ts import { createSelector } from '@ngrx/store'; import { songsFeature } from './songs.reducer'; export const selectActiveSong = createSelector( songsFeature.selectSongs, songsFeature.selectActiveSongId, (songs, activeSongId) => songs.find((song) => song.id === activeSongId) );