wip: matching estimate hook

Author: vacekj

packages/grant-explorer/src/features/round/ViewCartPage/SummaryBox.tsx

@@ -1,11 +1,21 @@
 import { BigNumber, ethers } from "ethers";
 import React from "react";
 import { PayoutToken } from "../../api/types";
+
+function useMatchingEstimation(): {
+  totalMatchingEstimation: bigint;
+} {
+  return {
+    totalMatchingEstimation: 0n,
+  };
+}
+
 type SummaryBoxProps = {
   payoutTokenPrice: number | undefined;
   totalDonation: BigNumber;
   selectedPayoutToken: PayoutToken;
 };
+
 export function Summary({
   payoutTokenPrice,
   totalDonation,
@@ -20,6 +30,27 @@ export function Summary({
   return (
     <div className="shrink mb-5 block px-[16px] py-4 rounded-lg shadow-lg bg-white border border-violet-400 font-semibold">
       <h2 className="text-xl border-b-2 pb-2">Summary</h2>
+      <div className="flex justify-between mt-4">
+        <p>Estimated matching</p>
+        <p>
+          <span data-testid={"totalDonation"} className="mr-2">
+            {ethers.utils.formatUnits(
+              totalDonation,
+              selectedPayoutToken.decimal
+            )}
+          </span>
+          <span data-testid={"summaryPayoutToken"}>
+            {selectedPayoutToken.name}
+          </span>
+        </p>
+      </div>
+      {payoutTokenPrice && (
+        <div className="flex flex-row-reverse mt-2">
+          <p className="text-[14px] text-grey-400">
+            $ {totalDonationInUSD?.toFixed(2)}
+          </p>
+        </div>
+      )}
       <div className="flex justify-between mt-4">
         <p>Your Contribution</p>
         <p>