feat: include commiter's avatar in LastUpdated footer (#687)

Author: Toffikk

src/components/overrides/LastUpdated.astro

@@ -1,5 +1,6 @@
 ---
 import { REPO, getCommitInfo } from "../../utils/git";
+import { Image } from "astro:assets";
 
 const { lang, lastUpdated } = Astro.locals.starlightRoute;
 const filePath = Astro.locals.starlightRoute.entry.filePath;
@@ -21,7 +22,20 @@ const info = await getCommitInfo(filePath);
       </span>{" "}
       {info && (
         <span class="nowrap">
-          by <a href={info.committer.href}>{info.committer.name}</a>
+          by{" "}
+          <a href={info.committer.href}>
+            {info.committer.avatar && (
+              <Image
+                src={info.committer.avatar}
+                alt={info.committer.name}
+                class="avatar"
+                width="18"
+                height="18"
+                loading="lazy"
+              />
+            )}
+            {info.committer.name}
+          </a>{" "}
           in <a href={`https://github.com/${REPO}/commit/${info.hash}`}>{info.hash.substring(0, 7)}</a>
         </span>
       )}
@@ -38,4 +52,11 @@ const info = await getCommitInfo(filePath);
   .nowrap {
     white-space: nowrap;
   }
+
+  .avatar {
+    vertical-align: middle;
+    border-radius: 50%;
+    margin-left: 1px;
+    margin-right: 4px;
+  }
 </style>

src/utils/git.ts

@@ -3,6 +3,7 @@ import { execSync } from "child_process";
 export interface CommitterInfo {
   name: string;
   href: string;
+  avatar?: string;
 }
 
 export interface CommitInfo {
@@ -47,6 +48,7 @@ export const getCommitInfo = async (filePath: string): Promise<CommitInfo | null
   if (res.ok) {
     const commit = await res.json();
     info.href = commit.author.html_url;
+    info.avatar = commit.author.avatar_url;
   }
 
   cache.set(email, info);