Search code examples
angulartypescripttypescript-typingsngrxngrx-store

How to type branches of normalized state tree?


I have a question about typing normalized state tree in ngrx library. For example:

const initialState: State = {
    dependencies: {
        1: {
            id: 1,
            name: "dependency1",
            type: "basic"
        },
        2: {
            id: 2,
            name: "dependency2",
            type: "complex"
        },
        3: {
            id: 3,
            name: "dependency3",
            type: "basic"
        }
    },
    dependencyIds: [1, 2, 3]
}

Ok, so we can declare dependencyIds as number[] in State interface, and it's pretty clear. But question is: Is there a way to type dependecies as Object, within every parameters are a Dependency objects?

smth like:

export interface State {
    dependencies: any,  <--- is there a {Dependency} instead of 'any' type, or sth?
    dependencyIds: number[]
}

Solution

  • Yes, it is possible. You can use dependencies: { [key: number]: {...}

    interface State {
        dependencies: { [key: number]: {
            id: number,
            name: string,
            type: "basic" | "complex"
        } }
        dependencyIds: number[]
    }
    

    Or with a subsequent interface:

    interface State {
        dependencies: { [key: number]: Dependency},
        dependencyIds: number[];
    }
    
    interface Dependency {
        id: number,
        name: string,
        type: "basic" | "complex"
    }