Ngrx: how to combine simpe store pattern with entity state?

Question

Recently sorry if it's a duplicate of someone question. However I can't find solution for my problem.

I faced with a problem that I want to make my store state a little bit complex that ngrx/entity provides but I don't know how to make it properly.

Here are models in reducer that I have now:

export interface State extends EntityState<BagParametres> {
    SimpleBag: BagParametres;
}

export const adapter: EntityAdapter<BagParametres> = createEntityAdapter<BagParametres>({
    selectId: (params: BagParametres) => params.id
});

export const initialState: State = adapter.getInitialState({
    SimpleBag: defaultParams,
    RareBags: {
        ids: [],
        entities: []
    }
});

So what store I expect:

{
    SimpleBag: {
        //params
    },
    RareBags: {
        ids: [2, 3, 4 //, ...etc],
        entities: [
            { id: 2 //, etc params },
            { id: 3 //, etc params },
            { id: 4 //, etc params }
            // ... and so on
        ]
    }
}

What store I'm getting:

{
    SimpleBag: {
        id: 1
        // etc params
    },,
    RareBags: {
        ids: [],
        entities: []
    },
    ids: [2, 3, 4 //, ...etc],
    entities: [
        { id: 2 //, etc params },
        { id: 3 //, etc params },
        { id: 4 //, etc params }
        // ... and so on
    ]

}

How can I place ids and entities inside RareBags?

Answer 1

You are mixing up the state. What you want is 2 differents entities storages.

export interface State {
    simpleBag: BagParametres;
    rareBag: RareBagState
}

export interface RareBagState extends EntityState<BagParametres> {}

export const rareAdapter: EntityAdapter<BagParametres> = createEntityAdapter<BagParametres>({
    selectId: (params: BagParametres) => params.id
});

export const initialState: State = {
    simpleBag: defaultParams,
    rareBag: rareAdapter.getInitialState({})
};