Merge pull request #691 from aeternity/feature/refactor-tips-pagination

TipsPagination: Combine data fetching, fetch simultaneously

src/components/TipsPagination.vue

@@ -27,11 +27,11 @@
 </template>
 
 <script>
+import { times } from 'lodash-es';
 import Loading from './Loading.vue';
 import Backend from '../utils/backend';
 import { MIDDLEWARE_URL } from '../config/constants';
 import TipRecord from './tipRecords/TipRecord.vue';
-import Util from '../utils/util';
 import { EventBus } from '../utils/eventBus';
 
 export default {
@@ -67,7 +67,7 @@ export default {
     },
   },
   async created() {
-    this.loadData();
+    await this.reloadData();
   },
   mounted() {
     const scrollHandler = () => {
@@ -81,9 +81,7 @@ export default {
     this.$on('hook:deactivated', () => window.removeEventListener('scroll', scrollHandler));
     this.$once('hook:destroyed', () => window.removeEventListener('scroll', scrollHandler));
 
-    EventBus.$on('reloadData', () => {
-      this.reloadData();
-    });
+    EventBus.$on('reloadData', () => this.reloadData());
 
     const interval = setInterval(() => this.reloadData(), 120 * 1000);
     this.$once('hook:destroyed', () => clearInterval(interval));
@@ -94,21 +92,15 @@ export default {
       this.endReached = false;
       this.page = 1;
       this.tips = null;
-      this.loadData();
+      await this.reloadData();
     },
-    async loadData() {
-      this.loadingTips = true;
-      this.tips = await Backend.getCacheTips(this.tipSortBy, this.page,
-        this.address, this.search, this.blacklist);
-      if (this.tips) {
-        this.loadingTips = false;
-      }
+    getCacheTips(page) {
+      return Backend.getCacheTips(this.tipSortBy, page, this.address, this.search, this.blacklist);
     },
     async loadMoreTips() {
       if (!this.endReached && !this.loadingMoreTips) {
         this.loadingMoreTips = true;
-        const tips = await Backend
-          .getCacheTips(this.tipSortBy, this.page + 1, this.address, this.search, this.blacklist);
+        const tips = await this.getCacheTips(this.page + 1);
         this.tips = this.tips.concat(tips);
         if (tips.length > 0) {
           this.page += 1;
@@ -120,10 +112,9 @@ export default {
     },
     async reloadData() {
       this.loadingTips = true;
-
-      this.tips = await Util.range(1, this.page)
-        .asyncMap(async (page) => Backend
-          .getCacheTips(this.tipSortBy, page, this.address, this.search, this.blacklist));
+      this.tips = (await Promise.all(
+        times(this.page, (page) => this.getCacheTips(page + 1)),
+      )).flat();
       this.loadingTips = false;
     },
     openExplorer(address) {

src/utils/util.js

@@ -30,24 +30,6 @@ export const wrapTry = async (promise) => {
   }
 };
 
-const range = (start, end) => (new Array(end - start + 1)).fill(undefined).map((_, i) => i + start);
-
-// eslint-disable-next-line no-extend-native, func-names
-Array.prototype.asyncMap = async function (asyncF) {
-  return this.reduce(async (promiseAcc, cur) => {
-    const acc = await promiseAcc;
-    const res = await asyncF(cur).catch((e) => {
-      console.error('asyncMap asyncF', e.message);
-      return null;
-    });
-    if (Array.isArray(res)) {
-      return acc.concat(res);
-    }
-    if (res) acc.push(res);
-    return acc;
-  }, Promise.resolve([]));
-};
-
 export const supportedBrowsers = [
   'chrome', 'firefox', 'opera', 'vivaldi', 'brave', 'edge-chromium',
 ];
@@ -122,7 +104,6 @@ export const getI18nPath = (index, page) => (isTitle(index, page)
 export default {
   atomsToAe,
   aeToAtoms,
-  range,
   wrapTry,
   currencySigns,
   createDeepLinkUrl,