1

Problem decryption: a property of ngrx state interface are represented by other interface and this interface has nested interface too. I have an action that receive new value for nested property from server and when I try to assing new value in reducer I got a error.

Code ->

Ngrx state represented by follow structure:

export interface StockCardState {
    load: {
        isLoading: boolean;
        isLoaded: boolean;
    }
    current: StockCardInterface | null;
    resentViewed: StockCardInterface[] | null;
}
  
const initialState: StockCardState = {
    load: {
        isLoading: false,
        isLoaded: false,
    },
    current: null,
    resentViewed: null
}

The StockCardInterface contains next properties:

export interface StockCardInterface {
   id: number;
    isin: string;
    symbol: string;
    shortName: string;
    longName: string;
    searchEnable: boolean;
    favourite: boolean;
    profile: StockProfileInterface[];
    history: StockHistoryInterface[];
    historySplit: StockHistorySplitInterface;
    comments: StockCommentInterface[];
  }

And the last interface is a StockCommentIntreface that make me trouble has next structure:

export interface StockCommentInterface {
    id: number;
    date: string;
    userid: string;
    userName: string;
    comment: string;
}

When user add a new comment, a corresponding action will be dispatched and through an ngrx effect it will be send and store on server side. If server response success it will bring back updated comment array and dispatch new action createStockCommentSuccess that has in an argument StockCommentInterface[]. The reducer looks like that:

on( fromStockCardAction.createStockCommentSuccess, (state, { comments }): StockCardState => ({
        ...state,
        load: {
            ...state.load,
             isLoading: false,
             isLoaded: true
        },
        current: {    <=problem is here
            ...state.current,
            comments: comments
        }
        })

Problem appears when i try to assing an updated comment array to the 'current' StockCardInterface that was received from server.

Error message:

error message

As i understood problem appears because of state 'current' property use an 'Interface | null ' declaration and it is not good solution. Please give some good practice advice how to solve this issue. Thank you!

Tanay
  • 871
  • 1
  • 6
  • 12

1 Answers1

0

As the error points out, the state interface expect the id to be a number. The interface of the action does not, as id can be a number or can be undefined.

Either update the interface, create a new one, or verify that id is not undefined in the reducer.

timdeschryver
  • 14,415
  • 1
  • 19
  • 32