From 9c8937b55abbc7b96382659312c71b1c998926ec Mon Sep 17 00:00:00 2001
From: Esenwa Kachukwu Michael <michael.esenwa@gmail.com>
Date: Thu, 31 Oct 2024 03:18:07 +0100
Subject: [PATCH 1/4] feat: personal page

---
 .../page.tsx                                  | 69 +++++++++++++++++++
 1 file changed, 69 insertions(+)
 create mode 100644 packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/page.tsx

diff --git a/packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/page.tsx b/packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/page.tsx
new file mode 100644
index 0000000..01c4bc9
--- /dev/null
+++ b/packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/page.tsx
@@ -0,0 +1,69 @@
+import React from "react";
+import Image from "next/image";
+import { NextPage } from "next";
+
+const MichaelEsenwa: NextPage = () => {
+  const contactLink = [
+    {
+      link: "https://wa.me/2347081293274?text=Hello Michael",
+      image: "https://img.shields.io/badge/WHATSAPP-%2325D366.svg?&style=for-the-badge&logo=whatsapp&logoColor=white",
+      title: "Whatsapp",
+    },
+    {
+      link: "mailto:michael.esenwa@yahoo.com",
+      image: "https://img.shields.io/badge/email me-%23D14836.svg?&style=for-the-badge&logo=gmail&logoColor=white",
+      title: "Email",
+    },
+    {
+      link: "https://twitter.com/kcmikee",
+      image: "https://img.shields.io/badge/twitter-%231DA1F2.svg?&style=for-the-badge&logo=twitter&logoColor=white",
+      title: "Twitter",
+    },
+    {
+      link: "https://www.linkedin.com/in/kachukwu-michael-esenwa/",
+      image: "https://img.shields.io/badge/LinkedIn-0077B5?style=for-the-badge&logo=linkedin&logoColor=white",
+      title: "LinkedIn",
+    },
+  ];
+  return (
+    <div className="flex flex-col items-center h-[80vh] pt-20 md:pt-0 md:justify-center bg-gradient-to-br from-gray-800 to-base-300">
+      <div className="flex justify-between w-11/12 p-4 border border-gray-600 rounded-md md:p-8 md:w-9/12">
+        <div className="">
+          <div className="flex justify-between">
+            <h1 className="text-2xl font-bold lg:text-4xl text-start">Hi there, I am Kachukwu Michael Esenwa </h1>
+            <div className="h-[100px] w-[100px] lg:w-[300px] lg:h-[300px] shrink-0 !overflow-hidden rounded-full relative lg:hidden">
+              <Image fill src="https://avatars.githubusercontent.com/u/42065630?v=4" alt="avatar" />
+            </div>
+          </div>
+          <hr className="mt-2 border-gray-500" />
+          <div className="flex justify-between">
+            <h4 className="mt-5 text-base text-start">
+              I am a Front End Developer with a strong emphasis on creating high-performance web applications. With over
+              four years in the industry, my expertise lies in writing clean, efficient code and optimizing web pages
+              for speed and scalability. 💻
+            </h4>
+          </div>
+
+          <div className="mt-4">
+            <h4>📫 How to reach me:</h4>
+            <div className="flex items-center gap-3">
+              {contactLink.map((_, i) => (
+                <>
+                  <a key={i} href={_.link} target="_blank">
+                    {/* eslint-disable-next-line @next/next/no-img-element */}
+                    <img alt={_.title} src={_.image} />
+                  </a>
+                </>
+              ))}
+            </div>
+          </div>
+        </div>
+        <div className="h-[100px] w-[100px] lg:w-[300px] lg:h-[300px] shrink-0 !overflow-hidden rounded-full relative hidden lg:block">
+          <Image fill src="https://avatars.githubusercontent.com/u/42065630?v=4" alt="avatar" />
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default MichaelEsenwa;

From 8210a575c529ee9e8d487545fd83a2f3e70c5335 Mon Sep 17 00:00:00 2001
From: Esenwa Kachukwu Michael <michael.esenwa@gmail.com>
Date: Thu, 31 Oct 2024 03:43:39 +0100
Subject: [PATCH 2/4] feat: add address

---
 .../0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/page.tsx        | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/page.tsx b/packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/page.tsx
index 01c4bc9..1231d3c 100644
--- a/packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/page.tsx
+++ b/packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/page.tsx
@@ -45,7 +45,8 @@ const MichaelEsenwa: NextPage = () => {
           </div>
 
           <div className="mt-4">
-            <h4>📫 How to reach me:</h4>
+            <h4 className="">Address: 0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441</h4>
+            <h4 className="mt-8">📫 How to reach me:</h4>
             <div className="flex items-center gap-3">
               {contactLink.map((_, i) => (
                 <>

From 2283dd9abe7a42f5ae6ffbb790e9c30acf4ea3e6 Mon Sep 17 00:00:00 2001
From: Esenwa Kachukwu Michael <michael.esenwa@gmail.com>
Date: Thu, 31 Oct 2024 03:47:01 +0100
Subject: [PATCH 3/4] fixes

---
 .../0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/page.tsx         | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/page.tsx b/packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/page.tsx
index 1231d3c..97b976c 100644
--- a/packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/page.tsx
+++ b/packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/page.tsx
@@ -45,7 +45,7 @@ const MichaelEsenwa: NextPage = () => {
           </div>
 
           <div className="mt-4">
-            <h4 className="">Address: 0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441</h4>
+            <p className="text-xs md:text-base">Address: 0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441</p>
             <h4 className="mt-8">📫 How to reach me:</h4>
             <div className="flex items-center gap-3">
               {contactLink.map((_, i) => (

From e2c8b1d616ec50e43dfaf357dc2c686cc75acb87 Mon Sep 17 00:00:00 2001
From: Esenwa Kachukwu Michael <michael.esenwa@gmail.com>
Date: Thu, 31 Oct 2024 17:08:57 +0100
Subject: [PATCH 4/4] fix: Remove React import, Socials Component

---
 .../components/Socials.tsx                    | 31 ++++++++++
 .../page.tsx                                  | 56 +++++++------------
 2 files changed, 50 insertions(+), 37 deletions(-)
 create mode 100644 packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/components/Socials.tsx

diff --git a/packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/components/Socials.tsx b/packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/components/Socials.tsx
new file mode 100644
index 0000000..900b736
--- /dev/null
+++ b/packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/components/Socials.tsx
@@ -0,0 +1,31 @@
+import { FaLinkedin, FaXTwitter } from "react-icons/fa6";
+import { MdEmail } from "react-icons/md";
+
+const contactLinks = [
+  {
+    link: "mailto:michael.esenwa@yahoo.com",
+    image: <MdEmail size={24} />,
+  },
+  {
+    link: "https://twitter.com/kcmikee",
+    image: <FaXTwitter size={24} />,
+  },
+  {
+    link: "https://www.linkedin.com/in/kachukwu-michael-esenwa/",
+    image: <FaLinkedin size={24} />,
+  },
+];
+
+const Socials = () => {
+  return (
+    <div className="flex items-center gap-3">
+      {contactLinks.map((_, i) => (
+        <a key={i} href={_.link} target="_blank">
+          {_.image}
+        </a>
+      ))}
+    </div>
+  );
+};
+
+export default Socials;
diff --git a/packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/page.tsx b/packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/page.tsx
index 97b976c..2bd3ddf 100644
--- a/packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/page.tsx
+++ b/packages/nextjs/app/builders/0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441/page.tsx
@@ -1,36 +1,17 @@
-import React from "react";
 import Image from "next/image";
+import Socials from "./components/Socials";
 import { NextPage } from "next";
+import { Address } from "~~/components/scaffold-eth";
 
 const MichaelEsenwa: NextPage = () => {
-  const contactLink = [
-    {
-      link: "https://wa.me/2347081293274?text=Hello Michael",
-      image: "https://img.shields.io/badge/WHATSAPP-%2325D366.svg?&style=for-the-badge&logo=whatsapp&logoColor=white",
-      title: "Whatsapp",
-    },
-    {
-      link: "mailto:michael.esenwa@yahoo.com",
-      image: "https://img.shields.io/badge/email me-%23D14836.svg?&style=for-the-badge&logo=gmail&logoColor=white",
-      title: "Email",
-    },
-    {
-      link: "https://twitter.com/kcmikee",
-      image: "https://img.shields.io/badge/twitter-%231DA1F2.svg?&style=for-the-badge&logo=twitter&logoColor=white",
-      title: "Twitter",
-    },
-    {
-      link: "https://www.linkedin.com/in/kachukwu-michael-esenwa/",
-      image: "https://img.shields.io/badge/LinkedIn-0077B5?style=for-the-badge&logo=linkedin&logoColor=white",
-      title: "LinkedIn",
-    },
-  ];
   return (
-    <div className="flex flex-col items-center h-[80vh] pt-20 md:pt-0 md:justify-center bg-gradient-to-br from-gray-800 to-base-300">
-      <div className="flex justify-between w-11/12 p-4 border border-gray-600 rounded-md md:p-8 md:w-9/12">
+    <div className="flex flex-col items-center h-[80vh] pt-20 md:pt-0 md:justify-center bg-white dark:bg-gradient-to-br dark:from-gray-800 dark:to-base-300">
+      <div className="flex justify-between w-11/12 p-4 border border-gray-200 rounded-lg shadow-sm dark:border-gray-600 md:p-8 md:w-9/12">
         <div className="">
           <div className="flex justify-between">
-            <h1 className="text-2xl font-bold lg:text-4xl text-start">Hi there, I am Kachukwu Michael Esenwa </h1>
+            <h1 className="text-2xl font-bold lg:text-4xl text-start dark:text-white">
+              Hi there, I am Kachukwu Michael Esenwa{" "}
+            </h1>
             <div className="h-[100px] w-[100px] lg:w-[300px] lg:h-[300px] shrink-0 !overflow-hidden rounded-full relative lg:hidden">
               <Image fill src="https://avatars.githubusercontent.com/u/42065630?v=4" alt="avatar" />
             </div>
@@ -45,18 +26,19 @@ const MichaelEsenwa: NextPage = () => {
           </div>
 
           <div className="mt-4">
-            <p className="text-xs md:text-base">Address: 0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441</p>
-            <h4 className="mt-8">📫 How to reach me:</h4>
-            <div className="flex items-center gap-3">
-              {contactLink.map((_, i) => (
-                <>
-                  <a key={i} href={_.link} target="_blank">
-                    {/* eslint-disable-next-line @next/next/no-img-element */}
-                    <img alt={_.title} src={_.image} />
-                  </a>
-                </>
-              ))}
+            <div className="text-xs md:text-base">
+              Address:{" "}
+              <div className="block mt-1.5">
+                <Address
+                  onlyEnsOrAddress
+                  address="0x8Bb563DC969cC3b3e7275474c3847b44dBCB9441"
+                  format="short"
+                  size="sm"
+                />
+              </div>
             </div>
+            <h4 className="mt-8">📫 How to reach me:</h4>
+            <Socials />
           </div>
         </div>
         <div className="h-[100px] w-[100px] lg:w-[300px] lg:h-[300px] shrink-0 !overflow-hidden rounded-full relative hidden lg:block">