feat: fetch ens names & update tests

gitcoinco · May 14, 2024 · 4d07a4b · 4d07a4b
1 parent ec4f607
commit 4d07a4b
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 10 deletions.
diff --git a/packages/round-manager/src/features/round/ViewManageTeam.tsx b/packages/round-manager/src/features/round/ViewManageTeam.tsx
@@ -1,6 +1,7 @@
 import { AddressAndRole } from "data-layer";
 import { Round } from "../api/types";
 import { useMemo } from "react";
+import { useEnsName } from "wagmi";
 
 const sortDataByRole = (data: AddressAndRole[]): AddressAndRole[] => {
   return data.sort((a, b) => {
@@ -18,12 +19,9 @@ export default function ViewManageTeam(props: { round: Round | undefined }) {
   return (
     <div>
       <p className="font-bold text-lg mt-2 mb-2">Manage Team</p>
+      <p className="text-sm text-gray-400 mb-2">View who is on your team.</p>
       <p className="text-sm text-gray-400 mb-2">
-        Add or remove admins and operators to your team.{" "}
-      </p>
-      <p className="text-sm text-gray-400 mb-2">
-        Make sure to have at least two admins at all times for security
-        purposes.
+        Only admins can add others to your team.
       </p>
       <p className="text-md mt-6 mb-4">View Members</p>
       <div className="overflow-x-auto">
@@ -54,11 +52,9 @@ export default function ViewManageTeam(props: { round: Round | undefined }) {
             {sortedRoles.map((item: AddressAndRole, index) => (
               <tr key={index}>
                 <td className="w-1/4 py-4 whitespace-nowrap text-sm font-medium text-gray-400">
-                  User
-                </td>
-                <td className="w-2/4 px-6 py-4 whitespace-nowrap text-sm text-gray-400">
-                  {item.address}
+                  User{index + 1}
                 </td>
+                <AddressRow address={item.address} />
                 <td className="w-1/4 px-6 py-4 whitespace-nowrap text-sm text-gray-400">
                   {item.role === "ADMIN" ? "Admin" : "Operator"}
                 </td>
@@ -70,3 +66,17 @@ export default function ViewManageTeam(props: { round: Round | undefined }) {
     </div>
   );
 }
+
+function AddressRow(props: { address: string }) {
+  const { data: ensName } = useEnsName({
+    address: props.address as `0x${string}`,
+    chainId: 1,
+  });
+  console.log("ensName", ensName);
+
+  return (
+    <td className="w-2/4 px-6 py-4 whitespace-nowrap text-sm text-gray-400">
+      {ensName || props.address}
+    </td>
+  );
+}
diff --git a/packages/round-manager/src/features/round/__tests__/ViewRoundPage.test.tsx b/packages/round-manager/src/features/round/__tests__/ViewRoundPage.test.tsx
@@ -30,7 +30,7 @@ jest.mock("@rainbow-me/rainbowkit", () => ({
 jest.mock("data-layer", () => ({
   ...jest.requireActual("data-layer"),
   useDataLayer: () => ({
-   getRoundById: jest.fn(),
+    getRoundById: jest.fn(),
   }),
 }));
 
@@ -173,6 +173,7 @@ describe("View Round", () => {
     expect(screen.getByText("Fund Round")).toBeInTheDocument();
     expect(screen.getByText("Grant Applications")).toBeInTheDocument();
     expect(screen.getByText("Round Settings")).toBeInTheDocument();
+    expect(screen.getByText("Manage Team")).toBeInTheDocument();
     expect(screen.getByText("Round Stats")).toBeInTheDocument();
     expect(screen.getByText("Round Results")).toBeInTheDocument();
     expect(screen.getByText("Fund Grantees")).toBeInTheDocument();
@@ -200,6 +201,7 @@ describe("View Round", () => {
     expect(screen.getByTestId("side-nav-bar")).toBeInTheDocument();
     expect(screen.getByText("Grant Applications")).toBeInTheDocument();
     expect(screen.getByText("Round Settings")).toBeInTheDocument();
+    expect(screen.getByText("Manage Team")).toBeInTheDocument();
     expect(screen.queryAllByText("Fund Contract").length).toBe(0);
     expect(screen.queryAllByText("Round Stats").length).toBe(0);
     expect(screen.queryAllByText("Round Results").length).toBe(0);