From c0be58440a85f68fad0fec582874b7eb6c866b7e Mon Sep 17 00:00:00 2001
From: kualta <contact@kualta.dev>
Date: Sat, 12 Oct 2024 21:15:43 +0400
Subject: [PATCH] add kind donors

---
 src/components/Dontations.tsx   |  0
 src/components/TopDonors.tsx    | 82 ++++++++++++++++++---------------
 src/components/menu/Sidebar.tsx | 26 ++++-------
 3 files changed, 54 insertions(+), 54 deletions(-)
 delete mode 100644 src/components/Dontations.tsx

diff --git a/src/components/Dontations.tsx b/src/components/Dontations.tsx
deleted file mode 100644
index e69de29b..00000000
diff --git a/src/components/TopDonors.tsx b/src/components/TopDonors.tsx
index 5a6c6580..7784e3af 100644
--- a/src/components/TopDonors.tsx
+++ b/src/components/TopDonors.tsx
@@ -1,7 +1,5 @@
-import axios from "axios";
 import { ethers } from "ethers";
-import type React from "react";
-import { useEffect, useState } from "react";
+import Link from "next/link";
 import { env } from "~/env.mjs";
 
 interface Donor {
@@ -9,51 +7,59 @@ interface Donor {
   totalAmount: string;
 }
 
-const DONOR_WALLET = env.DONOR_WALLET
-const ETHERSCAN_API_KEY = env.ETHERSCAN_API_KEY
+const DONOR_WALLET = env.DONOR_WALLET;
+const ETHERSCAN_API_KEY = env.ETHERSCAN_API_KEY;
 
-export const TopDonors = () => {
-  const [topDonors, setTopDonors] = useState<Donor[]>([]);
+export const revalidate = 3600;
 
-  useEffect(() => {
-    fetchTopDonors();
-  }, []);
+async function fetchTopDonors(): Promise<Donor[]> {
+  try {
+    const response = await fetch(
+      `https://api.etherscan.io/api?module=account&action=txlist&address=${DONOR_WALLET}&startblock=0&endblock=99999999&sort=desc&apikey=${ETHERSCAN_API_KEY}`,
+      { next: { revalidate: 3600 } },
+    );
 
-  const fetchTopDonors = async () => {
-    try {
-      const response = await axios.get(
-        `https://api.etherscan.io/api?module=account&action=txlist&address=${DONOR_WALLET}&startblock=0&endblock=99999999&sort=desc&apikey=${ETHERSCAN_API_KEY}`,
-      );
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
 
-      const transactions = response.data.result;
+    const data = await response.json();
+    const transactions = data.result;
 
-      const donorMap = new Map<string, ethers.BigNumber>();
+    const donorMap = new Map<string, ethers.BigNumber>();
 
-      for (const tx of transactions) {
-        if (tx.to.toLowerCase() === DONOR_WALLET.toLowerCase()) {
-          const amount = ethers.BigNumber.from(tx.value);
-          const currentTotal = donorMap.get(tx.from) || ethers.BigNumber.from(0);
-          donorMap.set(tx.from, currentTotal.add(amount));
-        }
+    for (const tx of transactions) {
+      if (tx.to.toLowerCase() === DONOR_WALLET.toLowerCase()) {
+        const amount = ethers.BigNumber.from(tx.value);
+        const currentTotal = donorMap.get(tx.from) || ethers.BigNumber.from(0);
+        donorMap.set(tx.from, currentTotal.add(amount));
       }
+    }
 
-      const sortedDonors = Array.from(donorMap.entries())
-        .sort((a, b) => (b[1].gt(a[1]) ? 1 : -1))
-        .slice(0, 5)
-        .map(([address, amount]) => ({
-          address,
-          totalAmount: ethers.utils.formatEther(amount),
-        }));
+    const sortedDonors = Array.from(donorMap.entries())
+      .sort((a, b) => (b[1].gt(a[1]) ? 1 : -1))
+      .slice(0, 5)
+      .map(([address, amount]) => ({
+        address,
+        totalAmount: ethers.utils.formatEther(amount),
+      }));
 
-      setTopDonors(sortedDonors);
-    } catch (error) {
-      console.error("Error fetching top donors:", error);
-    }
-  };
+    return sortedDonors;
+  } catch (error) {
+    console.error("Error fetching top donors:", error);
+    return [];
+  }
+}
+
+export async function TopDonors() {
+  const topDonors = await fetchTopDonors();
 
   return (
-    <div className="bg-white shadow-md rounded-lg p-6">
-      <h2 className="text-2xl font-bold mb-4">Top 5 Donors</h2>
+    <div className="rounded-lg">
+      <p className="pb-2">
+        Pingpad is an <Link href="https://github.com/pingpad-io/ping">open source</Link> project, and we are being
+        supported by our kind donors:{" "}
+      </p>
       <ul>
         {topDonors.map((donor, index) => (
           <li key={donor.address} className="mb-2">
@@ -64,4 +70,4 @@ export const TopDonors = () => {
       </ul>
     </div>
   );
-};
+}
diff --git a/src/components/menu/Sidebar.tsx b/src/components/menu/Sidebar.tsx
index 2fee1cb7..940d2b2d 100644
--- a/src/components/menu/Sidebar.tsx
+++ b/src/components/menu/Sidebar.tsx
@@ -8,6 +8,7 @@ import { Button } from "../ui/button";
 import { lensProfileToUser } from "../user/User";
 import { UserAvatar } from "../user/UserAvatar";
 import { SearchBar } from "./Search";
+import { TopDonors } from "../TopDonors";
 
 const UserBar = async () => {
   const { handle, profileId, client } = await getServerAuth();
@@ -63,22 +64,15 @@ export function Sidebar() {
           </AccordionTrigger>
           <AccordionContent>
             <p>Welcome to pingpad!</p>
-            <p>This is a beta, some things might be broken</p>
-            <p>We would love to hear what you think!</p>
-            <p>
-              Leave your feedback here:{" "}
-              <Link className="underline underline-offset-2" href={"/c/pingpad"}>
-                /pingpad
-              </Link>
-            </p>
-            <br />
-            <p>
-              big love,{" "}
-              <Link className="underline underline-offset-2" href={"/u/pingpad"}>
-                @pingpad
-              </Link>{" "}
-              team
-            </p>
+            <p>This is a beta, we would love to hear what you think!</p>
+          </AccordionContent>
+        </AccordionItem>
+        <AccordionItem value="donos">
+          <AccordionTrigger className="py-2">
+            <span> Top Donors </span>
+          </AccordionTrigger>
+          <AccordionContent>
+            <TopDonors />
           </AccordionContent>
         </AccordionItem>
       </Accordion>