Add featured pull requests to team profile cards with GitHub REST API

[jwflory]

Summary

Provide a list of GitHub Pull Request URLs in team profile front matter, and add metadata about the Pull Requests to the team profile (by way of GitHub REST API)

Background

Is the improvement related to a problem? Describe the problem: Sometimes there are noteworthy Pull Requests we want to highlight by a specific Innovation Fund start-up. This can happen when a start-up implements a major feature as part of their roadmaps, or if they make an upstream contribution to another Open Source project. This is related to the design of team profiles (#13).

What does the improvement look like to you?: Previous wireframe designs suggested something like this for the summarized "card" view and the full team profile:

Describe any alternatives considered: This information could be manually embedded on each team profile, but this becomes difficult to maintain very quickly.

Details

This improvement is blocked by the initial implementation of team profiles as defined in #13.

The GitHub REST API should be used to gather metadata about a Pull Request and embed the relevant metadata into the team profile card and full profile. The featured Pull Requests should be defined in the front matter of a specific team profile.

For the content writer, all they should have to do to "feature" a Pull Request is specify it in the team profile's front matter, like below:

pulls:
  - https://github.com/example/pull1
  - https://github.com/example/pull2
  - https://github.com/example/pull3

Behind the scenes, the template should use GitHub's REST API to send a GET request for the relevant metadata from the Pull Requests and embed this in the template for the team profile card and the full profile page. The team profiles should render correctly even if zero, one, or many Pull Requests are provided for a specific team.

The API token for GitHub Pages (a.k.a. production deployments) can be stored safely in the Circle CI pipeline, but there should be a way to use a GitHub API token for local development too.

Outcome

Innovation Fund start-ups that complete exceptional work in GitHub Pull Requests can have their work and/or contributions highlighted in their team profile

[bl-aire]

Can I work on this? I don't understand it totally yet but I'm willing to research and learn as I work.

[jwflory]

@bl-aire This issue is complex and will take time to implement. But there are some nice new Hugo features that make it easier.

I think a good first step for this issue would be to try to hit the GitHub API from a test Hugo layout and see if you can grab different data from the GitHub API. I think data we will want about any Pull Request is the title, description, merge status, number of comments, and a link to the Pull Request. Depending how we specify the front-matter in a post, this could be filled into the layout based on what data we could pull from the GitHub API.

But for proof-of-concept, we could start with embedding any GitHub API data about Pull Requests into a page in Hugo.

@bl-aire What do you think? Does this make sense? Is it something you'd like to work on?

[bl-aire]

It makes sense. I have always been curious about how API's work but I've never had the opportunity to build or work with one. This would be an amazing learning experience for me so I am willing to start researching while I work on #69.
So when I am done I will attempt it.

But while learning, if I come across any problems, I will reach out for help.

[jwflory]

@bl-aire Sounds good – I'll keep this issue open, and let's assign you #69.

[bl-aire]

@jwflory hello,

My goal at the beginning of the week was to learn and understand how GitHub's API works and how I can achieve the goal for this issue. To try out ideas I had, I created a basic Hugo app and used Hugo's shortcodes feature to connect to GitHub's API and make a Get request.

I was able to get data about the unicef/inventory repository and reference it in my app's template...(a picture is available below).

My goal now is to make targeted Get requests for the:
-title
-description
-merge status
-number of comments
-link
....of Pull requests.

Team profiles are available in the inventory repository but this current issue is in the inventory-Hugo-theme repository.
Please how do I work on this issue? Would I have to create new team profiles on inventory-hugo-theme?

[Neha9849]

I think we should add the layout of team profiles in this repo. Currently we have this layouts in the inventory site but this makes it difficult to make changes as we have to make changes in the inventory repository .
By adding this layouts in this repo also benefits other downstreams which may want to use this profiles.
I am also facing this issue while working on PR #76.
@jwflory what are your thoughts?
Should i open an issue to make this changes so that it benefits both of us?

[bl-aire]

Hi @Neha9849,

I have had this on my mind for a while now. This approach was the first thought I had too.

I'm super relieved I can talk to someone that understands my current problem. Hoping we get a solution to it soon

[jwflory]

@bl-aire wrote…
My goal at the beginning of the week was to learn and understand how GitHub's API works and how I can achieve the goal for this issue. To try out ideas I had, I created a basic Hugo app and used Hugo's shortcodes feature to connect to GitHub's API and make a Get request.

Nice work 👍🏻

@bl-aire wrote…
My goal now is to make targeted Get requests for the: -title -description -merge status -number of comments -link ....of Pull requests.

Makes sense. Note that the Pull Requests in question would be specified with a URL in the front-matter somewhere.

@bl-aire wrote…
Team profiles are available in the inventory repository but this current issue is in the inventory-Hugo-theme repository. Please how do I work on this issue? Would I have to create new team profiles on inventory-hugo-theme?

@Neha9849 wrote…
I think we should add the layout of team profiles in this repo. Currently we have this layouts in the inventory site but this makes it difficult to make changes as we have to make changes in the inventory repository . By adding this layouts in this repo also benefits other downstreams which may want to use this profiles. I am also facing this issue while working on PR #76. @jwflory what are your thoughts? Should i open an issue to make this changes so that it benefits both of us?

This is a good observation. This is tied into #35. The goal is to bring the team profiles within the scope of the theme and not the Open Source Inventory site. It is probably best to hold off on this issue until the team profiles are absorbed into the theme. Then, grabbing those specific fields from the GitHub API and embedding them into the layout will become easier.

Does this make sense? The work in #35 will make this more straightforward too. It was opened here because ideally this work would live in this repo in the long-term.

[Neha9849]

Thanks @jwflory, i didn't see #35. I will be working on the UI part of rpg-report card from the inventory repo until this issue gets solved :)

[bl-aire]

@jwflory, noted.

Thank you

[Yavnikaa]

Since I am working on the Team Profiles layout, can I help with this as well?