Fix Issue #4334: Add GitHub icon linking to git repository #5179
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
✅ Deploy Preview for up-for-grabs-test-bench ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
|
👋 I'm a robot checking the state of this pull request to save the human reviewers time. I don't see any changes under As you make changes to this pull request, I'll re-run these checks. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
🔧 What has been changed?
This PR adds a GitHub icon next to each project name on the homepage that links to its github repository page.
Clicking the GitHub icon takes the user directly to the root GitHub repository of the project (e.g., https://github.com/user/repo).
🎯 Why This Matters
Many projects listed on up-for-grabs.net currently link to a GitHub label like:
https://github.com/user/repo/issues/labels/good-first-issue
Therefore, it there could be a way to directly link the user to the GitHub repository, a quicker navigation could be offered to explore the full project on a technical term, especially to those potential contributor.
🛠️ How It Works
Extracted the repository root by splitting the project.upforgrabs.link and joining the first 5 segments:
project.upforgrabs.link.split('/').slice(0, 5).join('/')Since we couldn't directly get the url of many projects, parsing the link to its labelled issue could lead us to the main repo page.
Conditionally rendered the icon only if project.upforgrabs.link is defined
Added the icon using a github SVG from Simple Icons cdn
<img src="https://cdn.jsdelivr.net/npm/simple-icons@v10/icons/github.svg" alt="GitHub" width="20" height="20" style="vertical-align: middle;" />✅ Preview
