add expanded view

nautls · Jan 25, 2022 · 326487d · 326487d
1 parent b7130f1
commit 326487d
Show file tree

Hide file tree

Showing 7 changed files with 85 additions and 9 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -13,6 +13,7 @@
     "@download/blockies": "^1.0.3",
     "@emurgo/cip4-js": "^1.0.6",
     "@oruga-ui/oruga-next": "^0.5.2",
+    "@types/chrome": "^0.0.177",
     "@vuelidate/core": "^2.0.0-alpha.33",
     "@vuelidate/validators": "^2.0.0-alpha.26",
     "axios": "^0.24.0",

diff --git a/src/App.vue b/src/App.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="flex flex-col h-600px max-h-600px w-365px gap-0">
+  <div class="app">
     <wallet-header v-show="!$route.meta.fullPage" />
     <nav-header v-if="!$route.meta.fullPage" />
     <div class="flex-grow overflow-y-auto overflow-x-hidden">
@@ -51,6 +51,7 @@ export default defineComponent({
     await this.init();
   },
   deactivated() {
+    alert("close");
     clearInterval(this.getPriceTimerId);
     clearInterval(this.syncTimerId);
   },

diff --git a/src/assets/styles/main.css b/src/assets/styles/main.css
@@ -1,5 +1,9 @@
 body {
-  @apply bg-light-50 text-base leading-normal tracking-wide text-dark-500 antialiased;
+  @apply bg-gray-200 text-base leading-normal tracking-wide text-dark-500 antialiased;
+}
+
+.app {
+  @apply bg-light-50 flex flex-col min-h-600px h-600px min-w-365px mx-auto gap-0 md:(max-w-5/12 shadow-lg h-screen max-h-screen);
 }
 
 a {
@@ -44,7 +48,7 @@ label {
 }
 
 .tabs {
-  @apply flex flex-row shadow px-10 mb-1 text-sm text-gray-500 justify-center;
+  @apply flex flex-row shadow px-10 mb-0.6 text-sm text-gray-500 justify-center;
 }
 
 .tabs .tab-item {

diff --git a/src/components/WalletHeader.vue b/src/components/WalletHeader.vue
@@ -28,6 +28,10 @@
               <vue-feather type="plus-circle" size="16" class="align-middle pr-2" />
               <span class="align-middle">Add new wallet</span></router-link
             >
+            <a @click="expandView()" class="group-item narrow">
+              <vue-feather type="maximize-2" size="16" class="align-middle pr-2" />
+              <span class="align-middle">Expand view</span></a
+            >
             <router-link :to="{ name: 'about-nautilus' }" class="group-item narrow">
               <vue-feather type="info" size="16" class="align-middle pr-2" />
               <span class="align-middle">About</span></router-link
@@ -56,7 +60,18 @@ export default defineComponent({
     };
   },
   methods: {
-    ...mapActions({ setCurrentWallet: ACTIONS.SET_CURRENT_WALLET })
+    ...mapActions({ setCurrentWallet: ACTIONS.SET_CURRENT_WALLET }),
+    async expandView() {
+      if (!chrome.tabs) {
+        return;
+      }
+
+      chrome.tabs.create({
+        url: chrome.extension.getURL("index.html"),
+        active: true
+      });
+      window.close();
+    }
   },
   computed: {
     ...mapState({

diff --git a/src/store.ts b/src/store.ts
@@ -466,8 +466,8 @@ export default createStore({
         await walletsDbService.getMnemonic(command.walletId, command.password)
       );
       const changeAddress =
-        find(addresses, a => a.state === AddressState.Unused)?.script ||
-        bip32.deriveAddress(0).script;
+        find(addresses, a => a.state === AddressState.Unused && a.script !== command.recipient)
+          ?.script || bip32.deriveAddress(0).script;
 
       const boxes = await explorerService.getUnspentBoxes(selectedAddresses.map(a => a.script));
       const blockHeaders = await explorerService.getLastTenBlockHeaders();

diff --git a/tsconfig.json b/tsconfig.json
@@ -11,7 +11,7 @@
     "allowSyntheticDefaultImports": true,
     "sourceMap": true,
     "baseUrl": ".",
-    "types": ["webpack-env", "jest"],
+    "types": ["webpack-env", "jest", "chrome"],
     "paths": {
       "@/*": ["src/*"]
     },