From e1c700f2a6e3bb56656b8041d9394599da44621c Mon Sep 17 00:00:00 2001
From: Peter <obidaberechukwu@gmail.com>
Date: Fri, 30 Aug 2024 08:21:46 +0100
Subject: [PATCH 1/2] minor fix: Fix scroll at FAQ

---
 app/page.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/page.tsx b/app/page.tsx
index e8564eb..62d1923 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -181,7 +181,7 @@ export default function Home() {
             Here are some of our most asked questions and their answers
           </span>
         </div>
-        <div className="flex flex-col max-sm:gap-1 gap-2 max-h-[20rem] overflow-y-auto">
+        <div className="flex flex-col max-sm:gap-1 gap-2">
           {[
             {
               question: "What is EduLaunchBox?",
@@ -211,7 +211,7 @@ export default function Home() {
             {
               question: "Which blockchains are compatible with EduLaunchBox?",
               answer:
-                "EduLaunchBox is designed to be compatible with EVM (Ethereum Virtual Machine) chains, enabling developers to easily migrate tokens and dApps from popular blockchains. Currently, Ethereum is supported, with upcoming support for Binance Smart Chain, Polygon, and others.",
+                "EduLaunchBox is designed to be compatible with EVM (Ethereum Virtual Machine) chains, enabling developers to easily migrate tokens and dApps from popular blockchains. Currently, Base is supported, with upcoming support for Binance Smart Chain, Polygon, and others.",
             },
             {
               question: "Can I migrate tokens from non-EVM chains to EduChain?",

From 5f3e518e00d49729af0cc4fc8d715c1eab37a60d Mon Sep 17 00:00:00 2001
From: Peter <obidaberechukwu@gmail.com>
Date: Sat, 7 Sep 2024 09:00:16 +0100
Subject: [PATCH 2/2] Made Airdrop page coming soon

---
 app/airdrop/page.tsx                   | 459 +++++++++++++------------
 app/assets/images/transparent_logo.png | Bin 0 -> 8908 bytes
 app/sections/sidenav.tsx               |   8 +
 3 files changed, 255 insertions(+), 212 deletions(-)
 create mode 100644 app/assets/images/transparent_logo.png

diff --git a/app/airdrop/page.tsx b/app/airdrop/page.tsx
index f30f756..45f7a49 100644
--- a/app/airdrop/page.tsx
+++ b/app/airdrop/page.tsx
@@ -13,226 +13,261 @@ import axios from "axios";
 import { UserType } from "../types";
 import { Address } from "viem";
 import { shortenAddress } from "../lib/utils";
+import { Button } from "../components/buttons";
+import transparent_logo from "../assets/images/transparent_logo.png";
 
-export default function Airdrop() {
-  const { address } = useAccount();
-  const [users, setUsers] = useState<UserType[]>([]);
-  const [currentUserPoints, setCurrentUserPoints] = useState<string>("0.00");
-  const [currentUserRank, setCurrentUserRank] = useState<number>(0);
-
-  useEffect(() => {
-    (async () => {
-      try {
-        if (!address) {
-          Swal.fire({
-            title: "Error!!",
-            text: "Please connect your wallet",
-            icon: "error",
-            confirmButtonText: "Okay",
-          });
-          return;
-        }
-
-        const { data } = await axios.get("/api/airdrop");
-
-        setUsers(data?.data);
-        console.table(data?.data);
-      } catch (error) {
-        console.error(
-          "Error:",
-          (error as any).response?.data || (error as any).message
-        );
-        Swal.fire({
-          title: "Error",
-          text: "Error fetching users",
-          icon: "error",
-          cancelButtonText: "Okay",
-        });
-      }
-    })();
-  }, [address]);
-
-  useEffect(() => {
-    users.forEach((user, index) => {
-      if (user.address === address) {
-        setCurrentUserPoints(user.points?.toLocaleString() || "0.00");
-        setCurrentUserRank(index + 1);
-      }
-    });
-  }, [address, users]);
-
-  const TableRow = ({
-    rank,
-    userAddress,
-    points,
-  }: {
-    rank: number;
-    userAddress: string;
-    points: string;
-  }) => {
-    return (
-      <tr
-        className={
-          (rank === 1
-            ? "border border-firstPlace bg-firstPlace/30 rounded-2xl"
-            : rank === 2
-            ? "border border-secondPlace bg-secondPlace/30 rounded-2xl"
-            : rank === 3
-            ? "border border-thirdPlace bg-thirdPlace/30 rounded-2xl"
-            : "") +
-          " flex w-full max-sm:w-fit justify-between gap-4 py-1.5 pl-3 max-md:pr-20 max-lg:pr-28 pr-40"
-        }
-      >
-        <td className={" flex my-auto gap-4 min-w-[6rem] "}>
-          <span className="flex w-full gap-3">
-            {rank < 4 ? (
-              <Image
-                className="flex max-md:w-10 w-12 max-md:h-10 h-12 rounded-lg object-fit my-auto"
-                src={
-                  rank === 1
-                    ? firstPlace
-                    : rank === 2
-                    ? secondPlace
-                    : thirdPlace
-                }
-                alt={"position " + rank}
-              />
-            ) : (
-              <span className="flex w-12 h-12 my-auto" />
-            )}
-            <span
-              className={
-                (rank === 1
-                  ? "text-firstPlace"
-                  : rank === 2
-                  ? "text-secondPlace"
-                  : rank === 3
-                  ? "text-thirdPlace"
-                  : "text-primary/400 ") +
-                " flex max-md:text-[0.875rem] leading-none my-auto font-extrabold"
-              }
-            >
-              {rank}
-            </span>
-          </span>
-        </td>
-        <td className="flex my-auto min-w-[8rem]">
-          <span className="flex max-md:text-[0.75rem] text-[0.875rem] text-grey/700 font-extrabold">
-            {userAddress}
-          </span>
-        </td>
-        <td className="flex my-auto min-w-[10rem]">
-          <span
-            className={
-              (rank === 1
-                ? "text-firstPlace"
-                : rank === 2
-                ? "text-secondPlace"
-                : rank === 3
-                ? "text-thirdPlace"
-                : "text-secondary/700") +
-              " flex w-full my-auto max-md:text-[0.75rem] text-[0.875rem] font-black"
-            }
-          >
-            {points} EP
-          </span>
-        </td>
-      </tr>
-    );
-  };
-
+export default function ComingSoonAirdrop() {
   return (
     <section className="flex max-md:px-8 max-sm:px-6 max-xs:px-4 px-10 py-6 ">
-      <div className="flex flex-col gap-6 w-full">
-        <BannerContainer>
-          <div className="flex w-full h-full gap-4 py-4 max-xl:px-4 px-6 max-md:flex-col max-md:gap-2">
-            <div className="flex flex-col my-auto">
-              <h1 className="flex text-grey/50 max-xl:text-[1.25rem] text-[1.75rem] font-extrabold">
-                Airdrop
-              </h1>
-              <span className="flex max-md:w-full max-xl:w-44 w-56 text-grey/50 max-xl:text-[0.75rem] text-[0.875rem] text-pretty font-medium">
-                Interact with tokens Created and Migrated into EDUCHAIN to rank
-                up.
+      <div className="flex w-full relative border border-primary/200 rounded-2xl bg-primary/100 py-6 overflow-hidden">
+        <Image
+          src={transparent_logo}
+          alt="logo"
+          className="flex w-36 h-36 absolute right-0 bottom-[-1.5rem]"
+        />
+        <div className="flex z-10 flex-col gap-4 w-full my-auto">
+          <div className="flex max-sm:flex-col justify-center max-sm:gap-2 mx-auto gap-4">
+            <h1 className="max-xl:text-[2rem] max-sm:text-[1.25rem] max-md:text-[1.5rem] font-bold text-grey/800 ">
+              GET READY FOR DECENTRALIZATION
+            </h1>
+            <div className="flex my-auto w-24 max-sm:mx-auto bg-grey/50 rounded-3xl px-2">
+              <span className="flex mx-auto text-[0.75rem] font-semibold">
+                Coming soon
               </span>
             </div>
-
-            <div className="flex gap-2 py-4 max-sm:flex-wrap">
-              <div className="flex max-md:py-2 max-xl:px-6 max-lg:px-4 px-8 justify-center rounded-xl flex-col border-grey/50/25 border bg-grey/50/5">
-                <span className="flex mx-auto font-bold text-grey/50 max-xl:text-[0.75rem] text-[0.875rem] text-nowrap">
-                  Box Points earned
-                </span>
-                <span className="flex max-xl:text-[1.25rem] text-[1.75rem] text-secondary/500 font-extrabold mx-auto text-nowrap">
-                  {currentUserPoints} EP
-                </span>
-              </div>
-              <div className="flex max-md:py-2 max-lg:px-6 px-8 justify-center rounded-xl flex-col border-grey/50/25 border bg-grey/50/5">
-                <span className="flex mx-auto font-bold text-grey/50 max-xl:text-[0.75rem] text-[0.875rem]">
-                  Your rank
-                </span>
-                <span className="flex max-xl:text-[1.25rem] text-[1.75rem] text-secondary/500 font-extrabold mx-auto">
-                  {currentUserRank}
-                </span>
-              </div>
-              <div className="flex max-md:py-2 max-sm:w-full max-lg:px-6 px-8 justify-center rounded-xl flex-col border-grey/50/25 border gap-1 bg-grey/50/5">
-                <h4 className="flex font-extrabold text-grey/50 max-xl:text-[0.75rem] text-[0.875rem]">
-                  How to earn points
-                </h4>
-                <span className="flex flex-col text-grey/50 max-xl:text-[0.75rem] text-[0.875rem]">
-                  <ul className="ml-4 list-disc">
-                    <li>Bridge EDU over to EDUCHAIN</li>
-                    <li>Use Dapps listed on our Leaderboard</li>
-                    <li>Refer others</li>
-                  </ul>
-                  <Link className="underline" href={""}>
-                    See Referal Dashboard
-                  </Link>
-                </span>
-              </div>
-            </div>
           </div>
-        </BannerContainer>
-
-        <div className="flex w-full">
-          <TableContainer
-            className="flex w-full max-sm:overflow-x-auto"
-            title="Ranking"
-          >
-            <table className="flex flex-col w-full">
-              <thead className="flex w-full max-sm:w-fit border-b border-primary/100 py-3 pl-6 text-grey/700 max-md:pr-24 max-lg:pr-32 pr-44">
-                <tr className="flex gap-4 justify-between w-full">
-                  <th className="flex min-w-[6rem]">
-                    <span className="flex font-semibold text-[0.875rem] text-grey/700 text-nowrap">
-                      Rank
-                    </span>
-                  </th>
-                  <th className="flex min-w-[8rem]">
-                    <span className="flex font-semibold text-[0.875rem] text-grey/700 text-nowrap">
-                      User address
-                    </span>
-                  </th>
-                  <th className="flex px-2 min-w-[10rem]">
-                    <span className="flex font-semibold text-[0.875rem] text-grey/700 text-nowrap">
-                      point
-                    </span>
-                  </th>
-                </tr>
-              </thead>
-              <tbody className="flex flex-col gap-1 px-3 py-4">
-                {users.map((item, index) => {
-                  return (
-                    <TableRow
-                      key={index}
-                      rank={index + 1}
-                      userAddress={shortenAddress(item.address!) as Address}
-                      points={item.points?.toLocaleString() || "0.00"}
-                    />
-                  );
-                })}
-              </tbody>
-            </table>
-          </TableContainer>
+          <div className="flex z-10 w-full">
+            <Button
+              color="green"
+              text="Bridge into EDU"
+              className=" mx-auto w-[10rem]"
+            />
+          </div>
         </div>
       </div>
     </section>
   );
 }
+
+// export default function Airdrop() {
+//   const { address } = useAccount();
+//   const [users, setUsers] = useState<UserType[]>([]);
+//   const [currentUserPoints, setCurrentUserPoints] = useState<string>("0.00");
+//   const [currentUserRank, setCurrentUserRank] = useState<number>(0);
+
+//   useEffect(() => {
+//     (async () => {
+//       try {
+//         if (!address) {
+//           Swal.fire({
+//             title: "Error!!",
+//             text: "Please connect your wallet",
+//             icon: "error",
+//             confirmButtonText: "Okay",
+//           });
+//           return;
+//         }
+
+//         const { data } = await axios.get("/api/airdrop");
+
+//         setUsers(data?.data);
+//         console.table(data?.data);
+//       } catch (error) {
+//         console.error(
+//           "Error:",
+//           (error as any).response?.data || (error as any).message
+//         );
+//         Swal.fire({
+//           title: "Error",
+//           text: "Error fetching users",
+//           icon: "error",
+//           cancelButtonText: "Okay",
+//         });
+//       }
+//     })();
+//   }, [address]);
+
+//   useEffect(() => {
+//     users.forEach((user, index) => {
+//       if (user.address === address) {
+//         setCurrentUserPoints(user.points?.toLocaleString() || "0.00");
+//         setCurrentUserRank(index + 1);
+//       }
+//     });
+//   }, [address, users]);
+
+//   const TableRow = ({
+//     rank,
+//     userAddress,
+//     points,
+//   }: {
+//     rank: number;
+//     userAddress: string;
+//     points: string;
+//   }) => {
+//     return (
+//       <tr
+//         className={
+//           (rank === 1
+//             ? "border border-firstPlace bg-firstPlace/30 rounded-2xl"
+//             : rank === 2
+//             ? "border border-secondPlace bg-secondPlace/30 rounded-2xl"
+//             : rank === 3
+//             ? "border border-thirdPlace bg-thirdPlace/30 rounded-2xl"
+//             : "") +
+//           " flex w-full max-sm:w-fit justify-between gap-4 py-1.5 pl-3 max-md:pr-20 max-lg:pr-28 pr-40"
+//         }
+//       >
+//         <td className={" flex my-auto gap-4 min-w-[6rem] "}>
+//           <span className="flex w-full gap-3">
+//             {rank < 4 ? (
+//               <Image
+//                 className="flex max-md:w-10 w-12 max-md:h-10 h-12 rounded-lg object-fit my-auto"
+//                 src={
+//                   rank === 1
+//                     ? firstPlace
+//                     : rank === 2
+//                     ? secondPlace
+//                     : thirdPlace
+//                 }
+//                 alt={"position " + rank}
+//               />
+//             ) : (
+//               <span className="flex w-12 h-12 my-auto" />
+//             )}
+//             <span
+//               className={
+//                 (rank === 1
+//                   ? "text-firstPlace"
+//                   : rank === 2
+//                   ? "text-secondPlace"
+//                   : rank === 3
+//                   ? "text-thirdPlace"
+//                   : "text-primary/400 ") +
+//                 " flex max-md:text-[0.875rem] leading-none my-auto font-extrabold"
+//               }
+//             >
+//               {rank}
+//             </span>
+//           </span>
+//         </td>
+//         <td className="flex my-auto min-w-[8rem]">
+//           <span className="flex max-md:text-[0.75rem] text-[0.875rem] text-grey/700 font-extrabold">
+//             {userAddress}
+//           </span>
+//         </td>
+//         <td className="flex my-auto min-w-[10rem]">
+//           <span
+//             className={
+//               (rank === 1
+//                 ? "text-firstPlace"
+//                 : rank === 2
+//                 ? "text-secondPlace"
+//                 : rank === 3
+//                 ? "text-thirdPlace"
+//                 : "text-secondary/700") +
+//               " flex w-full my-auto max-md:text-[0.75rem] text-[0.875rem] font-black"
+//             }
+//           >
+//             {points} EP
+//           </span>
+//         </td>
+//       </tr>
+//     );
+//   };
+
+//   return (
+//     <section className="flex max-md:px-8 max-sm:px-6 max-xs:px-4 px-10 py-6 ">
+//       <div className="flex flex-col gap-6 w-full">
+//         <BannerContainer>
+//           <div className="flex w-full h-full gap-4 py-4 max-xl:px-4 px-6 max-md:flex-col max-md:gap-2">
+//             <div className="flex flex-col my-auto">
+//               <h1 className="flex text-grey/50 max-xl:text-[1.25rem] text-[1.75rem] font-extrabold">
+//                 Airdrop
+//               </h1>
+//               <span className="flex max-md:w-full max-xl:w-44 w-56 text-grey/50 max-xl:text-[0.75rem] text-[0.875rem] text-pretty font-medium">
+//                 Interact with tokens Created and Migrated into EDUCHAIN to rank
+//                 up.
+//               </span>
+//             </div>
+
+//             <div className="flex gap-2 py-4 max-sm:flex-wrap">
+//               <div className="flex max-md:py-2 max-xl:px-6 max-lg:px-4 px-8 justify-center rounded-xl flex-col border-grey/50/25 border bg-grey/50/5">
+//                 <span className="flex mx-auto font-bold text-grey/50 max-xl:text-[0.75rem] text-[0.875rem] text-nowrap">
+//                   Box Points earned
+//                 </span>
+//                 <span className="flex max-xl:text-[1.25rem] text-[1.75rem] text-secondary/500 font-extrabold mx-auto text-nowrap">
+//                   {currentUserPoints} EP
+//                 </span>
+//               </div>
+//               <div className="flex max-md:py-2 max-lg:px-6 px-8 justify-center rounded-xl flex-col border-grey/50/25 border bg-grey/50/5">
+//                 <span className="flex mx-auto font-bold text-grey/50 max-xl:text-[0.75rem] text-[0.875rem]">
+//                   Your rank
+//                 </span>
+//                 <span className="flex max-xl:text-[1.25rem] text-[1.75rem] text-secondary/500 font-extrabold mx-auto">
+//                   {currentUserRank}
+//                 </span>
+//               </div>
+//               <div className="flex max-md:py-2 max-sm:w-full max-lg:px-6 px-8 justify-center rounded-xl flex-col border-grey/50/25 border gap-1 bg-grey/50/5">
+//                 <h4 className="flex font-extrabold text-grey/50 max-xl:text-[0.75rem] text-[0.875rem]">
+//                   How to earn points
+//                 </h4>
+//                 <span className="flex flex-col text-grey/50 max-xl:text-[0.75rem] text-[0.875rem]">
+//                   <ul className="ml-4 list-disc">
+//                     <li>Bridge EDU over to EDUCHAIN</li>
+//                     <li>Use Dapps listed on our Leaderboard</li>
+//                     <li>Refer others</li>
+//                   </ul>
+//                   <Link className="underline" href={""}>
+//                     See Referal Dashboard
+//                   </Link>
+//                 </span>
+//               </div>
+//             </div>
+//           </div>
+//         </BannerContainer>
+
+//         <div className="flex w-full">
+//           <TableContainer
+//             className="flex w-full max-sm:overflow-x-auto"
+//             title="Ranking"
+//           >
+//             <table className="flex flex-col w-full">
+//               <thead className="flex w-full max-sm:w-fit border-b border-primary/100 py-3 pl-6 text-grey/700 max-md:pr-24 max-lg:pr-32 pr-44">
+//                 <tr className="flex gap-4 justify-between w-full">
+//                   <th className="flex min-w-[6rem]">
+//                     <span className="flex font-semibold text-[0.875rem] text-grey/700 text-nowrap">
+//                       Rank
+//                     </span>
+//                   </th>
+//                   <th className="flex min-w-[8rem]">
+//                     <span className="flex font-semibold text-[0.875rem] text-grey/700 text-nowrap">
+//                       User address
+//                     </span>
+//                   </th>
+//                   <th className="flex px-2 min-w-[10rem]">
+//                     <span className="flex font-semibold text-[0.875rem] text-grey/700 text-nowrap">
+//                       point
+//                     </span>
+//                   </th>
+//                 </tr>
+//               </thead>
+//               <tbody className="flex flex-col gap-1 px-3 py-4">
+//                 {users.map((item, index) => {
+//                   return (
+//                     <TableRow
+//                       key={index}
+//                       rank={index + 1}
+//                       userAddress={shortenAddress(item.address!) as Address}
+//                       points={item.points?.toLocaleString() || "0.00"}
+//                     />
+//                   );
+//                 })}
+//               </tbody>
+//             </table>
+//           </TableContainer>
+//         </div>
+//       </div>
+//     </section>
+//   );
+// }
diff --git a/app/assets/images/transparent_logo.png b/app/assets/images/transparent_logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..63bb2c667c5c4af0d8b81c930ad73a4f40ad6bee
GIT binary patch
literal 8908
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
DSsB%o

literal 0
HcmV?d00001

diff --git a/app/sections/sidenav.tsx b/app/sections/sidenav.tsx
index 9236c63..6bb4593 100644
--- a/app/sections/sidenav.tsx
+++ b/app/sections/sidenav.tsx
@@ -47,11 +47,13 @@ export default function SideNav() {
     text,
     logo,
     active,
+    comingSoon,
   }: {
     href: string;
     text: string;
     active: boolean;
     logo: any;
+    comingSoon?: boolean;
   }) => {
     return (
       <Link
@@ -74,6 +76,11 @@ export default function SideNav() {
         >
           {text}
         </span>
+        {comingSoon && (
+          <span className="flex w-full flex-row-reverse">
+            <span className="text-[0.75rem] my-auto">Coming soon</span>
+          </span>
+        )}
       </Link>
     );
   };
@@ -125,6 +132,7 @@ export default function SideNav() {
             href="/airdrop"
             text="airdrop"
             logo={CoinSvg}
+            comingSoon
           />
           <NavItem
             active={pathname.includes("/dev")}