chore: redo donation history page (#3666)

Co-authored-by: Aditya Anand M C <[email protected]>

packages/grant-explorer/src/features/api/round.ts

@@ -1,66 +1,7 @@
 import { ApplicationStatus } from "./types";
-import { useEffect, useState } from "react";
-import { Address, getAddress } from "viem";
-import { Contribution, useDataLayer } from "data-layer";
-import { dateToEthereumTimestamp } from "common";
 
 export type RoundProject = {
   id: string;
   status: ApplicationStatus;
   payoutAddress: string;
 };
-
-export type ContributionHistoryState =
-  | { type: "loading" }
-  | {
-      type: "loaded";
-      data: { chainIds: number[]; data: Contribution[] };
-    }
-  | { type: "error"; error: string };
-
-export const useContributionHistory = (
-  chainIds: number[],
-  rawAddress: string
-) => {
-  const [state, setState] = useState<ContributionHistoryState>({
-    type: "loading",
-  });
-  const dataLayer = useDataLayer();
-
-  useEffect(() => {
-    const fetchContributions = async () => {
-      let address: Address = "0x";
-      try {
-        address = getAddress(rawAddress.toLowerCase());
-      } catch (e) {
-        return Promise.resolve({
-          chainIds,
-          error: "Invalid address",
-          data: [],
-        });
-      }
-
-      const contributions = await dataLayer.getDonationsByDonorAddress({
-        address,
-        chainIds,
-      });
-
-      setState({
-        type: "loaded",
-        data: {
-          chainIds: chainIds,
-          data: contributions.map((contribution) => ({
-            ...contribution,
-            timestamp: dateToEthereumTimestamp(
-              new Date(contribution.timestamp)
-            ).toString(),
-          })),
-        },
-      });
-    };
-
-    fetchContributions();
-  }, [chainIds, dataLayer, rawAddress]);
-
-  return state;
-};

packages/grant-explorer/src/features/common/CopyToClipboardButton.tsx

@@ -14,18 +14,18 @@ export default function CopyToClipboardButton(props: CopyToClipboardType) {
   return (
     <Button
       type="button"
-      className={`inline-flex bg-[#FFD9CD] text-black w-30 justify-center font-mono ${
-        active && "animate-[peachTransition_20s_ease-in]"
-      } ${props.styles}`}
+      className={`inline-flex text-black w-30 justify-center text-sm font-semibold bg-white border border-grey-100 ${props.styles}`}
       onClick={async () => {
         setActive(true);
         setTimeout(() => setActive(false), 1000);
 
         await navigator.clipboard.writeText(props.textToCopy);
       }}
     >
-      <LinkIcon className={props.iconStyle} aria-hidden="true" />
-      {active ? "Link Copied" : "Share Profile"}
+      <LinkIcon className={`mt-1 ${props.iconStyle}`} aria-hidden="true" />
+      <span className="ml-1">
+        {active ? "Link Copied" : "Share Profile"}
+      </span>
     </Button>
   );
 }

packages/grant-explorer/src/features/common/StatCard.tsx

@@ -1,8 +1,8 @@
 export function StatCard(props: { title: string; value: string | undefined }) {
   return (
-    <div className="rounded-2xl bg-[#F7F7F7] font-mono p-4">
+    <div className="rounded-2xl bg-[#F7F7F7] font-mono px-6 py-7">
       <div className="text-grey-400 text-4xl">{props.value}</div>
-      <div className="font-bold text-md pb-4 mt-4">{props.title}</div>
+      <div className="font-bold text-md mt-6">{props.title}</div>
     </div>
   );
 }