chore: restore names in og

Author: alexdln

app/components/OgImage/BlogPost.vue

@@ -35,6 +35,20 @@ const formattedDate = computed(() => {
 
 const MAX_VISIBLE_AUTHORS = 2
 
+const getInitials = (name: string) =>
+  name
+    .split(' ')
+    .map(n => n[0])
+    .join('')
+    .toUpperCase()
+    .slice(0, 2)
+
+const visibleAuthors = computed(() => {
+  console.log('blog post 5', props.authors)
+  if (props.authors.length <= 3) return props.authors
+  return props.authors.slice(0, MAX_VISIBLE_AUTHORS)
+})
+
 const extraCount = computed(() => {
   console.log('blog post 6', props.authors)
   if (props.authors.length <= 3) return 0
@@ -94,6 +108,22 @@ const formattedAuthorNames = computed(() => {
       >
         <!-- Stacked avatars -->
         <span>
+          <span
+            v-for="(author, index) in visibleAuthors"
+            :key="author.name"
+            class="flex items-center justify-center rounded-full border border-[#050505] bg-[#1a1a1a] overflow-hidden w-12 h-12"
+            :style="{ marginLeft: index > 0 ? '-20px' : '0' }"
+          >
+            <img
+              v-if="author.avatar"
+              :src="author.avatar"
+              :alt="author.name"
+              class="w-full h-full object-cover"
+            />
+            <span v-else style="font-size: 20px; color: #666; font-weight: 500">
+              {{ getInitials(author.name) }}
+            </span>
+          </span>
           <!-- +N badge -->
           <span
             v-if="extraCount > 0"