ready for whitelist

lfglabs-dev · Jul 15, 2024 · 26b37fa · 26b37fa
1 parent 3975779
commit 26b37fa
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 111 deletions.
diff --git a/components/discount/freeRegisterCheckout.tsx b/components/discount/freeRegisterCheckout.tsx
@@ -62,13 +62,9 @@ const FreeRegisterCheckout: FunctionComponent<FreeRegisterCheckoutProps> = ({
   const {
     handleRegister,
     paymasterRewards,
-    gasTokenPrices,
-    gasTokenPrice,
     loadingGas,
-    gaslessCompatibility,
-    setGasTokenPrice,
-    maxGasTokenAmount,
     loadingDeploymentData,
+    refreshRewards,
   } = usePaymaster(callData, async (transactionHash) => {
     setDomainsMinting((prev) =>
       new Map(prev).set(encodedDomain.toString(), true)
@@ -86,6 +82,11 @@ const FreeRegisterCheckout: FunctionComponent<FreeRegisterCheckoutProps> = ({
     if (address) setTargetAddress(address);
   }, [address]);
 
+  useEffect(() => {
+    if (loadingCoupon || !coupon) return;
+    refreshRewards();
+  }, [loadingCoupon, coupon, refreshRewards]);
+
   useEffect(() => {
     // salt must not be empty to preserve privacy
     if (!salt) return;
@@ -188,16 +189,7 @@ const FreeRegisterCheckout: FunctionComponent<FreeRegisterCheckoutProps> = ({
               </div>
             </div>
             <div className={styles.summary}>
-              <FreeRegisterSummary
-                duration={duration}
-                domain={domain}
-                hasPaymasterRewards={paymasterRewards.length > 0}
-                gasTokenPrices={gasTokenPrices}
-                gasTokenPrice={gasTokenPrice}
-                setGasTokenPrice={setGasTokenPrice}
-                maxGasTokenAmount={maxGasTokenAmount}
-                deployed={gaslessCompatibility?.isCompatible}
-              />
+              <FreeRegisterSummary duration={duration} domain={domain} />
               <Divider className="w-full" />
               <TermCheckbox
                 checked={termsBox}

diff --git a/components/discount/freeRegisterSummary.tsx b/components/discount/freeRegisterSummary.tsx
@@ -2,43 +2,23 @@ import React, { FunctionComponent } from "react";
 import styles from "../../styles/components/registerV3.module.css";
 import { getYearlyPrice } from "@/utils/priceService";
 import DoneIcon from "../UI/iconsComponents/icons/doneIcon";
-import { GasTokenPrice } from "@avnu/gasless-sdk";
-import { tokenNames } from "@/utils/altcoinService";
-import { shortenDomain } from "@/utils/stringService";
-import { Alert } from "@mui/material";
 import { useAccount } from "@starknet-react/core";
 
 type FreeRegisterSummaryProps = {
   duration: number;
   domain: string;
-  hasPaymasterRewards?: boolean;
-  gasTokenPrices?: GasTokenPrice[];
-  gasTokenPrice?: GasTokenPrice;
-  setGasTokenPrice: (price: GasTokenPrice) => void;
-  maxGasTokenAmount?: bigint;
-  deployed?: boolean;
 };
 
 const FreeRegisterSummary: FunctionComponent<FreeRegisterSummaryProps> = ({
   domain,
   duration,
-  hasPaymasterRewards,
-  gasTokenPrices,
-  gasTokenPrice,
-  setGasTokenPrice,
-  maxGasTokenAmount,
-  deployed,
 }) => {
   const { address } = useAccount();
 
   function getMessage() {
     return `${Math.floor(duration / 30)} months of domain registration`;
   }
 
-  const getTokenName = (price: GasTokenPrice) =>
-    tokenNames[price.tokenAddress as keyof typeof tokenNames] ||
-    shortenDomain(price.tokenAddress);
-
   return (
     <div className={styles.pricesSummary}>
       <div className={styles.totalDue}>
@@ -52,77 +32,21 @@ const FreeRegisterSummary: FunctionComponent<FreeRegisterSummaryProps> = ({
           </p>
         </div>
         {address ? (
-          hasPaymasterRewards ? (
-            <div className="flex items-center gap-2">
-              <DoneIcon width="24" color="green" />
-              <p className="text-sm">
-                No gas fees to pay. You have a{" "}
-                <a
-                  href="https://doc.avnu.fi/starknet-paymaster/introduction"
-                  target="_blank"
-                  rel="noreferrer noopener"
-                  className="underline"
-                >
-                  Paymaster
-                </a>{" "}
-                reward.
-              </p>
-            </div>
-          ) : (
-            <div className="flex flex-col gap-2 w-full">
-              <p className="text-sm">
-                No{" "}
-                <a
-                  href="https://doc.avnu.fi/starknet-paymaster/introduction"
-                  target="_blank"
-                  rel="noreferrer noopener"
-                  className="underline"
-                >
-                  Paymaster
-                </a>{" "}
-                reward. {deployed ? "Please select a gas token." : ""}
-              </p>
-              {deployed ? (
-                <>
-                  <div className={styles.gasMethods}>
-                    {gasTokenPrices?.map((price) => (
-                      <button
-                        disabled={
-                          price.tokenAddress === gasTokenPrice?.tokenAddress
-                        }
-                        onClick={() => setGasTokenPrice(price)}
-                        key={price.tokenAddress}
-                        className={
-                          price.tokenAddress === gasTokenPrice?.tokenAddress
-                            ? styles.gasMethodSelected
-                            : styles.gasMethod
-                        }
-                        type="button"
-                      >
-                        {getTokenName(price)}{" "}
-                      </button>
-                    ))}
-                  </div>
-                  {gasTokenPrice ? (
-                    <Alert severity="info">
-                      {maxGasTokenAmount
-                        ? `Please make sure to have at least ${maxGasTokenAmount.toString()} ${getTokenName(
-                            gasTokenPrice
-                          )} to prevent transaction failure.`
-                        : `Please make sure to have enough ${getTokenName(
-                            gasTokenPrice
-                          )} to prevent transaction failure.`}
-                    </Alert>
-                  ) : null}
-                </>
-              ) : (
-                <Alert severity="error">
-                  Your wallet is not deployed. To sponsor its deployment, please
-                  gather rewards.
-                </Alert>
-              )}
-            </div>
-          )
+          <div className="flex items-center gap-2">
+            <DoneIcon width="24" color="green" />
+            <p className="text-sm">
+              No gas fees to pay. You have a{" "}
+              <a
+                href="https://doc.avnu.fi/starknet-paymaster/introduction"
+                target="_blank"
+                rel="noreferrer noopener"
+                className="underline"
+              >
+                Paymaster
+              </a>{" "}
+              reward.
+            </p>
+          </div>
         ) : null}
       </div>
     </div>

diff --git a/hooks/paymaster.tsx b/hooks/paymaster.tsx
@@ -63,6 +63,14 @@ const usePaymaster = (
     });
   }, []);
 
+  const refreshRewards = useCallback(() => {
+    if (!account) return;
+    fetchAccountsRewards(account.address, {
+      ...gaslessOptions,
+      protocol: "STARKNETID",
+    }).then(setPaymasterRewards);
+  }, [account]);
+
   useEffect(() => {
     if (!account || !gaslessAPIAvailable) return;
     fetchAccountCompatibility(account.address, gaslessOptions)
@@ -71,11 +79,8 @@ const usePaymaster = (
         setGaslessCompatibility(undefined);
         console.error(e);
       });
-    fetchAccountsRewards(account.address, {
-      ...gaslessOptions,
-      protocol: "STARKNETID",
-    }).then(setPaymasterRewards);
-  }, [account, gaslessAPIAvailable]);
+    refreshRewards();
+  }, [account, gaslessAPIAvailable, refreshRewards]);
 
   const estimateCalls = useCallback(
     async (
@@ -238,6 +243,7 @@ const usePaymaster = (
     gaslessCompatibility,
     maxGasTokenAmount,
     loadingDeploymentData,
+    refreshRewards,
   };
 };