From 14bf025a537d56189f1576fed9f2310e462d6142 Mon Sep 17 00:00:00 2001
From: Alexandre de Souza <alexandre@aledsz.com.br>
Date: Wed, 19 Feb 2025 17:08:28 -0300
Subject: [PATCH] Add a fallback to user's profile picture (#2940)

---
 .../components/user_components.ex             | 35 ++++++++++++-------
 1 file changed, 22 insertions(+), 13 deletions(-)

diff --git a/lib/livebook_web/components/user_components.ex b/lib/livebook_web/components/user_components.ex
index 0df09f7bc..c621138da 100644
--- a/lib/livebook_web/components/user_components.ex
+++ b/lib/livebook_web/components/user_components.ex
@@ -14,6 +14,25 @@ defmodule LivebookWeb.UserComponents do
   attr :text_class, :string, default: nil
 
   def user_avatar(%{user: %{avatar_url: nil}} = assigns) do
+    ~H"""
+    <.avatar_text class={@class} user={@user} text_class={@text_class} />
+    """
+  end
+
+  def user_avatar(assigns) do
+    ~H"""
+    <object
+      data={@user.avatar_url}
+      type="image/png"
+      class={["rounded-full flex items-center justify-center", @class]}
+      aria-hidden="true"
+    >
+      <.avatar_text class={@class} user={@user} text_class={@text_class} />
+    </object>
+    """
+  end
+
+  defp avatar_text(assigns) do
     ~H"""
     <div
       class={["rounded-full flex items-center justify-center", @class]}
@@ -21,25 +40,15 @@ defmodule LivebookWeb.UserComponents do
       aria-hidden="true"
     >
       <div class={["text-gray-100 font-semibold", @text_class]}>
-        {avatar_text(@user.name)}
+        {initials(@user.name)}
       </div>
     </div>
     """
   end
 
-  def user_avatar(assigns) do
-    ~H"""
-    <img
-      src={@user.avatar_url}
-      class={["rounded-full flex items-center justify-center", @class]}
-      aria-hidden="true"
-    />
-    """
-  end
+  defp initials(nil), do: "?"
 
-  defp avatar_text(nil), do: "?"
-
-  defp avatar_text(name) do
+  defp initials(name) do
     name
     |> String.split()
     |> Enum.map(&String.at(&1, 0))