diff --git a/.github/workflows/ci.yaml b/.github/workflows/ci.yaml
index f77bc21..3fc52d6 100644
--- a/.github/workflows/ci.yaml
+++ b/.github/workflows/ci.yaml
@@ -9,53 +9,53 @@ on:
       - '**'
 
 jobs:
-    build:
-        name: Build
-        runs-on: ubuntu-latest
-        steps:
-            - uses: actions/checkout@v3
-            - uses: actions/setup-node@v3
-              with:
-                cache: yarn
-                node-version: '18'
-            - name: Install deps
-              run: yarn install --frozen-lockfile
-            - name: Build
-              run: yarn build
-            - name: Lint
-              run: yarn run lint
-            - name: Tests
-              run: yarn run test
-
-    maybe-release:
-        name: release
-        runs-on: ubuntu-latest
-        if: github.event_name == 'push' && github.ref == 'refs/heads/main'
-        steps:
-            - uses: google-github-actions/release-please-action@v3
-              id: release
-              with:
-                release-type: node
-                package-name: release-please-action
-                changelog-types: '[{"type":"feat","section":"Features","hidden":false},{"type":"fix","section":"Bug Fixes","hidden":false},{"type":"chore","section":"Miscellaneous","hidden":true}]'
-            
-            - uses: actions/checkout@v3
-              if: ${{ steps.release.outputs.release_created }}
-            
-            - uses: actions/setup-node@v3
-              with:
-                cache: 'yarn'
-                node-version: 18
-                registry-url: 'https://registry.npmjs.org'
-              if: ${{ steps.release.outputs.release_created }}
-            
-            - run: yarn install --frozen-lockfile
-              if: ${{ steps.release.outputs.release_created }}
-            
-            - run: yarn build
-              if: ${{ steps.release.outputs.release_created }}
-
-            - run: yarn publish --access public
-              env:
-                NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}
-              if: ${{ steps.release.outputs.release_created }}
\ No newline at end of file
+  build:
+    name: Build
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          cache: yarn
+          node-version: '18'
+      - name: Install deps
+        run: yarn install --frozen-lockfile
+      - name: Build
+        run: yarn build
+      - name: Lint
+        run: yarn run lint
+      - name: Tests
+        run: yarn run test
+
+  maybe-release:
+    name: release
+    runs-on: ubuntu-latest
+    if: github.event_name == 'push' && github.ref == 'refs/heads/main'
+    steps:
+      - uses: google-github-actions/release-please-action@v3
+        id: release
+        with:
+          release-type: node
+          package-name: release-please-action
+          changelog-types: '[{"type":"feat","section":"Features","hidden":false},{"type":"fix","section":"Bug Fixes","hidden":false},{"type":"chore","section":"Miscellaneous","hidden":true}]'
+
+      - uses: actions/checkout@v3
+        if: ${{ steps.release.outputs.release_created }}
+
+      - uses: actions/setup-node@v3
+        with:
+          cache: 'yarn'
+          node-version: 18
+          registry-url: 'https://registry.npmjs.org'
+        if: ${{ steps.release.outputs.release_created }}
+
+      - run: yarn install --frozen-lockfile
+        if: ${{ steps.release.outputs.release_created }}
+
+      - run: yarn build
+        if: ${{ steps.release.outputs.release_created }}
+
+      - run: yarn publish --access public
+        env:
+          NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}
+        if: ${{ steps.release.outputs.release_created }}
diff --git a/.github/workflows/docs.yml b/.github/workflows/docs.yml
index 4c4cd73..ef04d01 100644
--- a/.github/workflows/docs.yml
+++ b/.github/workflows/docs.yml
@@ -19,7 +19,7 @@ permissions:
 # Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
 # However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
 concurrency:
-  group: "pages"
+  group: 'pages'
   cancel-in-progress: false
 
 jobs:
diff --git a/.github/workflows/pr_title.yml b/.github/workflows/pr_title.yml
index 61a69c4..f01597c 100644
--- a/.github/workflows/pr_title.yml
+++ b/.github/workflows/pr_title.yml
@@ -1,4 +1,4 @@
-name: "Semantic PR"
+name: 'Semantic PR'
 
 on:
   pull_request_target:
diff --git a/.prettierrc.json b/.prettierrc.json
index bf357fb..f133c83 100644
--- a/.prettierrc.json
+++ b/.prettierrc.json
@@ -1,3 +1,9 @@
 {
-  "trailingComma": "all"
+  "semi": true,
+  "trailingComma": "all",
+  "singleQuote": true,
+  "printWidth": 90,
+  "tabWidth": 2,
+  "endOfLine": "auto",
+  "bracketSpacing": true
 }
diff --git a/README.md b/README.md
index b7a19c4..435f932 100644
--- a/README.md
+++ b/README.md
@@ -35,10 +35,10 @@ pnpm add web3-plugin-wallet-rpc
 ### Register plugin
 
 ```typescript
-import { Web3 } from "web3";
-import { WalletRpcPlugin } from "web3-plugin-wallet-rpc";
+import { Web3 } from 'web3';
+import { WalletRpcPlugin } from 'web3-plugin-wallet-rpc';
 
-const web3 = new Web3("https://eth.llamarpc.com");
+const web3 = new Web3('https://eth.llamarpc.com');
 web3.registerPlugin(new WalletRpcPlugin());
 ```
 
@@ -51,15 +51,15 @@ Invokes the `wallet_addEthereumChain` method as defined in [EIP-3085](https://ei
 ```typescript
 await web3.walletRpc.addEthereumChain({
   chainId: 5000,
-  blockExplorerUrls: ["https://mantlescan.xyz"],
-  chainName: "Mantle",
-  iconUrls: ["https://icons.llamao.fi/icons/chains/rsz_mantle.jpg"],
+  blockExplorerUrls: ['https://mantlescan.xyz'],
+  chainName: 'Mantle',
+  iconUrls: ['https://icons.llamao.fi/icons/chains/rsz_mantle.jpg'],
   nativeCurrency: {
-    name: "Mantle",
-    symbol: "MNT",
+    name: 'Mantle',
+    symbol: 'MNT',
     decimals: 18,
   },
-  rpcUrls: ["https://rpc.mantle.xyz"],
+  rpcUrls: ['https://rpc.mantle.xyz'],
 });
 ```
 
@@ -77,10 +77,10 @@ Invokes the `wallet_watchAsset` method as defined in [EIP-747](https://eips.ethe
 
 ```typescript
 await web3.walletRpc.watchAsset({
-  type: "ERC20",
+  type: 'ERC20',
   options: {
-    address: "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
-    symbol: "USDC",
+    address: '0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48',
+    symbol: 'USDC',
   },
 });
 ```
@@ -122,14 +122,14 @@ Invokes the `wallet_updateEthereumChain` method as defined in [EIP-2015](https:/
 ```typescript
 await web3.walletRpc.updateEthereumChain({
   chainId: 5000,
-  blockExplorerUrls: ["https://mantlescan.xyz"],
-  chainName: "Mantle",
+  blockExplorerUrls: ['https://mantlescan.xyz'],
+  chainName: 'Mantle',
   nativeCurrency: {
-    name: "Mantle",
-    symbol: "MNT",
+    name: 'Mantle',
+    symbol: 'MNT',
     decimals: 18,
   },
-  rpcUrls: ["https://rpc.mantle.xyz"],
+  rpcUrls: ['https://rpc.mantle.xyz'],
 });
 ```
 
@@ -139,7 +139,7 @@ Invokes the `wallet_getOwnedAssets` method as defined in [EIP-2256](https://eips
 
 ```typescript
 const ownedAssets = await web3.walletRpc.getOwnedAssets({
-  address: "0xa5653e88D9c352387deDdC79bcf99f0ada62e9c6",
+  address: '0xa5653e88D9c352387deDdC79bcf99f0ada62e9c6',
 });
 ```
 
diff --git a/package.json b/package.json
index 0025e9c..81210e4 100644
--- a/package.json
+++ b/package.json
@@ -21,11 +21,16 @@
   ],
   "packageManager": "yarn@1.22.15",
   "scripts": {
-    "lint": "cd packages/web3-plugin-wallet-rpc && yarn lint",
     "build": "cd packages/web3-plugin-wallet-rpc && yarn build",
     "build:docs": "cd packages/web3-plugin-wallet-rpc && yarn build:docs",
     "test": "cd packages/web3-plugin-wallet-rpc && yarn test",
+    "lint": "yarn lint:plugin && yarn lint:example",
+    "lint:plugin": "cd packages/web3-plugin-wallet-rpc && yarn lint",
     "lint:example": "cd packages/example-react-app && yarn lint",
-    "start:example": "cd packages/example-react-app && yarn start"
+    "format": "prettier --write .",
+    "start:example": "yarn build && cd packages/example-react-app && yarn start"
+  },
+  "devDependencies": {
+    "prettier": "^3.3.3"
   }
 }
diff --git a/packages/example-react-app/package.json b/packages/example-react-app/package.json
index 0d814c7..f3374c6 100644
--- a/packages/example-react-app/package.json
+++ b/packages/example-react-app/package.json
@@ -8,22 +8,24 @@
   ],
   "license": "MIT",
   "dependencies": {
-    "@types/node": "^16.18.108",
-    "@types/react": "^18.3.8",
-    "@types/react-dom": "^18.3.0",
-    "@types/uuid": "^10.0.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "react-scripts": "5.0.1",
-    "typescript": "5.3.x",
     "uuid": "^10.0.0",
     "web3": "^4.14.0",
-    "web3-eth": "^4.9.0",
     "web3-plugin-wallet-rpc": "*"
   },
+  "devDependencies": {
+    "@types/node": "^16.18.108",
+    "@types/react": "^18.3.8",
+    "@types/react-dom": "^18.3.0",
+    "@types/uuid": "^10.0.0",
+    "eslint": "8",
+    "react-scripts": "5.0.1",
+    "typescript": "5.3.x"
+  },
   "scripts": {
     "start": "react-scripts start",
-    "lint": "eslint 'src/**/*.{ts,tsx}'"
+    "lint": "eslint 'src/**/*.{js,ts,tsx}'"
   },
   "eslintConfig": {
     "extends": [
diff --git a/packages/example-react-app/public/index.html b/packages/example-react-app/public/index.html
index 2fd78ab..454360c 100644
--- a/packages/example-react-app/public/index.html
+++ b/packages/example-react-app/public/index.html
@@ -1,14 +1,11 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <meta charset="utf-8" />
     <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />
-    <meta
-      name="description"
-      content="Web3.js Wallet RPC Methods Demonstration dApp"
-    />
+    <meta name="description" content="Web3.js Wallet RPC Methods Demonstration dApp" />
     <!--
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
diff --git a/packages/example-react-app/src/AccountDetail.tsx b/packages/example-react-app/src/AccountDetail.tsx
deleted file mode 100644
index 8bd1299..0000000
--- a/packages/example-react-app/src/AccountDetail.tsx
+++ /dev/null
@@ -1,56 +0,0 @@
-import {
-  type MutableRefObject,
-  useContext,
-  useEffect,
-  useRef,
-  useState,
-} from "react";
-
-import { type IWeb3Context, Web3Context } from "./web3/Web3Context";
-
-function AccountDetail({ address }: { address: string }) {
-  const web3Context: IWeb3Context = useContext(Web3Context);
-
-  const [balance, setBalance] = useState<number>(NaN);
-  const subscriptionId: MutableRefObject<string | undefined> =
-    useRef(undefined);
-
-  // update balance
-  useEffect(() => {
-    updateBalance();
-
-    if (!web3Context.web3.subscriptionManager.supportsSubscriptions()) {
-      return;
-    }
-
-    web3Context.web3.eth
-      .subscribe("newBlockHeaders")
-      .then((newBlockSubscription) => {
-        subscriptionId.current = newBlockSubscription.id;
-        newBlockSubscription.on("data", () => {
-          updateBalance();
-        });
-      });
-
-    return () => {
-      web3Context.web3.eth.subscriptionManager.unsubscribe(
-        ({ id }) => subscriptionId.current === id
-      );
-    };
-  });
-
-  function updateBalance(): void {
-    web3Context.web3.eth.getBalance(address).then((balance: bigint) => {
-      setBalance(parseFloat(web3Context.web3.utils.fromWei(balance, "ether")));
-    });
-  }
-
-  return (
-    <>
-      <div>{address}</div>
-      <div>Balance in native token: {`${balance}`}</div>
-    </>
-  );
-}
-
-export default AccountDetail;
diff --git a/packages/example-react-app/src/App.tsx b/packages/example-react-app/src/App.tsx
index d024860..a4d8315 100644
--- a/packages/example-react-app/src/App.tsx
+++ b/packages/example-react-app/src/App.tsx
@@ -1,12 +1,14 @@
-import { useContext, useEffect, useState } from "react";
-import type { ProviderChainId, providers } from "web3";
+import { useContext, useEffect, useState } from 'react';
+import type { ProviderChainId, providers } from 'web3';
 
-import { AccountProvider } from "./web3/AccountContext";
-import { type IWeb3Context, Web3Context } from "./web3/Web3Context";
-
-import Accounts from "./Accounts";
-import ProviderButton from "./ProviderButton";
-import WalletRpcPlugComponent from "./WalletRpcPlugComponent";
+import { Accounts } from './components/Accounts';
+import { ProviderButton } from './components/ProviderButton';
+import { AccountProvider } from './web3/AccountContext';
+import { type IWeb3Context, Web3Context } from './web3/Web3Context';
+import { SwitchEthereumChain } from './wallet-components/SwitchEthereumChain';
+import { AddEthereumChain } from './wallet-components/AddEthereumChain';
+import { WatchAsset } from './wallet-components/WatchAsset';
+import { Permissions } from './wallet-components/Permissions';
 
 function App() {
   const web3Context: IWeb3Context = useContext(Web3Context);
@@ -36,70 +38,66 @@ function App() {
 
     web3Context.web3.eth.getChainId().then(updateChainId);
     web3Context.web3.eth.net.getId().then(setNetworkId);
-    provider.on("chainChanged", updateProviderIds);
-    return () => provider.removeListener("chainChanged", updateProviderIds);
+    provider.on('chainChanged', updateProviderIds);
+    return () => provider.removeListener('chainChanged', updateProviderIds);
   }, [web3Context.currentProvider, web3Context.web3.eth]);
 
   return (
     <main>
       <h1>Web3.js Wallet RPC Methods Demonstration dApp</h1>
-      <div>
-        This is a sample project that demonstrates using web3-plugin-wallet-rpc.
-      </div>
+      <div>This is a sample project that demonstrates using web3-plugin-wallet-rpc.</div>
       {!hasProviders ? (
         <h2>Install a Wallet</h2>
       ) : web3Context.currentProvider === undefined ? (
         <>
           <h2>Select a Provider</h2>
-          {web3Context.providers.map(
-            (provider: providers.EIP6963ProviderDetail) => {
-              return (
-                <div key={provider.info.uuid}>
-                  <ProviderButton provider={provider}></ProviderButton>
-                </div>
-              );
-            }
-          )}
+          {web3Context.providers.map((provider: providers.EIP6963ProviderDetail) => {
+            return (
+              <div key={provider.info.uuid}>
+                <ProviderButton provider={provider}></ProviderButton>
+              </div>
+            );
+          })}
         </>
       ) : (
         <>
           {web3Context.providers.length > 1 ? (
             <>
               <h2>Switch Provider</h2>
-              {web3Context.providers.map(
-                (provider: providers.EIP6963ProviderDetail) => {
-                  if (
-                    provider.info.uuid ===
-                    web3Context.currentProvider?.info.uuid
-                  ) {
-                    return null;
-                  }
-                  return (
-                    <div key={provider.info.uuid}>
-                      <ProviderButton provider={provider}></ProviderButton>
-                    </div>
-                  );
+              {web3Context.providers.map((provider: providers.EIP6963ProviderDetail) => {
+                if (provider.info.uuid === web3Context.currentProvider?.info.uuid) {
+                  return null;
                 }
-              )}
+                return (
+                  <div key={provider.info.uuid}>
+                    <ProviderButton provider={provider}></ProviderButton>
+                  </div>
+                );
+              })}
             </>
           ) : null}
+
           <h2>Network Details</h2>
           <div>Chain ID: {`${chainId}`}</div>
           <div>Network ID: {`${networkId}`}</div>
+
           <AccountProvider>
-            <Accounts></Accounts>
+            <Accounts />
           </AccountProvider>
 
-          <WalletRpcPlugComponent></WalletRpcPlugComponent>
+          <h2>Wallet RPC Methods</h2>
+          <div>
+            <AddEthereumChain />
+            <SwitchEthereumChain />
+            <WatchAsset />
+            <Permissions />
+          </div>
         </>
       )}
       <br />
       <i>
-        This project was bootstrapped with{" "}
-        <a href="https://github.com/facebook/create-react-app">
-          Create React App
-        </a>
-        .
+        This project was bootstrapped with{' '}
+        <a href="https://github.com/facebook/create-react-app">Create React App</a>.
       </i>
     </main>
   );
diff --git a/packages/example-react-app/src/ProviderButton.tsx b/packages/example-react-app/src/ProviderButton.tsx
deleted file mode 100644
index e913ed0..0000000
--- a/packages/example-react-app/src/ProviderButton.tsx
+++ /dev/null
@@ -1,18 +0,0 @@
-import { useContext } from "react";
-import { EIP6963ProviderDetail } from "web3";
-
-import "./ProviderButton.css";
-import { IWeb3Context, Web3Context } from "./web3/Web3Context";
-
-function ProviderButton({ provider }: { provider: EIP6963ProviderDetail }) {
-  const web3Context: IWeb3Context = useContext(Web3Context);
-
-  return (
-    <button onClick={() => web3Context.setCurrentProvider(provider)}>
-      <img src={provider.info.icon} alt={provider.info.name} width="35" />
-      <span> {provider.info.name}</span>
-    </button>
-  );
-}
-
-export default ProviderButton;
diff --git a/packages/example-react-app/src/WalletRpcPlugComponent.tsx b/packages/example-react-app/src/WalletRpcPlugComponent.tsx
deleted file mode 100644
index 2b5cd07..0000000
--- a/packages/example-react-app/src/WalletRpcPlugComponent.tsx
+++ /dev/null
@@ -1,19 +0,0 @@
-import { useContext } from "react";
-import { Web3Context } from "./web3/Web3Context";
-
-function WalletRpcPlugComponent() {
-  const { web3 } = useContext(Web3Context);
-
-  return (
-    <div>
-      <button onClick={() => web3.walletRpc.switchEthereumChain(137)}>
-        Switch chain to 137
-      </button>
-      <button onClick={() => web3.walletRpc.switchEthereumChain(1)}>
-        Switch chain to 1
-      </button>
-    </div>
-  );
-}
-
-export default WalletRpcPlugComponent;
diff --git a/packages/example-react-app/src/components/AccountDetail.tsx b/packages/example-react-app/src/components/AccountDetail.tsx
new file mode 100644
index 0000000..2614e4b
--- /dev/null
+++ b/packages/example-react-app/src/components/AccountDetail.tsx
@@ -0,0 +1,44 @@
+import { type MutableRefObject, useContext, useEffect, useRef, useState } from 'react';
+
+import { type IWeb3Context, Web3Context } from '../web3/Web3Context';
+
+export function AccountDetail({ address }: { address: string }) {
+  const web3Context: IWeb3Context = useContext(Web3Context);
+
+  const [balance, setBalance] = useState<number>(NaN);
+  const subscriptionId: MutableRefObject<string | undefined> = useRef(undefined);
+
+  async function updateBalance(): Promise<void> {
+    const newBalance = await web3Context.web3.eth.getBalance(address);
+
+    setBalance(parseFloat(web3Context.web3.utils.fromWei(newBalance, 'ether')));
+  }
+
+  useEffect(() => {
+    async function subscribeToNewBlockHeaders() {
+      const newBlockSubscription =
+        await web3Context.web3.eth.subscribe('newBlockHeaders');
+
+      subscriptionId.current = newBlockSubscription.id;
+
+      newBlockSubscription.on('data', () => {
+        void updateBalance();
+      });
+    }
+
+    void subscribeToNewBlockHeaders();
+
+    return () => {
+      void web3Context.web3.eth.subscriptionManager.unsubscribe(
+        ({ id }) => subscriptionId.current === id,
+      );
+    };
+  });
+
+  return (
+    <>
+      <div>{address}</div>
+      <div>Balance in native token: {`${balance}`}</div>
+    </>
+  );
+}
diff --git a/packages/example-react-app/src/Accounts.tsx b/packages/example-react-app/src/components/Accounts.tsx
similarity index 53%
rename from packages/example-react-app/src/Accounts.tsx
rename to packages/example-react-app/src/components/Accounts.tsx
index 39782c6..34fdfc6 100644
--- a/packages/example-react-app/src/Accounts.tsx
+++ b/packages/example-react-app/src/components/Accounts.tsx
@@ -1,8 +1,10 @@
-import { useContext } from "react";
-import { AccountContext, type IAccountContext } from "./web3/AccountContext";
-import AccountDetail from "./AccountDetail";
+import { useContext } from 'react';
 
-function Accounts() {
+import { AccountContext, type IAccountContext } from '../web3/AccountContext';
+
+import { AccountDetail } from './AccountDetail';
+
+export function Accounts() {
   const accountContext: IAccountContext = useContext(AccountContext);
 
   return (
@@ -10,23 +12,18 @@ function Accounts() {
       <h2>Accounts</h2>
       <div>
         {accountContext.selectedAccount === undefined ? (
-          <button onClick={accountContext.requestAccounts}>
+          <button type="button" onClick={accountContext.requestAccounts}>
             Connect Accounts
           </button>
         ) : (
           <>
             <h3>Selected Account</h3>
-            <AccountDetail
-              address={accountContext.selectedAccount}
-            ></AccountDetail>
+            <AccountDetail address={accountContext.selectedAccount} />
             {accountContext.accounts.length > 1 ? (
               <>
                 <h3>Other Accounts</h3>
                 {accountContext.accounts.slice(1).map((account: string) => (
-                  <AccountDetail
-                    address={account}
-                    key={account}
-                  ></AccountDetail>
+                  <AccountDetail address={account} key={account} />
                 ))}
               </>
             ) : null}
@@ -36,5 +33,3 @@ function Accounts() {
     </>
   );
 }
-
-export default Accounts;
diff --git a/packages/example-react-app/src/ProviderButton.css b/packages/example-react-app/src/components/ProviderButton.css
similarity index 100%
rename from packages/example-react-app/src/ProviderButton.css
rename to packages/example-react-app/src/components/ProviderButton.css
diff --git a/packages/example-react-app/src/components/ProviderButton.tsx b/packages/example-react-app/src/components/ProviderButton.tsx
new file mode 100644
index 0000000..5754738
--- /dev/null
+++ b/packages/example-react-app/src/components/ProviderButton.tsx
@@ -0,0 +1,18 @@
+import { useContext } from 'react';
+import type { EIP6963ProviderDetail } from 'web3';
+
+import type { IWeb3Context } from '../web3/Web3Context';
+import { Web3Context } from '../web3/Web3Context';
+
+import './ProviderButton.css';
+
+export function ProviderButton({ provider }: { provider: EIP6963ProviderDetail }) {
+  const web3Context: IWeb3Context = useContext(Web3Context);
+
+  return (
+    <button type="button" onClick={() => web3Context.setCurrentProvider(provider)}>
+      <img src={provider.info.icon} alt={provider.info.name} width="35" />
+      <span> {provider.info.name}</span>
+    </button>
+  );
+}
diff --git a/packages/example-react-app/src/index.tsx b/packages/example-react-app/src/index.tsx
index 9fa0d3f..71ea909 100644
--- a/packages/example-react-app/src/index.tsx
+++ b/packages/example-react-app/src/index.tsx
@@ -1,15 +1,13 @@
-import React from "react";
-import ReactDOM from "react-dom/client";
-import App from "./App";
-import { Web3Provider } from "./web3/Web3Context";
+import React from 'react';
+import ReactDOM from 'react-dom/client';
+import App from './App';
+import { Web3Provider } from './web3/Web3Context';
 
-const root = ReactDOM.createRoot(
-  document.getElementById("root") as HTMLElement
-);
+const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement);
 root.render(
   <React.StrictMode>
     <Web3Provider>
       <App />
     </Web3Provider>
-  </React.StrictMode>
+  </React.StrictMode>,
 );
diff --git a/packages/example-react-app/src/wallet-components/AddEthereumChain.tsx b/packages/example-react-app/src/wallet-components/AddEthereumChain.tsx
new file mode 100644
index 0000000..5edff3a
--- /dev/null
+++ b/packages/example-react-app/src/wallet-components/AddEthereumChain.tsx
@@ -0,0 +1,74 @@
+import { useContext, useState } from 'react';
+import { AddEthereumChainRequest } from 'web3-plugin-wallet-rpc';
+import { Web3Context } from '../web3/Web3Context';
+
+const chains: Record<string, AddEthereumChainRequest> = {
+  mantle: {
+    chainId: 5000,
+    blockExplorerUrls: ['https://mantlescan.xyz'],
+    chainName: 'Mantle',
+    iconUrls: ['https://icons.llamao.fi/icons/chains/rsz_mantle.jpg'],
+    nativeCurrency: {
+      name: 'Mantle',
+      symbol: 'MNT',
+      decimals: 18,
+    },
+    rpcUrls: ['https://rpc.mantle.xyz'],
+  },
+  scroll: {
+    chainId: 534352,
+    blockExplorerUrls: ['https://scrollscan.com'],
+    chainName: 'Scroll',
+    iconUrls: ['https://icons.llamao.fi/icons/chains/rsz_scroll.jpg'],
+    nativeCurrency: {
+      name: 'ETH',
+      symbol: 'ETH',
+      decimals: 18,
+    },
+    rpcUrls: ['https://rpc.scroll.io'],
+  },
+};
+
+function AddChainButton({ chainDetails }: { chainDetails: AddEthereumChainRequest }) {
+  const { web3 } = useContext(Web3Context);
+  const [error, setError] = useState<Error | undefined>(undefined);
+
+  const handleClick = () => {
+    web3.walletRpc
+      .addEthereumChain(chainDetails)
+      .then((response) => {
+        // eslint-disable-next-line no-console
+        console.log(
+          `Successfully added chain ${chainDetails.chainId} with response`,
+          response,
+        );
+      })
+      .catch((e) => {
+        // eslint-disable-next-line no-console
+        console.error(e);
+
+        if (e instanceof Error) {
+          setError(e);
+        }
+      });
+  };
+
+  return (
+    <>
+      <button type="button" onClick={handleClick}>
+        {`Add new chain: ${chainDetails.chainName} (${chainDetails.chainId})`}
+      </button>
+      {error && <div>{error.message}</div>}
+    </>
+  );
+}
+
+export function AddEthereumChain() {
+  return (
+    <div>
+      <h4>Add EVM Chain</h4>
+      <AddChainButton chainDetails={chains.mantle} />
+      <AddChainButton chainDetails={chains.scroll} />
+    </div>
+  );
+}
diff --git a/packages/example-react-app/src/wallet-components/GetPermissions.tsx b/packages/example-react-app/src/wallet-components/GetPermissions.tsx
new file mode 100644
index 0000000..fa2fdc2
--- /dev/null
+++ b/packages/example-react-app/src/wallet-components/GetPermissions.tsx
@@ -0,0 +1,38 @@
+import { useContext, useState } from 'react';
+import { Permission } from 'web3-plugin-wallet-rpc';
+import { Web3Context } from '../web3/Web3Context';
+
+export function GetPermissions() {
+  const { web3 } = useContext(Web3Context);
+  const [error, setError] = useState<Error | undefined>(undefined);
+  const [permissions, setPermissions] = useState<Permission[] | undefined>(undefined);
+
+  const handleClick = () => {
+    web3.walletRpc
+      .getPermissions()
+      .then((response) => {
+        // eslint-disable-next-line no-console
+        console.log(`Successfully got permissions with response`, response);
+
+        setPermissions(response);
+      })
+      .catch((e) => {
+        // eslint-disable-next-line no-console
+        console.error(e);
+
+        if (e instanceof Error) {
+          setError(e);
+        }
+      });
+  };
+
+  return (
+    <>
+      <button type="button" onClick={handleClick}>
+        Get permissions
+      </button>
+      {permissions && <pre>{JSON.stringify(permissions, null, 2)}</pre>}
+      {error && <div>{error.message}</div>}
+    </>
+  );
+}
diff --git a/packages/example-react-app/src/wallet-components/Permissions.tsx b/packages/example-react-app/src/wallet-components/Permissions.tsx
new file mode 100644
index 0000000..81481dd
--- /dev/null
+++ b/packages/example-react-app/src/wallet-components/Permissions.tsx
@@ -0,0 +1,14 @@
+import { GetPermissions } from './GetPermissions';
+import { RequestPermissions } from './RequestPermissions';
+import { RevokePermissions } from './RevokePermissions';
+
+export function Permissions() {
+  return (
+    <div>
+      <h4>Request, get and revoke permissions</h4>
+      <RequestPermissions />
+      <GetPermissions />
+      <RevokePermissions />
+    </div>
+  );
+}
diff --git a/packages/example-react-app/src/wallet-components/RequestPermissions.tsx b/packages/example-react-app/src/wallet-components/RequestPermissions.tsx
new file mode 100644
index 0000000..b1f70e8
--- /dev/null
+++ b/packages/example-react-app/src/wallet-components/RequestPermissions.tsx
@@ -0,0 +1,40 @@
+import { useContext, useState } from 'react';
+import { Permission } from 'web3-plugin-wallet-rpc';
+import { Web3Context } from '../web3/Web3Context';
+
+export function RequestPermissions() {
+  const { web3 } = useContext(Web3Context);
+  const [error, setError] = useState<Error | undefined>(undefined);
+  const [permissions, setPermissions] = useState<Permission[] | undefined>(undefined);
+
+  const handleClick = () => {
+    web3.walletRpc
+      .requestPermissions({
+        eth_accounts: {},
+      })
+      .then((response) => {
+        // eslint-disable-next-line no-console
+        console.log(`Successfully requested permissions with response`, response);
+
+        setPermissions(response);
+      })
+      .catch((e) => {
+        // eslint-disable-next-line no-console
+        console.error(e);
+
+        if (e instanceof Error) {
+          setError(e);
+        }
+      });
+  };
+
+  return (
+    <>
+      <button type="button" onClick={handleClick}>
+        Request permissions
+      </button>
+      {permissions && <pre>{JSON.stringify(permissions, null, 2)}</pre>}
+      {error && <div>{error.message}</div>}
+    </>
+  );
+}
diff --git a/packages/example-react-app/src/wallet-components/RevokePermissions.tsx b/packages/example-react-app/src/wallet-components/RevokePermissions.tsx
new file mode 100644
index 0000000..2ac68fb
--- /dev/null
+++ b/packages/example-react-app/src/wallet-components/RevokePermissions.tsx
@@ -0,0 +1,35 @@
+import { useContext, useState } from 'react';
+import { Web3Context } from '../web3/Web3Context';
+
+export function RevokePermissions() {
+  const { web3 } = useContext(Web3Context);
+  const [error, setError] = useState<Error | undefined>(undefined);
+
+  const handleClick = () => {
+    web3.walletRpc
+      .revokePermissions({
+        eth_accounts: {},
+      })
+      .then((response) => {
+        // eslint-disable-next-line no-console
+        console.log(`Successfully revoked permissions with response`, response);
+      })
+      .catch((e) => {
+        // eslint-disable-next-line no-console
+        console.error(e);
+
+        if (e instanceof Error) {
+          setError(e);
+        }
+      });
+  };
+
+  return (
+    <>
+      <button type="button" onClick={handleClick}>
+        Revoke permissions
+      </button>
+      {error && <div>{error.message}</div>}
+    </>
+  );
+}
diff --git a/packages/example-react-app/src/wallet-components/SwitchEthereumChain.tsx b/packages/example-react-app/src/wallet-components/SwitchEthereumChain.tsx
new file mode 100644
index 0000000..66202c0
--- /dev/null
+++ b/packages/example-react-app/src/wallet-components/SwitchEthereumChain.tsx
@@ -0,0 +1,45 @@
+import { useContext, useState } from 'react';
+
+import { Web3Context } from '../web3/Web3Context';
+
+function SwitchChainButton({ chainId }: { chainId: number }) {
+  const { web3 } = useContext(Web3Context);
+  const [error, setError] = useState<Error | undefined>(undefined);
+
+  const handleClick = () => {
+    web3.walletRpc
+      .switchEthereumChain(chainId)
+      .then((response) => {
+        // eslint-disable-next-line no-console
+        console.log(`Successfully switched to chain ${chainId} with response`, response);
+      })
+      .catch((e) => {
+        // eslint-disable-next-line no-console
+        console.error(e);
+
+        if (e instanceof Error) {
+          setError(e);
+        }
+      });
+  };
+
+  return (
+    <>
+      <button type="button" onClick={handleClick}>
+        Switch to chain {chainId}
+      </button>
+      {error && <div>{error.message}</div>}
+    </>
+  );
+}
+
+export function SwitchEthereumChain() {
+  return (
+    <div>
+      <h4>Switch Chain (must be known by the wallet)</h4>
+      <SwitchChainButton chainId={137} />
+      <SwitchChainButton chainId={1} />
+      <SwitchChainButton chainId={5000} />
+    </div>
+  );
+}
diff --git a/packages/example-react-app/src/wallet-components/WatchAsset.tsx b/packages/example-react-app/src/wallet-components/WatchAsset.tsx
new file mode 100644
index 0000000..a59d255
--- /dev/null
+++ b/packages/example-react-app/src/wallet-components/WatchAsset.tsx
@@ -0,0 +1,53 @@
+import { useContext, useState } from 'react';
+import { WatchAssetRequest } from 'web3-plugin-wallet-rpc';
+import { Web3Context } from '../web3/Web3Context';
+
+const tokens: Record<string, WatchAssetRequest> = {
+  usdc: {
+    type: 'ERC20',
+    options: {
+      address: '0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48',
+      symbol: 'USDC',
+    },
+  },
+};
+
+function WatchAssetButton({ asset }: { asset: WatchAssetRequest }) {
+  const { web3 } = useContext(Web3Context);
+  const [error, setError] = useState<Error | undefined>(undefined);
+
+  const handleClick = () => {
+    web3.walletRpc
+      .watchAsset(asset)
+      .then((response) => {
+        // eslint-disable-next-line no-console
+        console.log(`Successfully added ${asset.options.symbol} with response`, response);
+      })
+      .catch((e) => {
+        // eslint-disable-next-line no-console
+        console.error(e);
+
+        if (e instanceof Error) {
+          setError(e);
+        }
+      });
+  };
+
+  return (
+    <>
+      <button type="button" onClick={handleClick}>
+        Add {asset.options.symbol}
+      </button>
+      {error && <div>{error.message}</div>}
+    </>
+  );
+}
+
+export function WatchAsset() {
+  return (
+    <div>
+      <h4>Add token to wallet's list</h4>
+      <WatchAssetButton asset={tokens.usdc} />
+    </div>
+  );
+}
diff --git a/packages/example-react-app/src/web3/AccountContext.tsx b/packages/example-react-app/src/web3/AccountContext.tsx
index 6cceaf6..bd9820a 100644
--- a/packages/example-react-app/src/web3/AccountContext.tsx
+++ b/packages/example-react-app/src/web3/AccountContext.tsx
@@ -1,12 +1,6 @@
-import {
-  createContext,
-  type ReactNode,
-  useContext,
-  useEffect,
-  useState,
-} from "react";
+import { createContext, type ReactNode, useContext, useEffect, useState } from 'react';
 
-import { type IWeb3Context, Web3Context } from "./Web3Context";
+import { type IWeb3Context, Web3Context } from './Web3Context';
 
 export interface IAccountContext {
   accounts: string[];
@@ -41,9 +35,8 @@ export const AccountProvider = ({ children }: { children: ReactNode }) => {
     }
 
     web3Context.web3.eth.getAccounts().then(setAccounts);
-    provider.provider.on("accountsChanged", setAccounts);
-    return () =>
-      provider.provider.removeListener("accountsChanged", setAccounts);
+    provider.provider.on('accountsChanged', setAccounts);
+    return () => provider.provider.removeListener('accountsChanged', setAccounts);
   }, [web3Context.currentProvider, web3Context.web3.eth]);
 
   // update selected account
@@ -66,8 +59,6 @@ export const AccountProvider = ({ children }: { children: ReactNode }) => {
   };
 
   return (
-    <AccountContext.Provider value={accountContext}>
-      {children}
-    </AccountContext.Provider>
+    <AccountContext.Provider value={accountContext}>{children}</AccountContext.Provider>
   );
 };
diff --git a/packages/example-react-app/src/web3/Web3Context.tsx b/packages/example-react-app/src/web3/Web3Context.tsx
index ae29467..b6dcc77 100644
--- a/packages/example-react-app/src/web3/Web3Context.tsx
+++ b/packages/example-react-app/src/web3/Web3Context.tsx
@@ -5,10 +5,10 @@ import {
   useEffect,
   useMemo,
   useState,
-} from "react";
-import { providers, Web3 } from "web3";
-import { WalletRpcPlugin } from "web3-plugin-wallet-rpc";
-import { useProviders } from "./useProviders";
+} from 'react';
+import { providers, Web3 } from 'web3';
+import { WalletRpcPlugin } from 'web3-plugin-wallet-rpc';
+import { useProviders } from './useProviders';
 
 export interface IWeb3Context {
   web3: Web3;
@@ -21,9 +21,7 @@ const defaultContext: IWeb3Context = {
   web3: new Web3(),
   providers: [],
   currentProvider: undefined,
-  setCurrentProvider: function (
-    provider: providers.EIP6963ProviderDetail
-  ): void {
+  setCurrentProvider: function (provider: providers.EIP6963ProviderDetail): void {
     this.web3.setProvider(provider.provider);
     this.currentProvider = provider;
   },
@@ -51,10 +49,10 @@ export const Web3Provider = ({ children }: { children: ReactNode }) => {
   const setCurrentProvider = useCallback(
     (provider: providers.EIP6963ProviderDetail) => {
       web3.setProvider(provider.provider);
-      localStorage.setItem("provider", provider.info.rdns);
+      localStorage.setItem('provider', provider.info.rdns);
       _setCurrentProvider(provider);
     },
-    [web3]
+    [web3],
   );
 
   // update provider with cached value from local storage on page load
@@ -63,16 +61,15 @@ export const Web3Provider = ({ children }: { children: ReactNode }) => {
       return;
     }
 
-    const cachedProvider: string | null = localStorage.getItem("provider");
+    const cachedProvider: string | null = localStorage.getItem('provider');
     if (cachedProvider === null) {
       return;
     }
 
-    const targetProvider: providers.EIP6963ProviderDetail | undefined =
-      providers.find(
-        (provider: providers.EIP6963ProviderDetail) =>
-          provider.info.rdns === cachedProvider
-      );
+    const targetProvider: providers.EIP6963ProviderDetail | undefined = providers.find(
+      (provider: providers.EIP6963ProviderDetail) =>
+        provider.info.rdns === cachedProvider,
+    );
 
     if (targetProvider !== undefined) {
       setCurrentProvider(targetProvider);
@@ -86,7 +83,5 @@ export const Web3Provider = ({ children }: { children: ReactNode }) => {
     setCurrentProvider,
   };
 
-  return (
-    <Web3Context.Provider value={web3Context}>{children}</Web3Context.Provider>
-  );
+  return <Web3Context.Provider value={web3Context}>{children}</Web3Context.Provider>;
 };
diff --git a/packages/example-react-app/src/web3/useProviders.ts b/packages/example-react-app/src/web3/useProviders.ts
index 5c5d8d6..b7dc198 100644
--- a/packages/example-react-app/src/web3/useProviders.ts
+++ b/packages/example-react-app/src/web3/useProviders.ts
@@ -1,5 +1,5 @@
-import { useSyncExternalStore } from "react";
-import { providers, Web3 } from "web3";
+import { useSyncExternalStore } from 'react';
+import { providers, Web3 } from 'web3';
 
 let providerList: providers.EIP6963ProviderDetail[] = [];
 
@@ -21,9 +21,7 @@ const providerStore = {
 
     Web3.requestEIP6963Providers().then(setProviders);
 
-    function updateProviders(
-      providerEvent: providers.EIP6963ProvidersMapUpdateEvent,
-    ) {
+    function updateProviders(providerEvent: providers.EIP6963ProvidersMapUpdateEvent) {
       setProviders(providerEvent.detail);
     }
 
diff --git a/packages/example-react-app/tsconfig.json b/packages/example-react-app/tsconfig.json
index eab4d9e..8df5389 100644
--- a/packages/example-react-app/tsconfig.json
+++ b/packages/example-react-app/tsconfig.json
@@ -1,11 +1,7 @@
 {
   "compilerOptions": {
     "target": "es2020",
-    "lib": [
-      "dom",
-      "dom.iterable",
-      "esnext"
-    ],
+    "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,
     "esModuleInterop": true,
@@ -20,7 +16,5 @@
     "noEmit": true,
     "jsx": "react-jsx"
   },
-  "include": [
-    "src"
-  ]
+  "include": ["src"]
 }
diff --git a/packages/web3-plugin-wallet-rpc/.eslintrc.js b/packages/web3-plugin-wallet-rpc/.eslintrc.js
index 95780fa..9aad996 100644
--- a/packages/web3-plugin-wallet-rpc/.eslintrc.js
+++ b/packages/web3-plugin-wallet-rpc/.eslintrc.js
@@ -1,3 +1,3 @@
 module.exports = {
-  extends: "@chainsafe",
+  extends: '@chainsafe',
 };
diff --git a/packages/web3-plugin-wallet-rpc/src/WalletRpcPlugin.ts b/packages/web3-plugin-wallet-rpc/src/WalletRpcPlugin.ts
index d31ba1f..b6da5e8 100644
--- a/packages/web3-plugin-wallet-rpc/src/WalletRpcPlugin.ts
+++ b/packages/web3-plugin-wallet-rpc/src/WalletRpcPlugin.ts
@@ -1,5 +1,5 @@
-import type { Numbers } from "web3";
-import { Web3PluginBase, utils, validator } from "web3";
+import type { Numbers } from 'web3';
+import { Web3PluginBase, utils, validator } from 'web3';
 
 import type {
   AddEthereumChainRequest,
@@ -9,18 +9,19 @@ import type {
   PermissionRequest,
   UpdateEthereumChainRequest,
   WatchAssetRequest,
-} from "./types";
-import { parseToGetOwnedAssetsResult } from "./utils";
+} from './types';
+import { parseToGetOwnedAssetsResult } from './utils';
 
 type WalletRpcApi = {
-  wallet_addEthereumChain: (param: AddEthereumChainRequest) => void;
-  wallet_updateEthereumChain: (param: UpdateEthereumChainRequest) => void;
-  wallet_switchEthereumChain: (chainId: Numbers) => void;
-  wallet_getOwnedAssets: (param: GetOwnedAssetsRequest) => OwnedAsset[];
+  wallet_addEthereumChain: (param: AddEthereumChainRequest) => null;
+  wallet_switchEthereumChain: (chainId: Numbers) => null;
   wallet_watchAsset: (param: WatchAssetRequest) => boolean;
   wallet_requestPermissions: (param: PermissionRequest) => Permission[];
   wallet_getPermissions: () => Permission[];
-  wallet_revokePermissions: (param: PermissionRequest) => void;
+  wallet_revokePermissions: (param: PermissionRequest) => null;
+  // experimental
+  wallet_getOwnedAssets: (param: GetOwnedAssetsRequest) => OwnedAsset[];
+  wallet_updateEthereumChain: (param: UpdateEthereumChainRequest) => void;
 };
 
 /**
@@ -38,7 +39,7 @@ type WalletRpcApi = {
  * ```
  */
 export class WalletRpcPlugin extends Web3PluginBase<WalletRpcApi> {
-  public pluginNamespace = "walletRpc";
+  public pluginNamespace = 'walletRpc';
 
   public constructor() {
     super();
@@ -66,9 +67,9 @@ export class WalletRpcPlugin extends Web3PluginBase<WalletRpcApi> {
    *   rpcUrls: ["https://rpc.mantle.xyz"],
    * });
    */
-  public async addEthereumChain(param: AddEthereumChainRequest): Promise<void> {
+  public async addEthereumChain(param: AddEthereumChainRequest): Promise<null> {
     return this.requestManager.send({
-      method: "wallet_addEthereumChain",
+      method: 'wallet_addEthereumChain',
       params: [
         {
           ...param,
@@ -87,11 +88,9 @@ export class WalletRpcPlugin extends Web3PluginBase<WalletRpcApi> {
    * @returns A Promise that resolves if the request is successful.
    * @experimental
    */
-  public async updateEthereumChain(
-    param: UpdateEthereumChainRequest,
-  ): Promise<void> {
+  public async updateEthereumChain(param: UpdateEthereumChainRequest): Promise<void> {
     return this.requestManager.send({
-      method: "wallet_updateEthereumChain",
+      method: 'wallet_updateEthereumChain',
       params: [
         {
           ...param,
@@ -103,6 +102,7 @@ export class WalletRpcPlugin extends Web3PluginBase<WalletRpcApi> {
 
   /**
    * Switch the wallet's currently active chain.
+   *
    * If the specified chain does not exist in the wallet, an error will be thrown.
    * To prevent errors, ensure the chain has been added first or handle the call within a try/catch block.
    *
@@ -114,9 +114,9 @@ export class WalletRpcPlugin extends Web3PluginBase<WalletRpcApi> {
    * @example
    * await web3.walletRpc.switchEthereumChain(5000);
    */
-  public async switchEthereumChain(chainId: Numbers): Promise<void> {
+  public async switchEthereumChain(chainId: Numbers): Promise<null> {
     return this.requestManager.send({
-      method: "wallet_switchEthereumChain",
+      method: 'wallet_switchEthereumChain',
       params: [
         {
           chainId: utils.toHex(chainId),
@@ -134,10 +134,8 @@ export class WalletRpcPlugin extends Web3PluginBase<WalletRpcApi> {
    * @returns A Promise that resolves to a list of owned assets.
    * @experimental
    */
-  public async getOwnedAssets(
-    param: GetOwnedAssetsRequest,
-  ): Promise<OwnedAsset[]> {
-    validator.validator.validate(["address"], [param.address]);
+  public async getOwnedAssets(param: GetOwnedAssetsRequest): Promise<OwnedAsset[]> {
+    validator.validator.validate(['address'], [param.address]);
 
     const trueParam = { ...param };
     if (trueParam.options?.chainId) {
@@ -145,7 +143,7 @@ export class WalletRpcPlugin extends Web3PluginBase<WalletRpcApi> {
     }
 
     const result = await this.requestManager.send({
-      method: "wallet_getOwnedAssets",
+      method: 'wallet_getOwnedAssets',
       params: [trueParam],
     });
 
@@ -171,7 +169,7 @@ export class WalletRpcPlugin extends Web3PluginBase<WalletRpcApi> {
    */
   public async watchAsset(param: WatchAssetRequest): Promise<boolean> {
     return this.requestManager.send({
-      method: "wallet_watchAsset",
+      method: 'wallet_watchAsset',
       params: [param],
     });
   }
@@ -189,11 +187,9 @@ export class WalletRpcPlugin extends Web3PluginBase<WalletRpcApi> {
    *   eth_accounts: {}
    * });
    */
-  public async requestPermissions(
-    param: PermissionRequest,
-  ): Promise<Permission[]> {
+  public async requestPermissions(param: PermissionRequest): Promise<Permission[]> {
     return this.requestManager.send({
-      method: "wallet_requestPermissions",
+      method: 'wallet_requestPermissions',
       params: [param],
     });
   }
@@ -210,7 +206,7 @@ export class WalletRpcPlugin extends Web3PluginBase<WalletRpcApi> {
    */
   public async getPermissions(): Promise<Permission[]> {
     return this.requestManager.send({
-      method: "wallet_getPermissions",
+      method: 'wallet_getPermissions',
       params: [],
     });
   }
@@ -226,15 +222,15 @@ export class WalletRpcPlugin extends Web3PluginBase<WalletRpcApi> {
    *   eth_accounts: {}
    * });
    */
-  public async revokePermissions(param: PermissionRequest): Promise<void> {
+  public async revokePermissions(param: PermissionRequest): Promise<null> {
     return this.requestManager.send({
-      method: "wallet_revokePermissions",
+      method: 'wallet_revokePermissions',
       params: [param],
     });
   }
 }
 
-declare module "web3" {
+declare module 'web3' {
   interface Web3Context {
     walletRpc: WalletRpcPlugin;
   }
diff --git a/packages/web3-plugin-wallet-rpc/src/index.ts b/packages/web3-plugin-wallet-rpc/src/index.ts
index a715ade..5071188 100644
--- a/packages/web3-plugin-wallet-rpc/src/index.ts
+++ b/packages/web3-plugin-wallet-rpc/src/index.ts
@@ -1,2 +1,2 @@
-export * from "./WalletRpcPlugin";
-export * from "./types";
+export * from './WalletRpcPlugin';
+export * from './types';
diff --git a/packages/web3-plugin-wallet-rpc/src/types.ts b/packages/web3-plugin-wallet-rpc/src/types.ts
index d20dc73..7aeabf7 100644
--- a/packages/web3-plugin-wallet-rpc/src/types.ts
+++ b/packages/web3-plugin-wallet-rpc/src/types.ts
@@ -1,4 +1,4 @@
-import type { Address, Numbers } from "web3";
+import type { Address, Numbers } from 'web3';
 
 export type NativeCurrencyData = {
   /**
@@ -230,7 +230,7 @@ export type Caveat = {
   /**
    * Value associated with this restriction, as JSON. Its meaning is context-dependent based on the caveat type.
    */
-  value: any;
+  value: unknown;
 };
 
 /**
diff --git a/packages/web3-plugin-wallet-rpc/src/utils.ts b/packages/web3-plugin-wallet-rpc/src/utils.ts
index b537693..6500331 100644
--- a/packages/web3-plugin-wallet-rpc/src/utils.ts
+++ b/packages/web3-plugin-wallet-rpc/src/utils.ts
@@ -1,4 +1,4 @@
-import type { OwnedAsset } from "./types";
+import type { OwnedAsset } from './types';
 
 export function parseToGetOwnedAssetsResult(result: unknown[]): OwnedAsset[] {
   return result as OwnedAsset[];
diff --git a/packages/web3-plugin-wallet-rpc/test/WalletRpcPlugin.test.ts b/packages/web3-plugin-wallet-rpc/test/WalletRpcPlugin.test.ts
index 9ce10ba..a208c12 100644
--- a/packages/web3-plugin-wallet-rpc/test/WalletRpcPlugin.test.ts
+++ b/packages/web3-plugin-wallet-rpc/test/WalletRpcPlugin.test.ts
@@ -1,10 +1,10 @@
-import { core } from "web3";
+import { core } from 'web3';
 
-import { WalletRpcPlugin } from "../src";
+import { WalletRpcPlugin } from '../src';
 
-describe("WalletRpcPlugin", () => {
-  it("should register the plugin on Web3Context instance", () => {
-    const web3Context = new core.Web3Context("http://127.0.0.1:8545");
+describe('WalletRpcPlugin', () => {
+  it('should register the plugin on Web3Context instance', () => {
+    const web3Context = new core.Web3Context('http://127.0.0.1:8545');
     web3Context.registerPlugin(new WalletRpcPlugin());
     expect(web3Context.walletRpc).toBeDefined();
   });
diff --git a/packages/web3-plugin-wallet-rpc/test/jest.config.js b/packages/web3-plugin-wallet-rpc/test/jest.config.js
index 3abcbd9..3745fc2 100644
--- a/packages/web3-plugin-wallet-rpc/test/jest.config.js
+++ b/packages/web3-plugin-wallet-rpc/test/jest.config.js
@@ -1,5 +1,5 @@
 /** @type {import('ts-jest').JestConfigWithTsJest} */
 module.exports = {
-  preset: "ts-jest",
-  testEnvironment: "node",
+  preset: 'ts-jest',
+  testEnvironment: 'node',
 };
diff --git a/packages/web3-plugin-wallet-rpc/test/wallet_addEthereumChain.test.ts b/packages/web3-plugin-wallet-rpc/test/wallet_addEthereumChain.test.ts
index 5bb5478..522acd7 100644
--- a/packages/web3-plugin-wallet-rpc/test/wallet_addEthereumChain.test.ts
+++ b/packages/web3-plugin-wallet-rpc/test/wallet_addEthereumChain.test.ts
@@ -1,10 +1,10 @@
-import { Web3 } from "web3";
+import { Web3 } from 'web3';
 
-import { WalletRpcPlugin } from "../src";
+import { WalletRpcPlugin } from '../src';
 
-describe("WalletRpcPlugin", () => {
-  describe("wallet_addEthereumChain", () => {
-    const web3 = new Web3("http://127.0.0.1:8545");
+describe('WalletRpcPlugin', () => {
+  describe('wallet_addEthereumChain', () => {
+    const web3 = new Web3('http://127.0.0.1:8545');
     web3.registerPlugin(new WalletRpcPlugin());
 
     const requestManagerSendSpy = jest.fn();
@@ -14,43 +14,43 @@ describe("WalletRpcPlugin", () => {
       requestManagerSendSpy.mockClear();
     });
 
-    it("should call the method with expected params", async () => {
+    it('should call the method with expected params', async () => {
       await web3.walletRpc.addEthereumChain({ chainId: 5000 });
 
       expect(requestManagerSendSpy).toHaveBeenCalledWith({
-        method: "wallet_addEthereumChain",
-        params: [{ chainId: "0x1388" }],
+        method: 'wallet_addEthereumChain',
+        params: [{ chainId: '0x1388' }],
       });
     });
 
-    it("should return correct result", async () => {
+    it('should return correct result', async () => {
       const result = await web3.walletRpc.addEthereumChain({ chainId: 5000 });
 
       expect(result).toBeUndefined();
     });
 
-    it("should pass all possible fields as a param", async () => {
+    it('should pass all possible fields as a param', async () => {
       const request = {
         chainId: 5000,
-        blockExplorerUrls: ["https://mantlescan.xyz"],
-        chainName: "Mantle",
-        iconUrls: ["https://icons.llamao.fi/icons/chains/rsz_mantle.jpg"],
+        blockExplorerUrls: ['https://mantlescan.xyz'],
+        chainName: 'Mantle',
+        iconUrls: ['https://icons.llamao.fi/icons/chains/rsz_mantle.jpg'],
         nativeCurrency: {
-          name: "Mantle",
-          symbol: "MNT",
+          name: 'Mantle',
+          symbol: 'MNT',
           decimals: 18,
         },
-        rpcUrls: ["https://rpc.mantle.xyz"],
+        rpcUrls: ['https://rpc.mantle.xyz'],
       };
 
       await web3.walletRpc.addEthereumChain(request);
 
       expect(requestManagerSendSpy).toHaveBeenCalledWith({
-        method: "wallet_addEthereumChain",
+        method: 'wallet_addEthereumChain',
         params: [
           {
             ...request,
-            chainId: "0x1388",
+            chainId: '0x1388',
           },
         ],
       });
diff --git a/packages/web3-plugin-wallet-rpc/test/wallet_getOwnedAssets.test.ts b/packages/web3-plugin-wallet-rpc/test/wallet_getOwnedAssets.test.ts
index d56924d..1cbd4ae 100644
--- a/packages/web3-plugin-wallet-rpc/test/wallet_getOwnedAssets.test.ts
+++ b/packages/web3-plugin-wallet-rpc/test/wallet_getOwnedAssets.test.ts
@@ -1,10 +1,10 @@
-import { Web3 } from "web3";
+import { Web3 } from 'web3';
 
-import { WalletRpcPlugin } from "../src";
+import { WalletRpcPlugin } from '../src';
 
-describe("WalletRpcPlugin", () => {
-  describe("wallet_getOwnedAssets", () => {
-    const web3 = new Web3("http://127.0.0.1:8545");
+describe('WalletRpcPlugin', () => {
+  describe('wallet_getOwnedAssets', () => {
+    const web3 = new Web3('http://127.0.0.1:8545');
     web3.registerPlugin(new WalletRpcPlugin());
 
     const requestManagerSendSpy = jest.fn();
@@ -14,21 +14,21 @@ describe("WalletRpcPlugin", () => {
       requestManagerSendSpy.mockClear();
     });
 
-    it("should call the method with expected params", async () => {
+    it('should call the method with expected params', async () => {
       await web3.walletRpc.getOwnedAssets({
-        address: "0xa5653e88D9c352387deDdC79bcf99f0ada62e9c6",
+        address: '0xa5653e88D9c352387deDdC79bcf99f0ada62e9c6',
       });
 
       expect(requestManagerSendSpy).toHaveBeenCalledWith({
-        method: "wallet_getOwnedAssets",
-        params: [{ address: "0xa5653e88D9c352387deDdC79bcf99f0ada62e9c6" }],
+        method: 'wallet_getOwnedAssets',
+        params: [{ address: '0xa5653e88D9c352387deDdC79bcf99f0ada62e9c6' }],
       });
     });
 
-    it("should throw when called with invalid address", async () => {
-      await expect(
-        web3.walletRpc.getOwnedAssets({ address: "" }),
-      ).rejects.toThrow("validator found 1 error");
+    it('should throw when called with invalid address', async () => {
+      await expect(web3.walletRpc.getOwnedAssets({ address: '' })).rejects.toThrow(
+        'validator found 1 error',
+      );
     });
   });
 });
diff --git a/packages/web3-plugin-wallet-rpc/test/wallet_getPermissions.test.ts b/packages/web3-plugin-wallet-rpc/test/wallet_getPermissions.test.ts
index f681cad..db38aba 100644
--- a/packages/web3-plugin-wallet-rpc/test/wallet_getPermissions.test.ts
+++ b/packages/web3-plugin-wallet-rpc/test/wallet_getPermissions.test.ts
@@ -1,10 +1,10 @@
-import { Web3 } from "web3";
+import { Web3 } from 'web3';
 
-import { WalletRpcPlugin } from "../src";
+import { WalletRpcPlugin } from '../src';
 
-describe("WalletRpcPlugin", () => {
-  describe("wallet_getPermissions", () => {
-    const web3 = new Web3("http://127.0.0.1:8545");
+describe('WalletRpcPlugin', () => {
+  describe('wallet_getPermissions', () => {
+    const web3 = new Web3('http://127.0.0.1:8545');
     web3.registerPlugin(new WalletRpcPlugin());
 
     const requestManagerSendSpy = jest.fn();
@@ -14,11 +14,11 @@ describe("WalletRpcPlugin", () => {
       requestManagerSendSpy.mockClear();
     });
 
-    it("should call the method with expected params", async () => {
+    it('should call the method with expected params', async () => {
       await web3.walletRpc.getPermissions();
 
       expect(requestManagerSendSpy).toHaveBeenCalledWith({
-        method: "wallet_getPermissions",
+        method: 'wallet_getPermissions',
         params: [],
       });
     });
diff --git a/packages/web3-plugin-wallet-rpc/test/wallet_requestPermissions.test.ts b/packages/web3-plugin-wallet-rpc/test/wallet_requestPermissions.test.ts
index c8f8d94..bd3dcca 100644
--- a/packages/web3-plugin-wallet-rpc/test/wallet_requestPermissions.test.ts
+++ b/packages/web3-plugin-wallet-rpc/test/wallet_requestPermissions.test.ts
@@ -1,10 +1,10 @@
-import { Web3 } from "web3";
+import { Web3 } from 'web3';
 
-import { WalletRpcPlugin } from "../src";
+import { WalletRpcPlugin } from '../src';
 
-describe("WalletRpcPlugin", () => {
-  describe("wallet_requestPermissions", () => {
-    const web3 = new Web3("http://127.0.0.1:8545");
+describe('WalletRpcPlugin', () => {
+  describe('wallet_requestPermissions', () => {
+    const web3 = new Web3('http://127.0.0.1:8545');
     web3.registerPlugin(new WalletRpcPlugin());
 
     const requestManagerSendSpy = jest.fn();
@@ -14,7 +14,7 @@ describe("WalletRpcPlugin", () => {
       requestManagerSendSpy.mockClear();
     });
 
-    it("should call the method with expected params", async () => {
+    it('should call the method with expected params', async () => {
       const request = {
         eth_accounts: {},
       };
@@ -22,7 +22,7 @@ describe("WalletRpcPlugin", () => {
       await web3.walletRpc.requestPermissions(request);
 
       expect(requestManagerSendSpy).toHaveBeenCalledWith({
-        method: "wallet_requestPermissions",
+        method: 'wallet_requestPermissions',
         params: [request],
       });
     });
diff --git a/packages/web3-plugin-wallet-rpc/test/wallet_revokePermissions.test.ts b/packages/web3-plugin-wallet-rpc/test/wallet_revokePermissions.test.ts
index 2d23506..10b79a0 100644
--- a/packages/web3-plugin-wallet-rpc/test/wallet_revokePermissions.test.ts
+++ b/packages/web3-plugin-wallet-rpc/test/wallet_revokePermissions.test.ts
@@ -1,10 +1,10 @@
-import { Web3 } from "web3";
+import { Web3 } from 'web3';
 
-import { WalletRpcPlugin } from "../src";
+import { WalletRpcPlugin } from '../src';
 
-describe("WalletRpcPlugin", () => {
-  describe("wallet_revokePermissions", () => {
-    const web3 = new Web3("http://127.0.0.1:8545");
+describe('WalletRpcPlugin', () => {
+  describe('wallet_revokePermissions', () => {
+    const web3 = new Web3('http://127.0.0.1:8545');
     web3.registerPlugin(new WalletRpcPlugin());
 
     const requestManagerSendSpy = jest.fn();
@@ -14,7 +14,7 @@ describe("WalletRpcPlugin", () => {
       requestManagerSendSpy.mockClear();
     });
 
-    it("should call the method with expected params", async () => {
+    it('should call the method with expected params', async () => {
       const request = {
         eth_accounts: {},
       };
@@ -22,7 +22,7 @@ describe("WalletRpcPlugin", () => {
       await web3.walletRpc.revokePermissions(request);
 
       expect(requestManagerSendSpy).toHaveBeenCalledWith({
-        method: "wallet_revokePermissions",
+        method: 'wallet_revokePermissions',
         params: [request],
       });
     });
diff --git a/packages/web3-plugin-wallet-rpc/test/wallet_switchEthereumChain.test.ts b/packages/web3-plugin-wallet-rpc/test/wallet_switchEthereumChain.test.ts
index 5f8bb87..138c0ea 100644
--- a/packages/web3-plugin-wallet-rpc/test/wallet_switchEthereumChain.test.ts
+++ b/packages/web3-plugin-wallet-rpc/test/wallet_switchEthereumChain.test.ts
@@ -1,10 +1,10 @@
-import { Web3 } from "web3";
+import { Web3 } from 'web3';
 
-import { WalletRpcPlugin } from "../src";
+import { WalletRpcPlugin } from '../src';
 
-describe("WalletRpcPlugin", () => {
-  describe("wallet_switchEthereumChain", () => {
-    const web3 = new Web3("http://127.0.0.1:8545");
+describe('WalletRpcPlugin', () => {
+  describe('wallet_switchEthereumChain', () => {
+    const web3 = new Web3('http://127.0.0.1:8545');
     web3.registerPlugin(new WalletRpcPlugin());
 
     const requestManagerSendSpy = jest.fn();
@@ -14,16 +14,16 @@ describe("WalletRpcPlugin", () => {
       requestManagerSendSpy.mockClear();
     });
 
-    it("should call the method with expected params", async () => {
+    it('should call the method with expected params', async () => {
       await web3.walletRpc.switchEthereumChain(5000);
 
       expect(requestManagerSendSpy).toHaveBeenCalledWith({
-        method: "wallet_switchEthereumChain",
-        params: [{ chainId: "0x1388" }],
+        method: 'wallet_switchEthereumChain',
+        params: [{ chainId: '0x1388' }],
       });
     });
 
-    it("should return correct result", async () => {
+    it('should return correct result', async () => {
       const result = await web3.walletRpc.switchEthereumChain(5000);
 
       expect(result).toBeUndefined();
diff --git a/packages/web3-plugin-wallet-rpc/test/wallet_updateEthereumChain.test.ts b/packages/web3-plugin-wallet-rpc/test/wallet_updateEthereumChain.test.ts
index cf5172b..d9b1e15 100644
--- a/packages/web3-plugin-wallet-rpc/test/wallet_updateEthereumChain.test.ts
+++ b/packages/web3-plugin-wallet-rpc/test/wallet_updateEthereumChain.test.ts
@@ -1,10 +1,10 @@
-import { Web3 } from "web3";
+import { Web3 } from 'web3';
 
-import { WalletRpcPlugin } from "../src";
+import { WalletRpcPlugin } from '../src';
 
-describe("WalletRpcPlugin", () => {
-  describe("wallet_updateEthereumChain", () => {
-    const web3 = new Web3("http://127.0.0.1:8545");
+describe('WalletRpcPlugin', () => {
+  describe('wallet_updateEthereumChain', () => {
+    const web3 = new Web3('http://127.0.0.1:8545');
     web3.registerPlugin(new WalletRpcPlugin());
 
     const requestManagerSendSpy = jest.fn();
@@ -14,16 +14,16 @@ describe("WalletRpcPlugin", () => {
       requestManagerSendSpy.mockClear();
     });
 
-    it("should call the method with expected params", async () => {
+    it('should call the method with expected params', async () => {
       await web3.walletRpc.updateEthereumChain({ chainId: 5000 });
 
       expect(requestManagerSendSpy).toHaveBeenCalledWith({
-        method: "wallet_updateEthereumChain",
-        params: [{ chainId: "0x1388" }],
+        method: 'wallet_updateEthereumChain',
+        params: [{ chainId: '0x1388' }],
       });
     });
 
-    it("should return correct result", async () => {
+    it('should return correct result', async () => {
       const result = await web3.walletRpc.updateEthereumChain({
         chainId: 5000,
       });
@@ -31,27 +31,27 @@ describe("WalletRpcPlugin", () => {
       expect(result).toBeUndefined();
     });
 
-    it("should pass all possible fields as a param", async () => {
+    it('should pass all possible fields as a param', async () => {
       const request = {
         chainId: 5000,
-        blockExplorerUrls: ["https://mantlescan.xyz"],
-        chainName: "Mantle",
+        blockExplorerUrls: ['https://mantlescan.xyz'],
+        chainName: 'Mantle',
         nativeCurrency: {
-          name: "Mantle",
-          symbol: "MNT",
+          name: 'Mantle',
+          symbol: 'MNT',
           decimals: 18,
         },
-        rpcUrls: ["https://rpc.mantle.xyz"],
+        rpcUrls: ['https://rpc.mantle.xyz'],
       };
 
       await web3.walletRpc.updateEthereumChain(request);
 
       expect(requestManagerSendSpy).toHaveBeenCalledWith({
-        method: "wallet_updateEthereumChain",
+        method: 'wallet_updateEthereumChain',
         params: [
           {
             ...request,
-            chainId: "0x1388",
+            chainId: '0x1388',
           },
         ],
       });
diff --git a/packages/web3-plugin-wallet-rpc/test/wallet_watchAsset.test.ts b/packages/web3-plugin-wallet-rpc/test/wallet_watchAsset.test.ts
index 84cf9fb..d8a7df5 100644
--- a/packages/web3-plugin-wallet-rpc/test/wallet_watchAsset.test.ts
+++ b/packages/web3-plugin-wallet-rpc/test/wallet_watchAsset.test.ts
@@ -1,10 +1,10 @@
-import { Web3 } from "web3";
+import { Web3 } from 'web3';
 
-import { WalletRpcPlugin } from "../src";
+import { WalletRpcPlugin } from '../src';
 
-describe("WalletRpcPlugin", () => {
-  describe("wallet_watchAsset", () => {
-    const web3 = new Web3("http://127.0.0.1:8545");
+describe('WalletRpcPlugin', () => {
+  describe('wallet_watchAsset', () => {
+    const web3 = new Web3('http://127.0.0.1:8545');
     web3.registerPlugin(new WalletRpcPlugin());
 
     const requestManagerSendSpy = jest.fn();
@@ -14,28 +14,28 @@ describe("WalletRpcPlugin", () => {
       requestManagerSendSpy.mockClear();
     });
 
-    it("should call the method with expected params", async () => {
+    it('should call the method with expected params', async () => {
       const request = {
-        type: "ERC20",
+        type: 'ERC20',
         options: {
-          address: "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
-          symbol: "USDC",
+          address: '0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48',
+          symbol: 'USDC',
         },
       };
 
       await web3.walletRpc.watchAsset(request);
 
       expect(requestManagerSendSpy).toHaveBeenCalledWith({
-        method: "wallet_watchAsset",
+        method: 'wallet_watchAsset',
         params: [request],
       });
     });
 
-    it("should return correct result", async () => {
+    it('should return correct result', async () => {
       const result = await web3.walletRpc.watchAsset({
-        type: "ERC20",
+        type: 'ERC20',
         options: {
-          address: "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
+          address: '0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48',
         },
       });
 
diff --git a/packages/web3-plugin-wallet-rpc/tsconfig.json b/packages/web3-plugin-wallet-rpc/tsconfig.json
index 694b50b..844eb27 100644
--- a/packages/web3-plugin-wallet-rpc/tsconfig.json
+++ b/packages/web3-plugin-wallet-rpc/tsconfig.json
@@ -1,25 +1,25 @@
 {
-	"compilerOptions": {
-		"baseUrl": "./",
-		"resolveJsonModule": true,
-		"forceConsistentCasingInFileNames": true,
-		"target": "es2020",
-		"module": "commonjs",
-		"declaration": true,
-		"moduleResolution": "node",
-		"noFallthroughCasesInSwitch": true,
-		"noImplicitReturns": true,
-		"noUnusedLocals": true,
-		"noUnusedParameters": true,
-		"pretty": true,
-		"removeComments": true,
-		"sourceMap": true,
-		"declarationMap": true,
-		"strict": true,
-		"strictNullChecks": true,
-		"outDir": "lib",
-		"esModuleInterop": true
-	},
-	"include": ["src", "test"],
-	"exclude": ["node_modules"]
-}
\ No newline at end of file
+  "compilerOptions": {
+    "baseUrl": "./",
+    "resolveJsonModule": true,
+    "forceConsistentCasingInFileNames": true,
+    "target": "es2020",
+    "module": "commonjs",
+    "declaration": true,
+    "moduleResolution": "node",
+    "noFallthroughCasesInSwitch": true,
+    "noImplicitReturns": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "pretty": true,
+    "removeComments": true,
+    "sourceMap": true,
+    "declarationMap": true,
+    "strict": true,
+    "strictNullChecks": true,
+    "outDir": "lib",
+    "esModuleInterop": true
+  },
+  "include": ["src", "test"],
+  "exclude": ["node_modules"]
+}
diff --git a/yarn.lock b/yarn.lock
index 75ac35a..50ebc79 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -8721,7 +8721,7 @@ prettier-linter-helpers@^1.0.0:
   dependencies:
     fast-diff "^1.1.2"
 
-prettier@^3.0.2:
+prettier@^3.0.2, prettier@^3.3.3:
   version "3.3.3"
   resolved "https://registry.yarnpkg.com/prettier/-/prettier-3.3.3.tgz#30c54fe0be0d8d12e6ae61dbb10109ea00d53105"
   integrity sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==