From dd9b7c948c317acecb42048577ed368da000cae3 Mon Sep 17 00:00:00 2001
From: AlphaX-Projects <77661270+AlphaX-Projects@users.noreply.github.com>
Date: Wed, 24 Aug 2022 12:29:18 +0200
Subject: [PATCH 1/3] Clear fields

---
 .../plugins/core/wallet/wallet-app.src.js     | 134 +++++++++++-------
 1 file changed, 81 insertions(+), 53 deletions(-)

diff --git a/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js b/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js
index cd50fc22..ba01f086 100644
--- a/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js
+++ b/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js
@@ -832,7 +832,7 @@ class MultiWallet extends LitElement {
                     <div class="qrcode-pos" ?hidden="${this.getSelectedWalletAddress().length < 1}">
                         <qortal-qrcode-generator data="${this.getSelectedWalletAddress()}" mode="octet" format="html" auto></qortal-qrcode-generator>
                     </div>
-                    <div id="transactions">
+                    <div class="transactions">
                         ${this.loading ? html`<paper-spinner-lite style="display: block; margin: 5px auto;" active></paper-spinner-lite>` : ''}
                         <div id="transactionsDOM"></div>
                     </div>
@@ -1205,7 +1205,7 @@ class MultiWallet extends LitElement {
                     </mwc-button>
                 </mwc-dialog>
 
-                <mwc-dialog id="sendQortDialog">
+                <mwc-dialog id="sendQortDialog" scrimClickAction="" escapeKeyAction="">
                     <div class="send-coin-dialog">
                         <div style="text-align: center;">
                             <img src="/img/qort.png" width="32" height="32">
@@ -1271,7 +1271,7 @@ class MultiWallet extends LitElement {
                     </mwc-button>
                 </mwc-dialog>
 
-                <mwc-dialog id="sendBtcDialog">
+                <mwc-dialog id="sendBtcDialog" scrimClickAction="" escapeKeyAction="">
                     <div class="send-coin-dialog">
                         <div style="text-align: center;">
                             <img src="/img/btc.png" width="32" height="32">
@@ -1348,7 +1348,7 @@ class MultiWallet extends LitElement {
                     </mwc-button>
                 </mwc-dialog>
 
-                <mwc-dialog id="sendLtcDialog">
+                <mwc-dialog id="sendLtcDialog" scrimClickAction="" escapeKeyAction="">
                     <div class="send-coin-dialog">
                         <div style="text-align: center;">
                             <img src="/img/ltc.png" width="32" height="32">
@@ -1425,7 +1425,7 @@ class MultiWallet extends LitElement {
                     </mwc-button>
                 </mwc-dialog>
 
-                <mwc-dialog id="sendDogeDialog">
+                <mwc-dialog id="sendDogeDialog" scrimClickAction="" escapeKeyAction="">
                     <div class="send-coin-dialog">
                         <div style="text-align: center;">
                             <img src="/img/doge.png" width="32" height="32">
@@ -1504,7 +1504,7 @@ class MultiWallet extends LitElement {
                     </mwc-button>
                 </mwc-dialog>
 
-                <mwc-dialog id="sendDgbDialog">
+                <mwc-dialog id="sendDgbDialog" scrimClickAction="" escapeKeyAction="">
                     <div class="send-coin-dialog">
                         <div style="text-align: center;">
                             <img src="/img/dgb.png" width="32" height="32">
@@ -1583,7 +1583,7 @@ class MultiWallet extends LitElement {
                     </mwc-button>
                 </mwc-dialog>
 
-		    <mwc-dialog id="sendRvnDialog">
+		    <mwc-dialog id="sendRvnDialog" scrimClickAction="" escapeKeyAction="">
                     <div class="send-coin-dialog">
                         <div style="text-align: center;">
                             <img src="/img/rvn.png" width="32" height="32">
@@ -1662,7 +1662,7 @@ class MultiWallet extends LitElement {
                     </mwc-button>
                 </mwc-dialog>
 
-                <mwc-dialog id="sendArrrDialog">
+                <mwc-dialog id="sendArrrDialog" scrimClickAction="" escapeKeyAction="">
                     <div class="send-coin-dialog">
                         <div style="text-align: center;">
                             <img src="/img/arrr.png" width="32" height="32">
@@ -1974,7 +1974,7 @@ class MultiWallet extends LitElement {
                     </mwc-button>
                 </mwc-dialog>
 
-                <mwc-dialog id="addQortAddressDialog">
+                <mwc-dialog id="addQortAddressDialog" scrimClickAction="" escapeKeyAction="">
                     <div style="text-align:center">
                         <img src="/img/qort.png" width="32" height="32">
                         <h1>Qortal ${translate("walletpage.wchange47")}</h1><br />
@@ -2023,7 +2023,7 @@ class MultiWallet extends LitElement {
                     </mwc-button>
                 </mwc-dialog>
 
-                <mwc-dialog id="addBtcAddressDialog">
+                <mwc-dialog id="addBtcAddressDialog" scrimClickAction="" escapeKeyAction="">
                     <div style="text-align:center">
                         <img src="/img/btc.png" width="32" height="32">
                         <h1>Bitcoin ${translate("walletpage.wchange47")}</h1><br />
@@ -2072,7 +2072,7 @@ class MultiWallet extends LitElement {
                     </mwc-button>
                 </mwc-dialog>
 
-                <mwc-dialog id="addLtcAddressDialog">
+                <mwc-dialog id="addLtcAddressDialog" scrimClickAction="" escapeKeyAction="">
                     <div style="text-align:center">
                         <img src="/img/ltc.png" width="32" height="32">
                         <h1>Litecoin ${translate("walletpage.wchange47")}</h1><br />
@@ -2121,7 +2121,7 @@ class MultiWallet extends LitElement {
                     </mwc-button>
                 </mwc-dialog>
 
-                <mwc-dialog id="addDogeAddressDialog">
+                <mwc-dialog id="addDogeAddressDialog" scrimClickAction="" escapeKeyAction="">
                     <div style="text-align:center">
                         <img src="/img/doge.png" width="32" height="32">
                         <h1>Dogecoin ${translate("walletpage.wchange47")}</h1><br />
@@ -2170,7 +2170,7 @@ class MultiWallet extends LitElement {
                     </mwc-button>
                 </mwc-dialog>
 
-                <mwc-dialog id="addDgbAddressDialog">
+                <mwc-dialog id="addDgbAddressDialog" scrimClickAction="" escapeKeyAction="">
                     <div style="text-align:center">
                         <img src="/img/dgb.png" width="32" height="32">
                         <h1>Digibyte ${translate("walletpage.wchange47")}</h1><br />
@@ -2219,7 +2219,7 @@ class MultiWallet extends LitElement {
                     </mwc-button>
                 </mwc-dialog>
 
-                <mwc-dialog id="addRvnAddressDialog">
+                <mwc-dialog id="addRvnAddressDialog" scrimClickAction="" escapeKeyAction="">
                     <div style="text-align:center">
                         <img src="/img/rvn.png" width="32" height="32">
                         <h1>Ravencoin ${translate("walletpage.wchange47")}</h1><br />
@@ -2268,7 +2268,7 @@ class MultiWallet extends LitElement {
                     </mwc-button>
                 </mwc-dialog>
 
-                <mwc-dialog id="addArrrAddressDialog">
+                <mwc-dialog id="addArrrAddressDialog" scrimClickAction="" escapeKeyAction="">
                     <div style="text-align:center">
                         <img src="/img/arrr.png" width="32" height="32">
                         <h1>Pirate Chain ${translate("walletpage.wchange47")}</h1><br />
@@ -3084,30 +3084,58 @@ class MultiWallet extends LitElement {
 
     closeQortAddressDialog() {
         this.shadowRoot.querySelector('#addQortAddressDialog').close()
+        this.shadowRoot.getElementById('qortNameInput').value = ''
+        this.shadowRoot.getElementById('qortAddressInput').value = ''
+        this.qortBookName = ''
+        this.qortBookAddress = ''
     }
 
     closeBtcAddressDialog() {
         this.shadowRoot.querySelector('#addBtcAddressDialog').close()
+        this.shadowRoot.getElementById('btcNameInput').value = ''
+        this.shadowRoot.getElementById('btcAddressInput').value = ''
+        this.btcBookName = ''
+        this.btcBookAddress = ''
     }
 
     closeLtcAddressDialog() {
         this.shadowRoot.querySelector('#addLtcAddressDialog').close()
+        this.shadowRoot.getElementById('ltcNameInput').value = ''
+        this.shadowRoot.getElementById('ltcAddressInput').value = ''
+        this.ltcBookName = ''
+        this.ltcBookAddress = ''
     }
 
     closeDogeAddressDialog() {
         this.shadowRoot.querySelector('#addDogeAddressDialog').close()
+        this.shadowRoot.getElementById('dogeNameInput').value = ''
+        this.shadowRoot.getElementById('dogeAddressInput').value = ''
+        this.dogeBookName = ''
+        this.dogeBookAddress = ''
     }
 
     closeDgbAddressDialog() {
         this.shadowRoot.querySelector('#addDgbAddressDialog').close()
+        this.shadowRoot.getElementById('dgbNameInput').value = ''
+        this.shadowRoot.getElementById('dgbAddressInput').value = ''
+        this.dgbBookName = ''
+        this.dgbBookAddress = ''
     }
 
     closeRvnAddressDialog() {
         this.shadowRoot.querySelector('#addRvnAddressDialog').close()
+        this.shadowRoot.getElementById('rvnNameInput').value = ''
+        this.shadowRoot.getElementById('rvnAddressInput').value = ''
+        this.rvnBookName = ''
+        this.rvnBookAddress = ''
     }
 
     closeArrrAddressDialog() {
         this.shadowRoot.querySelector('#addArrrAddressDialog').close()
+        this.shadowRoot.getElementById('arrrNameInput').value = ''
+        this.shadowRoot.getElementById('arrrAddressInput').value = ''
+        this.arrrBookName = ''
+        this.arrrBookAddress = ''
     }
 
     closeImportQortAddressbookDialog() {
@@ -3560,42 +3588,71 @@ class MultiWallet extends LitElement {
 
     closeQortDialog() {
         this.shadowRoot.querySelector('#sendQortDialog').close()
+        this.shadowRoot.getElementById('amountInput').value = ''
+        this.shadowRoot.getElementById('recipient').value = ''
+        this.recipient = ''
+        this.amount = 0
         this.successMessage = ''
         this.errorMessage = ''
     }
 
     closeBtcDialog() {
         this.shadowRoot.querySelector('#sendBtcDialog').close()
+        this.shadowRoot.getElementById('btcAmountInput').value = 0
+        this.shadowRoot.getElementById('btcRecipient').value = ''
+        this.btcRecipient = ''
+        this.btcAmount = 0
         this.successMessage = ''
         this.errorMessage = ''
     }
 
     closeLtcDialog() {
         this.shadowRoot.querySelector('#sendLtcDialog').close()
+        this.shadowRoot.getElementById('ltcAmountInput').value = 0
+        this.shadowRoot.getElementById('ltcRecipient').value = ''
+        this.ltcRecipient = ''
+        this.ltcAmount = 0
         this.successMessage = ''
         this.errorMessage = ''
     }
 
     closeDogeDialog() {
         this.shadowRoot.querySelector('#sendDogeDialog').close()
+        this.shadowRoot.getElementById('dogeAmountInput').value = 0
+        this.shadowRoot.getElementById('dogeRecipient').value = ''
+        this.dogeRecipient = ''
+        this.dogeAmount = 0
         this.successMessage = ''
         this.errorMessage = ''
     }
 
     closeDgbDialog() {
         this.shadowRoot.querySelector('#sendDgbDialog').close()
+        this.shadowRoot.getElementById('dgbAmountInput').value = 0
+        this.shadowRoot.getElementById('dgbRecipient').value = ''
+        this.dgbRecipient = ''
+        this.dgbAmount = 0
         this.successMessage = ''
         this.errorMessage = ''
     }
 
     closeRvnDialog() {
         this.shadowRoot.querySelector('#sendRvnDialog').close()
+        this.shadowRoot.getElementById('rvnAmountInput').value = 0
+        this.shadowRoot.getElementById('rvRecipient').value = ''
+        this.rvnRecipient = ''
+        this.rvnAmount = 0
         this.successMessage = ''
         this.errorMessage = ''
     }
 
     closeArrrDialog() {
         this.shadowRoot.querySelector('#sendArrrDialog').close()
+        this.shadowRoot.getElementById('arrrRecipient').value = ''
+        this.shadowRoot.getElementById('arrrMemo').value = ''
+        this.arrrRecipient = ''
+        this.arrrMemo=''
+        this.arrrAmount = 0
         this.successMessage = ''
         this.errorMessage = ''
     }
@@ -4667,7 +4724,7 @@ class MultiWallet extends LitElement {
                             return render(html``, root)
                         }
                         const confirmed = data.item.confirmations >= requiredConfirmations
-						const unconfirmed = data.item.confirmations == 0
+				const unconfirmed = data.item.confirmations == 0
                         if (confirmed) {
                             render(html`<mwc-icon title="${data.item.confirmations} ${translate("walletpage.wchange42")}" style="color: #00C851">check</mwc-icon>`, root)
 						} else if (unconfirmed) {
@@ -4680,20 +4737,22 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange35")}"
                     .renderer=${(root, column, data) => {
                         render(html` ${data.item.type} ${data.item.creatorAddress === this.wallets.get('qort').wallet.address ? html`<span class="color-out">${translate("walletpage.wchange7")}</span>` : html`<span class="color-in">${translate("walletpage.wchange8")}</span>`} `, root)
                     }}
                 >
                 </vaadin-grid-column>
-                <vaadin-grid-column auto-width resizable header="${translate("walletpage.wchange9")}" path="creatorAddress"></vaadin-grid-column>
-                <vaadin-grid-column auto-width resizable header="${translate("walletpage.wchange10")}" path="recipient"></vaadin-grid-column>
-                <vaadin-grid-column auto-width resizable header="${translate("walletpage.wchange36")}" path="fee"></vaadin-grid-column>
-                <vaadin-grid-column auto-width resizable header="${translate("walletpage.wchange11")}" path="amount"></vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
+                    header="${translate("walletpage.wchange9")}"
+                    path="creatorAddress"
+                >
+                </vaadin-grid-column>
+                <vaadin-grid-column auto-width header="${translate("walletpage.wchange10")}" path="recipient"></vaadin-grid-column>
+                <vaadin-grid-column auto-width header="${translate("walletpage.wchange36")}" path="fee"></vaadin-grid-column>
+                <vaadin-grid-column auto-width header="${translate("walletpage.wchange11")}" path="amount"></vaadin-grid-column>
+                <vaadin-grid-column auto-width
                     header="${translate("walletpage.wchange14")}"
                     .renderer=${(root, column, data) => {
                         const time = new Date(data.item.timestamp)
@@ -4720,7 +4779,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange35")}"
                     .renderer=${(root, column, data) => {
                         render(html` ${translate("walletpage.wchange40")} ${data.item.inputs[0].address === this.wallets.get(this._selectedWallet).wallet.address ? html`<span class="color-out">${translate("walletpage.wchange7")}</span>` : html`<span class="color-in">${translate("walletpage.wchange8")}</span>`} `, root)
@@ -4729,7 +4787,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange9")}"
                     .renderer=${(root, column, data) => {
                         render(html`${data.item.inputs[0].address}`, root)
@@ -4738,7 +4795,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange10")}"
                     .renderer=${(root, column, data) => {
                         render(html`${data.item.outputs[0].address}`, root)
@@ -4748,7 +4804,6 @@ class MultiWallet extends LitElement {
                 <vaadin-grid-column auto-width resizable header="${translate("walletpage.wchange16")}" path="txHash"></vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange37")}"
                     .renderer=${(root, column, data) => {
                         const amount = (Number(data.item.totalAmount) / 1e8).toFixed(8)
@@ -4758,7 +4813,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange14")}"
                     .renderer=${(root, column, data) => {
                         const time = new Date(data.item.timestamp)
@@ -4785,7 +4839,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange35")}"
                     .renderer=${(root, column, data) => {
                         render(html` ${translate("walletpage.wchange40")} ${data.item.inputs[0].address === this.wallets.get(this._selectedWallet).wallet.address ? html`<span class="color-out">${translate("walletpage.wchange7")}</span>` : html`<span class="color-in">${translate("walletpage.wchange8")}</span>`} `, root)
@@ -4794,7 +4847,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange9")}"
                     .renderer=${(root, column, data) => {
                         render(html`${data.item.inputs[0].address}`, root)
@@ -4803,7 +4855,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange10")}"
                     .renderer=${(root, column, data) => {
                         render(html`${data.item.outputs[0].address}`, root)
@@ -4813,7 +4864,6 @@ class MultiWallet extends LitElement {
                 <vaadin-grid-column auto-width resizable header="${translate("walletpage.wchange16")}" path="txHash"></vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange37")}"
                     .renderer=${(root, column, data) => {
                         const amount = (Number(data.item.totalAmount) / 1e8).toFixed(8)
@@ -4823,7 +4873,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange14")}"
                     .renderer=${(root, column, data) => {
                         const time = new Date(data.item.timestamp)
@@ -4850,7 +4899,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange35")}"
                     .renderer=${(root, column, data) => {
                         render(html` ${translate("walletpage.wchange40")} ${data.item.inputs[0].address === this.wallets.get(this._selectedWallet).wallet.address ? html`<span class="color-out">${translate("walletpage.wchange7")}</span>` : html`<span class="color-in">${translate("walletpage.wchange8")}</span>`} `, root)
@@ -4859,7 +4907,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange9")}"
                     .renderer=${(root, column, data) => {
                         render(html`${data.item.inputs[0].address}`, root)
@@ -4868,7 +4915,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange10")}"
                     .renderer=${(root, column, data) => {
                         render(html`${data.item.outputs[0].address}`, root)
@@ -4878,7 +4924,6 @@ class MultiWallet extends LitElement {
                 <vaadin-grid-column auto-width resizable header="${translate("walletpage.wchange16")}" path="txHash"></vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange37")}"
                     .renderer=${(root, column, data) => {
                         const amount = (Number(data.item.totalAmount) / 1e8).toFixed(8)
@@ -4888,7 +4933,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange14")}"
                     .renderer=${(root, column, data) => {
                         const time = new Date(data.item.timestamp)
@@ -4915,7 +4959,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange35")}"
                     .renderer=${(root, column, data) => {
                         render(html` ${translate("walletpage.wchange40")} ${data.item.inputs[0].address === this.wallets.get(this._selectedWallet).wallet.address ? html`<span class="color-out">${translate("walletpage.wchange7")}</span>` : html`<span class="color-in">${translate("walletpage.wchange8")}</span>`} `, root)
@@ -4924,7 +4967,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange9")}"
                     .renderer=${(root, column, data) => {
                         render(html`${data.item.inputs[0].address}`, root)
@@ -4933,7 +4975,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange10")}"
                     .renderer=${(root, column, data) => {
                         render(html`${data.item.outputs[0].address}`, root)
@@ -4943,7 +4984,6 @@ class MultiWallet extends LitElement {
                 <vaadin-grid-column auto-width resizable header="${translate("walletpage.wchange16")}" path="txHash"></vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange37")}"
                     .renderer=${(root, column, data) => {
                         const amount = (Number(data.item.totalAmount) / 1e8).toFixed(8)
@@ -4953,7 +4993,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange14")}"
                     .renderer=${(root, column, data) => {
                         const time = new Date(data.item.timestamp)
@@ -4980,7 +5019,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange35")}"
                     .renderer=${(root, column, data) => {
                         render(html` ${translate("walletpage.wchange40")} ${data.item.inputs[0].address === this.wallets.get(this._selectedWallet).wallet.address ? html`<span class="color-out">${translate("walletpage.wchange7")}</span>` : html`<span class="color-in">${translate("walletpage.wchange8")}</span>`} `, root)
@@ -4989,7 +5027,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange9")}"
                     .renderer=${(root, column, data) => {
                         render(html`${data.item.inputs[0].address}`, root)
@@ -4998,7 +5035,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange10")}"
                     .renderer=${(root, column, data) => {
                         render(html`${data.item.outputs[0].address}`, root)
@@ -5008,7 +5044,6 @@ class MultiWallet extends LitElement {
                 <vaadin-grid-column auto-width resizable header="${translate("walletpage.wchange16")}" path="txHash"></vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange37")}"
                     .renderer=${(root, column, data) => {
                         const amount = (Number(data.item.totalAmount) / 1e8).toFixed(8)
@@ -5018,7 +5053,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange14")}"
                     .renderer=${(root, column, data) => {
                         const time = new Date(data.item.timestamp)
@@ -5045,7 +5079,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange35")}"
                     .renderer=${(root, column, data) => {
                         render(html` ${translate("walletpage.wchange40")} ${data.item.totalAmount < 0 ? html`<span class="color-out">${translate("walletpage.wchange7")}</span>` : html`<span class="color-in">${translate("walletpage.wchange8")}</span>`} `, root)
@@ -5054,7 +5087,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <!--<vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange9")}"
                     .renderer=${(root, column, data) => {
                         render(html`${data.item.inputs[0].address}`, root)
@@ -5063,7 +5095,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange10")}"
                     .renderer=${(root, column, data) => {
                         render(html`${data.item.outputs[0].address}`, root)
@@ -5073,7 +5104,6 @@ class MultiWallet extends LitElement {
                 <vaadin-grid-column auto-width resizable header="${translate("walletpage.wchange16")}" path="txHash"></vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange37")}"
                     .renderer=${(root, column, data) => {
                         const amount = (Number(data.item.totalAmount) / 1e8).toFixed(8)
@@ -5083,7 +5113,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange14")}"
                     .renderer=${(root, column, data) => {
                         const time = new Date(data.item.timestamp)
@@ -5093,7 +5122,6 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    resizable
                     header="${translate("walletpage.wchange50")}"
                     .renderer=${(root, column, data) => {
                         render(html`${data.item.memo}`, root)

From b83106d98458e648f0adfa2376cb86a26f073c61 Mon Sep 17 00:00:00 2001
From: AlphaX-Projects <77661270+AlphaX-Projects@users.noreply.github.com>
Date: Wed, 24 Aug 2022 12:32:21 +0200
Subject: [PATCH 2/3] fix

---
 qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js b/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js
index ba01f086..48e1dd62 100644
--- a/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js
+++ b/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js
@@ -832,7 +832,7 @@ class MultiWallet extends LitElement {
                     <div class="qrcode-pos" ?hidden="${this.getSelectedWalletAddress().length < 1}">
                         <qortal-qrcode-generator data="${this.getSelectedWalletAddress()}" mode="octet" format="html" auto></qortal-qrcode-generator>
                     </div>
-                    <div class="transactions">
+                    <div id="transactions">
                         ${this.loading ? html`<paper-spinner-lite style="display: block; margin: 5px auto;" active></paper-spinner-lite>` : ''}
                         <div id="transactionsDOM"></div>
                     </div>

From dc3630ce06063d5e378a965264944e5c8e1d1476 Mon Sep 17 00:00:00 2001
From: AlphaX-Projects <77661270+AlphaX-Projects@users.noreply.github.com>
Date: Fri, 26 Aug 2022 15:14:18 +0200
Subject: [PATCH 3/3] New wallet menu

---
 .../plugins/core/wallet/wallet-app.src.js     | 229 ++++++++----------
 1 file changed, 106 insertions(+), 123 deletions(-)

diff --git a/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js b/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js
index 48e1dd62..ae817975 100644
--- a/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js
+++ b/qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js
@@ -18,6 +18,7 @@ import '@material/mwc-dialog'
 import '@material/mwc-formfield'
 import '@material/mwc-icon'
 import '@material/mwc-icon-button'
+import '@material/mwc-tab-bar'
 import '@material/mwc-textfield'
 import '@polymer/paper-progress/paper-progress.js'
 import '@polymer/paper-slider/paper-slider.js'
@@ -60,19 +61,18 @@ class MultiWallet extends LitElement {
             arrrAmount: { type: Number },
             arrrMemo: { type: String },
             errorMessage: { type: String },
+            arrrWalletAddress: { type: String },
             successMessage: { type: String },
             sendMoneyLoading: { type: Boolean },
             btnDisable: { type: Boolean },
             isValidAmount: { type: Boolean },
             balance: { type: Number },
+            balanceString: { type: String },
             btcFeePerByte: { type: Number },
             ltcFeePerByte: { type: Number },
             dogeFeePerByte: { type: Number },
             dgbFeePerByte: { type: Number },
 		rvnFeePerByte: { type: Number },
-            balanceString: { type: String },
-            arrrWalletAddress: { type: String },
-            exportErrorMessage: { type: String },
             qortBook: { type: Array },
             btcBook: { type: Array },
             ltcBook: { type: Array },
@@ -159,6 +159,21 @@ class MultiWallet extends LitElement {
                 cursor: default;
             }
 
+            #tabs-height {
+                --mdc-tab-height: 50px;
+            }
+
+            #tabs-1-content {
+                height: 100%;
+                padding-bottom: 10px;
+            }
+
+            mwc-tab-bar {
+                --mdc-text-transform: none;
+                --mdc-tab-color-default: var(--black);
+                --mdc-tab-text-label-color-default: var(--black);
+            }
+
             paper-slider.blue {
                 --paper-slider-knob-color: var(--paper-light-blue-500);
                 --paper-slider-active-color: var(--paper-light-blue-500);
@@ -196,6 +211,10 @@ class MultiWallet extends LitElement {
                 font-family: 'Roboto Mono', monospace;
             }
 
+            .sans {
+                font-family: 'Open Sans', sans-serif;
+            }
+
             .weight-100 {
                 font-weight: 100;
             }
@@ -273,25 +292,37 @@ class MultiWallet extends LitElement {
                 -moz-osx-font-smoothing: grayscale;
             }
 
-
             h2 {
                 margin: 0;
+                color: var(--black);
                 font-weight: 400;
                 font: 24px/24px 'Open Sans', sans-serif;
             }
 
             h3 {
                 margin: 0 0 5px;
+                color: var(--black);
                 font-weight: 600;
                 font-size: 18px;
                 line-height: 18px;
             }
 
-            @media (min-width: 765px) {
-                .wrapper {
-                    display: grid;
-                    grid-template-columns: 0.5fr 3.5fr;
-                }
+            .hrstyle {
+                color: var(--border);
+                border-radius: 80%;
+                margin-bottom: 1rem;
+            }
+
+            .header-title {
+                font-size: 32px;
+                color: var(--black);
+                font-weight: 600;
+                text-align: center;
+                margin-top: 1rem;
+            }
+
+            .fullWidth {
+                width: 100%;
             }
 
             .wrapper {
@@ -405,19 +436,6 @@ class MultiWallet extends LitElement {
                 display: inline-block;
             }
 
-            .currency-box {
-                display: flex;
-                background-color: var(--white);
-                text-align: center;
-                padding: 12px;
-                cursor: pointer;
-                transition: 0.1s ease-in-out;
-            }
-
-            .currency-box:not(:last-child) {
-                border-bottom: var(--border);
-            }
-
             .active {
                 background: var(--menuactive);
             }
@@ -432,27 +450,6 @@ class MultiWallet extends LitElement {
                 filter: grayscale(100%);
             }
 
-            .currency-box.active .currency-image,
-            .currency-box:hover .currency-image {
-                filter: none;
-            }
-
-            .currency-box:hover {
-                background: var(--menuhover);
-            }
-
-            .currency-box.active,
-            .currency-box:hover .currency-text {
-                font-weight: 500;
-            }				
-				
-            .currency-text {
-                margin: auto 0;
-                margin-left: 8px;
-                font-size: 20px;
-                color: var(--black);
-            }
-
             .qort .currency-image {
                 background-image: url('/img/qort.png');
             }
@@ -572,9 +569,6 @@ class MultiWallet extends LitElement {
                 .cards {
                     margin-top: 25px;
                 }
-                .currency-box:nth-of-type(2) {
-                    margin-right: 0;
-                }
             }
 
             .checkboxLabel:hover{
@@ -591,16 +585,6 @@ class MultiWallet extends LitElement {
                 .cards {
                     margin-top: 25px;
                 }
-                .currency-box {
-                    width: calc(50% - 25px);
-                    max-width: 260px;
-                    display: inline-block;
-                    margin-right: 25px;
-                    margin-bottom: 25px;
-                }
-                .currency-box:nth-of-type(2) {
-                    margin-right: 0;
-                }
             }
 
             @media (max-width: 530px) {
@@ -610,16 +594,6 @@ class MultiWallet extends LitElement {
                 .cards {
                     text-align: center;
                 }
-                .currency-box {
-                    width: calc(100% - 25px);
-                    max-width: 260px;
-                }
-                .currency-box:nth-of-type(2) {
-                    margin-right: 25px;
-                }
-                .currency-box:last-of-type {
-                    margin-bottom: 0;
-                }
                 .wallet-balance {
                     font-size: 22px;
                 }
@@ -652,11 +626,8 @@ class MultiWallet extends LitElement {
         this.isTextMenuOpen = false
         this.loading = true
 
-        this.selectWallet = this.selectWallet.bind(this)
-
         this.theme = localStorage.getItem('qortalTheme') ? localStorage.getItem('qortalTheme') : 'light';
 
-        this.exportErrorMessage = ''
         this.qortBook = []
         this.btcBook = []
         this.ltcBook = []
@@ -767,40 +738,38 @@ class MultiWallet extends LitElement {
     render() {
         return html`
             <div class="wrapper">
-                <div class="wallet">
-                    <div style="font-size: 20px; color: var(--black); padding: 16px; border-bottom: 1px solid var(--border);">${translate("walletpage.wchange22")}</div>
-                    <div class="cards">
-                        <div coin="qort" class="currency-box qort active">
-                            <div class="currency-image"></div>
-                            <div class="currency-text">Qort</div>
-                        </div>
-                        <div coin="btc" class="currency-box btc">
-                            <div class="currency-image"></div>
-                            <div class="currency-text">Bitcoin</div>
-                        </div>
-                        <div coin="ltc" class="currency-box ltc">
-                            <div class="currency-image"></div>
-                            <div class="currency-text">Litecoin</div>
-                        </div>
-                        <div coin="doge" class="currency-box doge">
-                            <div class="currency-image"></div>
-                            <div class="currency-text">Dogecoin</div>
-                        </div>
-                        <div coin="dgb" class="currency-box dgb">
-                            <div class="currency-image"></div>
-                            <div class="currency-text">Digibyte</div>
-                        </div>
-				<div coin="rvn" class="currency-box rvn">
-                            <div class="currency-image"></div>
-                            <div class="currency-text">Ravencoin</div>
-                        </div>
-                        <div coin="arrr" class="currency-box arrr">
-                            <div class="currency-image"></div>
-                            <div class="currency-text">Pirate Chain</div>
-                        </div>
-                    </div>
+                <div class="header-title sans">
+                    ${translate("walletpage.wchange22")}
                 </div>
 
+                <div class="fullWidth">
+                    <hr class="hrstyle">
+                </div>
+
+                <mwc-tab-bar id="tabs-1" activeIndex="0">
+                    <mwc-tab label="Qortal" hasImageIcon minWidth @click="${(e) => this.tabWalletQort()}">
+                        <img slot="icon" width="24px" height="24px" src="/img/qort.png">
+                    </mwc-tab>
+                    <mwc-tab label="Bitcoin" hasImageIcon minWidth @click="${(e) => this.tabWalletBtc()}">
+                        <img slot="icon" width="24px" height="24px" src="/img/btc.png">
+                    </mwc-tab>
+                    <mwc-tab label="Litecoin" hasImageIcon minWidth @click="${(e) => this.tabWalletLtc()}">
+                        <img slot="icon" width="24px" height="24px" src="/img/ltc.png">
+                    </mwc-tab>
+                    <mwc-tab label="Dogecoin" hasImageIcon minWidth @click="${(e) => this.tabWalletDoge()}">
+                        <img slot="icon" width="24px" height="24px" src="/img/doge.png">
+                    </mwc-tab>
+                    <mwc-tab label="Digibyte" hasImageIcon minWidth @click="${(e) => this.tabWalletDgb()}">
+                        <img slot="icon" width="24px" height="24px" src="/img/dgb.png">
+                    </mwc-tab>
+                    <mwc-tab label="Ravencoin" hasImageIcon minWidth @click="${(e) => this.tabWalletRvn()}">
+                        <img slot="icon" width="24px" height="24px" src="/img/rvn.png">
+                    </mwc-tab>
+                    <mwc-tab label="Pirate Chain" hasImageIcon minWidth @click="${(e) => this.tabWalletArrr()}">
+                        <img slot="icon" width="24px" height="24px" src="/img/arrr.png">
+                    </mwc-tab>
+                </mwc-tab-bar>
+
                 <div class="transactions-wrapper">
                     <h2 class="wallet-header">
                         ${translate("walletpage.wchange2")}
@@ -2479,13 +2448,8 @@ class MultiWallet extends LitElement {
         this.rvnAddressbook()
         this.arrrAddressbook()
 
-        this.currencyBoxes = this.shadowRoot.querySelectorAll('.currency-box')
         this.transactionsDOM = this.shadowRoot.getElementById('transactionsDOM')
 
-        this.currencyBoxes.forEach((currencyBox) => {
-            currencyBox.addEventListener('click', this.selectWallet)
-        })
-
         this.showWallet()
 
         window.addEventListener('contextmenu', (event) => {
@@ -2900,6 +2864,41 @@ class MultiWallet extends LitElement {
         }
     }
 
+    tabWalletQort() {
+        this._selectedWallet = 'qort'
+        this.showWallet()
+    }
+
+    tabWalletBtc() {
+        this._selectedWallet = 'btc'
+        this.showWallet()
+    }
+
+    tabWalletLtc() {
+        this._selectedWallet = 'ltc'
+        this.showWallet()
+    }
+
+    tabWalletDoge() {
+        this._selectedWallet = 'doge'
+        this.showWallet()
+    }
+
+    tabWalletDgb() {
+        this._selectedWallet = 'dgb'
+        this.showWallet()
+    }
+
+    tabWalletRvn() {
+        this._selectedWallet = 'rvn'
+        this.showWallet()
+    }
+
+    tabWalletArrr() {
+        this._selectedWallet = 'arrr'
+        this.showWallet()
+    }
+
     qortAddressbook() {
         if (localStorage.getItem("addressbookQort") === null) {
             localStorage.setItem("addressbookQort", "")
@@ -3808,21 +3807,6 @@ class MultiWallet extends LitElement {
         return html`${translate("walletpage.wchange8")}`
     }
 
-    selectWallet(event) {
-        event.preventDefault()
-
-        const target = event.currentTarget
-
-        this.currencyBoxes.forEach((currencyBox) => {
-            if (currencyBox.classList.contains('active')) {
-                currencyBox.classList.remove('active')
-            }
-        })
-        target.classList.add('active')
-        this._selectedWallet = target.attributes.coin.value
-        this.showWallet()
-    }
-
     _checkAmount(e) {
         const targetAmount = e.target.value
         const target = e.target
@@ -5122,7 +5106,7 @@ class MultiWallet extends LitElement {
                 </vaadin-grid-column>
                 <vaadin-grid-column
                     auto-width
-                    header="${translate("walletpage.wchange50")}"
+                    header="${translate("walletpage.wchange57")}"
                     .renderer=${(root, column, data) => {
                         render(html`${data.item.memo}`, root)
                     }}
@@ -5347,7 +5331,6 @@ class MultiWallet extends LitElement {
         })
     }
 
-
     isEmptyArray(arr) {
         if (!arr) {
             return true