0

I have three services that return same type of objects based on different actions. How can I hold all the objects on feature store with a clean separation.

Action1: LOAD_CANDIDATES



    I have an effect that invokes below service call

    public getCandidates(): Observable {
        const url = 'Candidates Url';
        return this.http.get(url);
    }

Action2:LOAD_MATCHED_CANDIDATES



    I have an effect that invokes below service call

    public getMatchingCandidates(conditions: any): Observable 
    {
        const url = 'Matched Candidates Url';
        return this.http.get(url);
    }

Action3: LOAD_ASSIGNED_CANDIDATES



    I have an effect that invokes below service call

    public getAssignedCandidates(id: number): Observable {
        const url = 'Assigned candidates url';
        return this.http.get(url);
    }

I do have success and fail effects for each of them.



    Candidate reducer :

    export const reducers = {
      search: fromSearch.reducer,
      candidates: fromCandidates.reducer,
      collection: fromCollection.reducer
    };

    Here is the injection of feature store to module

    StoreModule.forFeature('candidates', combineReducers(fromStore.reducers))

How can I have all, matched and assigned candidates at same time on the feature store with clean separation that specifies respective object type(i.e. these are matched, these are assigned)

  • 1) do you ever show more than one of these collections on screen at the same time? 2) are those collections somehow related or completely unrelated? when i say 'related' i mean - is any of the collections a subset of the other(s)? – dee zg May 22 '18 at 06:19

1 Answers1

0

To achieve this, you need to slice the corresponding state with multiple properties and handle it in the reducer. refer below code for sample implementation

declare the 'candidates' as of the type "CandidateState"

export interface CandidateState {
  allcandidates: Array<Object>;
  matchedcandidates: Array<Object>;
  assignedcandidates: Array<Object>;
} 

now compose your candidate reducer as below

export const candidateInitialState: fromState.CandidateState = {
  allcandidates: [],
  matchedcandidates: [],
  assignedcandidates: []
};

export const reducer = (
  state: fromState.CandidateState = candidateInitialState,
  action: fromAction.CandidateActions
): fromUserState.CandidateState => {
  switch (action.type) {
    case fromAction.LOAD_CANDIDATES: {
      return {
        ...state,
        allcandidates: action.allCandidatesData
      };
    }
    case fromAction.LOAD_MATCHED_CANDIDATES: {
      return {
        ...state,
        matchedcandidates: action.matchedCandidatesData
      };
    }
    case fromAction.LOAD_ASSIGNED_CANDIDATES: {
      return {
        ...state,
        assignedcandidates: action.assignedCandidatesData
      };
    }

    default:
      return state;
  }
};
mayflower
  • 24
  • 1
  • 4