Issue 6 - Resolve Show connected wallet info

packages/nextjs/components/Header.tsx

@@ -4,6 +4,7 @@ import React, { useCallback, useRef, useState } from "react";
 import Image from "next/image";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
+import { BatchWalletInfo } from "./scaffold-eth/BatchWalletInfo";
 import { Bars3Icon, BugAntIcon } from "@heroicons/react/24/outline";
 import { FaucetButton, RainbowKitCustomConnectButton } from "~~/components/scaffold-eth";
 import { useOutsideClick } from "~~/hooks/scaffold-eth";
@@ -101,6 +102,9 @@ export const Header = () => {
           <HeaderMenuLinks />
         </ul>
       </div>
+      <div className="flex justify-center">
+        <BatchWalletInfo />
+      </div>
       <div className="navbar-end flex-grow mr-4">
         <RainbowKitCustomConnectButton />
         <FaucetButton />

packages/nextjs/components/scaffold-eth/BatchWalletInfo.tsx

@@ -0,0 +1,44 @@
+import { useAccount } from "wagmi";
+import { useScaffoldReadContract } from "~~/hooks/scaffold-eth";
+
+type Text = {
+  title: string;
+  message: string;
+};
+
+export const BatchWalletInfo = () => {
+  const { address } = useAccount();
+
+  const { data: isAllowed } = useScaffoldReadContract({
+    contractName: "BatchRegistry",
+    functionName: "allowList",
+    args: [address?.toString()],
+  });
+  const { data: checkedIn } = useScaffoldReadContract({
+    contractName: "BatchRegistry",
+    functionName: "yourContractAddress",
+    args: [address?.toString()],
+  });
+
+  if (address == undefined) {
+    return;
+  }
+
+  const hasCheckedIn = "0x0000000000000000000000000000000000000000" != checkedIn;
+
+  let textToShow: Text = { title: "", message: "" };
+  if (isAllowed && hasCheckedIn) {
+    textToShow = { title: "", message: "You are an up to date builder🥇 " };
+  } else if (isAllowed && !hasCheckedIn) {
+    textToShow = { title: "Hey builder 🏗️!", message: "Remember to checkIn :)" };
+  } else if ((!isAllowed && !hasCheckedIn) || (!isAllowed && hasCheckedIn)) {
+    textToShow = { title: "Oops!", message: "Reach us to be a builder" };
+  }
+
+  return (
+    <div className="bg-base-300  p-4 rounded shadow-lg">
+      <p className="text-lg m-0">{textToShow.title}</p>
+      <p className="text-sm m-0">{textToShow.message}</p>
+    </div>
+  );
+};