From 65654e963da32dc1dcf1ba6c0300882a88b69ec8 Mon Sep 17 00:00:00 2001
From: Artem <aopoltorzhicky@gmail.com>
Date: Tue, 24 Nov 2020 20:20:50 +0300
Subject: [PATCH] Fix: mempool view

---
 src/components/RawJsonViewer.vue     | 32 +++++++---
 src/views/contract/OperationsTab.vue | 87 +++++++++++++++++-----------
 2 files changed, 78 insertions(+), 41 deletions(-)

diff --git a/src/components/RawJsonViewer.vue b/src/components/RawJsonViewer.vue
index 14786ee5..52d290a8 100644
--- a/src/components/RawJsonViewer.vue
+++ b/src/components/RawJsonViewer.vue
@@ -16,7 +16,13 @@
         <v-spacer></v-spacer>
         <v-menu offset-y v-if="type === 'code'">
           <template v-slot:activator="{ on, attrs }">
-            <v-btn text outlined v-bind="attrs" v-on="on" class="mr-4 text--secondary">
+            <v-btn
+              text
+              outlined
+              v-bind="attrs"
+              v-on="on"
+              class="mr-4 text--secondary"
+            >
               <v-icon small class="mr-1">mdi-content-copy</v-icon>Copy
             </v-btn>
           </template>
@@ -29,7 +35,9 @@
               v-clipboard="() => getSection(item)"
               v-clipboard:success="showClipboardOK"
             >
-              <v-list-item-title class="text-capitalize">{{ item }}</v-list-item-title>
+              <v-list-item-title class="text-capitalize">{{
+                item
+              }}</v-list-item-title>
             </v-list-item>
           </v-list>
         </v-menu>
@@ -52,12 +60,15 @@
         >
           <v-icon small class="mr-1">mdi-open-in-new</v-icon>In new tab
         </v-btn>
-        <v-btn text @click="close">
-          <v-icon>mdi-close</v-icon>Close
-        </v-btn>
+        <v-btn text @click="close"> <v-icon>mdi-close</v-icon>Close </v-btn>
       </v-card-title>
-      <v-progress-linear absolute v-if="!loaded" indeterminate color="primary"></v-progress-linear>
-      <v-card-text class="data" style="max-height: calc(100% - 52px);">
+      <v-progress-linear
+        absolute
+        v-if="!loaded"
+        indeterminate
+        color="primary"
+      ></v-progress-linear>
+      <v-card-text class="data" style="max-height: calc(100% - 52px)">
         <vue-json-pretty
           class="raw-json-viewer"
           v-if="loaded"
@@ -85,6 +96,7 @@ export default {
     hash: String,
     ptr: String,
     keyhash: String,
+    mempool: Boolean,
   },
   components: {
     VueJsonPretty,
@@ -129,7 +141,11 @@ export default {
       const level = this.level && this.level > 0 ? this.level : "head";
 
       if (this.type === "operation") {
-        res = this.rpc.getOperation(this.network, level, this.hash);
+        if (this.mempool) {
+          console.log("mempool")
+        } else {
+          res = this.rpc.getOperation(this.network, level, this.hash);
+        }
       } else if (this.type === "big_map") {
         res = this.rpc.getBigMapValue(
           this.network,
diff --git a/src/views/contract/OperationsTab.vue b/src/views/contract/OperationsTab.vue
index cfd1e00d..f2541948 100644
--- a/src/views/contract/OperationsTab.vue
+++ b/src/views/contract/OperationsTab.vue
@@ -4,7 +4,16 @@
       <v-col cols="3">
         <v-select
           v-model="status"
-          :items="['applied', 'failed', 'backtracked', 'skipped', 'pending', 'lost', 'refused', 'branch_refused']"
+          :items="[
+            'applied',
+            'failed',
+            'backtracked',
+            'skipped',
+            'pending',
+            'lost',
+            'refused',
+            'branch_refused',
+          ]"
           chips
           small-chips
           filled
@@ -16,12 +25,11 @@
         >
           <template v-slot:selection="{ item, index }">
             <v-chip x-small v-if="index < 1">
-              <span>{{ item }}</span>
-            </v-chip>&nbsp;
-            <span
-              v-if="index === 1 "
-              class="grey--text caption"
-            >+{{ status.length - 1 }} others</span>
+              <span>{{ item }}</span> </v-chip
+            >&nbsp;
+            <span v-if="index === 1" class="grey--text caption"
+              >+{{ status.length - 1 }} others</span
+            >
           </template>
         </v-select>
       </v-col>
@@ -40,12 +48,11 @@
         >
           <template v-slot:selection="{ index }">
             <v-chip x-small v-if="index < 1">
-              <span>{{ shortestEntrypoint }}</span>
-            </v-chip>&nbsp;
-            <span
-              v-if="index === 1 "
-              class="grey--text caption"
-            >+{{ entrypoints.length - 1 }} others</span>
+              <span>{{ shortestEntrypoint }}</span> </v-chip
+            >&nbsp;
+            <span v-if="index === 1" class="grey--text caption"
+              >+{{ entrypoints.length - 1 }} others</span
+            >
           </template>
         </v-select>
       </v-col>
@@ -74,8 +81,12 @@
           </template>
           <v-date-picker v-model="datesBuf" scrollable range show-current>
             <v-spacer></v-spacer>
-            <v-btn text color="primary" @click="datesModal = false">Cancel</v-btn>
-            <v-btn text color="primary" @click="$refs.menu.save(datesBuf)">OK</v-btn>
+            <v-btn text color="primary" @click="datesModal = false"
+              >Cancel</v-btn
+            >
+            <v-btn text color="primary" @click="$refs.menu.save(datesBuf)"
+              >OK</v-btn
+            >
           </v-date-picker>
         </v-menu>
       </v-col>
@@ -89,25 +100,34 @@
     <v-row>
       <v-col>
         <v-skeleton-loader
-          v-if="loading && items.length === 0"
           :loading="loading"
           type="list-item-two-line, list-item-two-line, list-item-two-line"
-        />
-        <EmptyState
-          v-if="!loading && items.length === 0"
-          icon="mdi-code-brackets"
-          title="Nothing found"
-          text="Empty set is also a result, otherwise try a broader query"
-        />
-        <v-expansion-panels v-if="items.length > 0" multiple hover flat class="bb-1">
-          <ContentItem
-            :data="item"
-            :address="address"
-            v-for="(item, key) in items"
-            :key="item.hash + '_' + item.counter + '_' + key"
+        >
+          <EmptyState
+            v-if="items.length === 0"
+            icon="mdi-code-brackets"
+            title="Nothing found"
+            text="Empty set is also a result, otherwise try a broader query"
           />
-        </v-expansion-panels>
-        <span v-intersect="onDownloadPage" v-if="!loading && !downloaded"></span>
+          <v-expansion-panels
+            v-else
+            multiple
+            hover
+            flat
+            class="bb-1"
+          >
+            <ContentItem
+              :data="item"
+              :address="address"
+              v-for="(item, key) in items"
+              :key="item.hash + '_' + item.counter + '_' + key"
+            />
+          </v-expansion-panels>
+          <span
+            v-intersect="onDownloadPage"
+            v-if="!loading && !downloaded"
+          ></span>
+        </v-skeleton-loader>
       </v-col>
     </v-row>
   </v-container>
@@ -149,10 +169,11 @@ export default {
   },
   computed: {
     loading() {
-      return this.operationsLoading || this.mempoolLoading;
+      return (this.operationsLoading || this.mempoolLoading) && this.items.length === 0;
     },
     items() {
       let operations = [];
+      if (this.operations.length === 0) return [];
       if (this.last_id !== null) operations = this.operations;
 
       if (this.config.MEMPOOL_ENABLED) {
@@ -186,7 +207,7 @@ export default {
     },
     isContract() {
       return this.address.startsWith("KT");
-    }
+    },
   },
   methods: {
     ...mapActions(["showError"]),