React ProptTypes - object of objects

Question

I have an object, which has dynamic keys(but the values are objects which have same keys):

menu = {
    dogs: {
        name: 'some name1',
        url: 'google.com'
    },
    cats: {
        name: 'some name2',
        url: 'facebook.com'
    },
    parrots: {
        name: 'some name3',
        url: 'linkedin.com'
    }
}

Suppose I have a component:

const Menu = ({menu}) => (
    <div>        
        {
            Object.keys(menu).map(key => (
                <div>{menu.name}</div>
            ))
        }
    </div>
);

How to validate the menu prop using PropTypes?

Answer 1

You could do the following using PropTypes.objectOf():

propTypes: {
  menu: PropTypes.objectOf(
    PropTypes.shape({
      name: PropTypes.string.isRequired,
      url: PropTypes.string.isRequired,
    })
  ).isRequired
}