Getting the list of pull requests

[00:00 - 02:13] Getting the list of pull requests. Inside of the SRC pull requests create a new file list pull requests TSX here. We'll want to define the GraphQL query first We want to call the list pull request query We want to get a viewer with a pull request list limited by first 100 and for each node we get title and URL After we have the query defined we can run the code generator You can find the code for it in the text version of this lesson run the generator import the generated type from the types module and then define the list pull request component expert const list pull requests here we want to call use query providing the list pull requests type that we got from the Apollo we'll get loading error and data Like for all the queries we used previously. Let's process the loading state if loading We're gonna show a panel with loading text then let's process an error if error here will return the JSON representation of the error object and now if we have the data We want to render the regular layout return render the panel inside of it render the text It should say list pull requests render the pull request list here. We pass the list ref We define it as a ref of type any pass the items It's gonna be pull requests. We will calculate them from the data const pull requests equals Data viewer pull requests nodes now we map through them and For each pull request we return its title. We'll have an empty array as a fall back Define the list action handler here. We call open with the URL of the pull request where title matches the content of the element. Okay Now define the use effect that will focus on our list when the data changes go to pull requests Remove the old mock component and import the new list pull requests that we've just defined launch the application go to pull requests and you should be able to list the pull requests