Add API Fallback to Channel view, update dependencies and add Windows Portable build

.github/workflows/build.yml

@@ -106,6 +106,12 @@ jobs:
       with:
         name: freetube-vue-0.8.0-setup-x64.exe
         path: build/FreeTube-Vue Setup 0.8.0.exe
+    - name: Upload Windows Portable Artifact
+      uses: actions/upload-artifact@v2
+      if: startsWith(matrix.os, 'windows')
+      with:
+        name: freetube-vue-0.8.0-portable-x64.exe
+        path: build/FreeTube-Vue 0.8.0.exe
     - name: Upload Mac .dmg Artifact
       uses: actions/upload-artifact@v2
       if: startsWith(matrix.os, 'macos')

package.json

@@ -40,9 +40,9 @@
     "youtube-suggest": "^1.1.0",
     "yt-channel-info": "^1.0.1",
     "yt-xml2vtt": "^1.1.1",
-    "ytdl-core": "^3.1.2",
+    "ytdl-core": "^3.2.0",
-    "ytpl": "^0.2.0",
+    "ytpl": "^0.2.3",
-    "ytsr": "^0.1.16"
+    "ytsr": "^0.1.20"
   },
   "description": "A private YouTube client",
   "devDependencies": {
@@ -51,17 +51,17 @@
     "@babel/plugin-proposal-object-rest-spread": "^7.10.4",
     "@babel/preset-env": "^7.10.4",
     "@babel/preset-typescript": "^7.10.4",
-    "@typescript-eslint/eslint-plugin": "^3.7.0",
+    "@typescript-eslint/eslint-plugin": "^3.7.1",
-    "@typescript-eslint/parser": "^3.7.0",
+    "@typescript-eslint/parser": "^3.7.1",
     "acorn": "^7.3.1",
     "babel-eslint": "^10.1.0",
     "babel-loader": "^8.1.0",
     "copy-webpack-plugin": "^6.0.3",
-    "css-loader": "^3.6.0",
+    "css-loader": "^4.1.0",
     "devtron": "^1.4.0",
-    "electron": "^9.1.1",
+    "electron": "^9.1.2",
-    "electron-builder": "^22.7.0",
+    "electron-builder": "^22.8.0",
-    "electron-builder-squirrel-windows": "^22.8.0",
+    "electron-builder-squirrel-windows": "^22.8.1",
     "electron-debug": "^3.1.0",
     "electron-rebuild": "^1.11.0",
     "eslint": "^7.5.0",
@@ -79,7 +79,7 @@
     "jest": "^26.1.0",
     "mini-css-extract-plugin": "^0.9.0",
     "node-abi": "^2.18.0",
-    "node-loader": "^1.0.0",
+    "node-loader": "^1.0.1",
     "npm-run-all": "^4.1.5",
     "prettier": "^2.0.5",
     "sass": "^1.26.10",
@@ -93,7 +93,7 @@
     "vue-loader": "^15.9.3",
     "vue-style-loader": "^4.1.2",
     "vue-template-compiler": "^2.6.11",
-    "webpack": "^4.43.0",
+    "webpack": "^4.44.0",
     "webpack-cli": "^3.3.12",
     "webpack-dev-server": "^3.11.0"
   },

src/renderer/views/Channel/Channel.js

@@ -154,13 +154,11 @@ export default Vue.extend({
     } else {
       switch (this.backendPreference) {
         case 'local':
-          this.apiUsed = 'local'
           this.getChannelInfoLocal()
           this.getChannelVideosLocal()
           this.getPlaylistsLocal()
           break
         case 'invidious':
-          this.apiUsed = 'invidious'
           this.getChannelInfoInvidious()
           this.getPlaylistsInvidious()
           break
@@ -169,6 +167,7 @@ export default Vue.extend({
   },
   methods: {
     getChannelInfoLocal: function () {
+      this.apiUsed = 'local'
       ytch.getChannelInfo(this.id).then((response) => {
         this.id = response.authorId
         this.channelName = response.author
@@ -192,6 +191,13 @@ export default Vue.extend({
         this.isLoading = false
       }).catch((err) => {
         console.log(err)
+        if (this.backendPreference === 'local' && this.backendFallback) {
+          console.log('Falling back to Invidious API')
+          this.getChannelInfoInvidious()
+        } else {
+          this.isLoading = false
+          // TODO: Show toast with error message
+        }
       })
     },
 
@@ -203,6 +209,13 @@ export default Vue.extend({
         this.isElementListLoading = false
       }).catch((err) => {
         console.log(err)
+        if (this.backendPreference === 'local' && this.backendFallback) {
+          console.log('Falling back to Invidious API')
+          this.getChannelInfoInvidious()
+        } else {
+          this.isLoading = false
+          // TODO: Show toast with error message
+        }
       })
     },
 
@@ -217,6 +230,7 @@ export default Vue.extend({
 
     getChannelInfoInvidious: function () {
       this.isLoading = true
+      this.apiUsed = 'invidious'
 
       this.$store.dispatch('invidiousGetChannelInfo', this.id).then((response) => {
         console.log(response)
@@ -264,6 +278,13 @@ export default Vue.extend({
         this.isElementListLoading = false
       }).catch((err) => {
         console.log(err)
+        if (this.backendPreference === 'local' && this.backendFallback) {
+          console.log('Falling back to Invidious API')
+          this.getPlaylistsInvidious()
+        } else {
+          this.isLoading = false
+          // TODO: Show toast with error message
+        }
       })
     },
 
@@ -296,8 +317,15 @@ export default Vue.extend({
         this.playlistContinuationString = response.continuation
         this.latestPlaylists = this.latestPlaylists.concat(response.playlists)
         this.isElementListLoading = false
-      }).catch((error) => {
+      }).catch((err) => {
-        console.log(error)
+        console.log(err)
+        if (this.backendPreference === 'invidious' && this.backendFallback) {
+          console.log('Falling back to Local API')
+          this.getPlaylistsLocal()
+        } else {
+          this.isLoading = false
+          // TODO: Show toast with error message
+        }
       })
     },
 
@@ -370,6 +398,13 @@ export default Vue.extend({
           this.searchContinuationString = response.continuation
         }).catch((err) => {
           console.log(err)
+          if (this.backendPreference === 'local' && this.backendFallback) {
+            console.log('Falling back to Invidious API')
+            this.searchChannelInvidious()
+          } else {
+            this.isLoading = false
+            // TODO: Show toast with error message
+          }
         })
       } else {
         ytch.searchChannelMore(this.searchContinuationString).then((response) => {
@@ -397,6 +432,15 @@ export default Vue.extend({
         this.searchResults = this.searchResults.concat(response)
         this.isElementListLoading = false
         this.searchPage++
+      }).catch((err) => {
+        console.log(err)
+        if (this.backendPreference === 'invidious' && this.backendFallback) {
+          console.log('Falling back to Local API')
+          this.searchChannelLocal()
+        } else {
+          this.isLoading = false
+          // TODO: Show toast with error message
+        }
       })
     }
   }