diff --git a/src/components/GitHubUserCard.astro b/src/components/GitHubUserCard.astro new file mode 100644 index 0000000..9eee58d --- /dev/null +++ b/src/components/GitHubUserCard.astro @@ -0,0 +1,45 @@ +--- +import { fetchGitHubUser } from '../utils/github' + +interface Props { + username: string +} + +const { username } = Astro.props + +const cleanUsername = username.startsWith('@') ? username.slice(1) : username +const user = await fetchGitHubUser(cleanUsername) +const githubUrl = `https://github.com/${cleanUsername}` +--- + +{ + user ? ( + + {user.name + + {user.name || user.login} + + + ) : ( + + + {username} + + ) +} diff --git a/src/pages/articles/[slug].astro b/src/pages/articles/[slug].astro index 5548f53..95a0cec 100644 --- a/src/pages/articles/[slug].astro +++ b/src/pages/articles/[slug].astro @@ -1,6 +1,7 @@ --- import DocsLayout from '../../layouts/DocsLayout.astro' import ShareButtons from '../../components/ShareButtons.astro' +import GitHubUserCard from '../../components/GitHubUserCard.astro' import { getCollection, render } from 'astro:content' import { SITE } from '../../config.mjs' import { getLangFromUrl, t } from '../../i18n/index.ts' @@ -63,7 +64,6 @@ const jsonLdArticle = { const homeLabel = t(labels, 'article.home') const articlesLabel = t(labels, 'nav.articles') -const byLabel = t(labels, 'article.by') const onThisPageLabel = t(labels, 'article.onThisPage') --- @@ -118,9 +118,13 @@ const onThisPageLabel = t(labels, 'article.onThisPage')

{article.data.title}

-
- {byLabel} {article.data.author} +
+ + · {article.data.date} + · {article.data.views.toLocaleString()} diff --git a/src/pages/en/articles/[slug].astro b/src/pages/en/articles/[slug].astro index 2afe9b4..658b85c 100644 --- a/src/pages/en/articles/[slug].astro +++ b/src/pages/en/articles/[slug].astro @@ -1,6 +1,7 @@ --- import DocsLayout from '../../../layouts/DocsLayout.astro' import ShareButtons from '../../../components/ShareButtons.astro' +import GitHubUserCard from '../../../components/GitHubUserCard.astro' import { getCollection, render } from 'astro:content' import { SITE } from '../../../config.mjs' import { t } from '../../../i18n/index.ts' @@ -64,7 +65,6 @@ const jsonLdArticle = { const homeLabel = t(labels, 'article.home') const articlesLabel = t(labels, 'nav.articles') -const byLabel = t(labels, 'article.by') const onThisPageLabel = t(labels, 'article.onThisPage') --- @@ -117,9 +117,13 @@ const onThisPageLabel = t(labels, 'article.onThisPage')

{article.data.title}

-
- {byLabel} {article.data.author} +
+ + · {article.data.date} + · {article.data.views.toLocaleString()} diff --git a/src/utils/github.ts b/src/utils/github.ts new file mode 100644 index 0000000..4cde14f --- /dev/null +++ b/src/utils/github.ts @@ -0,0 +1,34 @@ +export interface GitHubUser { + login: string + avatar_url: string + html_url: string + name: string | null + bio: string | null + company: string | null + blog: string + public_repos: number + followers: number + following: number +} + +export async function fetchGitHubUser(username: string): Promise { + const cleanUsername = username.startsWith('@') ? username.slice(1) : username + + try { + const response = await fetch(`https://api.github.com/users/${cleanUsername}`, { + headers: { + Accept: 'application/vnd.github.v3+json', + }, + }) + + if (!response.ok) { + console.error(`GitHub API error: ${response.status} for user ${cleanUsername}`) + return null + } + + return await response.json() + } catch (error) { + console.error(`Failed to fetch GitHub user ${cleanUsername}:`, error) + return null + } +}