chore: changes for version 1.4.7

2024-12-26 12:10:46 +00:00 · 2024-10-13 13:49:17 +03:00 · 2024-10-13 13:49:17 +03:00 · 3c1720d200
commit 3c1720d200
parent a9a5cb9f3c
20 changed files with 251 additions and 5010 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -1,5 +1,15 @@
 # Changelog

+## Manifest Version 1.4.7
+
+- added network(Rootstock Network) template from @ahsan-javaiid
+- updated all deps
+- tweaked the local memory cache
+- switched to bun packet manager
+- added a small demo video of the latest version in repo
+- UI changes
+- Sign Tx And Sign message now show selected account in the header
+
 ## Manifest Version 1.4.6

 - added support for 24 words seed phrases besides 12 words
--- a/CI/bun.lockb
+++ b/CI/bun.lockb
--- a/CI/index.ts
+++ b/CI/index.ts
@ -104,13 +104,14 @@ const main = async () => {
            const commiter = GithubEvent?.head_commit?.author.username || GithubEvent?.head_commit?.committer?.username || ''
            const message = `Github ClearWallet new repo commit!\n
 - ChromeStore: https://bit.ly/clw-evm \n
+- Docs: https://clear-wallet.flashsoft.eu \n
 - Commit: ${GithubEvent.head_commit.url} \n
 ${commiter ? `- Commiter: @${commiter}` : ''}
            `;

            await yupAPI.sendPost({
                content: message,
-                platforms: ['twitter', 'threads', 'bsky', 'lens']
+                platforms: ['twitter', 'threads', 'bsky', 'lens', 'mastodon']
            })

            await fchubUtils.createFarcasterPost({
--- a/CI/package.json
+++ b/CI/package.json
@ -6,11 +6,11 @@
    "@types/bun": "latest"
  },
  "peerDependencies": {
-    "typescript": "^5.0.0"
+    "typescript": "^5.5.3"
  },
  "dependencies": {
-    "farcaster-hub-utils": "^0.1.8",
-    "yup-api-interact": "^0.1.6"
+    "farcaster-hub-utils": "0.1.8",
+    "yup-api-interact": "0.1.7"
  },
  "license": "MIT"
 }
--- a/README.md
+++ b/README.md
@ -20,6 +20,10 @@ For more info you can check [docs website](https://clear-wallet.flashsoft.eu)

 [Article on Mirror](https://mirror.xyz/andrei0x309.eth/9nc8UXrGIGOvz694ZY2gouS1JM9L8-Z8ITLNtirqD6Q)

+### Latest Demo Clip
+
+https://github.com/user-attachments/assets/4f7d267a-7410-43cf-b3bd-0256f1ccc954
+
 ### FAQ

 Q: Why use Ionic?
--- a/bun.lockb
+++ b/bun.lockb
--- a/package.json
+++ b/package.json
@ -8,47 +8,47 @@
    "dev": "vite",
    "inject": "tsc --downlevelIteration --outFile src/extension/inject.js src/extension/inject.ts",
    "content": "tsc --outFile src/extension/content.js src/extension/content.ts",
-    "post-build": "yarn tsx ./release-scripts/post-build.ts",
-    "build": "yarn inject && yarn content && vue-tsc --noEmit && vite build && yarn post-build",
-    "rebuild": "yarn build && yarn tsx ./release-scripts/create-release.ts rebuild",
+    "post-build": "bun run ./release-scripts/post-build.ts",
+    "build": "bun run inject && bun run content && vue-tsc --noEmit && vite build && bun run post-build",
+    "rebuild": "bun run build && bun run ./release-scripts/create-release.ts rebuild",
    "preview": "vite preview",
-    "release": "yarn config set version-tag-prefix clear-wallet@v &&  yarn config set version-git-message 'clear-wallet@v%s' && yarn version --patch && yarn postversion",
+    "release": "bun run ./release-scripts/version-release.ts",
    "postversion": "git push",
-    "pub": "yarn build && yarn release && yarn tsx ./release-scripts/create-release.ts"
+    "pub": "bun run build && yarn bun run release && bun run ./release-scripts/create-release.ts"
  },
  "dependencies": {
-    "@ionic/vue": "^8.2.6",
-    "@ionic/vue-router": "^8.2.6",
-    "core-js": "^3.38.0",
-    "ethers": "^6.13.2",
+    "@ionic/vue": "^8.3.2",
+    "@ionic/vue-router": "^8.3.2",
+    "core-js": "^3.38.1",
+    "ethers": "^6.13.4",
    "qr-scanner": "^1.4.2",
-    "vue": "^3.4.37",
-    "vue-router": "^4.4.3"
+    "vue": "^3.5.12",
+    "vue-router": "^4.4.5"
  },
  "devDependencies": {
    "@crxjs/vite-plugin": "2.0.0-beta.25",
    "@types/archiver": "^6.0.2",
    "@types/chrome": "^0.0.269",
-    "@types/jest": "^29.5.12",
-    "@types/node": "^22.2.0",
-    "@typescript-eslint/eslint-plugin": "^8.0.1",
-    "@typescript-eslint/parser": "^8.0.1",
-    "@vitejs/plugin-vue": "^5.1.2",
+    "@types/jest": "^29.5.13",
+    "@types/node": "^22.7.5",
+    "@typescript-eslint/eslint-plugin": "^8.8.1",
+    "@typescript-eslint/parser": "^8.8.1",
+    "@vitejs/plugin-vue": "^5.1.4",
    "@vue/eslint-config-typescript": "^13.0.0",
    "archiver": "^7.0.1",
-    "eslint": "^9.9.0",
-    "eslint-plugin-vue": "^9.27.0",
+    "eslint": "^9.12.0",
+    "eslint-plugin-vue": "^9.29.0",
    "http-browserify": "^1.7.0",
    "https-browserify": "^1.0.0",
    "jest": "^29.7.0",
-    "sass": "^1.77.8",
+    "sass": "^1.79.5",
    "stream-browserify": "^3.0.0",
-    "ts-jest": "^29.2.4",
-    "tsx": "^4.17.0",
-    "typescript": "^5.5.4",
+    "ts-jest": "^29.2.5",
+    "tsx": "^4.19.1",
+    "typescript": "^5.6.3",
    "util": "^0.12.5",
-    "vite": "^5.4.0",
-    "vue-tsc": "^2.0.29",
+    "vite": "^5.4.8",
+    "vue-tsc": "^2.1.6",
    "yarn-upgrade-all": "^0.7.4"
  },
  "disabledNativeDependencies": {
--- a/release-scripts/version-release.ts
+++ b/release-scripts/version-release.ts
@ -0,0 +1,30 @@
+import { execSync } from 'child_process';
+import { readFileSync, writeFileSync } from 'fs';
+import { resolve } from 'path';
+
+async function main() {
+  // 1. Bump version in package.json
+  const packageJsonPath = resolve('./package.json');
+  const packageJson = JSON.parse(readFileSync(packageJsonPath, 'utf-8'));
+  const currentVersion = packageJson.version;
+  const newVersion = bumpVersion(currentVersion);
+  packageJson.version = newVersion;
+  writeFileSync(packageJsonPath, JSON.stringify(packageJson, null, 2));
+
+  // 3. Commit changes
+  execSync(`git add .`);
+  execSync(`git commit -m "Release v${newVersion}"`);
+
+  // 4. Create and push tag
+  execSync(`git tag v${newVersion}`);
+  execSync(`git push --follow-tags`);
+
+}
+
+function bumpVersion(version: string): string {
+  const parts = version.split('.');
+  parts[2] = String(parseInt(parts[2]) + 1);
+  return parts.join('.');
+}
+
+main();
--- a/src/extension/inject.ts
+++ b/src/extension/inject.ts
@ -15,7 +15,7 @@ const ProviderInfo: EIP6963ProviderInfo = {
    uuid: '1fa914a1-f8c9-4c74-8d84-4aa93dc90eec',
    name: 'Clear Wallet',
    icon: 'data:image/png;base64,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',
-    rdns: 'clear-wallet.flashsoft.eu/',
+    rdns: 'eu.flashsoft.clear-wallet',
 }

 const MAX_PROMISES = 50
--- a/src/extension/manifest.json
+++ b/src/extension/manifest.json
@ -3,8 +3,8 @@
    "name": "__MSG_appName__",
    "description": "__MSG_appDesc__",
    "default_locale": "en",
-    "version": "1.4.6",
-    "version_name": "1.4.6",
+    "version": "1.4.7",
+    "version_name": "1.4.7",
    "icons": {
      "16": "assets/extension-icon/wallet_16.png",
      "32": "assets/extension-icon/wallet_32.png",
--- a/src/extension/serviceWorker.ts
+++ b/src/extension/serviceWorker.ts
@ -376,7 +376,7 @@ const mainListner = (message: RequestArguments, sender: any, sendResponse: (a: a
                    try {
                        const hash = cyrb64Hash('eth_getBalance' + JSON.stringify(message?.params))
                        const cacheItem = cache.get(hash)
-                        if (cacheItem &&  cacheItem?.time > Date.now() - 5e3) {
+                        if (cacheItem &&  cacheItem?.time > Date.now() - 5e2) {
                            sendResponse(cacheItem?.data);
                            break
                        }
@ -419,7 +419,7 @@ const mainListner = (message: RequestArguments, sender: any, sendResponse: (a: a
                    try {
                        const hash = cyrb64Hash('eth_blockNumber' + JSON.stringify(message?.params))
                        const cacheItem = cache.get(hash)
-                        if (cacheItem &&  cacheItem?.time > Date.now() - 5e3) {
+                        if (cacheItem &&  cacheItem?.time > Date.now() - 3e3) {
                            sendResponse(cacheItem?.data);
                            break
                        }
@ -449,7 +449,7 @@ const mainListner = (message: RequestArguments, sender: any, sendResponse: (a: a
                        }
                        const hash = cyrb64Hash('eth_estimateGas' + JSON.stringify(message?.params))
                        const cacheItem = cache.get(hash)
-                        if (cacheItem &&  cacheItem?.time > Date.now() - 3e3) {
+                        if (cacheItem &&  cacheItem?.time > Date.now() - 5e2) {
                            sendResponse(cacheItem?.data);
                            break
                        }
@ -492,7 +492,7 @@ const mainListner = (message: RequestArguments, sender: any, sendResponse: (a: a
                    try {
                        const hash = cyrb64Hash('eth_accounts' + JSON.stringify(message?.params))
                        const cacheItem = cache.get(hash)
-                        if (cacheItem &&  cacheItem?.time > Date.now() - 3e3) {
+                        if (cacheItem &&  cacheItem?.time > Date.now() - 5e2) {
                            sendResponse(cacheItem?.data);
                            break
                        }
@ -515,7 +515,7 @@ const mainListner = (message: RequestArguments, sender: any, sendResponse: (a: a
                        try {
                            const hash = cyrb64Hash('eth_chainId' + JSON.stringify(message?.params))
                            const cacheItem = cache.get(hash)
-                            if (cacheItem &&  cacheItem?.time > Date.now() - 5e3) {
+                            if (cacheItem &&  cacheItem?.time > Date.now() - 1e3) {
                                sendResponse(cacheItem?.data);
                                break
                            }
--- a/src/theme/variables.css
+++ b/src/theme/variables.css
@ -10,7 +10,7 @@ http://ionicframework.com/docs/theming/ */
   */

   body:not(.light) {
-    --ion-color-primary: #6a64ff;
+    --ion-color-primary: #645285;
    --ion-color-primary-rgb: 106, 100, 255;
    --ion-color-primary-contrast: #ffffff;
    --ion-color-primary-contrast-rgb: 255, 255, 255;
@ -72,6 +72,8 @@ http://ionicframework.com/docs/theming/ */
    --ion-color-light-contrast-rgb: 255,255,255;
    --ion-color-light-shade: #1e2023;
    --ion-color-light-tint: #383a3e;
+
+    scrollbar-color: #161616 #383a3e;
  }

  /*
@ -80,35 +82,34 @@ http://ionicframework.com/docs/theming/ */
   */

  .ios body:not(.light) {
-    --ion-background-color: #000000;
-    --ion-background-color-rgb: 0,0,0;
-
+    --ion-background-color: #161616;
+    --ion-background-color-rgb: 18, 18, 18;
    --ion-text-color: #ffffff;
    --ion-text-color-rgb: 255, 255, 255;
-
-    --ion-color-step-50: #0d0d0d;
-    --ion-color-step-100: #1a1a1a;
-    --ion-color-step-150: #262626;
-    --ion-color-step-200: #333333;
-    --ion-color-step-250: #404040;
-    --ion-color-step-300: #4d4d4d;
-    --ion-color-step-350: #595959;
-    --ion-color-step-400: #666666;
-    --ion-color-step-450: #737373;
-    --ion-color-step-500: #808080;
-    --ion-color-step-550: #8c8c8c;
-    --ion-color-step-600: #999999;
-    --ion-color-step-650: #a6a6a6;
-    --ion-color-step-700: #b3b3b3;
-    --ion-color-step-750: #bfbfbf;
-    --ion-color-step-800: #cccccc;
-    --ion-color-step-850: #d9d9d9;
-    --ion-color-step-900: #e6e6e6;
-    --ion-color-step-950: #f2f2f2;
-
-    --ion-item-background: #000000;
-
-    --ion-card-background: #1c1c1d;
+    --ion-border-color: #222222;
+    --ion-color-step-50: #1e1e1e;
+    --ion-color-step-100: #2a2a2a;
+    --ion-color-step-150: #363636;
+    --ion-color-step-200: #414141;
+    --ion-color-step-250: #4d4d4d;
+    --ion-color-step-300: #595959;
+    --ion-color-step-350: #656565;
+    --ion-color-step-400: #717171;
+    --ion-color-step-450: #7d7d7d;
+    --ion-color-step-500: #898989;
+    --ion-color-step-550: #949494;
+    --ion-color-step-600: #a0a0a0;
+    --ion-color-step-650: #acacac;
+    --ion-color-step-700: #b8b8b8;
+    --ion-color-step-750: #c4c4c4;
+    --ion-color-step-800: #d0d0d0;
+    --ion-color-step-850: #dbdbdb;
+    --ion-color-step-900: #e7e7e7;
+    --ion-color-step-950: #f3f3f3;
+    --ion-item-background: #161616;
+    --ion-toolbar-background: #161616;
+    --ion-tab-bar-background: #161616;
+    --ion-card-background: #161616;
  }

  .ios ion-modal {
@ -124,13 +125,13 @@ http://ionicframework.com/docs/theming/ */
   */

  .md body:not(.light) {
-    --ion-background-color: #121212;
+    --ion-background-color: #161616;
    --ion-background-color-rgb: 18,18,18;

    --ion-text-color: #ffffff;
    --ion-text-color-rgb: 255,255,255;

-    --ion-border-color: #222222;
+    --ion-border-color: #161616;

    --ion-color-step-50: #1e1e1e;
    --ion-color-step-100: #2a2a2a;
@ -152,19 +153,20 @@ http://ionicframework.com/docs/theming/ */
    --ion-color-step-900: #e7e7e7;
    --ion-color-step-950: #f3f3f3;

-    --ion-item-background: #1e1e1e;
+    --ion-item-background: #161616;

-    --ion-toolbar-background: #1f1f1f;
+    --ion-toolbar-background: #161616;

-    --ion-tab-bar-background: #1f1f1f;
+    --ion-tab-bar-background: #161616;
+
+    --ion-card-background: #161616;

-    --ion-card-background: #1e1e1e;
  }
 }

 :root, body.light {
  /** primary **/
-  --ion-color-primary: #5260ff;
+  --ion-color-primary: #645285;
  --ion-color-primary-rgb: 82, 96, 255;
  --ion-color-primary-contrast: #ffffff;
  --ion-color-primary-contrast-rgb: 255, 255, 255;
@ -234,11 +236,14 @@ http://ionicframework.com/docs/theming/ */
  --ion-color-light-contrast-rgb: 0, 0, 0;
  --ion-color-light-shade: #d7d8da;
  --ion-color-light-tint: #f5f6f9;
+
+  scrollbar-color: #9999999c #ffffff;
+
 }


 body.dark {
-  --ion-color-primary: #6a64ff;
+  --ion-color-primary: #645285;
  --ion-color-primary-rgb: 106, 100, 255;
  --ion-color-primary-contrast: #ffffff;
  --ion-color-primary-contrast-rgb: 255, 255, 255;
--- a/src/views/AccountsTab.vue
+++ b/src/views/AccountsTab.vue
@ -27,7 +27,7 @@
      </ion-item>
      <ion-list v-for="account of accounts" :key="account.address">
        <ion-item>
-          <ion-label>
+          <ion-label style="color: var(--primary-color)">
            {{ account.name }}
          </ion-label>
        </ion-item>
--- a/src/views/AppTabs.vue
+++ b/src/views/AppTabs.vue
@ -3,7 +3,11 @@
    <ion-content>
      <ion-tabs @ionTabsWillChange="beforeTabChange" @ionTabsDidChange="afterTabChange">
        <ion-router-outlet />
-        <ion-tab-bar slot="bottom">
+        <ion-tab-bar
+          slot="bottom"
+          style="display: flex; flex-direction: column; height: 116px"
+        >
+          <div style="display: flex">
            <ion-tab-button tab="home" href="/tabs/home">
              <ion-icon :icon="walletOutline"></ion-icon>
              <ion-label>Wallet</ion-label>
@ -18,8 +22,7 @@
              <ion-icon :icon="gitNetworkOutline"></ion-icon>
              <ion-label>Networks</ion-label>
            </ion-tab-button>
-        </ion-tab-bar>
-        <ion-tab-bar slot="bottom">
+
            <ion-tab-button tab="history" href="/tabs/history">
              <ion-icon :icon="receiptOutline"></ion-icon>
              <ion-label>History</ion-label>
@ -29,14 +32,14 @@
              <ion-icon :icon="diamondOutline"></ion-icon>
              <ion-label>Assets</ion-label>
            </ion-tab-button>
+          </div>

+          <div style="display: flex">
            <ion-tab-button tab="settings" href="/tabs/settings">
              <ion-icon :icon="cogOutline"></ion-icon>
              <ion-label>Settings</ion-label>
            </ion-tab-button>
-        </ion-tab-bar>

-        <ion-tab-bar slot="bottom">
            <ion-tab-button tab="send-token" href="/tabs/send-token">
              <ion-icon :icon="sendOutline"></ion-icon>
              <ion-label>Send Tokens</ion-label>
@ -44,13 +47,14 @@

            <ion-tab-button tab="read-contract" href="/tabs/read-contract">
              <ion-icon :icon="glassesOutline"></ion-icon>
-            <ion-label>Read Contract</ion-label>
+              <ion-label>Read Contracts</ion-label>
            </ion-tab-button>

            <ion-tab-button tab="write-contract" href="/tabs/write-contract">
              <ion-icon :icon="pushOutline"></ion-icon>
              <ion-label>Write Contracts</ion-label>
            </ion-tab-button>
+          </div>
        </ion-tab-bar>
      </ion-tabs>
    </ion-content>
--- a/src/views/HomeTab.vue
+++ b/src/views/HomeTab.vue
@ -17,7 +17,7 @@
              position: absolute;
              right: 1.1rem;
              margin-left: 0.3rem;
-              color: coral;
+              color: #645285;
              font-weight: bold;
              font-size: 0.65rem;
            "
@ -60,7 +60,7 @@
            )
          "
        >
-          <p style="font-size: 0.7rem; color: coral">{{ selectedAccount?.address }}</p>
+          <p style="font-size: 0.7rem; color: #645285">{{ selectedAccount?.address }}</p>
          <ion-icon style="margin-left: 0.5rem" :icon="copyOutline"></ion-icon>
        </ion-item>
        <ion-item
@ -107,7 +107,7 @@
          @click="copyText(String(selectedNetwork?.chainId), getToastRef())"
          style="cursor: pointer"
          >Selected Network ID:
-          <span style="color: coral; font-weight: bold">{{
+          <span style="color: #645285; font-weight: bold">{{
            selectedNetwork?.chainId
          }}</span>
          <ion-icon style="margin-left: 0.5rem" :icon="copyOutline"></ion-icon>
@ -122,21 +122,6 @@
          >Select</ion-button
        >
      </ion-item>
-      <ion-item style="margin-top: 0.3rem">
-        <div class="display: flex; flex-direction: column">
-          <img
-            alt="stealthex"
-            @click="openTab('https://stealthex.io')"
-            id="exchange-btn"
-            :src="getUrl('assets/exchange-btn-min.svg')"
-            class="exchange-btn"
-            style=""
-          />
-          <p style="font-size: 0.75rem; opacity: 0.8; padding: 0.2rem">
-            This button does not contain any referral to maximize privacy.
-          </p>
-        </div>
-      </ion-item>
      <ion-item style="margin-top: 0.3rem; margin-bottom: 0.3rem; text-align: center">
        <ion-button
          @click="goToFarcasterActions"
@ -154,7 +139,21 @@
          >Personal Sign Messages</ion-button
        >
      </ion-item>
-
+      <ion-item style="margin-top: 0.3rem">
+        <div class="display: flex; flex-direction: column">
+          <img
+            alt="stealthex"
+            @click="openTab('https://stealthex.io')"
+            id="exchange-btn"
+            :src="getUrl('assets/exchange-btn-min.svg')"
+            class="exchange-btn"
+            style=""
+          />
+          <p style="font-size: 0.75rem; opacity: 0.8; padding: 0.2rem">
+            This button does not contain any referral to maximize privacy.
+          </p>
+        </div>
+      </ion-item>
      <ion-loading
        :is-open="loading"
        cssClass="my-custom-class"
@ -189,6 +188,14 @@
              <ion-label>Accounts</ion-label>
              <ion-searchbar
                placeholder="search..."
+                autocomplete="off"
+                autocorrect="off"
+                :autofocus="true"
+                :clear-input="false"
+                :clear-on-edit="false"
+                :debounce="300"
+                :spellcheck="false"
+                :tabindex="0"
                @ionInput="searchAccount"
              ></ion-searchbar>
            </ion-list-header>
@ -233,6 +240,14 @@
            <ion-list-header>
              <ion-label>Networks</ion-label>
              <ion-searchbar
+                autocomplete="off"
+                autocorrect="off"
+                :autofocus="true"
+                :clear-input="false"
+                :clear-on-edit="false"
+                :debounce="300"
+                :spellcheck="false"
+                :tabindex="0"
                placeholder="search..."
                @ionInput="searchNetwork"
              ></ion-searchbar>
@ -530,7 +545,7 @@ export default defineComponent({
  top: 0.9rem;
  right: 2.4rem;
  margin-left: 0.3rem;
-  color: coral;
+  color: #645285;
  font-weight: bold;
  font-size: 0.65rem;
  cursor: pointer;
--- a/src/views/ReadContract.vue
+++ b/src/views/ReadContract.vue
@ -106,7 +106,7 @@
          label-placement="stacked"
          style="overflow-y: scroll"
          :rows="10"
-          :cols="20"
+          :cols="40"
          :value="result"
          readonly
        ></ion-textarea>
--- a/src/views/SignMessage.vue
+++ b/src/views/SignMessage.vue
@ -8,7 +8,16 @@

    <ion-content class="ion-padding">
      <ion-item>
-        <ion-label>Message to Sign</ion-label>
+        <ion-label
+          >Message to Sign
+          {{
+            `${
+              intialSelectedAccount?.name
+                ? "- [ " + intialSelectedAccount?.name + " ]"
+                : ""
+            }`
+          }}
+        </ion-label>
      </ion-item>
      <ion-item>
        <div
@ -67,6 +76,7 @@ import {
  hexTostr,
 } from "@/utils/platform";
 import UnlockModal from "@/views/UnlockModal.vue";
+import type { Account } from "@/extension/types";

 export default defineComponent({
  components: {
@ -84,6 +94,7 @@ export default defineComponent({
  setup: () => {
    const route = useRoute();
    const loading = ref(false);
+    const intialSelectedAccount = ref(null as Account | null);
    const rid = (route?.params?.rid as string) ?? "";

    let sigmMsg: string = "";
@ -117,6 +128,9 @@ export default defineComponent({

    onIonViewWillEnter(async () => {
      blockLockout();
+      getSelectedAccount().then((account) => {
+        intialSelectedAccount.value = account;
+      });
      interval = setInterval(async () => {
        if (timerReject.value <= 0) {
          onCancel();
@ -172,6 +186,7 @@ export default defineComponent({
      onSign,
      loading,
      timerReject,
+      intialSelectedAccount,
    };
  },
 });
--- a/src/views/SignTx.vue
+++ b/src/views/SignTx.vue
@ -2,7 +2,16 @@
  <ion-page>
    <ion-header>
      <ion-toolbar>
-        <ion-title>Send Transaction</ion-title>
+        <ion-title
+          >Send Transaction
+          {{
+            `${
+              intialSelectedAccount?.name
+                ? "- [ " + intialSelectedAccount?.name + " ]"
+                : ""
+            }`
+          }}</ion-title
+        >
      </ion-toolbar>
    </ion-header>

@ -200,7 +209,7 @@ import {
  hexTostr,
 } from "@/utils/platform";
 import { getBalance, getGasPrice, estimateGas } from "@/utils/wallet";
-import type { Network } from "@/extension/types";
+import type { Network, Account } from "@/extension/types";
 import { allTemplateNets, chainIdToPriceId } from "@/utils/networks";
 import UnlockModal from "@/views/UnlockModal.vue";
 import router from "@/router";
@ -245,6 +254,7 @@ export default defineComponent({
    const insuficientBalance = ref(false);
    const gasPriceReFetch = ref(true);
    const selectedNetwork = (ref(null) as unknown) as Ref<Network>;
+    const intialSelectedAccount = ref(null as unknown) as Ref<Account>;
    const dollarPrice = ref(0);
    const gasLimitModal = ref(false);
    const gasPriceModal = ref(false);
@ -367,7 +377,9 @@ export default defineComponent({
      const pGasPrice = getGasPrice();
      const pBalance = getBalance();
      const pGetPrices = getPrices();
-      selectedNetwork.value = await getSelectedNetwork();
+      const data = await Promise.all([getSelectedNetwork(), getSelectedAccount()]);
+      selectedNetwork.value = data[0];
+      intialSelectedAccount.value = data[1];
      userBalance.value = Number(
        ethers.formatEther((await pBalance).toString() ?? "0x0")
      );
@ -442,6 +454,7 @@ export default defineComponent({
      gasPriceModal,
      inGasPrice,
      inGasLimit,
+      intialSelectedAccount,
    };
  },
 });
--- a/src/views/UnlockModal.vue
+++ b/src/views/UnlockModal.vue
@ -33,14 +33,22 @@
        <ion-list>
          <ion-item>
            <ion-input
+              label-placement="floating"
              aria-label="password"
-              placeholder=""
-              class="password-input"
              type="password"
-              @ion-input="mpPass = String($event.target.value)"
-              fill="solid"
+              v-model="mpPass"
+              autocomplete="off"
+              autocorrect="off"
+              :autofocus="true"
+              :clear-input="false"
+              :clear-on-edit="false"
+              :debounce="300"
+              :spellcheck="false"
+              :tabindex="0"
              id="pass-input"
-            ></ion-input>
+            >
+              <div slot="label"><ion-text color="danger">(Password)</ion-text></div>
+            </ion-input>

            <!-- <ion-input
            label="Password"
@ -48,7 +56,6 @@
            fill="outline"
            placeholder=""
            type="password"
-            ref="ionInput"
            @ion-input="mpPass = String($event.target.value)"
          ></ion-input> -->
          </ion-item>
@ -156,7 +163,6 @@ export default defineComponent({
    onMounted(async () => {
      await new Promise((resolve) => setTimeout(resolve, 150));
      const passInput = document.querySelector("#pass-input input") as HTMLInputElement;
-      console.log("passInput", passInput);
      if (passInput) {
        passInput?.focus();
        passInput.addEventListener("keyup", (e: any) => {
@ -164,9 +170,6 @@ export default defineComponent({
            unlock();
          }
        });
-        passInput.addEventListener("blur", () => {
-          passInput?.focus();
-        });
      }
    });

--- a/yarn.lock
+++ b/yarn.lock