Add support for tuple types in ABI event and function signatures

Author: Amine Afia

apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/FilterDetailsStep.tsx

@@ -344,7 +344,7 @@ export function FilterDetailsStep({
                     }}
                     options={functionSignatures.map((sig) => ({
                       abi: sig.abi,
-                      label: sig.name,
+                      label: truncateMiddle(sig.name, 30, 15),
                       value: sig.signature,
                     }))}
                     placeholder="Select or enter a function signature"

apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/abiUtils.ts

@@ -28,6 +28,19 @@ function isAbiInput(
   );
 }
 
+// Helper to recursively get canonical type for ABI input (handles tuples)
+function getCanonicalType(input: any): string {
+  if (input.type.startsWith("tuple")) {
+    // Recursively build tuple type string
+    const components = input.components || [];
+    const tupleType = `(${components.map(getCanonicalType).join(",")})`;
+    // Handle tuple arrays (tuple[], tuple[2], etc)
+    const arraySuffix = input.type.slice("tuple".length);
+    return tupleType + arraySuffix;
+  }
+  return input.type;
+}
+
 /**
  * Extracts event signatures from ABI data
  * @param abiData Array of ABI data objects
@@ -80,7 +93,7 @@ export const extractEventSignatures = (
               const canonicalInputs = Array.isArray(event.inputs)
                 ? event.inputs
                     .filter((input: unknown) => isAbiInput(input))
-                    .map((input: { type: string }) => input.type)
+                    .map((input: any) => getCanonicalType(input))
                     .join(",")
                 : "";
 
@@ -162,7 +175,7 @@ export const extractFunctionSignatures = (
               const canonicalInputs = Array.isArray(func.inputs)
                 ? func.inputs
                     .filter((input: unknown) => isAbiInput(input))
-                    .map((input: { type: string }) => input.type)
+                    .map((input: any) => getCanonicalType(input))
                     .join(",")
                 : "";