diff --git a/__tests__/unit/components/utils/merge-table-transactions.spec.js b/__tests__/unit/components/utils/merge-table-transactions.spec.js
index 3f3a4d6923..17fb7ce103 100644
--- a/__tests__/unit/components/utils/merge-table-transactions.spec.js
+++ b/__tests__/unit/components/utils/merge-table-transactions.spec.js
@@ -5,12 +5,12 @@ describe('Utils > mergeTableTransactions', () => {
 
   beforeEach(() => {
     transactions = [
-      { id: 'tx1', timestamp: 1 },
-      { id: 'tx2', timestamp: 2 },
-      { id: 'tx3', timestamp: 8 },
-      { id: 'tx4', timestamp: 9 },
-      { id: 'tx5', timestamp: 5 },
-      { id: 'tx6', timestamp: 6 }
+      { id: 'tx1', timestamp: 1, amount: '6' },
+      { id: 'tx2', timestamp: 2, amount: '5' },
+      { id: 'tx3', timestamp: 8, amount: '9' },
+      { id: 'tx4', timestamp: 9, amount: '8' },
+      { id: 'tx5', timestamp: 5, amount: '2' },
+      { id: 'tx6', timestamp: 6, amount: '1' }
     ]
   })
 
@@ -31,6 +31,40 @@ describe('Utils > mergeTableTransactions', () => {
     ])
   })
 
+  it('should return the transactions sorted by `timestamp` ascendently', () => {
+    const a = [
+      transactions[0],
+      transactions[2]
+    ]
+    const b = [
+      transactions[1],
+      transactions[5]
+    ]
+    expect(mergeTableTransactions(a, b, { field: 'timestamp', type: 'asc' })).toEqual([
+      transactions[0],
+      transactions[1],
+      transactions[5],
+      transactions[2]
+    ])
+  })
+
+  it('should return the transactions sorted by `amount` ascendently', () => {
+    const a = [
+      transactions[0],
+      transactions[2]
+    ]
+    const b = [
+      transactions[1],
+      transactions[5]
+    ]
+    expect(mergeTableTransactions(a, b, { field: 'amount', type: 'asc' })).toEqual([
+      transactions[5],
+      transactions[1],
+      transactions[0],
+      transactions[2]
+    ])
+  })
+
   describe('when there are duplicates', () => {
     it('should not return duplicates', () => {
       const a = [
diff --git a/__tests__/unit/pages/Profile/ProfileAll.spec.js b/__tests__/unit/pages/Profile/ProfileAll.spec.js
index 0b64089589..c1d2ba19a6 100644
--- a/__tests__/unit/pages/Profile/ProfileAll.spec.js
+++ b/__tests__/unit/pages/Profile/ProfileAll.spec.js
@@ -36,7 +36,7 @@ describe('pages > ProfileAll', () => {
             'network/byToken': token => networkBy('token', token),
             'network/bySymbol': symbol => networkBy('symbol', symbol),
             'profile/all': profiles,
-            'profile/balanceWithLedger': _id => 13700000,
+            'profile/balanceWithLedger': _id => new BigNumber(13700000),
             'wallet/byProfileId': id => wallets[id]
           }
         },
@@ -62,20 +62,20 @@ describe('pages > ProfileAll', () => {
     ]
     wallets = {
       p1: [
-        { address: 'M0', balance: 1000 },
-        { address: 'M1', balance: 15089900 }
+        { address: 'M0', balance: '1000' },
+        { address: 'M1', balance: '15089900' }
       ],
       p2: [
-        { address: 'O0', balance: 12000000 },
-        { address: 'O1', balance: 190000 }
+        { address: 'O0', balance: '12000000' },
+        { address: 'O1', balance: '190000' }
       ],
       p3: [
-        { address: 'M2', balance: 0 },
-        { address: 'M3', balance: 50000000000 }
+        { address: 'M2', balance: '0' },
+        { address: 'M3', balance: '50000000000' }
       ],
       p4: [
-        { address: 'D0', balance: 1110000 },
-        { address: 'D1', balance: 50900000 }
+        { address: 'D0', balance: '1110000' },
+        { address: 'D1', balance: '50900000' }
       ]
     }
     ledgerWallets = []
@@ -110,8 +110,8 @@ describe('pages > ProfileAll', () => {
     describe('when the Ledger has wallets on the current network', () => {
       beforeEach(() => {
         ledgerWallets = [
-          { address: 'MxLedger0', balance: 9883102007 },
-          { address: 'MxLedger1', balance: 6723900701 }
+          { address: 'MxLedger0', balance: '9883102007' },
+          { address: 'MxLedger1', balance: '6723900701' }
         ]
       })
 
@@ -150,8 +150,8 @@ describe('pages > ProfileAll', () => {
     describe('when the Ledger has wallets on the current network', () => {
       beforeEach(() => {
         ledgerWallets = [
-          { address: 'MxLedger0', balance: 9883102007 },
-          { address: 'MxLedger1', balance: 6723900701 }
+          { address: 'MxLedger0', balance: '9883102007' },
+          { address: 'MxLedger1', balance: '6723900701' }
         ]
       })
 
diff --git a/__tests__/unit/services/client.spec.js b/__tests__/unit/services/client.spec.js
index d7c2979e77..28d47f3f56 100644
--- a/__tests__/unit/services/client.spec.js
+++ b/__tests__/unit/services/client.spec.js
@@ -421,8 +421,8 @@ describe('Services > Client', () => {
 
       transactions.forEach((transaction, i) => {
         expect(transaction).toHaveProperty('totalAmount')
-        expect(transaction.totalAmount).toBeInstanceOf(BigNumber)
-        expect(transaction.totalAmount.toString()).toBe((data[i].amount + data[i].fee).toString())
+        expect(transaction.totalAmount).toBeString()
+        expect(transaction.totalAmount).toEqual(new BigNumber(data[i].amount).plus(data[i].fee).toString())
         expect(transaction).toHaveProperty('timestamp', data[i].timestamp.unix * 1000)
         expect(transaction).toHaveProperty('isSender')
         expect(transaction).toHaveProperty('isRecipient')
diff --git a/package.json b/package.json
index de7d88df3a..73c3ac1bfa 100644
--- a/package.json
+++ b/package.json
@@ -93,7 +93,7 @@
     "vm2": "^3.8.4",
     "vue": "^2.6.10",
     "vue-chartjs": "^3.4.2",
-    "vue-good-table": "2.16.5",
+    "vue-good-table": "^2.18.0",
     "vue-i18n": "^8.12.0",
     "vue-qrcode-reader": "^2.0.3",
     "vue-router": "^3.0.7",
diff --git a/src/renderer/components/Transaction/TransactionConfirm/TransactionConfirm.vue b/src/renderer/components/Transaction/TransactionConfirm/TransactionConfirm.vue
index e43d77dc4b..98d64812f7 100644
--- a/src/renderer/components/Transaction/TransactionConfirm/TransactionConfirm.vue
+++ b/src/renderer/components/Transaction/TransactionConfirm/TransactionConfirm.vue
@@ -1,7 +1,7 @@
 <template>
   <section class="TransactionConfirm">
     <TransactionDetail
-      :amount="formatter_networkCurrency(totalAmount)"
+      :amount="formatter_networkCurrency(transaction.totalAmount)"
       :recipient-address="transaction.recipientId"
       :sender-address="address"
       :type="transaction.type"
@@ -27,7 +27,7 @@
         >
           {{ $t('TRANSACTION.SEND') }}
           <span class="px-2 py-1 bg-theme-button-inner-box rounded">
-            {{ formatter_networkCurrency(totalAmount) }}
+            {{ formatter_networkCurrency(transaction.totalAmount) }}
           </span>
         </button>
       </div>
@@ -98,9 +98,6 @@ export default {
   }),
 
   computed: {
-    totalAmount () {
-      return this.currency_toBuilder(this.transaction.amount).add(this.transaction.fee).value
-    },
     currentWallet () {
       return this.wallet || this.wallet_fromRoute
     },
diff --git a/src/renderer/components/Transaction/TransactionTable.vue b/src/renderer/components/Transaction/TransactionTable.vue
index 69da71959a..0dd14b5c3e 100644
--- a/src/renderer/components/Transaction/TransactionTable.vue
+++ b/src/renderer/components/Transaction/TransactionTable.vue
@@ -249,11 +249,11 @@ export default {
       this.network_openExplorer('transaction', id)
     },
 
-    onSortChange ({ columnIndex, sortType }) {
-      if (this.columns[columnIndex]) {
-        const columnName = this.columns[columnIndex].field
-        this.$emit('on-sort-change', { columnName, sortType })
-      }
+    onSortChange (sortOptions) {
+      this.$emit('on-sort-change', {
+        source: 'transactionsTab',
+        ...sortOptions[0]
+      })
     },
 
     onRowClick ({ row }) {
diff --git a/src/renderer/components/Wallet/WalletDelegates/WalletDelegates.vue b/src/renderer/components/Wallet/WalletDelegates/WalletDelegates.vue
index 8c82d1a60b..f9468321aa 100644
--- a/src/renderer/components/Wallet/WalletDelegates/WalletDelegates.vue
+++ b/src/renderer/components/Wallet/WalletDelegates/WalletDelegates.vue
@@ -31,9 +31,13 @@
       :is-loading="isLoading"
       :is-remote="true"
       :rows="delegates"
-      :sort-query="queryParams.sort"
+      :sort-query="{
+        field: queryParams.sort.field,
+        type: queryParams.sort.type
+      }"
       :total-rows="totalCount"
       :no-data-message="$t('TABLE.NO_DELEGATES')"
+      :current-page="currentPage"
       :per-page="queryParams.limit"
       :per-page-dropdown="[25, 51]"
       class="WalletDelegates__table"
@@ -68,6 +72,7 @@
 </template>
 
 <script>
+import isEqual from 'lodash/isEqual'
 import { ButtonClose } from '@/components/Button'
 import TableWrapper from '@/components/utils/TableWrapper'
 
@@ -193,16 +198,15 @@ export default {
     },
 
     onSortChange (sortOptions) {
-      const columnName = sortOptions[0].field
-      const sortType = sortOptions[0].type
-      this.__updateParams({
-        sort: {
-          field: columnName,
-          type: sortType
-        },
-        page: 1
-      })
-      this.fetchDelegates()
+      const params = sortOptions[0]
+
+      if (!isEqual(params, this.queryParams.sort)) {
+        this.__updateParams({
+          sort: params,
+          page: 1
+        })
+        this.fetchDelegates()
+      }
     },
 
     reset () {
diff --git a/src/renderer/components/Wallet/WalletTable.vue b/src/renderer/components/Wallet/WalletTable.vue
index d0c561353c..807acbf224 100644
--- a/src/renderer/components/Wallet/WalletTable.vue
+++ b/src/renderer/components/Wallet/WalletTable.vue
@@ -58,7 +58,7 @@
         </div>
 
         <div
-          v-else-if="data.column.field === 'delegate'"
+          v-else-if="data.column.field === 'vote'"
         >
           <span class="flex items-center">
             {{ getDelegateProperty(data.row.vote, 'username') }}
@@ -69,7 +69,7 @@
                   delegate: getDelegateProperty(data.row.vote, 'username'),
                   rank: getDelegateProperty(data.row.vote, 'rank')
                 }),
-                trigger:'hover'
+                trigger: 'hover'
               }"
               class="bg-theme-button-special-choice cursor-pointer rounded-full w-2 h-2 ml-2"
             />
@@ -178,7 +178,8 @@ export default {
         },
         {
           label: this.$t('PAGES.WALLET_ALL.VOTING_FOR'),
-          field: 'delegate',
+          field: 'vote',
+          sortFn: this.sortByVote,
           thClass: 'w-full whitespace-no-wrap',
           tdClass: 'w-full'
         },
@@ -224,6 +225,13 @@ export default {
       return a.localeCompare(b, undefined, { sensitivity: 'base', numeric: true })
     },
 
+    sortByVote (x, y, col, rowX, rowY) {
+      const a = x ? this.getDelegateProperty(x, 'username') : ''
+      const b = y ? this.getDelegateProperty(y, 'username') : ''
+
+      return a.localeCompare(b, undefined, { sensitivity: 'base', numeric: true })
+    },
+
     getDelegate (publicKey) {
       return this.$store.getters['delegate/byPublicKey'](publicKey)
     },
diff --git a/src/renderer/components/Wallet/WalletTransactions/WalletTransactions.vue b/src/renderer/components/Wallet/WalletTransactions/WalletTransactions.vue
index 26913aaff7..185c63282e 100644
--- a/src/renderer/components/Wallet/WalletTransactions/WalletTransactions.vue
+++ b/src/renderer/components/Wallet/WalletTransactions/WalletTransactions.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="WalletTransactions">
     <div
-      v-if="newTransactionsNotice"
+      v-if="newTransactionsNotice && newTransactionsNotice !== '0'"
       class="bg-theme-feature flex flex-row"
     >
       <div
@@ -17,7 +17,10 @@
       :is-loading="isLoading"
       :is-remote="true"
       :has-pagination="totalCount > 0"
-      :sort-query="queryParams.sort"
+      :sort-query="{
+        field: queryParams.sort.field,
+        type: queryParams.sort.type
+      }"
       :per-page="transactionTableRowCount"
       @on-per-page-change="onPerPageChange"
       @on-page-change="onPageChange"
@@ -27,7 +30,7 @@
 </template>
 
 <script>
-import at from 'lodash/at'
+import { at, isEqual } from 'lodash'
 import mergeTableTransactions from '@/components/utils/merge-table-transactions'
 import TransactionTable from '@/components/Transaction/TransactionTable'
 
@@ -170,7 +173,7 @@ export default {
           profileId: this.session_profile.id
         })
 
-        const transactions = mergeTableTransactions(response.transactions, this.getStoredTransactions(address))
+        const transactions = mergeTableTransactions(response.transactions, this.getStoredTransactions(address), this.queryParams.sort)
 
         if (this.wallet_fromRoute && address === this.wallet_fromRoute.address) {
           this.$set(this, 'fetchedTransactions', transactions)
@@ -225,7 +228,7 @@ export default {
       try {
         let newTransactions = 0
         const response = await this.getTransactions(address)
-        const transactions = mergeTableTransactions(response.transactions, this.getStoredTransactions(address))
+        const transactions = mergeTableTransactions(response.transactions, this.getStoredTransactions(address), this.queryParams.sort)
         for (const existingTransaction of this.fetchedTransactions) {
           for (const transaction of transactions) {
             if (existingTransaction.id === transaction.id) {
@@ -251,9 +254,8 @@ export default {
         // Avoid throwing an Error if the user changes to a different route
         if (this.wallet_fromRoute) {
           if (address === this.wallet_fromRoute.address && newTransactions > 0) {
-            this.newTransactionsNotice = this.$t('WALLET_TRANSACTIONS.NEW_TRANSACTIONS', {
-              count: newTransactions,
-              plural: newTransactions > 1 ? 's' : ''
+            this.newTransactionsNotice = this.$tc('WALLET_TRANSACTIONS.NEW_TRANSACTIONS', {
+              count: newTransactions
             })
           }
         }
@@ -269,23 +271,26 @@ export default {
     },
 
     onPerPageChange ({ currentPerPage }) {
+      this.transactionTableRowCount = currentPerPage
       this.__updateParams({ limit: currentPerPage, page: 1 })
       this.loadTransactions()
-      this.transactionTableRowCount = currentPerPage
     },
 
-    onSortChange (sortOptions) {
-      const columnName = sortOptions[0].field
-      const sortType = sortOptions[0].type
+    onSortChange ({ source, field, type }) {
+      if (!source || source !== 'transactionsTab') {
+        return
+      }
 
-      this.__updateParams({
-        sort: {
-          field: columnName,
-          type: sortType
-        },
-        page: 1
-      })
-      this.loadTransactions()
+      if (!isEqual({ field, type }, this.queryParams.sort)) {
+        this.__updateParams({
+          sort: {
+            field,
+            type
+          },
+          page: 1
+        })
+        this.loadTransactions()
+      }
     },
 
     reset () {
diff --git a/src/renderer/components/utils/TableWrapper.js b/src/renderer/components/utils/TableWrapper.js
index 8540a01a04..70b971ac8f 100644
--- a/src/renderer/components/utils/TableWrapper.js
+++ b/src/renderer/components/utils/TableWrapper.js
@@ -53,6 +53,7 @@ export default {
         },
         paginationOptions: {
           enabled: this.hasPagination,
+          setCurrentPage: this.currentPage,
           dropdownAllowAll: false,
           perPage: this.perPage,
           perPageDropdown: this.perPageDropdown,
diff --git a/src/renderer/components/utils/merge-table-transactions.js b/src/renderer/components/utils/merge-table-transactions.js
index efa0392933..16bc968e06 100644
--- a/src/renderer/components/utils/merge-table-transactions.js
+++ b/src/renderer/components/utils/merge-table-transactions.js
@@ -1,4 +1,5 @@
 import { orderBy, uniqBy } from 'lodash'
+import BigNumber from 'bignumber.js'
 
 /**
  * This utility is used to merge the transactions that have been fetched using
@@ -6,15 +7,26 @@ import { orderBy, uniqBy } from 'lodash'
  *
  * @param {Array} a
  * @param {Array} b
- * @param {Number} number - of transactions to return
+ * @param {Object} order - of transactions to return
  * @return {Array}
  */
-export default (a, b, number) => {
+export default (a, b, order = null) => {
+  const { field, type } = order || { field: 'timestamp', type: 'desc' }
+
   // The order is important: the fetched transactions should override the stored
   const transactions = uniqBy([
     ...a,
     ...b
   ], 'id')
 
-  return orderBy(transactions, 'timestamp', 'desc').slice(0, number)
+  if (['amount', 'fee'].includes(field)) {
+    return transactions.sort((a, b) => {
+      const bignumA = new BigNumber(a[field])
+      const bignumB = new BigNumber(b[field])
+
+      return type === 'asc' ? bignumA.comparedTo(bignumB) : bignumB.comparedTo(bignumA)
+    })
+  }
+
+  return orderBy(transactions, field, type)
 }
diff --git a/src/renderer/i18n/locales/en-US.js b/src/renderer/i18n/locales/en-US.js
index 9ed491d073..900fc44cbf 100644
--- a/src/renderer/i18n/locales/en-US.js
+++ b/src/renderer/i18n/locales/en-US.js
@@ -1036,7 +1036,7 @@ export default {
     RECIPIENT: 'Recipient',
     SENDER: 'Sender',
     AMOUNT: 'Amount',
-    NEW_TRANSACTIONS: 'This wallet has {count} new transaction{plural}. Press the refresh button to update.'
+    NEW_TRANSACTIONS: '0 | This wallet has 1 new transaction. Press the refresh button to update. | This wallet has {count} new transactions. Press the refresh button to update.'
   },
 
   WALLET_TABLE: {
diff --git a/src/renderer/i18n/locales/it-IT.js b/src/renderer/i18n/locales/it-IT.js
index d43264ba4a..e4a6d945ec 100644
--- a/src/renderer/i18n/locales/it-IT.js
+++ b/src/renderer/i18n/locales/it-IT.js
@@ -1025,7 +1025,7 @@ export default {
     RECIPIENT: 'Destinatario',
     SENDER: 'Mittente',
     AMOUNT: 'Importo',
-    NEW_TRANSACTIONS: 'Questo portafoglio ha {count} nuova/e transazione/i. Premi il pulsante ricarica per aggiornare.'
+    NEW_TRANSACTIONS: '0 | Questo portafoglio ha 1 nuova transazione. Premi il pulsante ricarica per aggiornare. | Questo portafoglio ha {count} nuove transazioni. Premi il pulsante ricarica per aggiornare.'
   },
 
   WALLET_TABLE: {
diff --git a/src/renderer/pages/Contact/ContactAll.vue b/src/renderer/pages/Contact/ContactAll.vue
index 628f15ec9a..ea9c997108 100644
--- a/src/renderer/pages/Contact/ContactAll.vue
+++ b/src/renderer/pages/Contact/ContactAll.vue
@@ -44,7 +44,7 @@
 
           <ButtonLayout
             :grid-layout="hasWalletGridLayout"
-            @click="toggleWalletLayout()"
+            @click="toggleWalletLayout"
           />
         </div>
       </div>
@@ -68,7 +68,10 @@
           :show-voted-delegates="showVotedDelegates"
           :rows="contacts"
           :total-rows="contacts.length"
-          :sort-query="sortParams"
+          :sort-query="{
+            field: sortParams.field,
+            type: sortParams.type
+          }"
           :no-data-message="$t('TABLE.NO_CONTACTS')"
           @remove-row="onRemoveContact"
           @rename-row="onRenameContact"
@@ -94,7 +97,7 @@
 </template>
 
 <script>
-import some from 'lodash/some'
+import { isEqual, some } from 'lodash'
 import { ButtonLayout } from '@/components/Button'
 import { ContactRemovalConfirmation, ContactRenameModal } from '@/components/Contact'
 import { WalletGrid, WalletIdenticonPlaceholder } from '@/components/Wallet'
@@ -210,7 +213,9 @@ export default {
     },
 
     onSortChange (sortParams) {
-      this.sortParams = sortParams
+      if (!isEqual(sortParams, this.sortParams)) {
+        this.sortParams = sortParams
+      }
     },
 
     showContact (contactId) {
diff --git a/src/renderer/pages/Wallet/WalletAll.vue b/src/renderer/pages/Wallet/WalletAll.vue
index c59280e7d9..ec886eefb1 100644
--- a/src/renderer/pages/Wallet/WalletAll.vue
+++ b/src/renderer/pages/Wallet/WalletAll.vue
@@ -81,7 +81,7 @@
 
           <ButtonLayout
             :grid-layout="hasWalletGridLayout"
-            @click="toggleWalletLayout()"
+            @click="toggleWalletLayout"
           />
         </div>
 
@@ -94,32 +94,37 @@
           </div>
         </div>
 
-        <WalletGrid
-          v-if="hasWalletGridLayout && !isLoading"
-          :is-ledger-loading="isLedgerLoading"
-          :wallets="selectableWallets"
-          @show="showWallet"
-          @rename="openRenameModal"
-          @remove="openRemovalConfirmation"
-        />
-
-        <div
-          v-else-if="!hasWalletGridLayout && !isLoading"
-          class="WalletAll__tabular mt-10"
-        >
-          <WalletTable
-            :has-pagination="false"
-            :is-loading="false"
-            :rows="selectableWallets"
-            :show-voted-delegates="showVotedDelegates"
-            :total-rows="selectableWallets.length"
-            :sort-query="sortParams"
-            :no-data-message="$t('TABLE.NO_WALLETS')"
-            @remove-row="onRemoveWallet"
-            @rename-row="onRenameWallet"
-            @on-sort-change="onSortChange"
+        <template v-else>
+          <WalletGrid
+            v-if="hasWalletGridLayout"
+            :is-ledger-loading="isLedgerLoading"
+            :wallets="selectableWallets"
+            @show="showWallet"
+            @rename="openRenameModal"
+            @remove="openRemovalConfirmation"
           />
-        </div>
+
+          <div
+            v-else
+            class="WalletAll__tabular mt-10"
+          >
+            <WalletTable
+              :has-pagination="false"
+              :is-loading="false"
+              :rows="selectableWallets"
+              :show-voted-delegates="showVotedDelegates"
+              :total-rows="selectableWallets.length"
+              :sort-query="{
+                field: sortParams.field,
+                type: sortParams.type
+              }"
+              :no-data-message="$t('TABLE.NO_WALLETS')"
+              @remove-row="onRemoveWallet"
+              @rename-row="onRenameWallet"
+              @on-sort-change="onSortChange"
+            />
+          </div>
+        </template>
       </div>
     </div>
 
@@ -140,7 +145,7 @@
 </template>
 
 <script>
-import { some, uniqBy } from 'lodash'
+import { isEqual, some, uniqBy } from 'lodash'
 import { ButtonLayout } from '@/components/Button'
 import Loader from '@/components/utils/Loader'
 import { ProfileAvatar } from '@/components/Profile'
@@ -353,7 +358,9 @@ export default {
     },
 
     onSortChange (sortParams) {
-      this.sortParams = sortParams
+      if (!isEqual(sortParams, this.sortParams)) {
+        this.sortParams = sortParams
+      }
     },
 
     showWallet (walletId) {
diff --git a/src/renderer/services/client.js b/src/renderer/services/client.js
index 8e039bb58a..9eb4a2e82d 100644
--- a/src/renderer/services/client.js
+++ b/src/renderer/services/client.js
@@ -289,7 +289,7 @@ export default class ClientService {
     const result = transactions.map(transaction => {
       transaction.isSender = transaction.sender === address
       transaction.isRecipient = transaction.recipient === address
-      transaction.totalAmount = new BigNumber(transaction.amount).plus(transaction.fee)
+      transaction.totalAmount = new BigNumber(transaction.amount).plus(transaction.fee).toString()
 
       return transaction
     })
diff --git a/src/renderer/store/modules/transaction.js b/src/renderer/store/modules/transaction.js
index 50b5f0f973..e2bb4f86e8 100644
--- a/src/renderer/store/modules/transaction.js
+++ b/src/renderer/store/modules/transaction.js
@@ -1,6 +1,7 @@
 import dayjs from 'dayjs'
 import { findIndex, unionBy } from 'lodash'
 import config from '@config'
+import BigNumber from '@/plugins/bignumber'
 import eventBus from '@/plugins/event-bus'
 import TransactionModel from '@/models/transaction'
 import Vue from 'vue'
@@ -34,7 +35,7 @@ export default {
       }).map(transaction => {
         transaction.isSender = transaction.sender === address
         transaction.isRecipient = transaction.recipient === address
-        transaction.totalAmount = transaction.amount + transaction.fee
+        transaction.totalAmount = new BigNumber(transaction.amount).plus(transaction.fee).toString()
 
         return transaction
       })
@@ -58,7 +59,7 @@ export default {
       const transactions = state.transactions[profileId].map(transaction => {
         transaction.isSender = addresses.includes(transaction.sender)
         transaction.isRecipient = addresses.includes(transaction.recipient)
-        transaction.totalAmount = transaction.amount + transaction.fee
+        transaction.totalAmount = new BigNumber(transaction.amount).plus(transaction.fee).toString()
 
         return transaction
       })
diff --git a/src/renderer/styles/_table.css b/src/renderer/styles/_table.css
index f50fe3f819..4168906445 100644
--- a/src/renderer/styles/_table.css
+++ b/src/renderer/styles/_table.css
@@ -58,6 +58,18 @@
   @apply .text-theme-page-text-light .cursor-default;
 }
 
+.vgt-table th.sorting {
+  @apply .flex .items-center .whitespace-no-wrap
+}
+
+.vgt-table th.vgt-right-align.sorting {
+  @apply .justify-end
+}
+
+.vgt-table th.vgt-right-align.text-center {
+  @apply .justify-center
+}
+
 .vgt-table th.sorting-asc:after {
   @apply .inline-block .ml-1;
   background: url('../assets/images/arrows/sort-asc.svg') no-repeat;
diff --git a/yarn.lock b/yarn.lock
index 6dcf0157c2..5a25c30b53 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3570,16 +3570,16 @@ data-urls@^1.0.0:
     whatwg-mimetype "^2.2.0"
     whatwg-url "^7.0.0"
 
-date-fns@2.0.0-alpha.7:
-  version "2.0.0-alpha.7"
-  resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.0.0-alpha.7.tgz#245ad16f95764eababfb2c0a41fd5d033c20e57a"
-  integrity sha1-JFrRb5V2Tqur+ywKQf1dAzwg5Xo=
-
 date-fns@^1.27.2:
   version "1.30.1"
   resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-1.30.1.tgz#2e71bf0b119153dbb4cc4e88d9ea5acfb50dc05c"
   integrity sha512-hBSVCvSmWC+QypYObzwGOd9wqdDpOt+0wl0KbU+R+uuZBS1jN8VsD1ss3irQDknRj5NvxiTF6oj/nDRnN/UQNw==
 
+date-fns@^2.0.0-beta.4:
+  version "2.4.1"
+  resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.4.1.tgz#b53f9bb65ae6bd9239437035710e01cf383b625e"
+  integrity sha512-2RhmH/sjDSCYW2F3ZQxOUx/I7PvzXpi89aQL2d3OAxSTwLx6NilATeUbe0menFE3Lu5lFkOFci36ivimwYHHxw==
+
 date-now@^0.1.4:
   version "0.1.4"
   resolved "https://registry.yarnpkg.com/date-now/-/date-now-0.1.4.tgz#eaf439fd4d4848ad74e5cc7dbef200672b9e345b"
@@ -11802,12 +11802,12 @@ vue-eslint-parser@^5.0.0:
     esquery "^1.0.1"
     lodash "^4.17.11"
 
-vue-good-table@2.16.5:
-  version "2.16.5"
-  resolved "https://registry.yarnpkg.com/vue-good-table/-/vue-good-table-2.16.5.tgz#c6bfeabcb6cfb88590daf99763887d13f33e22db"
-  integrity sha512-1X47ejqiTCqqYCCQFswJFPaXMIAUk+8HWvA861Aok+J5+HfG12q3RRJl3wyF9FUC0DZVz7TDF7x6pT/dBP8oUw==
+vue-good-table@^2.18.0:
+  version "2.18.0"
+  resolved "https://registry.yarnpkg.com/vue-good-table/-/vue-good-table-2.18.0.tgz#707c806cf5496e072cb3e0cb39bc6b6322403e89"
+  integrity sha512-wC0I9D7TyfSf0zrYwIpNtXdbSPRir//q7TNpGZ8/MfgW5mLMspk9I0MVq856M3ecgwTqgqXXtO87+i0sgQxALg==
   dependencies:
-    date-fns "2.0.0-alpha.7"
+    date-fns "^2.0.0-beta.4"
     diacriticless "1.0.1"
     lodash.assign "^4.2.0"
     lodash.clonedeep "^4.5.0"