Fix send flow snap (#3267)

Previous PR failed to parse the event value as it is a `CaipAccountId`,
updated the implementation to parse the value before checking against
the struct.

Author: hmalik88

packages/examples/packages/send-flow/snap.manifest.json

@@ -7,7 +7,7 @@
     "url": "https://github.com/MetaMask/snaps.git"
   },
   "source": {
-    "shasum": "5qERUafayyDWQ12V/+htfEs2wzmQwhSn0EcQolI7quo=",
+    "shasum": "INn+njbWhdgWBpvU4y5opvJpDWSyT14xl7DQEvwY0JM=",
     "location": {
       "npm": {
         "filePath": "dist/bundle.js",

packages/examples/packages/send-flow/src/index.tsx

@@ -3,10 +3,11 @@ import type {
   OnHomePageHandler,
   OnUserInputHandler,
   OnRpcRequestHandler,
+  CaipAccountId,
 } from '@metamask/snaps-sdk';
 import { UserInputEventType } from '@metamask/snaps-sdk';
 import { is } from '@metamask/superstruct';
-import { HexChecksumAddressStruct } from '@metamask/utils';
+import { HexChecksumAddressStruct, parseCaipAccountId } from '@metamask/utils';
 
 import { SendFlow } from './components';
 import { accountsArray, accounts } from './data';
@@ -102,6 +103,14 @@ export const onUserInput: OnUserInputHandler = async ({
       case 'amount':
       case 'to': {
         // For testing purposes, we display the avatar if the address is a valid hex checksum address.
+        let parsedAddress;
+        try {
+          parsedAddress = parseCaipAccountId(
+            event.value as CaipAccountId,
+          ).address;
+        } catch {
+          /** noop */
+        }
         await snap.request({
           method: 'snap_updateInterface',
           params: {
@@ -114,7 +123,7 @@ export const onUserInput: OnUserInputHandler = async ({
                 total={total}
                 fees={fees}
                 errors={formErrors}
-                displayAvatar={is(event.value, HexChecksumAddressStruct)}
+                displayAvatar={is(parsedAddress, HexChecksumAddressStruct)}
               />
             ),
           },