From f99d8e766f76d16e0bfa753759f5f6eceed5751f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mar=C3=ADa=20Gabald=C3=B3n=20Rico?= <mariag@stampery.co>
Date: Tue, 26 Oct 2021 10:05:34 +0200
Subject: [PATCH] fix: change fetch policy to network only

---
 packages/api/src/repository/Feed.ts    |  2 +-
 packages/ui/components/DataFeeds.vue   |  2 +-
 packages/ui/components/Main.vue        | 49 +++++++++++++-------------
 packages/ui/components/ThemeSwitch.vue |  4 +--
 4 files changed, 28 insertions(+), 29 deletions(-)

diff --git a/packages/api/src/repository/Feed.ts b/packages/api/src/repository/Feed.ts
index c31fee3f..54e86ac3 100644
--- a/packages/api/src/repository/Feed.ts
+++ b/packages/api/src/repository/Feed.ts
@@ -67,7 +67,7 @@ export class FeedRepository {
   }
 
   public getTotalCount (): Promise<number> {
-    return this.collection.count()
+    return this.collection.countDocuments()
   }
 
   private normalizeId (feed: FeedDbObject): FeedDbObjectNormalized | null {
diff --git a/packages/ui/components/DataFeeds.vue b/packages/ui/components/DataFeeds.vue
index 9f5f99c0..165475c5 100644
--- a/packages/ui/components/DataFeeds.vue
+++ b/packages/ui/components/DataFeeds.vue
@@ -36,7 +36,7 @@ export default {
       auto-fill,
       250px
     );
-  justify-items: center;
+  justify-content: center;
   align-items: center;
 }
 
diff --git a/packages/ui/components/Main.vue b/packages/ui/components/Main.vue
index ecc3e42a..e4fb51c0 100644
--- a/packages/ui/components/Main.vue
+++ b/packages/ui/components/Main.vue
@@ -1,14 +1,14 @@
 <template>
-  <div v-if="!$apollo.loading">
+  <div>
     <div class="section-header">
       <p class="section-title">{{ $t('main.data_feeds') }}</p>
-      <!-- <Select
+      <Select
         :options="options"
         :default-option="selected"
         @update-selected="updateSelected"
-      /> -->
+      />
     </div>
-    <div class="list-container">
+    <div v-if="feeds && feeds.total > 0" class="list-container">
       <DataFeeds :feeds="allFeeds" />
       <!-- <el-pagination
         v-if="numberOfPages > 1"
@@ -31,6 +31,7 @@ export default {
     feeds: {
       prefetch: true,
       query: feeds,
+      fetchPolicy: 'network-only',
       variables() {
         return {
           page: this.currentPage,
@@ -60,27 +61,25 @@ export default {
       return Math.ceil(this.feeds.total / this.itemsPerPage)
     },
     allFeeds() {
-      return this.feeds.feeds
-        .map((feed) => {
-          return {
-            detailsPath: {
-              name: 'feeds-id',
-              params: { id: feed.feedFullName },
-            },
-            decimals: parseInt(feed.feedFullName.split('_').pop()) || 3,
-            name: feed.name,
-            value: feed.lastResult,
-            label: feed.label,
-            img: {
-              name: formatSvgName(feed.name),
-              alt: feed.name,
-            },
-            network: feed.network,
-            color: feed.color,
-            blockExplorer: feed.blockExplorer,
-          }
-        })
-        .sort((a, b) => a.network < b.network)
+      return this.feeds.feeds.map((feed) => {
+        return {
+          detailsPath: {
+            name: 'feeds-id',
+            params: { id: feed.feedFullName },
+          },
+          decimals: parseInt(feed.feedFullName.split('_').pop()) || 3,
+          name: feed.name,
+          value: feed.lastResult,
+          label: feed.label,
+          img: {
+            name: formatSvgName(feed.name),
+            alt: feed.name,
+          },
+          network: feed.network,
+          color: feed.color,
+          blockExplorer: feed.blockExplorer,
+        }
+      })
     },
   },
   methods: {
diff --git a/packages/ui/components/ThemeSwitch.vue b/packages/ui/components/ThemeSwitch.vue
index 045ae4dd..7913763c 100644
--- a/packages/ui/components/ThemeSwitch.vue
+++ b/packages/ui/components/ThemeSwitch.vue
@@ -1,6 +1,6 @@
 <template>
-  <div class="icon-container">
-    <font-awesome-icon class="mode-icon" :icon="icon" @click="toggleMode" />
+  <div class="icon-container" @click="toggleMode">
+    <font-awesome-icon class="mode-icon" :icon="icon" />
   </div>
 </template>