From de57fec9b673edf61a240aacee82b091d19d374b Mon Sep 17 00:00:00 2001
From: Echo <ChaosExAnima@users.noreply.github.com>
Date: Thu, 2 Apr 2026 16:47:11 +0200
Subject: [PATCH] [Glitch] Profile redesign: Add alt to avatar and header

Port 59299c69ffce78bd4f2207ed3a7eb9484bd042a8 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
---
 app/javascript/flavours/glitch/api_types/accounts.ts         | 2 ++
 app/javascript/flavours/glitch/components/avatar.tsx         | 4 +++-
 .../features/account_timeline/components/account_header.tsx  | 5 +++--
 app/javascript/flavours/glitch/models/account.ts             | 2 ++
 4 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/app/javascript/flavours/glitch/api_types/accounts.ts b/app/javascript/flavours/glitch/api_types/accounts.ts
index 0a5e847e8e..1c340c387a 100644
--- a/app/javascript/flavours/glitch/api_types/accounts.ts
+++ b/app/javascript/flavours/glitch/api_types/accounts.ts
@@ -37,6 +37,7 @@ export interface BaseApiAccountJSON {
   acct: string;
   avatar: string;
   avatar_static: string;
+  avatar_description: string;
   bot: boolean;
   created_at: string;
   discoverable?: boolean;
@@ -50,6 +51,7 @@ export interface BaseApiAccountJSON {
   group: boolean;
   header: string;
   header_static: string;
+  header_description: string;
   id: string;
   last_status_at: string;
   locked: boolean;
diff --git a/app/javascript/flavours/glitch/components/avatar.tsx b/app/javascript/flavours/glitch/components/avatar.tsx
index f16ac8a4ac..030c577d49 100644
--- a/app/javascript/flavours/glitch/components/avatar.tsx
+++ b/app/javascript/flavours/glitch/components/avatar.tsx
@@ -13,6 +13,7 @@ interface Props {
   account:
     | Pick<Account, 'id' | 'acct' | 'avatar' | 'avatar_static'>
     | undefined; // FIXME: remove `undefined` once we know for sure its always there
+  alt?: string;
   size?: number;
   style?: React.CSSProperties;
   inline?: boolean;
@@ -25,6 +26,7 @@ interface Props {
 
 export const Avatar: React.FC<Props> = ({
   account,
+  alt = '',
   animate = autoPlayGif,
   size = 20,
   inline = false,
@@ -66,7 +68,7 @@ export const Avatar: React.FC<Props> = ({
       data-avatar-of={account && `@${account.acct}`}
     >
       {src && !error && (
-        <img src={src} alt='' onLoad={handleLoad} onError={handleError} />
+        <img src={src} alt={alt} onLoad={handleLoad} onError={handleError} />
       )}
 
       {counter && (
diff --git a/app/javascript/flavours/glitch/features/account_timeline/components/account_header.tsx b/app/javascript/flavours/glitch/features/account_timeline/components/account_header.tsx
index 350d480b12..a0d4ab1799 100644
--- a/app/javascript/flavours/glitch/features/account_timeline/components/account_header.tsx
+++ b/app/javascript/flavours/glitch/features/account_timeline/components/account_header.tsx
@@ -73,7 +73,7 @@ export const AccountHeader: React.FC<{
           modalType: 'IMAGE',
           modalProps: {
             src: account.avatar,
-            alt: '',
+            alt: account.avatar_description,
           },
         }),
       );
@@ -125,7 +125,7 @@ export const AccountHeader: React.FC<{
           {!suspendedOrHidden && (
             <img
               src={autoPlayGif ? account.header : account.header_static}
-              alt=''
+              alt={account.header_description}
               className='parallax'
             />
           )}
@@ -152,6 +152,7 @@ export const AccountHeader: React.FC<{
             >
               <Avatar
                 account={suspendedOrHidden ? undefined : account}
+                alt={account.avatar_description}
                 size={80}
               />
             </a>
diff --git a/app/javascript/flavours/glitch/models/account.ts b/app/javascript/flavours/glitch/models/account.ts
index ba01d1b325..1fe8341022 100644
--- a/app/javascript/flavours/glitch/models/account.ts
+++ b/app/javascript/flavours/glitch/models/account.ts
@@ -62,6 +62,7 @@ export const accountDefaultValues: AccountShape = {
   acct: '',
   avatar: '',
   avatar_static: '',
+  avatar_description: '',
   bot: false,
   created_at: '',
   discoverable: false,
@@ -78,6 +79,7 @@ export const accountDefaultValues: AccountShape = {
   group: false,
   header: '',
   header_static: '',
+  header_description: '',
   id: '',
   last_status_at: '',
   locked: false,