Used blockieAvatar for user profiles images

BuidlGuidl · Sep 19, 2024 · a36c63c · a36c63c
1 parent d564a55
commit a36c63c
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 16 deletions.
diff --git a/packages/nextjs/app/builders/_components/BuilderPicture.tsx b/packages/nextjs/app/builders/_components/BuilderPicture.tsx
@@ -1,5 +1,5 @@
-import Image from "next/image";
 import Link from "next/link";
+import { BlockieAvatar } from "~~/components/scaffold-eth";
 import { Builder } from "~~/types/builders";
 
 type ProfilePictureProps = {
@@ -9,14 +9,8 @@ type ProfilePictureProps = {
 export const BuilderPicture = ({ person }: ProfilePictureProps) => {
   return (
     <div className="text-center">
-      <Link href={person.link} className="link" rel="noopener noreferrer">
-        <Image
-          width={100}
-          height={100}
-          className="w-24 h-24 rounded-full mx-auto"
-          src={person.image}
-          alt={person.link}
-        />
+      <Link href={person.profileLink} className="link" rel="noopener noreferrer">
+        <BlockieAvatar address={person.address as `0x${string}`} size={100} />
         See profile
       </Link>
     </div>

diff --git a/packages/nextjs/app/builders/_components/MentorPicture.tsx b/packages/nextjs/app/builders/_components/MentorPicture.tsx
@@ -9,13 +9,13 @@ type ProfilePictureProps = {
 export const MentorPicture = ({ person }: ProfilePictureProps) => {
   return (
     <div className="text-center">
-      <Link href={person.link} className="link" target="_blank" rel="noopener noreferrer">
+      <Link href={person.profileLink} className="link" target="_blank" rel="noopener noreferrer">
         <Image
           width={100}
           height={100}
           className="w-24 h-24 rounded-full mx-auto"
           src={person.image}
-          alt={person.link}
+          alt={person.profileLink}
         />
         {person.name}
       </Link>

diff --git a/packages/nextjs/app/builders/page.tsx b/packages/nextjs/app/builders/page.tsx
@@ -19,27 +19,29 @@ const getRandomUserImage = () => {
 
 const getBuilderFromEvent = (event: any): Builder => ({
   image: getRandomUserImage(),
-  link: "builders/" + event.args.builder,
+  profileLink: "builders/" + event.args.builder,
+  address: event.args.builder,
   checkedIn: true,
 });
 
 const mentors: Mentor[] = [
   {
     name: "Eda",
     image: "https://avatars.githubusercontent.com/u/22100698?v=4",
-    link: "https://github.com/edakturk14",
+    profileLink: "https://github.com/edakturk14",
     checkedIn: false,
   },
   {
     name: "Derrek",
     image: "https://avatars.githubusercontent.com/u/80121818?v=4",
-    link: "https://github.com/derrekcoleman",
+    profileLink: "https://github.com/derrekcoleman",
+
     checkedIn: false,
   },
   {
     name: "Philip",
     image: "https://avatars.githubusercontent.com/u/90064316?v=4",
-    link: "https://github.com/phipsae",
+    profileLink: "https://github.com/phipsae",
     checkedIn: false,
   },
 ];

diff --git a/packages/nextjs/types/builders.ts b/packages/nextjs/types/builders.ts
@@ -1,6 +1,7 @@
 export type Builder = {
   image: string;
-  link: string;
+  profileLink: string;
+  address?: `0x${string}`;
   checkedIn: boolean;
 };