From 0ae46197b6b2bc35bab294ecd55ff170e373e8b7 Mon Sep 17 00:00:00 2001
From: Badri Sunderarajan <badrihippo@gmail.com>
Date: Sun, 15 Mar 2020 09:42:46 +0530
Subject: [PATCH] Remove <noscript> tag that was causing HierarchyRequestError

Replaced it with a v-if logic to show or hide the element.
---
 src/main.js         | 2 +-
 src/pages/Index.vue | 7 +++----
 2 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/main.js b/src/main.js
index 21b1c2b..d2a31b7 100644
--- a/src/main.js
+++ b/src/main.js
@@ -3,7 +3,7 @@ import DefaultLayout from '~/layouts/Default.vue'
 import moment from "vue-moment"
 import InfiniteLoading from "vue-infinite-loading"
 
-export default Vue => {
+export default (Vue, {router, head, isClient}) => {
 	Vue.component('Layout', DefaultLayout)
 	Vue.use(moment)
 	Vue.use(InfiniteLoading)
diff --git a/src/pages/Index.vue b/src/pages/Index.vue
index 4662ea4..d3986ae 100644
--- a/src/pages/Index.vue
+++ b/src/pages/Index.vue
@@ -37,10 +37,7 @@
             </div>
           </infinite-loading>
         </ClientOnly>
-        <Pager v-if="!loadedPosts" :info="$page.posts.pageInfo" linkClass="button" style="height: 5rem; text-align:center;" />
-        <noscript>
-          <Pager :info="$page.posts.pageInfo" linkClass="button" style="height: 5rem; text-align:center;" />
-        </noscript>
+        <Pager v-if="!infiniteLoadingActivated" :info="$page.posts.pageInfo" linkClass="button" style="height: 5rem; text-align:center;" />
       </div>
     </main>
   </Layout>
@@ -114,10 +111,12 @@
     },
     created() {
       this.loadedPosts.push(...this.$page.posts.edges)
+      this.infiniteLoadingActivated = false
     },
     methods: {
       async infiniteHandler($state) {
         console.log('Fetching infinite.')
+        this.infiniteLoadingActivated = true
         if (this.currentPage + 1 > this.$page.posts.pageInfo.totalPages) {
           console.log('State complete.')
           $state.complete()