refactor: rename useAuthorProfiles to useBlueskyAuthorProfiles for clarity

Add a comment to hopefully clarify how useBlueskyAuthorProfiles works with
the bluesky-author-profiles server end point.

Author: jonathanyeong

app/components/AuthorList.vue

@@ -6,7 +6,7 @@ const props = defineProps<{
   variant?: 'compact' | 'expanded'
 }>()
 
-const { resolvedAuthors } = useAuthorProfiles(props.authors)
+const { resolvedAuthors } = useBlueskyAuthorProfiles(props.authors)
 </script>
 
 <template>

app/components/OgImage/BlogPost.vue

@@ -15,7 +15,7 @@ const props = withDefaults(
   },
 )
 
-const { resolvedAuthors } = useAuthorProfiles(props.authors)
+const { resolvedAuthors } = useBlueskyAuthorProfiles(props.authors)
 
 const formattedDate = computed(() => {
   if (!props.date) return ''

app/composables/useAuthorProfiles.ts

@@ -0,0 +1,36 @@
+import type { Author, ResolvedAuthor } from '#shared/schemas/blog'
+
+/**
+ * Fetches author avatar URLs and profile links from the Bluesky API (AT Protocol).
+ *
+ * Makes a server-side request to `/api/atproto/bluesky-author-profiles`, which looks up
+ * each author's Bluesky profile to retrieve their avatar. Results are cached for 1 day.
+ *
+ * While the fetch is pending (or if it fails), returns authors with `avatar: null`
+ * and a constructed profile URL as fallback.
+ */
+export function useBlueskyAuthorProfiles(authors: Author[]) {
+  const authorsJson = JSON.stringify(authors)
+
+  const { data } = useFetch('/api/atproto/bluesky-author-profiles', {
+    query: {
+      authors: authorsJson,
+    },
+  })
+
+  const resolvedAuthors = computed<ResolvedAuthor[]>(
+    () => data.value?.authors ?? withoutBlueskyData(authors),
+  )
+
+  return {
+    resolvedAuthors,
+  }
+}
+
+function withoutBlueskyData(authors: Author[]): ResolvedAuthor[] {
+  return authors.map(author => ({
+    ...author,
+    avatar: null,
+    profileUrl: author.blueskyHandle ? `https://bsky.app/profile/${author.blueskyHandle}` : null,
+  }))
+}