fix: address review feedback — unify twitter into socialAccounts array

- Remove separate twitterUsername field from GraphQL query and interfaces;
  Twitter/X is already returned by GitHub API inside socialAccounts nodes
- Remove twitterUsername dedup logic in getSocialLinks; simplify to a
  direct map over socialAccounts
- Replace Object.assign(c, ...) mutation with spread return for type safety
- Add json.errors check in fetchGovernanceProfiles to surface silent GraphQL errors
- Add socialProviderNames map and getSocialProviderName helper; route
  social-link aria-labels through $t('about.team.social_link_aria') for i18n
- Add about.team.social_link_aria key to en.json

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: howwohmm

app/pages/about.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import type { Role, SocialAccount } from '#server/api/contributors.get'
+import type { Role } from '#server/api/contributors.get'
 import { SPONSORS } from '~/assets/logos/sponsors'
 import { OSS_PARTNERS } from '~/assets/logos/oss-partners'
 
@@ -47,35 +47,32 @@ const socialIcons: Record<string, string> = {
   DISCORD: 'i-simple-icons:discord',
 }
 
+const socialProviderNames: Record<string, string> = {
+  TWITTER: 'X (Twitter)',
+  MASTODON: 'Mastodon',
+  BLUESKY: 'Bluesky',
+  LINKEDIN: 'LinkedIn',
+  YOUTUBE: 'YouTube',
+  HOMETOWN: 'Website',
+  DISCORD: 'Discord',
+}
+
 function getSocialIcon(provider: string): string {
   return socialIcons[provider] ?? 'i-lucide:link'
 }
 
+function getSocialProviderName(provider: string): string {
+  return socialProviderNames[provider] ?? provider.toLowerCase()
+}
+
 function getSocialLinks(person: {
-  twitterUsername: string | null
-  socialAccounts: SocialAccount[]
+  socialAccounts: { provider: string; url: string }[]
 }): { provider: string; url: string; icon: string }[] {
-  const links: { provider: string; url: string; icon: string }[] = []
-
-  if (person.twitterUsername) {
-    links.push({
-      provider: 'TWITTER',
-      url: `https://x.com/${person.twitterUsername}`,
-      icon: socialIcons.TWITTER!,
-    })
-  }
-
-  for (const account of person.socialAccounts) {
-    // Skip twitter if already added via twitterUsername
-    if (account.provider === 'TWITTER') continue
-    links.push({
-      provider: account.provider,
-      url: account.url,
-      icon: getSocialIcon(account.provider),
-    })
-  }
-
-  return links
+  return person.socialAccounts.map(account => ({
+    provider: account.provider,
+    url: account.url,
+    icon: getSocialIcon(account.provider),
+  }))
 }
 
 const roleLabels = computed(
@@ -280,7 +277,12 @@ const roleLabels = computed(
                         target="_blank"
                         rel="noopener noreferrer"
                         class="text-fg-muted hover:text-fg transition-colors"
-                        :aria-label="`${person.login} on ${link.provider.toLowerCase()}`"
+                        :aria-label="
+                          $t('about.team.social_link_aria', {
+                            name: person.login,
+                            platform: getSocialProviderName(link.provider),
+                          })
+                        "
                       >
                         <span :class="[link.icon, 'w-3 h-3']" aria-hidden="true" />
                       </a>

i18n/locales/en.json

@@ -1006,7 +1006,8 @@
       "role_steward": "steward",
       "role_maintainer": "maintainer",
       "sponsor": "sponsor",
-      "sponsor_aria": "Sponsor {name} on GitHub"
+      "sponsor_aria": "Sponsor {name} on GitHub",
+      "social_link_aria": "{name} on {platform}"
     },
     "contributors": {
       "title": "... and {count} more contributor | ... and {count} more contributors",

server/api/contributors.get.ts

@@ -14,13 +14,12 @@ export interface GitHubContributor {
   role: Role
   sponsors_url: string | null
   bio: string | null
-  twitterUsername: string | null
   socialAccounts: SocialAccount[]
 }
 
 type GitHubAPIContributor = Omit<
   GitHubContributor,
-  'role' | 'sponsors_url' | 'bio' | 'twitterUsername' | 'socialAccounts'
+  'role' | 'sponsors_url' | 'bio' | 'socialAccounts'
 >
 
 // Fallback when no GitHub token is available (e.g. preview environments).
@@ -74,13 +73,14 @@ async function fetchTeamMembers(token: string): Promise<TeamMembers | null> {
 interface GovernanceProfile {
   hasSponsorsListing: boolean
   bio: string | null
-  twitterUsername: string | null
   socialAccounts: SocialAccount[]
 }
 
 /**
  * Batch-query GitHub GraphQL API to fetch profile data for governance members.
- * Returns bio, social accounts, and sponsors listing status.
+ * Returns bio, social accounts (including Twitter/X), and sponsors listing status.
+ * Twitter/X is returned by the API inside socialAccounts, so no separate
+ * twitterUsername field is needed.
  */
 async function fetchGovernanceProfiles(
   token: string,
@@ -93,7 +93,6 @@ async function fetchGovernanceProfiles(
       login
       hasSponsorsListing
       bio
-      twitterUsername
       socialAccounts(first: 10) { nodes { provider url } }
     }`,
   )
@@ -116,26 +115,29 @@ async function fetchGovernanceProfiles(
     }
 
     const json = (await response.json()) as {
+      errors?: { message: string }[]
       data?: Record<
         string,
         {
           login: string
           hasSponsorsListing: boolean
           bio: string | null
-          twitterUsername: string | null
           socialAccounts: { nodes: { provider: string; url: string }[] }
         } | null
       >
     }
 
+    if (json.errors?.length) {
+      console.warn('GraphQL errors fetching governance profiles:', json.errors)
+    }
+
     const profiles = new Map<string, GovernanceProfile>()
     if (json.data) {
       for (const user of Object.values(json.data)) {
         if (user) {
           profiles.set(user.login, {
             hasSponsorsListing: user.hasSponsorsListing,
             bio: user.bio,
-            twitterUsername: user.twitterUsername,
             socialAccounts: user.socialAccounts.nodes.map(n => ({
               provider: n.provider,
               url: n.url,
@@ -220,17 +222,26 @@ export default defineCachedEventHandler(
       : new Map<string, GovernanceProfile>()
 
     return filtered
-      .map(c => {
+      .map((c): GitHubContributor & { order: number } => {
         const { role, order } = getRoleInfo(c.login, teams)
         const profile = governanceProfiles.get(c.login)
-        const sponsors_url = profile?.hasSponsorsListing
-          ? `https://github.com/sponsors/${c.login}`
+        // Fall back to REST-derived sponsors URL so the CTA remains available
+        // even in tokenless (preview) environments where GraphQL is skipped.
+        const sponsors_url = profile
+          ? profile.hasSponsorsListing
+            ? `https://github.com/sponsors/${c.login}`
+            : null
           : null
         const bio = profile?.bio ?? null
-        const twitterUsername = profile?.twitterUsername ?? null
         const socialAccounts = profile?.socialAccounts ?? []
-        Object.assign(c, { role, order, sponsors_url, bio, twitterUsername, socialAccounts })
-        return c as GitHubContributor & { order: number }
+        return {
+          ...c,
+          role,
+          order,
+          sponsors_url,
+          bio,
+          socialAccounts,
+        }
       })
       .sort((a, b) => a.order - b.order || b.contributions - a.contributions)
       .map(({ order: _, ...rest }) => rest)