Added links back to BlogPostItem

asyncapi · Oct 11, 2024 · 3a87764 · 3a87764
1 parent 6b30619
commit 3a87764
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 7 deletions.
diff --git a/components/Avatar.tsx b/components/Avatar.tsx
@@ -31,5 +31,18 @@ export default function Avatar({ name, photo, link, className }: AvatarProps) {
     />
   );
 
-  return link ? <span data-testid='Avatars-link'>{avatar}</span> : <React.Fragment>{avatar}</React.Fragment>;
+  return link ? (
+    <span
+      onClick={(e) => {
+        e.preventDefault();
+
+        window.open(link, '_blank');
+      }}
+      data-testid='Avatars-link'
+    >
+      {avatar}
+    </span>
+  ) : (
+    <React.Fragment>{avatar}</React.Fragment>
+  );
 }
diff --git a/components/navigation/BlogPostItem.tsx b/components/navigation/BlogPostItem.tsx
@@ -96,15 +96,24 @@ export default forwardRef(function BlogPostItem(
                       {post.authors
                         .map((author, index) =>
                           author.link ? (
-                            <span key={index} data-alt={author.name}>
+                            <span
+                              key={index}
+                              data-alt={author.name}
+                              onClick={(e) => {
+                                e.preventDefault();
+
+                                // Handle the click event, e.g., navigate to author.link
+                                window.open(author.link, '_blank');
+                              }}
+                            >
                               {author.name}
                             </span>
                           ) : (
                             author.name
                           )
                         )
-                        .reduce((prev, curr) => (
-                          <React.Fragment>
+                        .reduce((prev, curr, index) => (
+                          <React.Fragment key={`author-${index}`}>
                             {prev} & {curr}
                           </React.Fragment>
                         ))}

diff --git a/next-env.d.ts b/next-env.d.ts
@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/basic-features/typescript for more information.
+// see https://nextjs.org/docs/pages/building-your-application/configuring/typescript for more information.
diff --git a/pages/blog/index.tsx b/pages/blog/index.tsx
@@ -60,8 +60,8 @@ export default function BlogIndexPage() {
   const image = '/img/social/blog.webp';
 
   useEffect(() => {
-    setIsClient(router.isReady);
-  }, [router.isReady]);
+    setIsClient(true);
+  }, []);
 
   return (
     <GenericLayout title='Blog' description={description} image={image} wide>