How to use the @ngrx/store.on function in @ngrx/store

ids: string[];
}

const initialState: State = {
  loaded: false,
  loading: false,
  ids: [],
};

export const reducer = createReducer(
  initialState,
  on(CollectionPageActions.loadCollection, state => ({
    ...state,
    loading: true,
  })),
  on(CollectionApiActions.loadBooksSuccess, (state, { books }) => ({
    loaded: true,
    loading: false,
    ids: books.map(book => book.id),
  })),
  // Supports handing multiple types of actions
  on(
    CollectionApiActions.addBookSuccess,
    CollectionApiActions.removeBookFailure,
    (state, { book }) => {
      if (state.ids.indexOf(book.id) > -1) {
        return state;
      }
      return {
        ...state,
        ids: [...state.ids, book.id],
      };

const initialState: State = {
  count: 0,
};

const featureReducer = createReducer(
  initialState,
  on(featureActions.incrementCount, (state) => ({
    ...state,
    count: state.count + 1,
  })),
  on(featureActions.decrementCount, (state) => ({
    ...state,
    count: state.count - 1,
  })),
  on(featureActions.setCount, (state, { count }) => ({ ...state, count })),
);

export function reducer(state: State | undefined, action: Action) {
  return featureReducer(state, action);
}

export const getCount = (state: State) => state.count;

const actions = require("org_tensorflow_tensorboard/tensorboard/components/tf_ng_tensorboard/core/core.actions");
    exports.CORE_FEATURE_KEY = 'core';
    const initialState = {
        activePlugin: null,
        plugins: {},
    };
    const ɵ0 = (state, { plugin }) => {
        return Object.assign({}, state, { activePlugin: plugin });
    }, ɵ1 = (state, { plugins }) => {
        const [firstPlugin] = Object.keys(plugins);
        let activePlugin = state.activePlugin !== null ? state.activePlugin : firstPlugin;
        return { activePlugin, plugins };
    };
    exports.ɵ0 = ɵ0;
    exports.ɵ1 = ɵ1;
    const reducer = store_1.createReducer(initialState, store_1.on(actions.changePlugin, ɵ0), store_1.on(actions.pluginsListingLoaded, ɵ1));
    function reducers(state, action) {
        return reducer(state, action);
    }
    exports.reducers = reducers;
    const selectCoreState = store_1.createFeatureSelector(exports.CORE_FEATURE_KEY);
    const ɵ2 = (state) => {
        return state.activePlugin;
    };
    exports.ɵ2 = ɵ2;
    exports.getActivePlugin = store_1.createSelector(selectCoreState, ɵ2);
    const ɵ3 = (state) => {
        return state.plugins;
    };
    exports.ɵ3 = ɵ3;
    exports.getPlugins = store_1.createSelector(selectCoreState, ɵ3);
});

export interface IngredientReducerState {
  entities: { [id: string]: Ingredient };
  loaded: boolean;
  loading: boolean;
}

export const initialState: IngredientReducerState = {
  entities: {},
  loaded: false,
  loading: false
};

const ingredientsReducerinternal = createReducer(
  initialState,
  on(signalrActions.receivedIngredientAdded, (state, { payload }) => {
    if (!!state.entities[payload.id]) {
      return state;
    }

    const ingredient = payload;
    const entities = {
      ...state.entities,
      [ingredient.id]: ingredient
    };

    return {
      ...state,
      entities
    };
  }),

return { ...state, currentSet };
  }),

  on(
    fromActions.updateAttachmentCaptionCompleteAction,
    (state, { attachment }) => {
      const attachments = state.currentSet.attachments.filter(
        existingAttachment => existingAttachment.id !== attachment.id
      );
      attachments.push(attachment);
      const currentSet = { ...state.currentSet, attachments };
      return { ...state, currentSet };
    }
  ),

  on(fromActions.removeAttachmentCompleteAction, (state, { attachmentId }) => {
    const attachments = state.currentSet.attachments.filter(
      attachment => attachment.id !== attachmentId
    );
    const currentSet = { ...state.currentSet, attachments };
    return { ...state, currentSet };
  }),

  on(fromActions.selectDatasetAction, (state, { dataset }) => {
    const alreadySelected = state.selectedSets.find(
      existing => dataset.pid === existing.pid
    );
    if (alreadySelected) {
      return state;
    } else {
      const selectedSets = state.selectedSets.concat(dataset);
      return { ...state, selectedSets };

return state;
    }

    const ingredient = payload;
    const entities = {
      ...state.entities,
      [ingredient.id]: ingredient
    };

    return {
      ...state,
      entities
    };
  }),

  on(signalrActions.receivedIngredientDeleted, (state, { payload }) => {
    if (!state.entities[payload]) {
      return state;
    }

    const { [payload]: removed, ...entities } = state.entities;

    return {
      ...state,
      entities
    };
  }),

  on(ingredientActions.addIngredientSuccess, (state, { payload }) => {
    const ingredient = payload;

    const entities = {

initialDatasetState,
  on(fromActions.fetchDatasetsCompleteAction, (state, { datasets }) => ({
    ...state,
    datasets
  })),

  on(
    fromActions.fetchFacetCountsCompleteAction,
    (state, { facetCounts, allCounts }) => ({
      ...state,
      facetCounts,
      totalCount: allCounts
    })
  ),

  on(fromActions.fetchDatasetCompleteAction, (state, { dataset }) => ({
    ...state,
    currentSet: dataset
  })),

  on(fromActions.prefillBatchCompleteAction, (state, { batch }) => ({
    ...state,
    batch
  })),
  on(fromActions.addToBatchAction, state => {
    const batchedPids = state.batch.map(dataset => dataset.pid);
    const addition = state.selectedSets.filter(
      dataset => batchedPids.indexOf(dataset.pid) === -1
    );
    const batch = [...state.batch, ...addition];
    return { ...state, batch };
  }),

on(upsertNote, (state, {note}) => adapter.upsertOne(note, state)),

  on(addNotes, (state, {notes}) => adapter.addMany(notes, state)),

  on(upsertNotes, (state, {notes}) => adapter.upsertMany(notes, state)),

  on(updateNote, (state, {note}) => adapter.updateOne(note, state)),

  on(updateNotes, (state, {notes}) => adapter.updateMany(notes, state)),

  on(deleteNote, (state, {id}) => adapter.removeOne(id, state)),

  on(deleteNotes, (state, {ids}) => adapter.removeMany(ids, state)),

  on(clearNotes, (state) => adapter.removeAll(state)),
);

export function noteReducer(
  state = initialNoteState,
  action: Action
): NoteState {
  return _reducer(state, action);
}

fromActions.fetchSampleDatasetsCountCompleteAction,
    (state, { count }) => ({ ...state, datasetsCount: count })
  ),

  on(fromActions.addSampleCompleteAction, (state, { sample }) => {
    const samples = state.samples;
    samples.push(sample);
    return { ...state, samples };
  }),

  on(fromActions.saveCharacteristicsCompleteAction, (state, { sample }) => ({
    ...state,
    currentSample: sample
  })),

  on(fromActions.addAttachmentCompleteAction, (state, { attachment }) => {
    const attachments = state.currentSample.attachments.filter(
      existingAttachment => existingAttachment.id !== attachment.id
    );
    attachments.push(attachment);
    const currentSample = { ...state.currentSample, attachments };
    return { ...state, currentSample };
  }),

  on(
    fromActions.updateAttachmentCaptionCompleteAction,
    (state, { attachment }) => {
      const attachments = state.currentSample.attachments.filter(
        existingAttachment => existingAttachment.id !== attachment.id
      );
      attachments.push(attachment);
      const currentSample = { ...state.currentSample, attachments };

export const reducer = createReducer(
  INIT_STATE,
  on(loadAllSuccess, (state, {contacts}) =>
    contactsAdapter.addAll(contacts, state)
  ),
  on(loadSuccess, (state, {contact}) =>
    contactsAdapter.upsertOne(contact, state)
  ),
  on(createSuccess, (state, {contact}) =>
    contactsAdapter.addOne(contact, state)
  ),
  on(updateSuccess, (state, {contact}) =>
    contactsAdapter.updateOne({id: contact.id, changes: contact}, state)
  ),
  on(removeSuccess, (state, {id}) =>
    contactsAdapter.removeOne(id, state)
  )
);

export const getContactById = (id: number) => (state: State) => state.entities[id];