feat: expose onSignature related callbacks for eth_signTypedData_v4 request

Author: normanzb

.changeset/strange-oranges-count.md

@@ -0,0 +1,5 @@
+---
+"@frames.js/render": patch
+---
+
+feat: expose onSignature callbacks for eth_signTypedData request from server

docs/pages/reference/render/use-frame.mdx

@@ -88,6 +88,12 @@ A function to handle redirect responses from the frame. This happens when you cl
 
 A function to handle transaction button presses, returns the transaction hash or null. The function is called when a user presses a transaction button and endpoint specified by `target` returns transaction data.
 
+### `onSignature`
+
+- Type: `OnSignatureFunc`
+
+A function to handle transaction button presses, returns the signature or null. The function is called when a user presses a transaction button and endpoint specified by `target` returns typed data for signing (`eth_signTypedData_v4`).
+
 ### `transactionDataSuffix`
 
 - Type: `0x${string}`

packages/render/src/types.ts

@@ -126,6 +126,9 @@ export type UseFetchFrameOptions<
   onTransaction: OnTransactionFunc;
   /** Transaction data suffix */
   transactionDataSuffix?: `0x${string}`;
+  /**
+   * Called after transaction data has been returned from the server and user needs to sign the typed data.
+   */
   onSignature: OnSignatureFunc;
   onComposerFormAction: OnComposerFormActionFunc;
   /**
@@ -281,6 +284,9 @@ export type UseFrameOptions<
     | "onTransactionError"
     | "onTransactionStart"
     | "onTransactionSuccess"
+    | "onSignatureError"
+    | "onSignatureStart"
+    | "onSignatureSuccess"
     | "onTransactionProcessingError"
     | "onTransactionProcessingStart"
     | "onTransactionProcessingSuccess"

packages/render/src/unstable-types.ts

@@ -211,6 +211,9 @@ export type UseFrameOptions<
     | "onTransactionError"
     | "onTransactionStart"
     | "onTransactionSuccess"
+    | "onSignatureError"
+    | "onSignatureStart"
+    | "onSignatureSuccess"
     | "onTransactionProcessingError"
     | "onTransactionProcessingStart"
     | "onTransactionProcessingSuccess"
@@ -515,6 +518,9 @@ export type UseFetchFrameOptions<
   onTransaction: OnTransactionFunction;
   /** Transaction data suffix */
   transactionDataSuffix?: `0x${string}`;
+  /**
+   * Called after transaction data has been returned from the server and user needs to sign the typed data.
+   */
   onSignature: OnSignatureFunction;
   /**
    * This function can be used to customize how error is reported to the user.

packages/render/src/unstable-use-frame.tsx

@@ -186,6 +186,9 @@ export function useFrame_unstable<
   onTransactionError,
   onTransactionStart,
   onTransactionSuccess,
+  onSignatureError,
+  onSignatureStart,
+  onSignatureSuccess,
   onTransactionProcessingError,
   onTransactionProcessingStart,
   onTransactionProcessingSuccess,
@@ -235,6 +238,9 @@ export function useFrame_unstable<
     onTransactionError,
     onTransactionStart,
     onTransactionSuccess,
+    onSignatureError,
+    onSignatureStart,
+    onSignatureSuccess,
     onTransactionProcessingError,
     onTransactionProcessingStart,
     onTransactionProcessingSuccess,

packages/render/src/use-frame.tsx

@@ -183,11 +183,14 @@ export function useFrame<
   onTransactionDataStart,
   onTransactionDataSuccess,
   onTransactionError,
+  onTransactionStart,
+  onTransactionSuccess,
+  onSignatureError,
+  onSignatureStart,
+  onSignatureSuccess,
   onTransactionProcessingError,
   onTransactionProcessingStart,
   onTransactionProcessingSuccess,
-  onTransactionStart,
-  onTransactionSuccess,
 }: UseFrameOptions<
   TSignerStorageType,
   TFrameActionBodyType,
@@ -231,11 +234,14 @@ export function useFrame<
     onTransactionDataStart,
     onTransactionDataSuccess,
     onTransactionError,
+    onTransactionStart,
+    onTransactionSuccess,
+    onSignatureError,
+    onSignatureStart,
+    onSignatureSuccess,
     onTransactionProcessingError,
     onTransactionProcessingStart,
     onTransactionProcessingSuccess,
-    onTransactionStart,
-    onTransactionSuccess,
   });
 
   const fetchFrameRef = useFreshRef(fetchFrame);
@@ -325,6 +331,7 @@ export function useFrame<
       homeframeUrl,
       signerState.hasSigner,
       signerState.signer,
+      onErrorRef,
     ]
   );
 
@@ -395,6 +402,7 @@ export function useFrame<
       connectedAddress,
       homeframeUrl,
       signerState,
+      onErrorRef,
     ]
   );
 
@@ -516,6 +524,7 @@ export function useFrame<
       onPostButton,
       onTransactionButton,
       signerState,
+      onErrorRef,
     ]
   );