[Meshery] Enhance the "Star the Repo" button with a unique GitHub CTA#7866
[Meshery] Enhance the "Star the Repo" button with a unique GitHub CTA#7866superezzdev wants to merge 3 commits into
Conversation
There was a problem hiding this comment.
Pull request overview
Note
Copilot was unable to run its full agentic suite in this review.
This PR updates the Meshery landing page “Star the Repo” CTA by introducing a reusable GitHubStarButton component and swapping out the previous generic GitHub button in the hero section.
Changes:
- Added a new
GitHubStarButtoncomponent that fetches/caches GitHub star counts and displays them inline. - Replaced the hero’s “Star the Repository” button with the new GitHub-specific CTA component.
- Performed minor JSX formatting changes in the Meshery section (headings/buttons).
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 9 comments.
| File | Description |
|---|---|
| src/sections/Meshery/index.js | Replaces the prior GitHub star button with GitHubStarButton and reformats some JSX. |
| src/components/GitHubStarButton/GitHubStarButton.js | Introduces the new reusable GitHub star CTA component with styles + star count fetch/cache. |
|
|
||
| useEffect(() => { | ||
| const cacheKey = `gh_stars_${repo.replace("/", "_")}`; | ||
| const cached = localStorage.getItem(cacheKey); |
| localStorage.setItem( | ||
| cacheKey, | ||
| JSON.stringify({ count, timestamp: Date.now() }), | ||
| ); |
| fetch(`https://api.github.com/repos/${repo}`) | ||
| .then((res) => { | ||
| if (!res.ok) throw new Error("GitHub API error"); | ||
| return res.json(); | ||
| }) | ||
| .then((data) => { | ||
| if (data.stargazers_count !== undefined) { | ||
| const count = data.stargazers_count; |
| setStars(count); | ||
| } | ||
| }) |
| .catch(() => { | ||
| // silent fail | ||
| }) | ||
| .finally(() => setLoading(false)); |
| &:focus { | ||
| outline: none; | ||
| } | ||
|
|
||
| &:focus-visible { | ||
| outline: 2px solid ${({ theme }) => theme.activeColor}; | ||
| outline-offset: 2px; | ||
| } |
| background: ${({ theme }) => theme.secondaryColor}; | ||
|
|
||
| position: relative; | ||
| transition: 450ms all; |
| <h1 className="heading-2"> | ||
| {" "} | ||
| <span className="heading-2"> collaboratively</span> | ||
| </h1> |
| <h1> | ||
| {" "} | ||
| Manage your clusters with features you won't find anywhere else. | ||
| </h1> |
Signed-off-by: superezz <248160976+superezz@users.noreply.github.com>
superezzdev
force-pushed
the
feat/star-repo-button-7859
branch
from
9193c34 to
b788148
Compare
|
Preview deployment for PR #7866 removed. This PR preview was automatically pruned because we keep only the 6 most recently updated previews on GitHub Pages to stay within deployment size limits. If needed, push a new commit to this PR to generate a fresh preview. |
leecalcote
left a comment
leecalcote
left a comment
There was a problem hiding this comment.
Thanks, @superezzdev.
- contrast is too low
- don't use the same saffron yellow
- don't use the same button style
- follow the instructions as outlined in the issue.
|
Thank You, @leecalcote . just tell me |
|
Hey @leecalcote , @Bhumikagarggg , @Sbragul26 tell me , is it looking now good ? 
|
Signed-off-by: superezz <248160976+superezz@users.noreply.github.com>
|
Thanks for the review! @leecalcote 
Improved the contrast. Looking forward to your feedback. |
|
Thanks for your suggestion @Sbragul26 |
Description
Fixe Issue: #7859.
Summary
This PR enhances the "Star the Repo" call-to-action on the Meshery landing page by replacing the previous generic button with a dedicated, reusable
GitHubStarButtoncomponent.Changes
GitHubStarButtoncomponent.Notes for Reviewers
Testing
Screenshots
Before --
After --
Signed commits