From 57cb6cdad7c7531d2feb4dc38e48028ebb926c49 Mon Sep 17 00:00:00 2001
From: Yash Maheshwari <yash.maheshwari@hotwax.co>
Date: Thu, 17 Dec 2020 18:18:16 +0530
Subject: [PATCH 1/2] Improved: code to display the filter count on initial
 load (#554)

---
 pages/Category.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/pages/Category.vue b/pages/Category.vue
index 5b25e0a7..f1e716f0 100644
--- a/pages/Category.vue
+++ b/pages/Category.vue
@@ -449,6 +449,7 @@ export default {
       // Pure CSR, with no initial category state
       next(async vm => {
         vm.loading = true;
+        await composeInitialPageState(vm.$store, to, true);
         vm.$store.dispatch('category-next/cacheProducts', { route: to });
         vm.loading = false;
       });

From b854467035e669aa3979cf613fa47f435f0adbc8 Mon Sep 17 00:00:00 2001
From: Yash Maheshwari <yash.maheshwari@hotwax.co>
Date: Tue, 22 Dec 2020 15:58:47 +0530
Subject: [PATCH 2/2] Updated: code to move the subscribeAction logic to
 asyncData (#554)

---
 pages/Category.vue | 21 +++++++++++----------
 1 file changed, 11 insertions(+), 10 deletions(-)

diff --git a/pages/Category.vue b/pages/Category.vue
index f1e716f0..b413178a 100644
--- a/pages/Category.vue
+++ b/pages/Category.vue
@@ -223,6 +223,8 @@ import {
 
 const THEME_PAGE_SIZE = 12;
 const LAZY_LOADING_ACTIVATION_BREAKPOINT = 1024;
+var unsubscribeFromStoreAction = ''
+var aggs = ''
 
 const composeInitialPageState = async (store, route, forceLoad = false) => {
   try {
@@ -432,6 +434,11 @@ export default {
   async asyncData ({ store, route, context }) {
     // this is for SSR purposes to prefetch data - and it's always executed before parent component methods
     if (context) context.output.cacheTags.add('category')
+    unsubscribeFromStoreAction = store.subscribeAction(action => {
+      if (action.type === 'category-next/loadAvailableFiltersFrom') {
+        aggs = action.payload.aggregations;
+      }
+    });
     await composeInitialPageState(store, route);
   },
   async beforeRouteEnter (to, from, next) {
@@ -449,24 +456,18 @@ export default {
       // Pure CSR, with no initial category state
       next(async vm => {
         vm.loading = true;
-        await composeInitialPageState(vm.$store, to, true);
         vm.$store.dispatch('category-next/cacheProducts', { route: to });
         vm.loading = false;
       });
     }
   },
   mounted () {
-    this.unsubscribeFromStoreAction = this.$store.subscribeAction(action => {
-      if (action.type === 'category-next/loadAvailableFiltersFrom') {
-        this.aggregations = action.payload.aggregations;
-      }
-    });
     this.$bus.$on('product-after-list', this.initPagination);
     window.addEventListener('resize', this.getBrowserWidth);
     this.getBrowserWidth();
   },
   beforeDestroy () {
-    this.unsubscribeFromStoreAction();
+    unsubscribeFromStoreAction();
     this.$bus.$off('product-after-list', this.initPagination);
     window.removeEventListener('resize', this.getBrowserWidth);
   },
@@ -546,9 +547,9 @@ export default {
       return aggregations
         .reduce((result, aggregation) => {
           const bucket =
-            this.aggregations &&
-            this.aggregations[aggregation] &&
-            this.aggregations[aggregation].buckets.find(
+            aggs &&
+            aggs[aggregation] &&
+            aggs[aggregation].buckets.find(
               bucket => String(bucket.key) === String(filter.id)
             );