From e9d1267584123e2f838769fa0c626bbc7b3f4fff Mon Sep 17 00:00:00 2001 From: Lukman-01 Date: Fri, 25 Oct 2024 10:08:49 +0100 Subject: [PATCH 1/6] Added member status to the home page --- packages/nextjs/app/page.tsx | 83 +++++++++++++++++++++++++++++++----- 1 file changed, 72 insertions(+), 11 deletions(-) diff --git a/packages/nextjs/app/page.tsx b/packages/nextjs/app/page.tsx index 2ba44ec..3fc2828 100644 --- a/packages/nextjs/app/page.tsx +++ b/packages/nextjs/app/page.tsx @@ -2,19 +2,46 @@ import Link from "next/link"; import type { NextPage } from "next"; +import { useAccount } from "wagmi"; import { BugAntIcon, MagnifyingGlassIcon } from "@heroicons/react/24/outline"; import { useScaffoldReadContract } from "~~/hooks/scaffold-eth"; const Home: NextPage = () => { + const { address: connectedAddress } = useAccount(); + const { data: checkedInCounter, - error, - isLoading: contractLoading, + error: counterError, + isLoading: counterLoading, } = useScaffoldReadContract({ contractName: "BatchRegistry", functionName: "checkedInCounter", }); + const { + data: isAllowListed, + error: allowListError, + isLoading: allowListLoading, + } = useScaffoldReadContract({ + contractName: "BatchRegistry", + functionName: "allowList", + args: [connectedAddress], + }); + + const { + data: userContractAddress, + error: checkInError, + isLoading: checkInLoading, + } = useScaffoldReadContract({ + contractName: "BatchRegistry", + functionName: "yourContractAddress", + args: [connectedAddress], + }); + + const error = counterError || allowListError || checkInError; + const isLoading = counterLoading || allowListLoading || checkInLoading; + const isCheckedIn = userContractAddress && userContractAddress !== "0x0000000000000000000000000000000000000000"; + return ( <>
@@ -30,16 +57,50 @@ const Home: NextPage = () => {

Error fetching contract data: {error.message}

) : ( -
- Checked in builders count: - {contractLoading ? ( - -
- - ) : ( - {checkedInCounter !== undefined ? Number(checkedInCounter) : "0"} + <> +
+ Checked in builders count: + {counterLoading ? ( + +
+ + ) : ( + {checkedInCounter !== undefined ? Number(checkedInCounter) : "0"} + )} +
+ + {connectedAddress && ( +
+

Your Status

+ {isLoading ? ( +
+
+
+
+ ) : ( +
+
+
+ + {isAllowListed ? "You are a member of Batch 10" : "You are not a member of Batch 10"} + +
+
+
+ + {isCheckedIn + ? `Checked in with contract: ${userContractAddress?.slice( + 0, + 6, + )}...${userContractAddress?.slice(-4)}` + : "Not checked in yet"} + +
+
+ )} +
)} -
+ )}
From a94147ce1fb3914086594273d17317e92298899f Mon Sep 17 00:00:00 2001 From: Lukman-01 Date: Thu, 31 Oct 2024 20:26:54 +0100 Subject: [PATCH 2/6] Implemented all cases of member status --- packages/nextjs/app/page.tsx | 266 ++++++++++++++++++++++++----------- 1 file changed, 182 insertions(+), 84 deletions(-) diff --git a/packages/nextjs/app/page.tsx b/packages/nextjs/app/page.tsx index 3fc2828..c46d6e4 100644 --- a/packages/nextjs/app/page.tsx +++ b/packages/nextjs/app/page.tsx @@ -1,12 +1,136 @@ "use client"; +import React from "react"; import Link from "next/link"; -import type { NextPage } from "next"; import { useAccount } from "wagmi"; import { BugAntIcon, MagnifyingGlassIcon } from "@heroicons/react/24/outline"; import { useScaffoldReadContract } from "~~/hooks/scaffold-eth"; -const Home: NextPage = () => { +interface Props { + children: React.ReactNode; + className?: string; +} + +interface StarknetReact { + connectedAddress: string; + isAllowListed: boolean; + isCheckedIn: boolean; + userContractAddress: string; + isLoading: boolean; +} + +// Alert Components +const Alert = ({ children, className = "" }: Props) => ( +
{children}
+); + +const AlertTitle = ({ children }: Props) => ( +
{children}
+); + +const AlertDescription = ({ children }: Props) =>
{children}
; + +// Card Components +const Card = ({ children, className = "" }: Props) => ( +
+ {children} +
+); + +const CardHeader = ({ children, className = "" }: Props) => ( +
{children}
+); + +const CardTitle = ({ children }: Props) => ( +

{children}

+); + +const CardContent = ({ children, className = "" }: Props) =>
{children}
; + +// Status Component +const StatusSection = ({ + connectedAddress, + isAllowListed, + isCheckedIn, + userContractAddress, + isLoading, +}: StarknetReact) => { + if (isLoading) { + return ( + + +
+
+
+

Checking your status...

+
+
+ + + ); + } + + if (!connectedAddress) { + return ( + + Connect Your Wallet + Please connect your wallet to view your Batch 10 status + + ); + } + + if (!isAllowListed) { + return ( + + +
+ Your Status + Not a Member +
+ + +

You are not currently a member of Batch 10

+ + + ); + } + + if (!isCheckedIn) { + return ( + + +
+ Your Status + + Ready to Check In + +
+ + +

You are a Batch 10 member! Deploy your contract to check in

+ + + ); + } + + return ( + + +
+ Your Status + Checked In +
+ + +

+ Active with contract: {userContractAddress?.slice(0, 6)}...{userContractAddress?.slice(-4)} +

+ + + ); +}; + +const Home = () => { const { address: connectedAddress } = useAccount(); const { @@ -43,93 +167,67 @@ const Home: NextPage = () => { const isCheckedIn = userContractAddress && userContractAddress !== "0x0000000000000000000000000000000000000000"; return ( - <> -
-
-

- Welcome to - Batch 10 -

-

Get started by taking a look at your batch GitHub repository.

- - {error ? ( -
-

Error fetching contract data: {error.message}

-
- ) : ( - <> -
- Checked in builders count: - {counterLoading ? ( - -
- - ) : ( - {checkedInCounter !== undefined ? Number(checkedInCounter) : "0"} - )} -
- - {connectedAddress && ( -
-

Your Status

- {isLoading ? ( -
-
-
-
- ) : ( -
-
-
- - {isAllowListed ? "You are a member of Batch 10" : "You are not a member of Batch 10"} - -
-
-
- - {isCheckedIn - ? `Checked in with contract: ${userContractAddress?.slice( - 0, - 6, - )}...${userContractAddress?.slice(-4)}` - : "Not checked in yet"} - -
-
- )} -
- )} - - )} -
+
+
+

+ Welcome to + Batch 10 +

+

Get started by taking a look at your batch GitHub repository.

-
-
-
- -

- Tinker with your smart contract using the{" "} - - Debug Contracts - {" "} - tab. -

-
-
- -

- Explore your local transactions with the{" "} - - Block Explorer - {" "} - tab. -

+ {error ? ( +
+

Error fetching contract data: {error.message}

+
+ ) : ( +
+
+ Checked in builders count: + {counterLoading ? ( + +
+ + ) : ( + {checkedInCounter !== undefined ? Number(checkedInCounter) : "0"} + )}
+ + +
+ )} +
+ +
+
+
+ +

+ Tinker with your smart contract using the{" "} + + Debug Contracts + {" "} + tab. +

+
+
+ +

+ Explore your local transactions with the{" "} + + Block Explorer + {" "} + tab. +

- +
); }; From 6f838728b1e0e68a0bc94c28274e6a61806dfa05 Mon Sep 17 00:00:00 2001 From: Lukman-01 Date: Thu, 31 Oct 2024 20:31:29 +0100 Subject: [PATCH 3/6] Implemented all cases of member status --- packages/nextjs/app/page.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/nextjs/app/page.tsx b/packages/nextjs/app/page.tsx index c46d6e4..eb5a75b 100644 --- a/packages/nextjs/app/page.tsx +++ b/packages/nextjs/app/page.tsx @@ -193,11 +193,11 @@ const Home = () => {
)} From 015e7da7ba7ebcee0932c16c0101e380bbd3b176 Mon Sep 17 00:00:00 2001 From: Lukman-01 Date: Thu, 31 Oct 2024 20:34:01 +0100 Subject: [PATCH 4/6] Updated --- packages/nextjs/app/page.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/nextjs/app/page.tsx b/packages/nextjs/app/page.tsx index eb5a75b..9158ef2 100644 --- a/packages/nextjs/app/page.tsx +++ b/packages/nextjs/app/page.tsx @@ -2,6 +2,7 @@ import React from "react"; import Link from "next/link"; +import type { NextPage } from "next"; import { useAccount } from "wagmi"; import { BugAntIcon, MagnifyingGlassIcon } from "@heroicons/react/24/outline"; import { useScaffoldReadContract } from "~~/hooks/scaffold-eth"; @@ -130,7 +131,7 @@ const StatusSection = ({ ); }; -const Home = () => { +const Home: NextPage = () => { const { address: connectedAddress } = useAccount(); const { From feda9745671ac3df233ba82a903ff9dbc0ff04b0 Mon Sep 17 00:00:00 2001 From: Lukman-01 Date: Fri, 1 Nov 2024 17:00:21 +0100 Subject: [PATCH 5/6] correction implemented --- packages/nextjs/app/page.tsx | 19 ++++--------------- 1 file changed, 4 insertions(+), 15 deletions(-) diff --git a/packages/nextjs/app/page.tsx b/packages/nextjs/app/page.tsx index 9158ef2..331cbb9 100644 --- a/packages/nextjs/app/page.tsx +++ b/packages/nextjs/app/page.tsx @@ -1,10 +1,10 @@ "use client"; -import React from "react"; import Link from "next/link"; import type { NextPage } from "next"; import { useAccount } from "wagmi"; import { BugAntIcon, MagnifyingGlassIcon } from "@heroicons/react/24/outline"; +import { Address } from "~~/components/scaffold-eth"; import { useScaffoldReadContract } from "~~/hooks/scaffold-eth"; interface Props { @@ -12,15 +12,13 @@ interface Props { className?: string; } -interface StarknetReact { +interface BatchUserStatus { connectedAddress: string; isAllowListed: boolean; isCheckedIn: boolean; - userContractAddress: string; isLoading: boolean; } -// Alert Components const Alert = ({ children, className = "" }: Props) => (
{children}
); @@ -31,7 +29,6 @@ const AlertTitle = ({ children }: Props) => ( const AlertDescription = ({ children }: Props) =>
{children}
; -// Card Components const Card = ({ children, className = "" }: Props) => (
{children} @@ -48,14 +45,7 @@ const CardTitle = ({ children }: Props) => ( const CardContent = ({ children, className = "" }: Props) =>
{children}
; -// Status Component -const StatusSection = ({ - connectedAddress, - isAllowListed, - isCheckedIn, - userContractAddress, - isLoading, -}: StarknetReact) => { +const StatusSection = ({ connectedAddress, isAllowListed, isCheckedIn, isLoading }: BatchUserStatus) => { if (isLoading) { return ( @@ -124,7 +114,7 @@ const StatusSection = ({

- Active with contract: {userContractAddress?.slice(0, 6)}...{userContractAddress?.slice(-4)} + Active with wallet address:

@@ -197,7 +187,6 @@ const Home: NextPage = () => { connectedAddress={connectedAddress as string} isAllowListed={isAllowListed as boolean} isCheckedIn={isCheckedIn as boolean} - userContractAddress={userContractAddress as string} isLoading={isLoading as boolean} />
From c26025d30b7efcfa96cae6a4006bd0e1b0f3abcb Mon Sep 17 00:00:00 2001 From: Lukman-01 Date: Sun, 3 Nov 2024 19:34:44 +0100 Subject: [PATCH 6/6] address hydration error solved --- packages/nextjs/app/page.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/nextjs/app/page.tsx b/packages/nextjs/app/page.tsx index 331cbb9..5a377e0 100644 --- a/packages/nextjs/app/page.tsx +++ b/packages/nextjs/app/page.tsx @@ -113,9 +113,9 @@ const StatusSection = ({ connectedAddress, isAllowListed, isCheckedIn, isLoading
-

+

Active with wallet address:
-

+
);