From 5b62d7ea89ed4a2843d7c51fb8b9c3c385f01bd6 Mon Sep 17 00:00:00 2001 From: Gbolahan Akande Date: Wed, 27 Nov 2024 08:29:32 +0100 Subject: [PATCH 1/3] Refactored and focused on builders grid --- packages/nextjs/app/api/builders/route.ts | 19 ++++++ packages/nextjs/app/page.tsx | 3 + .../nextjs/components/batch/BuildersGrid.tsx | 61 +++++++++++++++++++ 3 files changed, 83 insertions(+) create mode 100644 packages/nextjs/app/api/builders/route.ts create mode 100644 packages/nextjs/components/batch/BuildersGrid.tsx diff --git a/packages/nextjs/app/api/builders/route.ts b/packages/nextjs/app/api/builders/route.ts new file mode 100644 index 0000000..977f15b --- /dev/null +++ b/packages/nextjs/app/api/builders/route.ts @@ -0,0 +1,19 @@ +import { NextResponse } from "next/server"; +import { readdir } from "fs/promises"; +import path from "path"; + +export async function GET() { + const buildersPath = path.join(process.cwd(), "app/builders"); + + try { + const directories = await readdir(buildersPath, { withFileTypes: true }); + const addresses = directories + .filter(dirent => dirent.isDirectory()) + .map(dirent => dirent.name) + .filter(name => name.startsWith("0x")); + + return NextResponse.json(addresses); + } catch { + return NextResponse.json([], { status: 500 }); + } +} diff --git a/packages/nextjs/app/page.tsx b/packages/nextjs/app/page.tsx index a0a413f..ec2b3f9 100644 --- a/packages/nextjs/app/page.tsx +++ b/packages/nextjs/app/page.tsx @@ -3,6 +3,7 @@ import Link from "next/link"; import type { NextPage } from "next"; import { BugAntIcon, MagnifyingGlassIcon } from "@heroicons/react/24/outline"; +import BuildersGrid from "~~/components/batch/BuildersGrid"; const Home: NextPage = () => { return ( @@ -44,6 +45,8 @@ const Home: NextPage = () => { + {/* Builders Grid */} + ); diff --git a/packages/nextjs/components/batch/BuildersGrid.tsx b/packages/nextjs/components/batch/BuildersGrid.tsx new file mode 100644 index 0000000..0088700 --- /dev/null +++ b/packages/nextjs/components/batch/BuildersGrid.tsx @@ -0,0 +1,61 @@ +import Link from "next/link"; +import { useQuery } from "@tanstack/react-query"; +import { Address } from "~~/components/scaffold-eth"; +import { useScaffoldReadContract } from "~~/hooks/scaffold-eth"; + +const BuildersGrid = () => { + // Get total number of checked-in builders from contract + const { data: checkedInCount, isLoading: countLoading } = useScaffoldReadContract({ + contractName: "BatchRegistry", + functionName: "checkedInCounter", + }); + + // Get builder profiles from filesystem + const { data: profileBuilders = [], isLoading: profilesLoading } = useQuery({ + queryKey: ["builders-profiles"], + queryFn: async () => { + const response = await fetch("/api/builders"); + if (!response.ok) throw new Error("Failed to fetch builders"); + return response.json(); + }, + }); + + if (countLoading || profilesLoading) { + return ( +
+ +
+ ); + } + + return ( +
+
+

Batch Members ({checkedInCount?.toString() || "0"} checked in)

+

Showing builders who have created their profiles

+
+ +
+ {profileBuilders.map((address, idx) => ( + +
+
+
+ View Profile → + {checkedInCount && checkedInCount > 0 && ( + Checked In + )} +
+
+ + ))} +
+
+ ); +}; + +export default BuildersGrid; From 6530fbc2169c3c9ee6a03ecb047131fa418dee67 Mon Sep 17 00:00:00 2001 From: melanke Date: Thu, 5 Dec 2024 10:37:49 -0300 Subject: [PATCH 2/3] Showing Builders without profile on BuildersGrid; Removing the checkedInCount, it's supposed to be implemented on a different task --- .../nextjs/components/batch/BuildersGrid.tsx | 43 ++++++++++++------- 1 file changed, 27 insertions(+), 16 deletions(-) diff --git a/packages/nextjs/components/batch/BuildersGrid.tsx b/packages/nextjs/components/batch/BuildersGrid.tsx index 0088700..368a20f 100644 --- a/packages/nextjs/components/batch/BuildersGrid.tsx +++ b/packages/nextjs/components/batch/BuildersGrid.tsx @@ -1,15 +1,9 @@ import Link from "next/link"; import { useQuery } from "@tanstack/react-query"; import { Address } from "~~/components/scaffold-eth"; -import { useScaffoldReadContract } from "~~/hooks/scaffold-eth"; +import { useScaffoldEventHistory } from "~~/hooks/scaffold-eth"; const BuildersGrid = () => { - // Get total number of checked-in builders from contract - const { data: checkedInCount, isLoading: countLoading } = useScaffoldReadContract({ - contractName: "BatchRegistry", - functionName: "checkedInCounter", - }); - // Get builder profiles from filesystem const { data: profileBuilders = [], isLoading: profilesLoading } = useQuery({ queryKey: ["builders-profiles"], @@ -20,7 +14,14 @@ const BuildersGrid = () => { }, }); - if (countLoading || profilesLoading) { + // Get checked-in builders from contract events + const { data: events, isLoading: eventsLoading } = useScaffoldEventHistory({ + contractName: "BatchRegistry", + eventName: "CheckedIn", + fromBlock: 127324219n, + }); + + if (profilesLoading || eventsLoading) { return (
@@ -28,13 +29,13 @@ const BuildersGrid = () => { ); } + const buildersWithoutProfile = (events ?? []) + .map(event => event.args.builder) + .filter(address => address && !profileBuilders.includes(address)); + console.log(buildersWithoutProfile); + return (
-
-

Batch Members ({checkedInCount?.toString() || "0"} checked in)

-

Showing builders who have created their profiles

-
-
{profileBuilders.map((address, idx) => ( {
View Profile → - {checkedInCount && checkedInCount > 0 && ( - Checked In - )}
))} + {buildersWithoutProfile.map((address, idx) => ( +
+
+
+
+ No Profile +
+
+
+ ))}
); From 75eb1f933a6faa3d6045ee458eabd1f5f74dafae Mon Sep 17 00:00:00 2001 From: melanke Date: Tue, 10 Dec 2024 14:20:53 -0300 Subject: [PATCH 3/3] remove console.log and fix error on log --- packages/nextjs/components/batch/BuildersGrid.tsx | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/nextjs/components/batch/BuildersGrid.tsx b/packages/nextjs/components/batch/BuildersGrid.tsx index 368a20f..324d76d 100644 --- a/packages/nextjs/components/batch/BuildersGrid.tsx +++ b/packages/nextjs/components/batch/BuildersGrid.tsx @@ -32,24 +32,24 @@ const BuildersGrid = () => { const buildersWithoutProfile = (events ?? []) .map(event => event.args.builder) .filter(address => address && !profileBuilders.includes(address)); - console.log(buildersWithoutProfile); return (
{profileBuilders.map((address, idx) => ( -
- View Profile → + + View Profile → +
- +
))} {buildersWithoutProfile.map((address, idx) => (