From c3ec76947b091fe7e9f7b52b79f2a3bdf7069738 Mon Sep 17 00:00:00 2001
From: Miao ZhiCheng <miao@decentral.ee>
Date: Mon, 23 Dec 2019 23:52:41 +0200
Subject: [PATCH] fix #2 & #3 related to testnet support

---
 src/App.vue          |  3 +++
 src/views/Choose.vue | 21 ++++++++++++++-------
 2 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 5937bbc1..020b2fd7 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -46,6 +46,9 @@
             <v-alert type="warning" dismissible class="black--text" light>
               This website is for Multi-Collateral DAI. To redeem your SAI, visit <a href="rsai.rdai.money">rsai.rdai.money</a>
             </v-alert>
+            <v-alert type="error" dismissible class="black--text" light v-if="chainName!== 'Mainnet' && chainName !== 'Kovan'">
+              The {{ chainName }} Network is not supported. Please switch to Mainnet or Kovan
+            </v-alert>
             <v-tabs
               v-model="tab"
               light
diff --git a/src/views/Choose.vue b/src/views/Choose.vue
index 7aad40b5..98023088 100644
--- a/src/views/Choose.vue
+++ b/src/views/Choose.vue
@@ -138,7 +138,7 @@ export default {
     ...mapState(["allHats"]),
     ...mapGetters(["hasWeb3", "userHat", "rDAIdevs"]),
     allHatsLength() {
-      return this.allHats.length;
+      return this.allHats.length + 2;
     },
     listOfHatsLength() {
       return this.listOfHats.length;
@@ -191,6 +191,7 @@ export default {
         });
         this.listOfHats = list;
       } else this.listOfHats = featured;
+      return this.listOfHats.length;
     }
   },
   watch: {
@@ -200,12 +201,13 @@ export default {
     listOfHatsLength() {
       this.columns = [[], [], [], []];
       this.listOfHats.forEach((item, index) => {
-        if (item.hatID !== 2) {
-          if (item.hatID === this.userHat.hatID)
-            this.columns[index % this.numberOfColumns].unshift(item);
-          else this.columns[index % this.numberOfColumns].push(item);
-        }
+        if (item.hatID === this.userHat.hatID)
+          this.columns[index % this.numberOfColumns].unshift(item);
+        else this.columns[index % this.numberOfColumns].push(item);
       });
+    },
+    hasWeb3(){
+      this.loadAll();
     }
   },
   mounted() {
@@ -213,7 +215,12 @@ export default {
     if (this.$vuetify.breakpoint.smOnly) this.numberOfColumns = 2;
     if (this.$vuetify.breakpoint.mdOnly) this.numberOfColumns = 3;
     if (this.$vuetify.breakpoint.lgOnly) this.numberOfColumns = 4;
-    this.loadAll();
+    const length = this.loadAll();
+    if(length < this.numberOfColumns) {
+      console.log("length: ", length, " this.numberOfColumns: ", this.numberOfColumns);
+      this.numberOfColumns = length;
+      this.loadAll();
+    }
   }
 };
 </script>