remove buffer since it's not polifilled in some envs (#43)

* remove buffer since it's not polifilled in some envs

* fix format

Author: zhelezkov

packages/blinks/src/hooks/solana/useActionSolanaWalletAdapter.ts

@@ -12,6 +12,7 @@ import { useWalletModal } from '@solana/wallet-adapter-react-ui';
 import { Connection, VersionedTransaction } from '@solana/web3.js';
 import bs58 from 'bs58';
 import { useMemo } from 'react';
+import { decodeBase64 } from '../../utils/base64';
 /**
  * Hook to create an action adapter using solana's wallet adapter.
  *
@@ -64,7 +65,7 @@ export function useActionSolanaWalletAdapter(
       signTransaction: async (txData: string) => {
         try {
           const tx = await wallet.sendTransaction(
-            VersionedTransaction.deserialize(Buffer.from(txData, 'base64')),
+            VersionedTransaction.deserialize(decodeBase64(txData)),
             finalConnection,
           );
           return { signature: tx };

packages/blinks/src/utils/base64.ts

@@ -0,0 +1,22 @@
+// This approach is written in MDN.
+// btoa does not support utf-8 characters. So we need a little bit hack.
+export const encodeBase64 = (buf: ArrayBufferLike): string => {
+  let binary = '';
+  const bytes = new Uint8Array(buf);
+  for (let i = 0, len = bytes.length; i < len; i++) {
+    binary += String.fromCharCode(bytes[i]);
+  }
+  return btoa(binary);
+};
+
+// atob does not support utf-8 characters. So we need a little bit hack.
+export const decodeBase64 = (str: string): Uint8Array => {
+  const binary = atob(str);
+  const bytes = new Uint8Array(new ArrayBuffer(binary.length));
+  const half = binary.length / 2;
+  for (let i = 0, j = binary.length - 1; i <= half; i++, j--) {
+    bytes[i] = binary.charCodeAt(i);
+    bytes[j] = binary.charCodeAt(j);
+  }
+  return bytes;
+};