How to use @ngrx/entity - 10 common examples

columnIds?: string[] | null;

  treeStatus: 'collapsed' | 'expanded' | 'disabled' | 'loading'; // collapsed
  childrenLoaded: boolean; // false
  bold: boolean; // false

  createId?: number; // this is used to identify newly created item
  selected: boolean;
  editable?: boolean; // Based on the logged in user this value will be changed. Default value is false
}

export interface WorkItemStateModel extends EntityState {
  nextLink: string;
}

const workItemAdapter = createEntityAdapter();
const { selectIds, selectEntities, selectAll, selectTotal } = workItemAdapter.getSelectors();

export class WorkItemMapper implements Mapper {
  wiTypeMapper = new WorkItemTypeMapper();
  labelMapper = new LabelMapper();
  serviceToUiMapTree: MapTree = [
    {
      fromPath: ['id'],
      toPath: ['id'],
    },
    {
      fromPath: ['attributes', 'system.title'],
      toPath: ['title'],
    },
    {
      fromPath: ['attributes', 'system.number'],

import { createEntityAdapter, EntityAdapter, EntityState } from '@ngrx/entity';
import { JiraIssueActions, JiraIssueActionTypes } from './jira-issue.actions';
import { JiraIssue } from '../jira-issue.model';
import { createFeatureSelector, createSelector } from '@ngrx/store';
import { TaskActionTypes } from '../../../../tasks/store/task.actions';

export const JIRA_ISSUE_FEATURE_NAME = 'issues';

export interface JiraIssueState extends EntityState {
  // additional entities state properties
  currentJiraIssueId: string | null;
}

export const jiraIssueAdapter: EntityAdapter = createEntityAdapter();


// SELECTORS
// ---------
export const selectJiraIssueFeatureState = createFeatureSelector(JIRA_ISSUE_FEATURE_NAME);

const {selectIds, selectEntities, selectAll, selectTotal} = jiraIssueAdapter.getSelectors();

export const selectJiraIssueIds = createSelector(selectJiraIssueFeatureState, selectIds);
export const selectJiraIssueEntities = createSelector(selectJiraIssueFeatureState, selectEntities);
export const selectAllJiraIssues = createSelector(selectJiraIssueFeatureState, selectAll);

// select the total user count
export const selectJiraIssueTotal = createSelector(selectJiraIssueFeatureState, selectTotal);

export const selectCurrentJiraIssue = createSelector(selectJiraIssueFeatureState, state => state.currentJiraIssueId);

import {createEntityAdapter, EntityAdapter, EntityState} from '@ngrx/entity';
import {BookmarkActions, BookmarkActionTypes} from './bookmark.actions';
import {Bookmark} from '../bookmark.model';
import {createFeatureSelector, createSelector} from '@ngrx/store';

export const BOOKMARK_FEATURE_NAME = 'bookmark';

export interface BookmarkState extends EntityState {
  // additional entities state properties
  isShowBookmarks: boolean;
}

export const adapter: EntityAdapter = createEntityAdapter();
export const selectBookmarkFeatureState = createFeatureSelector(BOOKMARK_FEATURE_NAME);
export const {selectIds, selectEntities, selectAll, selectTotal} = adapter.getSelectors();
export const selectAllBookmarks = createSelector(selectBookmarkFeatureState, selectAll);
export const selectIsShowBookmarkBar = createSelector(selectBookmarkFeatureState, state => state.isShowBookmarks);

export const initialBookmarkState: BookmarkState = adapter.getInitialState({
  // additional entity state properties
  isShowBookmarks: false
});

export function bookmarkReducer(
  state = initialBookmarkState,
  action: BookmarkActions
): BookmarkState {
  switch (action.type) {
    case BookmarkActionTypes.AddBookmark: {

import {compareCourses, Course} from '../model/course';
import {createEntityAdapter, EntityState} from '@ngrx/entity';
import {createReducer, on} from '@ngrx/store';
import {CourseActions} from '../action-types';


export interface CoursesState extends EntityState {
    allCoursesLoaded: boolean
}


export const adapter = createEntityAdapter({
    sortComparer: compareCourses
});


export const initialCoursesState = adapter.getInitialState({
    allCoursesLoaded:false
});


export const coursesReducer = createReducer(

    initialCoursesState,

    on(CourseActions.allCoursesLoaded,
        (state, action) => adapter.addAll(
            action.courses,

list: State;
}

export const roleReducers = {
  list: reducer,
};

/**
 * createEntityAdapter creates many an object of helper
 * functions for single or multiple operations
 * against the dictionary of records. The configuration
 * object takes a record id selector function and
 * a sortComparer option which is set to a compare
 * function if the records are to be sorted.
 */
export const adapter: EntityAdapter = createEntityAdapter({
  selectId: (item: Role) => item.id,
  sortComparer: false,
});

/** getInitialState returns the default initial state
 * for the generated entity state. Initial state
 * additional properties can also be defined.
 */
export const initialState: State = adapter.getInitialState({
  loading: false,
});

export function reducer(state = initialState, action: event.Actions): State {
  switch (action.type) {
    case event.LOAD_ROLES_REQUEST: {
      return {

list: State;
}

export const accountTagsReducers = {
  list: reducer,
};

/**
 * createEntityAdapter creates many an object of helper
 * functions for single or multiple operations
 * against the dictionary of records. The configuration
 * object takes a record id selector function and
 * a sortComparer option which is set to a compare
 * function if the records are to be sorted.
 */
export const adapter: EntityAdapter = createEntityAdapter({
  selectId: (item: Tag) => item.key,
  sortComparer: false,
});

/** getInitialState returns the default initial state
 * for the generated entity state. Initial state
 * additional properties can also be defined.
 */
export const initialState: State = adapter.getInitialState({
  loading: false,
  loaded: false,
});

export function reducer(state = initialState, action: accountTagActions.Actions): State {
  switch (action.type) {
    case accountTagActions.LOAD_ACCOUNT_TAGS_REQUEST: {

* model type by id. This interface is extended to include
 * any additional interface properties.
 */
export interface State extends EntityState {
  selectedBookId: string | null;
}

/**
 * createEntityAdapter creates many an object of helper
 * functions for single or multiple operations
 * against the dictionary of records. The configuration
 * object takes a record id selector function and
 * a sortComparer option which is set to a compare
 * function if the records are to be sorted.
 */
export const adapter: EntityAdapter = createEntityAdapter({
  selectId: (book: Book) => book.id,
  sortComparer: false
});

/**
 * getInitialState returns the default initial state
 * for the generated entity state. Initial state
 * additional properties can also be defined.
 */
export const initialState: State = adapter.getInitialState({
  selectedBookId: null
});

export function reducer(state = initialState, action: BookActions | CollectionActions): State {
  switch (action.type) {
    case BookActionTypes.SearchComplete:

import { EntityState, EntityAdapter, createEntityAdapter } from '@ngrx/entity';
import { set } from 'lodash/fp';

import { EntityStatus } from 'app/entities/entities';
import { RoleActionTypes, RoleActions } from './role.actions';
import { Role } from './role.model';

export interface RoleEntityState extends EntityState {
  getAllStatus: EntityStatus;
  getStatus: EntityStatus;
  deleteStatus: EntityStatus;
}

export const roleEntityAdapter: EntityAdapter = createEntityAdapter();

export const RoleEntityInitialState: RoleEntityState = roleEntityAdapter.getInitialState({
  getAllStatus: EntityStatus.notLoaded,
  getStatus: EntityStatus.notLoaded,
  deleteStatus: EntityStatus.notLoaded
});

export function roleEntityReducer(state: RoleEntityState = RoleEntityInitialState,
  action: RoleActions) {

  switch (action.type) {
    case RoleActionTypes.GET_ALL:
      return set('getAllStatus', EntityStatus.loading, roleEntityAdapter.removeAll(state));

    case RoleActionTypes.GET_ALL_SUCCESS:
      return set('getAllStatus', EntityStatus.loadingSuccess,

* but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with this program.  If not, see .
 */

import {createSelector} from '@ngrx/store';
import {AppState} from '../app.state';
import {createEntityAdapter, EntityState} from '@ngrx/entity';
import {DEFAULT_PIVOT_ID, Pivot} from './pivot';

export interface PivotsState extends EntityState {}

export const pivotsAdapter = createEntityAdapter({selectId: pivot => pivot.id});

export const initialPivotsState: PivotsState = pivotsAdapter.getInitialState();

export const selectPivotsState = (state: AppState) => state.pivots;
export const selectPivotsDictionary = createSelector(
  selectPivotsState,
  pivotsAdapter.getSelectors().selectEntities
);
export const selectPivotById = id =>
  createSelector(
    selectPivotsDictionary,
    pivots => pivots[id]
  );

export const selectDefaultPivot = selectPivotById(DEFAULT_PIVOT_ID);
export const selectPivotConfig = createSelector(

import * as fromVMs from '../../vm/redux/vm.reducers';
import { isTemplate } from '../../../template/shared';

export interface State extends EntityState {
  loading: boolean;
}

export interface OfferingsState {
  list: State;
}

export const diskOfferingReducers = {
  list: reducer,
};

export const adapter: EntityAdapter = createEntityAdapter({
  selectId: (item: DiskOffering) => item.id,
  sortComparer: false,
});

export const initialState: State = adapter.getInitialState({
  loading: false,
});

export function reducer(state = initialState, action: event.Actions): State {
  switch (action.type) {
    case event.LOAD_DISK_OFFERINGS_REQUEST: {
      return {
        ...state,
        loading: true,
      };
    }