From 626d5fb0d9ed3e3cb00c9565cf76b206b120e3a4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Magnus=20Alexander=20Str=C3=B8mseng?=
 <magnus.stromseng@gmail.com>
Date: Wed, 10 Apr 2024 17:30:29 +0200
Subject: [PATCH] try to fix avatar yet again

---
 frontend/src/app/blog/[articleSlug]/page.tsx | 22 ++++++++++++--------
 1 file changed, 13 insertions(+), 9 deletions(-)

diff --git a/frontend/src/app/blog/[articleSlug]/page.tsx b/frontend/src/app/blog/[articleSlug]/page.tsx
index 5b9fe37..a9efcdf 100644
--- a/frontend/src/app/blog/[articleSlug]/page.tsx
+++ b/frontend/src/app/blog/[articleSlug]/page.tsx
@@ -4,8 +4,8 @@ import { BlocksContent } from "@strapi/blocks-react-renderer";
 import BlockRendererClient from "@/components/BlockRendererClient";
 import { gql } from "@/__generated__/gql";
 import { getClient } from "@/lib/ApolloClient";
-import { AvatarImageFix } from "@/components/AvatarImageFix";
 import ShareButtons from "@/components/ShareButtons";
+import NextImage from "next/image";
 
 const STRAPI_URL = process.env.STRAPI_URL;
 
@@ -92,14 +92,18 @@ export default async function Page({
                 <div className="flex flex-1 justify-start gap-1">
                     {avatarURL && (
                         <Avatar className="">
-                            <AvatarImageFix src={avatarURL} alt="Avatar" />
-                            <AvatarFallback>
-                                {// Get initials from author name
-                                authorName
-                                    ?.split(" ")
-                                    .map((name: any) => name[0])
-                                    .join("")}
-                            </AvatarFallback>
+                            {avatarURL && (
+                                <NextImage src={avatarURL} alt="Avatar Image" />
+                            )}
+                            {!avatarURL && (
+                                <AvatarFallback>
+                                    {// Get initials from author name
+                                    authorName
+                                        ?.split(" ")
+                                        .map((name: any) => name[0])
+                                        .join("")}
+                                </AvatarFallback>
+                            )}
                         </Avatar>
                     )}
                     <div className="flex flex-col justify-center">