Passing the value of page from Pagination.jsx to App.jsx

While I'm trying to get in to React, I started a project and got stuck.

I've pushed it to CodeSandBox: codesandbox.io/s/523r34o39n

Maybe some one can help me to find the issue. Bellow I explain what the app should do.

The user types a query in an input-box inside SearchBar.jsx The SearchBar component passes the query to App.jsx and fires up fetchPhotos function, which starts an API request.

To sort out pagination, the App.jsx imports Pagination.jsx, which calculates the number of pictures in the response and displays pagination buttons.

The above works.

But now if you click on a pagination button, the value for page from Pagination component should be passed to App.jsx and so to fetchPhotos function (runs the API request).

I guess the problem is that the value of page never finds its way to App.jsx and so the API request is missing the value of page.

I spent hours but couldn't find a way to fix it, due to lack of knowledge. Could you please point me to the right direction and show me what is wrong with the code?