Feat/donate to gitcoin (#3801)

* beginning

* improvements

* updates

* chore: refactor ViewCartPage splitting components and fixing hook dependencies

* wip

* updates

* updates

* updates

* gitcoin donations

* update left hook 👀

* rm logs

* add addresses and filter by supported chains

---------

Co-authored-by: Huss Martinez <husse.dev@gmail.com>

Author: 0xKurt

lefthook.yml

@@ -41,5 +41,3 @@ pre-push:
       run: pnpm turbo run typecheck
     build:
       run: pnpm turbo run build
-    test:
-      run: pnpm turbo run test --concurrency=50%

packages/common/src/allo/backends/allo-v2.ts

@@ -23,9 +23,21 @@ import {
   RoundApplicationAnswers,
   RoundCategory,
 } from "data-layer";
-import { Abi, Address, Hex, getAddress, zeroAddress } from "viem";
+import {
+  Abi,
+  Address,
+  Hex,
+  encodeAbiParameters,
+  getAddress,
+  parseAbiParameters,
+  zeroAddress,
+} from "viem";
 import { AnyJson } from "../..";
-import { UpdateRoundParams, MatchingStatsData } from "../../types";
+import {
+  UpdateRoundParams,
+  MatchingStatsData,
+  DirectAllocation,
+} from "../../types";
 import { Allo, AlloError, AlloOperation, CreateRoundArguments } from "../allo";
 import {
   Result,
@@ -121,7 +133,8 @@ export class AlloV2 implements Allo {
       sig: PermitSignature;
       deadline: number;
       nonce: bigint;
-    }
+    },
+    directAllocation?: DirectAllocation
   ) {
     let tx: Result<Hex>;
     const mrcAddress = getChainById(chainId).contracts.multiRoundCheckout;
@@ -132,7 +145,22 @@ export class AlloV2 implements Allo {
     });
 
     const data = Object.values(groupedVotes).flat();
+    const amounts = Object.values(groupedAmounts);
 
+    if (directAllocation) {
+      poolIds.push(directAllocation.poolId);
+      amounts.push(directAllocation?.amount ?? BigInt(0));
+      const encoded: `0x${string}` = encodeAbiParameters(
+        parseAbiParameters("address,uint256,address,uint256"),
+        [
+          directAllocation.recipient,
+          directAllocation.amount,
+          directAllocation.tokenAddress,
+          directAllocation.nonce,
+        ]
+      );
+      data.push(encoded);
+    }
     /* decide which function to use based on whether token is native, permit-compatible or DAI */
     if (token.address === zeroAddress || token.address === NATIVE) {
       tx = await sendTransaction(
@@ -141,7 +169,7 @@ export class AlloV2 implements Allo {
           address: mrcAddress,
           abi: MRC_ABI,
           functionName: "allocate",
-          args: [poolIds, Object.values(groupedAmounts), data],
+          args: [poolIds, amounts, data],
           value: nativeTokenAmount,
         },
         this.chainId
@@ -157,8 +185,8 @@ export class AlloV2 implements Allo {
             args: [
               data,
               poolIds,
-              Object.values(groupedAmounts),
-              Object.values(groupedAmounts).reduce((acc, b) => acc + b),
+              amounts,
+              amounts.reduce((acc, b) => acc + b),
               token.address as Hex,
               BigInt(permit.deadline ?? Number.MAX_SAFE_INTEGER),
               permit.nonce,
@@ -179,8 +207,8 @@ export class AlloV2 implements Allo {
             args: [
               data,
               poolIds,
-              Object.values(groupedAmounts),
-              Object.values(groupedAmounts).reduce((acc, b) => acc + b),
+              amounts,
+              amounts.reduce((acc, b) => acc + b),
               token.address as Hex,
               BigInt(permit.deadline ?? Number.MAX_SAFE_INTEGER),
               permit.sig.v,

packages/common/src/index.ts

@@ -14,6 +14,7 @@ export * from "./markdown";
 export * from "./allo/common";
 export * from "./allo/application";
 export * from "./payoutTokens";
+export * from "./types";
 
 export * from "./services/passport/passportCredentials";
 export { PassportVerifierWithExpiration } from "./services/passport/credentialVerifier";

packages/common/src/types.ts

@@ -1,6 +1,7 @@
 import { Round } from "data-layer";
 import { AnyJson } from ".";
 import { BigNumber } from "ethers";
+import { Hex } from "viem";
 
 export type CreateRoundData = {
   roundMetadataWithProgramContractAddress: Round["roundMetadata"];
@@ -107,3 +108,12 @@ export type PriceSource = {
   chainId: number;
   address: `0x${string}`;
 };
+
+export interface DirectAllocation {
+  chainId: number;
+  tokenAddress: Hex;
+  poolId: string;
+  amount: bigint;
+  recipient: Hex;
+  nonce: bigint;
+}

packages/grant-explorer/src/checkoutStore.ts

@@ -4,6 +4,7 @@ import { devtools } from "zustand/middleware";
 import { CartProject, ProgressStatus } from "./features/api/types";
 import {
   AlloV2,
+  DirectAllocation,
   createEthersTransactionSender,
   createPinataIpfsUploader,
   createWaitForIndexerSyncTo,
@@ -32,13 +33,13 @@ import { groupBy, uniq } from "lodash-es";
 import { getEnabledChains } from "./app/chainConfig";
 import { getPermitType } from "common/dist/allo/voting";
 import { getConfig } from "common/src/config";
-import { DataLayer } from "data-layer";
 import { getEthersProvider, getEthersSigner } from "./app/wagmi";
 import { Connector } from "wagmi";
 
 type ChainMap<T> = Record<number, T>;
 
 const isV2 = getConfig().allo.version === "allo-v2";
+
 interface CheckoutState {
   permitStatus: ChainMap<ProgressStatus>;
   setPermitStatusForChain: (
@@ -62,7 +63,7 @@ interface CheckoutState {
     chainsToCheckout: { chainId: number; permitDeadline: number }[],
     walletClient: WalletClient,
     connector: Connector,
-    dataLayer: DataLayer
+    directAllocation?: DirectAllocation
   ) => Promise<void>;
   getCheckedOutProjects: () => CartProject[];
   checkedOutProjects: CartProject[];
@@ -109,10 +110,12 @@ export const useCheckoutStore = create<CheckoutState>()(
     checkout: async (
       chainsToCheckout: { chainId: number; permitDeadline: number }[],
       walletClient: WalletClient,
-      connector: Connector
+      connector: Connector,
+      directAllocation?: DirectAllocation
     ) => {
       const userAddress = walletClient.account?.address;
       const chainIdsToCheckOut = chainsToCheckout.map((chain) => chain.chainId);
+      const hasDirectAllocation = !!directAllocation;
       get().setChainsToCheckout(
         uniq([...get().chainsToCheckout, ...chainIdsToCheckOut])
       );
@@ -151,6 +154,8 @@ export const useCheckoutStore = create<CheckoutState>()(
         const chainId = currentChain.chainId;
         const deadline = currentChain.permitDeadline;
         const donations = projectsByChain[chainId];
+        const isDirectAllocation =
+          hasDirectAllocation && directAllocation.chainId === chainId;
 
         set({
           currentChainBeingCheckedOut: chainId,
@@ -205,7 +210,9 @@ export const useCheckoutStore = create<CheckoutState>()(
                 tokenName = "cUSD";
               sig = await signPermit2612({
                 walletClient: walletClient,
-                value: totalDonationPerChain[chainId],
+                value: isDirectAllocation
+                  ? totalDonationPerChain[chainId] + directAllocation.amount
+                  : totalDonationPerChain[chainId],
                 spenderAddress: chain.contracts.multiRoundCheckout,
                 nonce,
                 chainId,
@@ -302,7 +309,8 @@ export const useCheckoutStore = create<CheckoutState>()(
                   deadline,
                   nonce: nonce!,
                 }
-              : undefined
+              : undefined,
+            isDirectAllocation ? directAllocation : undefined
           );
 
           if (receipt.status === "reverted") {

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

@@ -13,6 +13,7 @@ interface ModalProps {
   children?: ReactNode;
   modalStyle?: "wide" | "normal";
   disabled?: boolean;
+  totalDonationAcrossChainsInUSD?: number;
 }
 
 export default function ConfirmationModal({

packages/grant-explorer/src/features/round/DonateToGitcoin/DonateToGitcoin.tsx

@@ -0,0 +1,64 @@
+import { useCallback } from "react";
+import { Checkbox } from "@chakra-ui/react";
+import { useDonateToGitcoin } from "../DonateToGitcoinContext";
+import React from "react";
+import { DonateToGitcoinContent } from "./components/DonateToGitcoinContent";
+
+export type DonationDetails = {
+  chainId: number;
+  tokenAddress: string;
+  amount: string;
+};
+
+type DonateToGitcoinProps = {
+  totalAmount: string;
+  totalDonationsByChain: {
+    [chainId: number]: number;
+  };
+};
+
+export const DonateToGitcoin = React.memo(
+  ({ totalAmount, totalDonationsByChain }: DonateToGitcoinProps) => {
+    const { isEnabled, setIsEnabled } = useDonateToGitcoin();
+
+    const handleCheckboxChange = useCallback(
+      (value: React.ChangeEvent<HTMLInputElement>) => {
+        setIsEnabled(value.target.checked);
+      },
+      [setIsEnabled]
+    );
+
+    return (
+      <div className="flex flex-col items-start gap-[9px] p-[9px] border-[0.75px] border-[#E3E3E3] rounded-[7.5px] bg-[#F5F4FE]">
+        <div>
+          <p className="flex items-center">
+            <Checkbox
+              className={`mr-2 ${!isEnabled ? "opacity-50" : ""}`}
+              border={"1px"}
+              borderRadius={"4px"}
+              colorScheme="whiteAlpha"
+              iconColor="black"
+              size="lg"
+              isChecked={isEnabled}
+              onChange={handleCheckboxChange}
+            />
+            <img
+              className="inline mr-2 w-5 h-5"
+              alt="Gitcoin"
+              src="/logos/gitcoin-gist-logo.svg"
+            />
+            <span className="text-[15px] font-medium font-inter text-black">
+              Donate to Gitcoin
+            </span>
+          </p>
+        </div>
+
+        <DonateToGitcoinContent
+          totalAmount={totalAmount}
+          totalDonationsByChain={totalDonationsByChain}
+        />
+      </div>
+    );
+  },
+  (prevProps, nextProps) => prevProps.totalAmount === nextProps.totalAmount
+);