Add homepage latest release badge - #277
Conversation
|
@Arteiimis is attempting to deploy a commit to the waruqi's projects Team on Vercel. A member of the Team first needs to authorize it. |
✅ Deploy Preview for mellow-creponne-9cce3d ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
This pull request introduces a dynamic release badge for the home page by fetching the latest release information from the GitHub API. Key changes include a new script to generate release data, a dedicated Vue component for the badge, and integration into the VitePress theme layout. The review feedback highlights several improvement opportunities: refining the hero configuration types and rendering logic to handle VitePress's object-based name property, adopting a more robust method for home page detection via frontmatter, and implementing a time-based cache to prevent hitting GitHub API rate limits during frequent builds.
| type HeroConfig = { | ||
| name?: string | ||
| text?: string | ||
| tagline?: string | ||
| } |
There was a problem hiding this comment.
The HeroConfig type for the name property is too restrictive. In VitePress, the hero name can be either a string or an object containing text and an optional tag. If an object is provided in the configuration, the current implementation will render [object Object] because of the v-html binding on line 40.
type HeroConfig = {
name?: string | { text: string; tag?: string }
text?: string
tagline?: string
}
| <template> | ||
| <h1 class="heading"> | ||
| <span class="xmake-hero-name-row"> | ||
| <span v-if="hero.name" v-html="hero.name" class="name clip"></span> |
There was a problem hiding this comment.
Handle cases where hero.name is an object (a standard VitePress configuration pattern) to ensure the text is correctly extracted for rendering, preventing [object Object] from appearing in the UI.
<span v-if="hero.name" v-html="typeof hero.name === 'string' ? hero.name : hero.name.text" class="name clip"></span>
| const isHomePage = computed(() => { | ||
| return page.value.relativePath === 'index.md' || page.value.relativePath === 'zh/index.md' | ||
| }) |
There was a problem hiding this comment.
The current check for the home page is restricted to specific file paths (index.md and zh/index.md). This approach is brittle as it will break if new languages are added or if the home page file is named differently. It is more idiomatic and robust to rely on the layout: home property in the frontmatter, which is the standard VitePress way to identify a home page.
const isHomePage = computed(() => page.value.frontmatter.layout === 'home')| const cachedRelease = readCachedRelease() | ||
|
|
||
| try { |
There was a problem hiding this comment.
The script fetches the latest release data from the GitHub API on every build or dev server start. Unauthenticated requests to the GitHub API are rate-limited to 60 per hour. To avoid hitting this limit during local development or frequent CI builds, consider adding a simple time-based cache check to skip fetching if the data was updated recently (e.g., within the last hour).
const cachedRelease = readCachedRelease()
const cacheAge = Date.now() - new Date(cachedRelease.fetchedAt || 0).getTime()
if (cacheAge < 3600000 && cachedRelease.tagName) {
console.log('Using cached release data: ' + cachedRelease.tagName)
return
}
try {
2 participants
Add a homepage badge synced with the latest xmake release.