React Higher Order Components Function argument

Question

I don't understand the HOC example in the react docs when it comes to passing in the second argument, selectData. How is that function being passed and utilized,like just general flow of what is happening with selectData?

 const CommentListWithSubscription = withSubscription( CommentList, (DataSource) => DataSource.getComments() );

 // This function takes a component... function withSubscription(WrappedComponent, selectData) { //...and returns another component... return class extends React.Component { constructor(props) { super(props); this.handleChange = this.handleChange.bind(this); this.state = { data: selectData(DataSource, props) }; }

Answer 1

I finally understood. DataSource is a global. Calling SelectData will trigger the callback provided by the arrow function ie DataSource.getComments().