diff --git a/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/FilterDetailsStep.tsx b/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/FilterDetailsStep.tsx
index 1a1fbf01038..8dcc1887e02 100644
--- a/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/FilterDetailsStep.tsx
+++ b/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/FilterDetailsStep.tsx
@@ -280,7 +280,7 @@ export function FilterDetailsStep({
{/* Advanced Options Section */}
- {/* Signature Hash Field - reused for both event and transaction types */}
+ {/* Signature Hash Field - rebuilt for both event and transaction types */}
- {watchFilterType === "event" &&
- Object.keys(fetchedAbis).length > 0 &&
- eventSignatures.length > 0 ? (
- {
- field.onChange(value);
- // Find the selected event
- const selectedEvent = eventSignatures.find(
- (sig) => sig.signature === value,
- );
- // Set the ABI for the event
- form.setValue("sigHashAbi", selectedEvent?.abi || "");
- }}
- >
-
-
- {field.value
- ? eventSignatures.find(
- (sig) => sig.signature === field.value,
- )?.name || ""
- : null}
-
-
-
- {eventSignatures.map((event) => {
- // Truncate the hash for display purposes
- const truncatedHash = truncateMiddle(
- event.signature,
- 6,
- 4,
+ {watchFilterType === "event" ? (
+ eventSignatures && eventSignatures.length > 0 ? (
+ {
+ field.onChange(value);
+ const selectedEvent = eventSignatures.find(
+ (sig) => sig.signature === value,
);
-
- return (
+ form.setValue("sigHashAbi", selectedEvent?.abi || "");
+ }}
+ >
+
+
+ {field.value
+ ? eventSignatures.find(
+ (sig) => sig.signature === field.value,
+ )?.name || ""
+ : null}
+
+
+
+ {eventSignatures.map((event) => (
{event.name}
- Signature: {truncatedHash}
+ Signature:{" "}
+ {truncateMiddle(event.signature, 6, 4)}
+ ))}
+
+
+ ) : (
+
+ )
+ ) : watchFilterType === "transaction" ? (
+ functionSignatures && functionSignatures.length > 0 ? (
+ {
+ field.onChange(value);
+ const selectedFunction = functionSignatures.find(
+ (sig) => sig.signature === value,
);
- })}
-
-
- ) : watchFilterType === "transaction" &&
- Object.keys(fetchedTxAbis).length > 0 &&
- functionSignatures.length > 0 ? (
- {
- field.onChange(value);
- // Find the selected function
- const selectedFunction = functionSignatures.find(
- (sig) => sig.signature === value,
- );
- // Set the ABI for the function
- form.setValue("sigHashAbi", selectedFunction?.abi || "");
- }}
- >
-
-
- {field.value
- ? functionSignatures.find(
- (sig) => sig.signature === field.value,
- )?.name || ""
- : null}
-
-
-
- {functionSignatures.map((func) => (
-
-
-
- {func.name}
-
-
- Selector: {func.signature}
-
-
-
- ))}
-
-
- ) : (
-
- )}
+ form.setValue(
+ "sigHashAbi",
+ selectedFunction?.abi || "",
+ );
+ }}
+ >
+
+
+ {field.value
+ ? functionSignatures.find(
+ (sig) => sig.signature === field.value,
+ )?.name || ""
+ : null}
+
+
+
+ {functionSignatures.map((func) => (
+
+
+
+ {func.name}
+
+
+ Selector: {truncateMiddle(func.signature, 6, 4)}
+
+
+
+ ))}
+
+
+ ) : (
+
+ )
+ ) : null}