How to create an interface for an API response with dynamic keys

Viewed 17

I have an endpoint that returns a response in the format:

{
    "associations": 
    {
        "rit-923949": 
        {
            "archived": false,
            "associationId": "kdk-93002",
            "associationType: "SUBORDINATION",
            "associationRole: "IS_SUPERIOR_OF",
            "endEntityId": "kfk-94939",
            "startEntityId": "kdk-83894"
        }
        "rit-86465": 
        {
            "archived": false,
            "associationId": "kdk-53589",
            "associationType: "SUBORDINATION",
            "associationRole: "IS_SUPERIOR_OF",
            "endEntityId": "kfk-23245",
            "startEntityId": "kdk-95790"
        }
        "rit-07214": 
        {
            "archived": false,
            "associationId": "kdk-97166",
            "associationType: "SUBORDINATION",
            "associationRole: "IS_SUPERIOR_OF",
            "endEntityId": "kfk-99866",
            "startEntityId": "kdk-22546"
        }
    }
}

How can I create an interface in my react application to handle this type of response when the associations object has dynamic values for its keys ("rit-923949", "rit-86465", "rit-07214")?

I know if the response was just

{
    "archived": false,
    "associationId": "kdk-93002",
    "associationType: "SUBORDINATION",
    "associationRole: "IS_SUPERIOR_OF",
    "endEntityId": "kfk-94939",
    "startEntityId": "kdk-83894"
}

I could do something like this:

export default interface IAssociations {
    archived: boolean,
    associationId: string,
    associationType: string,
    associationRole: string,
    endEntityId: string,
    startEntityId: string
}

but I'm not quite sure how to handle the dynamic key

0 Answers
Related