React proptypes with oneof object key

Question

I call two endpoints that respond with inconsistent JSON structure.

In the 1^st, JSON returned looks like this:

{
payinData: [{...}, {...}, ...],
amount: 3000
}

And in the 2^nd:

{
payInData: [{...}, {...}, ...],
amount: 34500
}

The problem lies in the casing of object keys, i.e payinData in 1^st is different from payInData in 2^nd.

I want to use the same react component for data coming from these endpoints. I can handle this inconsistency in my code logic but don't know how to do the same in props validation with prop-types.

I have tried to do this:

MyComponent.propTypes = {
dataPayload: Proptypes.shape({
    [Proptypes.oneOf(["payInData", "payinData"])]: Proptypes.arrayOf(Proptypes.shape({})),
    amount: Proptypes.number
  }),
}

But I get linting errors:

Answer 1

I think our priority here should be:

1. To modify the API server to keep the responses unified
2. To modify the incoming requests (With a middleware or something like that)
3. To try to fix typescript declarations

Have you considered the first 2 options?