switched to sepolia

.env.example

@@ -1,6 +1,4 @@
-# !STARTERCONF Duplicate this to .env.local
+WEB3AUTH_CLIENT_ID="BCUJ9sDhdO5iekR-oaXL7bIC5Dg3tPNyhtGp_4z_SLp3B0ZKp-0qmE9RFWxUdY4g1wNzJqkxr10d14ty-PoAqCI"
+ZERODEV_ID="f6375b6f-2205-4fc7-bc87-f03218789b86"
 
-# DEVELOPMENT TOOLS
-# Ideally, don't add them to production deployment envs
-# !STARTERCONF Change to true if you want to log data
-NEXT_PUBLIC_SHOW_LOGGER="false"
+NEXT_PUBLIC_ALCHEMY_API_KEY='tOs_g_ehALVT-_ca7ly1X4PeAwVyp2Kg'

package.json

@@ -39,6 +39,7 @@
     "react-aria-components": "^1.0.1",
     "react-dom": "^18.2.0",
     "react-icons": "^4.12.0",
+    "react-qr-code": "^2.0.12",
     "react-redux": "^9.1.0",
     "redux": "^5.0.1",
     "redux-persist": "^6.0.0",

src/GlobalRedux/Features/address/addressSlice.tsx

@@ -1,18 +1,24 @@
 'use client'
 
-import { createSlice } from "@reduxjs/toolkit"
+import { createSlice, PayloadAction } from "@reduxjs/toolkit"
 
-export const addressSlice = createSlice({
+interface AddressState {
+  value: string;
+}
+
+const initialState: AddressState = {
+  value: "0xc8C26Ab40fe4723519fE66B8dBb625FC070A982c",
+};
+
+const addressSlice = createSlice({
   name: "address",
-  initialState: {
-    value: "0xc8C26Ab40fe4723519fE66B8dBb625FC070A982c",
-  },
+  initialState,
   reducers: {
-    address: (state) => {
-      state.value = "0xc8C26Ab40fe4723519fE66B8dBb625FC070A982c"
+    setAddress: (state, action: PayloadAction<string>) => {
+      state.value = action.payload;
     },
-
   },
 });
-export const { address } = addressSlice.actions;
+
+export const { setAddress } = addressSlice.actions;
 export default addressSlice.reducer;

src/app/@auth/(.)receive/page.tsx

@@ -5,17 +5,28 @@ import useGetAddress from '@/app/hooks/useGetAddress';
 // Next
 import Link from 'next/link';
 
-// Layout
+// QR Code
+import QRCode from "react-qr-code";
+
+// Redux
+import { useSelector } from "react-redux";
+
 
 export default function Page() {
 
+  const address = useSelector((state: string) => state.address.value)
 
   return (
     <>
       <div className='grid'>
         <div className='my-4'>
           <p className='my-4 text-center text-xl text-gray-300'>Receive</p>
         </div>
+        <div className="p-4 grid justify-center">
+          <div className="mt-4">
+            <QRCode bgColor='#6A48F2' fgColor='#101012' value={`http://192.168.1.9:3001/send?payee=${address}`} />
+          </div>
+        </div>
 
       </div>
     </>

src/app/@auth/(.)send/page.tsx

@@ -19,7 +19,7 @@ import SendUsdc from '@/app/components/SendUsdc/SendUsdc';
 
 const config = {
   apiKey: process.env.NEXT_PUBLIC_ALCHEMY_API_KEY,
-  network: Network.MATIC_MUMBAI,
+  network: Network.ETH_SEPOLIA,
 };
 const alchemy = new Alchemy(config);
 

src/app/components/Balance/Balance.tsx

@@ -11,13 +11,13 @@ export default function Balance() {
 
 	const addressState = useSelector((state: RootState) => state.address.value);
 
-	console.log("addressState", addressState)
+
 	const result = useBalance({
 		address: addressState,
-		token: "0x9999f7Fea5938fD3b1E26A12c3f2fb024e194f97",
+		token: "0x94a9D9AC8a22534E3FaCa9F4e7F2E2cf85d5E4C8",
 	});
 
-
+	console.log("balance", result)
 	return (
 		<div className="text-white">
 			{result?.data?.formatted}

src/app/components/SendUsdc/SendUsdc.tsx

@@ -22,7 +22,8 @@ export default function SendUsdc() {
   let payee = searchParams.get('payee');
 
   // USDC contract address
-  const usdc = '0x9999f7Fea5938fD3b1E26A12c3f2fb024e194f97';
+  //const usdc = '0x9999f7Fea5938fD3b1E26A12c3f2fb024e194f97';
+  const usdc = '0x94a9D9AC8a22534E3FaCa9F4e7F2E2cf85d5E4C8';
 
   // Encode the data with Viem Function
   // Requires the abi of the contract, the function name, and the arguments address and amount
@@ -35,15 +36,13 @@ export default function SendUsdc() {
   // Send transaction function
   const sendTx = async () => {
     try {
-      const userOpHash = kernal.sendUserOperation({
-        userOperation: {
-          callData: await kernal.account.encodeCallData({
-            to: usdc,
-            data: encoded,
-            value: BigInt(0),
-          }),
-        },
-      });
+      const txnHash = await kernal.sendTransaction({
+        to: "0x94a9D9AC8a22534E3FaCa9F4e7F2E2cf85d5E4C8",  // use any address
+        value: BigInt(0), // default to 0
+        data: "0x",       // default to 0x
+      })
+
+      console.log("Txn hash:", txnHash)
     } catch (error) {
       console.log(error);
     }

src/app/config.ts

@@ -1,11 +1,11 @@
 'use client'
 import { http, createConfig } from 'wagmi'
-import { polygonMumbai } from 'wagmi/chains'
+import { sepolia } from 'wagmi/chains'
 
 const config = createConfig({
-  chains: [polygonMumbai],
+  chains: [sepolia],
   transports: {
-    [polygonMumbai.id]: http(),
+    [sepolia.id]: http(),
   },
 });
 

src/app/hooks/useGetRecentTransactions.tsx

@@ -7,7 +7,7 @@ const useGetRecentTransactions = async () => {
 
     const config = {
       apiKey: process.env.NEXT_PUBLIC_ALCHEMY_API_KEY,
-      network: Network.MATIC_MUMBAI,
+      network: Network.ETH_SEPOLIA,
     };
     const alchemy = new Alchemy(config);
 

src/app/page.tsx

@@ -26,12 +26,12 @@ import { parseEther } from 'viem';
 
 const chainConfig = {
   chainNamespace: CHAIN_NAMESPACES.EIP155,
-  chainId: '0x13881',
-  rpcTarget: 'https://rpc.ankr.com/polygon_mumbai',
-  displayName: 'Polygon Mumbai',
+  chainId: '0xaa36a7',
+  rpcTarget: 'https://rpc.ankr.com/eth_sepolia',
+  displayName: 'Sepolia',
   blockExplorer: 'https://etherscan.io/',
-  ticker: 'Matic',
-  tickerName: 'Matic',
+  ticker: 'Eth',
+  tickerName: 'Eth',
 };
 
 const web3auth = new Web3AuthNoModal({

src/app/receive/page.tsx

@@ -1,9 +1,22 @@
 'use client';
+// QR Code
+import QRCode from "react-qr-code";
+
+// Redux
+import { useSelector } from "react-redux";
 
 export default function Page() {
+
+  const address = useSelector((state: string) => state.address.value)
+
   return (
     <>
       <h1>Backup Receive Page</h1>
+      <div className="p-4">
+        <div className="mt-4">
+          <QRCode value="http://localhost:3000/" />
+        </div>
+      </div>
     </>
   );
 }

src/app/utils/useCreateKernal.tsx

@@ -8,7 +8,7 @@ import RPC from '../web3RPC';
 
 // Zero Dev
 import { createEcdsaKernelAccountClient } from '@zerodev/presets/zerodev';
-import { polygonMumbai } from 'viem/chains';
+import { sepolia } from 'viem/chains';
 import { Hex } from 'viem';
 import { privateKeyToAccount } from 'viem/accounts';
 
@@ -29,8 +29,8 @@ const useCreateKernal = async (web3auth) => {
   // create the Account Abstraction Kernal Client
   const kernelClient = await createEcdsaKernelAccountClient({
     // required
-    chain: polygonMumbai,
-    projectId: 'f1d2d8bf-0feb-430a-9f6f-dfeb8bc639a3',
+    chain: sepolia,
+    projectId: 'f6375b6f-2205-4fc7-bc87-f03218789b86',
     signer: signer,
   });