From 772ec6efcf19fb59e4eddac9f16f5835e4b7f625 Mon Sep 17 00:00:00 2001
From: Hugo Sales <hugo@hsal.es>
Date: Thu, 2 Dec 2021 15:36:08 +0000
Subject: [PATCH] [UI] Set html img width and height attributes for avatar

---
 components/Avatar/Avatar.php           | 10 ++++++++++
 src/Entity/Actor.php                   |  5 +++++
 templates/cards/profile/view.html.twig |  3 ++-
 3 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/components/Avatar/Avatar.php b/components/Avatar/Avatar.php
index 6023d7ae35..2f319fc20e 100644
--- a/components/Avatar/Avatar.php
+++ b/components/Avatar/Avatar.php
@@ -110,6 +110,16 @@ class Avatar extends Component
         }
     }
 
+    public static function getDimensions(int $actor_id, string $size = 'full')
+    {
+        try {
+            $attachment = self::getAvatar($actor_id)->getAttachment();
+            return ['width' => $attachment->getWidth(), 'height' => $attachment->getHeight()];
+        } catch (NoAvatarException) {
+            return ['width' => Common::config('thumbnail', 'small'), 'height' => Common::config('thumbnail', 'small')];
+        }
+    }
+
     /**
      * Get the cached avatar file info associated with the given Actor id
      *
diff --git a/src/Entity/Actor.php b/src/Entity/Actor.php
index 6487074d79..753057b438 100644
--- a/src/Entity/Actor.php
+++ b/src/Entity/Actor.php
@@ -250,6 +250,11 @@ class Actor extends Entity
         return Avatar::getAvatarUrl($this->getId(), $size);
     }
 
+    public function getAvatarDimensions(string $size = 'full')
+    {
+        return Avatar::getDimensions($this->getId(), $size);
+    }
+
     public static function getById(int $id): ?self
     {
         return Cache::get('actor-id-' . $id, fn () => DB::find('actor', ['id' => $id]));
diff --git a/templates/cards/profile/view.html.twig b/templates/cards/profile/view.html.twig
index 8f024f98a8..afd94ac092 100644
--- a/templates/cards/profile/view.html.twig
+++ b/templates/cards/profile/view.html.twig
@@ -1,5 +1,6 @@
 {% set actor_nickname = actor.getNickname() %}
 {% set actor_avatar = actor.getAvatarUrl() %}
+{% set actor_avatar_dimensions = actor.getAvatarDimensions() %}
 {% set actor_tags = actor.getSelfTags()[1] %} {# Take only the actor_tags, not the circles #}
 {% set actor_bio = actor.getBio() %}
 {% set actor_uri = actor.getUri() %}
@@ -8,7 +9,7 @@
     <section id='profile-{{ actor.id }}' class='profile' title="{{ actor_nickname }}'s {{ 'profile information.' | trans }}">
         <a href="{{ actor_uri }}">
             <div class="profile-info">
-                <img src='{{ actor_avatar }}' class="profile-avatar" alt="{{ actor_nickname }}{{ '\'s avatar.' | trans }}">
+                <img src="{{ actor_avatar }}" class="profile-avatar" alt="{% trans %} %actor_nickname%'s avatar. {% endtrans %}" width="{{actor_avatar_dimensions['width']}}" height="{{actor_avatar_dimensions['height']}}">
                 <strong class="profile-info-nickname" title="{{ actor_nickname }}{{ '\'s nickname.' | trans }}">{{ actor_nickname }}</strong>
 
                 <section class="profile-info-bio">