Merge branch 'develop' into dependencies

.eslintrc.js

@@ -13,7 +13,6 @@ module.exports = {
     },
   },
   rules: {
-    'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
     'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
     'vue/script-indent': ['error', 2, { baseIndent: 1 }],
     'max-len': 'off',

package-lock.json

@@ -13002,11 +13002,6 @@
       "resolved": "https://registry.npmjs.org/vue-analytics/-/vue-analytics-5.22.1.tgz",
       "integrity": "sha512-HPKQMN7gfcUqS5SxoO0VxqLRRSPkG1H1FqglsHccz6BatBatNtm/Vyy8brApktZxNCfnAkrSVDpxg3/FNDeOgQ=="
     },
-    "vue-async-computed": {
-      "version": "3.9.0",
-      "resolved": "https://registry.npmjs.org/vue-async-computed/-/vue-async-computed-3.9.0.tgz",
-      "integrity": "sha512-ac6m/9zxHHNGGKNOU1en8qNk+fAmEbJLuWL7qyQTFuH3vjv3V4urv//QHcVzCobROM6btnaDG2b+XYMncF/ETA=="
-    },
     "vue-cli-plugin-sitemap": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/vue-cli-plugin-sitemap/-/vue-cli-plugin-sitemap-2.3.0.tgz",

package.json

@@ -18,7 +18,6 @@
     "sass": "^1.26.11",
     "vue": "^2.6.12",
     "vue-analytics": "^5.22.1",
-    "vue-async-computed": "^3.9.0",
     "vue-markdown": "^2.2.4",
     "vue-material-design-icons": "^4.9.0",
     "vue-mq": "^1.0.1",

src/components/HomeDownloadBeta.vue

@@ -7,30 +7,54 @@
       :released="version.released"
       :github="version.github"
       :download="version.download" />
-    <spinner class="loading" v-if="versions === null" />
+    <spinner class="loading" v-if="loading" />
+    <home-download-load-more-button
+      v-if="moreLink !== null && !loading"
+      @click="loadMore"
+    />
   </div>
 </template>
 
 <script>
   import HomeDownloadBetaItem from './HomeDownloadBetaItem.vue';
+  import HomeDownloadLoadMoreButton from './HomeDownloadLoadMoreButton.vue';
   import Spinner from './Spinner.vue';
 
   export default {
     name: 'home-download-beta',
     components: {
       HomeDownloadBetaItem,
+      HomeDownloadLoadMoreButton,
       Spinner,
     },
-    asyncComputed: {
-      async versions() {
-        const response = await this.$http.get('https://api.github.com/repos/wulkanowy/wulkanowy/releases');
-        return response.body.map((release) => ({
+    data: () => ({
+      versions: [],
+      moreLink: 'https://api.github.com/repos/wulkanowy/wulkanowy/releases',
+      loading: false,
+    }),
+    async created() {
+      await this.loadMore();
+    },
+    methods: {
+      async loadMore() {
+        if (this.loading || this.moreLink === null) return;
+        this.loading = true;
+        try {
+          const response = await this.$http.get(this.moreLink);
+          this.versions.push(...response.body.map((release) => ({
             code: release.tag_name,
             released: release.published_at,
             github: release.html_url,
             download: release.assets.length === 0 ? release.html_url : release.assets[0].browser_download_url,
             id: release.id,
-        }));
+          })));
+          const nextLinkRegex = /<([^<>]+)>; ?rel="next"/;
+          const match = nextLinkRegex.exec(response.headers.get('link'));
+          this.moreLink = match === null ? null : match[1];
+        } catch (error) {
+          console.error(error);
+        }
+        this.loading = false;
       },
     },
   };

src/components/HomeDownloadDev.vue

@@ -20,7 +20,11 @@
       :user="version.user"
       :build="version.build"
       :commit="version.commit" />
-    <spinner class="loading" v-if="versions === null || master === null" />
+    <spinner class="loading" v-if="loading || master === null" />
+    <home-download-load-more-button
+      v-if="moreLink !== null && !loading"
+      @click="loadMore"
+    />
   </div>
 </template>
 
@@ -28,6 +32,7 @@
   import moment from 'moment';
   import HomeDownloadDevItem from './HomeDownloadDevItem.vue';
   import HomeDownloadDevMaster from './HomeDownloadDevMaster.vue';
+  import HomeDownloadLoadMoreButton from './HomeDownloadLoadMoreButton.vue';
   import Spinner from './Spinner.vue';
 
   export default {
@@ -35,13 +40,26 @@
     components: {
       HomeDownloadDevItem,
       HomeDownloadDevMaster,
+      HomeDownloadLoadMoreButton,
       Spinner,
     },
-    asyncComputed: {
-      async master() {
+    data: () => ({
+      master: null,
+      versions: [],
+      moreLink: 'https://api.github.com/repos/wulkanowy/wulkanowy/pulls?state=open',
+      loading: false,
+    }),
+    async created() {
+      await Promise.all([
+        this.loadMaster(),
+        this.loadMore(),
+      ]);
+    },
+    methods: {
+      async loadMaster() {
         const redirectorUrl = 'https://bitrise-redirector.herokuapp.com/v0.1/apps/daeff1893f3c8128/builds/develop/artifacts/0/info';
         const build = await this.$http.get(redirectorUrl);
-        return {
+        this.master = {
           released: build.body.finished_at,
           download: build.body.public_install_page_url,
           build: build.body.build_number,
@@ -49,9 +67,13 @@
           commitUrl: build.body.commit_view_url,
         };
       },
-      async versions() {
-        const response = await this.$http.get('https://api.github.com/repos/wulkanowy/wulkanowy/pulls?state=open');
-        return (await Promise.all(response.body.map(async (release) => {
+      async loadMore() {
+        if (this.loading || this.moreLink === null) return;
+        this.loading = true;
+        try {
+          const response = await this.$http.get(this.moreLink);
+          this.versions.push(
+            ...(await Promise.all(response.body.map(async (release) => {
               const redirectorUrl = `https://bitrise-redirector.herokuapp.com/v0.1/apps/daeff1893f3c8128/builds/${release.head.ref}/artifacts/0/info`;
               const build = await this.$http.get(redirectorUrl).catch((error) => error);
               return {
@@ -71,7 +93,15 @@
               if (moment(a.released).isBefore(b.released)) return 1;
               if (moment(a.released).isAfter(b.released)) return -1;
               return 0;
-        });
+            }),
+          );
+          const nextLinkRegex = /<([^<>]+)>; ?rel="next"/;
+          const match = nextLinkRegex.exec(response.headers.get('link'));
+          this.moreLink = match === null ? null : match[1];
+        } catch (error) {
+          console.error(error);
+        }
+        this.loading = false;
       },
     },
   };

src/components/HomeDownloadLoadMoreButton.vue

@@ -0,0 +1,35 @@
+<template>
+  <button
+    class="home-download-load-more-button"
+    @click="$emit('click', $event)"
+  >
+    Wczytaj więcej
+  </button>
+</template>
+
+<script>
+  export default {
+    name: 'home-download-load-more-button',
+  };
+</script>
+
+<style lang="scss">
+  .home-download-load-more-button {
+    width: 100%;
+    border: 1px solid;
+    color: #D32F2F;
+    box-sizing: border-box;
+    line-height: 48px;
+    font-size: 20px;
+    font-family: 'Roboto', sans-serif;
+    border-radius: 4px;
+    margin-top: 24px;
+    transition: background-color 300ms;
+    cursor: pointer;
+    background-color: transparent;
+
+    &:hover {
+      background-color: #D32F2F33;
+    }
+  }
+</style>

src/main.js

@@ -1,5 +1,4 @@
 import Vue from 'vue';
-import AsyncComputed from 'vue-async-computed';
 import VueResource from 'vue-resource';
 import VueMq from 'vue-mq';
 import VueAnalytics from 'vue-analytics';
@@ -7,7 +6,6 @@ import VueAnalytics from 'vue-analytics';
 import App from './App.vue';
 import router from './router';
 
-Vue.use(AsyncComputed);
 Vue.use(VueResource);
 Vue.use(VueMq, {
   breakpoints: {