Merge branch 'main' into yash/ocr-contracts-integration

Author: MananTank

.changeset/shaky-candles-rule.md

@@ -43,7 +43,6 @@
     "next-themes": "^0.4.6",
     "nextjs-toploader": "^1.6.12",
     "nuqs": "^2.4.3",
-    "p-limit": "^6.2.0",
     "papaparse": "^5.5.3",
     "pluralize": "^8.0.0",
     "posthog-js": "1.256.1",

.changeset/slick-cups-joke.md

@@ -17,9 +17,7 @@ export function DynamicHeight(props: {
         boxSizing: "border-box",
         height: height ? `${height}px` : "auto",
         overflow: "hidden",
-        transition:
-          props.transition ||
-          "height 210ms cubic-bezier(0.175, 0.885, 0.32, 1.1)",
+        transition: props.transition || "height 250ms ease",
       }}
     >
       <div

.changeset/warm-ways-decide.md

@@ -1,7 +1,7 @@
 "use client";
 
 import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
-import { CheckIcon } from "lucide-react";
+import { CheckIcon, MinusIcon } from "lucide-react";
 import * as React from "react";
 
 import { cn } from "@/lib/utils";
@@ -21,7 +21,11 @@ const Checkbox = React.forwardRef<
     <CheckboxPrimitive.Indicator
       className={cn("flex items-center justify-center text-current")}
     >
-      <CheckIcon className="size-4" />
+      {props.checked === "indeterminate" ? (
+        <MinusIcon className="size-3" />
+      ) : (
+        <CheckIcon className="size-4" />
+      )}
     </CheckboxPrimitive.Indicator>
   </CheckboxPrimitive.Root>
 ));

apps/dashboard/package.json

@@ -1,5 +1,4 @@
-import { useQuery } from "@tanstack/react-query";
-import pLimit from "p-limit";
+import { useQuery, useQueryClient } from "@tanstack/react-query";
 import Papa from "papaparse";
 import { useCallback, useState } from "react";
 import { isAddress, type ThirdwebClient, ZERO_ADDRESS } from "thirdweb";
@@ -95,6 +94,7 @@ export function useCsvUpload<
   // Always gonna need the wallet address
   T extends { address: string },
 >(props: Props<T>) {
+  const queryClient = useQueryClient();
   const [rawData, setRawData] = useState<
     T[] | Array<T & { [key in string]: unknown }>
   >(props.defaultRawData || []);
@@ -132,16 +132,29 @@ export function useCsvUpload<
     [props.csvParser],
   );
 
+  const [normalizeProgress, setNormalizeProgress] = useState({
+    total: 0,
+    current: 0,
+  });
+
   const normalizeQuery = useQuery({
     queryFn: async () => {
-      const limit = pLimit(50);
-      const results = await Promise.all(
-        rawData.map((item) => {
-          return limit(() =>
+      const batchSize = 50;
+      const results = [];
+      for (let i = 0; i < rawData.length; i += batchSize) {
+        const batch = rawData.slice(i, i + batchSize);
+        setNormalizeProgress({
+          total: rawData.length,
+          current: i,
+        });
+        const batchResults = await Promise.all(
+          batch.map((item) =>
             checkIsAddress({ item: item, thirdwebClient: props.client }),
-          );
-        }),
-      );
+          ),
+        );
+        results.push(...batchResults);
+      }
+
       return {
         invalidFound: !!results.find((item) => !item?.isValid),
         result: processAirdropData(results),
@@ -153,12 +166,18 @@ export function useCsvUpload<
 
   const removeInvalid = useCallback(() => {
     const filteredData = normalizeQuery.data?.result.filter(
-      ({ isValid }) => isValid,
+      (d) => d.isValid && d.resolvedAddress !== ZERO_ADDRESS,
     );
-    // double type assertion is save here because we don't really use this variable (only check for its length)
-    // Also filteredData's type is the superset of T[]
-    setRawData(filteredData as unknown as T[]);
-  }, [normalizeQuery.data?.result]);
+
+    if (filteredData && normalizeQuery.data) {
+      // Directly update the query result instead of setting new state to avoid triggering refetch
+      queryClient.setQueryData(["snapshot-check-isAddress", rawData], {
+        ...normalizeQuery.data,
+        result: filteredData,
+        invalidFound: false, // Since we removed all invalid items
+      });
+    }
+  }, [normalizeQuery.data, queryClient, rawData]);
 
   const processData = useCallback(
     (data: T[]) => {
@@ -181,5 +200,6 @@ export function useCsvUpload<
     removeInvalid,
     reset,
     setFiles,
+    normalizeProgress,
   };
 }

apps/dashboard/src/@/components/ui/DynamicHeight.tsx

@@ -7,15 +7,19 @@ import {
 import { toast } from "sonner";
 import {
   type Chain,
+  NATIVE_TOKEN_ADDRESS,
   sendAndConfirmTransaction,
   type ThirdwebClient,
   type ThirdwebContract,
 } from "thirdweb";
+import type { GetBalanceResult } from "thirdweb/extensions/erc20";
 import { distribute, distributeByToken } from "thirdweb/extensions/split";
 import { getOwnedTokens } from "thirdweb/insight";
 import { useActiveAccount } from "thirdweb/react";
+import { getWalletBalance } from "thirdweb/wallets";
 import invariant from "tiny-invariant";
 import { parseError } from "../utils/errorParser";
+import { tryCatch } from "../utils/try-catch";
 
 function getTokenBalancesQuery(params: {
   ownerAddress: string;
@@ -24,14 +28,39 @@ function getTokenBalancesQuery(params: {
 }) {
   return queryOptions({
     queryFn: async () => {
-      return getOwnedTokens({
+      const ownedTokenBalancePromise = getOwnedTokens({
         client: params.client,
         chains: [params.chain],
         ownerAddress: params.ownerAddress,
         queryOptions: {
           include_native: "true",
         },
       });
+
+      const result = await tryCatch(ownedTokenBalancePromise);
+
+      // fallback to fetch native token balance with rpc
+      if (result.error) {
+        const walletBalance = await getWalletBalance({
+          address: params.ownerAddress,
+          client: params.client,
+          chain: params.chain,
+        });
+
+        const nativeTokenBalance: GetBalanceResult = {
+          name: walletBalance.name,
+          value: walletBalance.value,
+          decimals: walletBalance.decimals,
+          displayValue: walletBalance.displayValue,
+          symbol: walletBalance.symbol,
+          chainId: params.chain.id,
+          tokenAddress: NATIVE_TOKEN_ADDRESS,
+        };
+
+        return [nativeTokenBalance];
+      }
+
+      return result.data;
     },
     queryKey: ["getOwnedTokens", params.chain.id, params.ownerAddress],
     retry: false,

apps/dashboard/src/@/components/ui/checkbox.tsx

@@ -27,28 +27,31 @@ export const ClaimerSelection = () => {
     setOpenSnapshotIndex: setOpenIndex,
     isAdmin,
     claimConditionType,
+    phaseSnapshots,
+    setPhaseSnapshot,
   } = useClaimConditionsFormContext();
 
   const handleClaimerChange = (value: string) => {
     const val = value as "any" | "specific" | "overrides";
 
     if (val === "any") {
-      form.setValue(`phases.${phaseIndex}.snapshot`, undefined);
+      setPhaseSnapshot(phaseIndex, undefined);
     } else {
       if (val === "specific") {
         form.setValue(`phases.${phaseIndex}.maxClaimablePerWallet`, 0);
       }
       if (val === "overrides" && field.maxClaimablePerWallet !== 1) {
         form.setValue(`phases.${phaseIndex}.maxClaimablePerWallet`, 1);
       }
-      form.setValue(`phases.${phaseIndex}.snapshot`, []);
+      setPhaseSnapshot(phaseIndex, []);
       setOpenIndex(phaseIndex);
     }
   };
 
   let helperText: React.ReactNode;
 
   const disabledSnapshotButton = isAdmin && formDisabled;
+  const snapshot = phaseSnapshots[phaseIndex];
 
   if (dropType === "specific") {
     helperText = (
@@ -87,10 +90,7 @@ export const ClaimerSelection = () => {
 
   return (
     <FormFieldSetup
-      errorMessage={
-        form.getFieldState(`phases.${phaseIndex}.snapshot`, form.formState)
-          ?.error?.message
-      }
+      errorMessage={undefined}
       helperText={helperText}
       label={label}
       isRequired={false}
@@ -117,7 +117,7 @@ export const ClaimerSelection = () => {
         )}
 
         {/* Edit or See Snapshot */}
-        {field.snapshot ? (
+        {snapshot ? (
           <div className="flex items-center gap-3">
             {/* disable the "Edit" button when form is disabled, but not when it's a "See" button */}
             <Button
@@ -133,17 +133,16 @@ export const ClaimerSelection = () => {
             <div
               className={cn(
                 "flex gap-2 items-center",
-                field.snapshot?.length === 0
+                snapshot?.length === 0
                   ? "text-muted-foreground"
                   : "text-green-600 dark:text-green-500",
                 disabledSnapshotButton ? "opacity-50" : "",
               )}
             >
               <div className="size-2 bg-current rounded-full" />
               <span className="text-sm">
-                {field.snapshot?.length}{" "}
-                {field.snapshot?.length === 1 ? "address" : "addresses"} in
-                snapshot
+                {snapshot?.length}{" "}
+                {snapshot?.length === 1 ? "address" : "addresses"} in snapshot
               </span>
             </div>
           </div>