IV: add support for hashtag pages

src/renderer/helpers/api/invidious.js

@@ -290,3 +290,15 @@ export function filterInvidiousFormats(formats, allowAv1 = false) {
   // }
   return [...audioFormats, ...h264Formats]
 }
+
+export async function getHashtagInvidious(hashtag, page) {
+  const payload = {
+    resource: 'hashtag',
+    id: hashtag,
+    params: {
+      page
+    }
+  }
+  const response = await invidiousAPICall(payload)
+  return response.results
+}

src/renderer/views/Hashtag/Hashtag.js

@@ -6,6 +6,7 @@ import FtLoader from '../../components/ft-loader/ft-loader.vue'
 import packageDetails from '../../../../package.json'
 import { getHashtagLocal, parseLocalListVideo } from '../../helpers/api/local'
 import { isNullOrEmpty } from '../../helpers/utils'
+import { getHashtagInvidious } from '../../helpers/api/invidious'
 
 export default defineComponent({
   name: 'Hashtag',
@@ -21,6 +22,7 @@ export default defineComponent({
       hashtagContinuationData: null,
       videos: [],
       apiUsed: 'local',
+      pageNumber: 1,
       isLoading: true
     }
   },
@@ -34,7 +36,7 @@ export default defineComponent({
     },
 
     showFetchMoreButton() {
-      return !isNullOrEmpty(this.hashtagContinuationData)
+      return !isNullOrEmpty(this.hashtagContinuationData) || this.apiUsed === 'invidious'
     }
   },
   watch: {
@@ -44,6 +46,7 @@ export default defineComponent({
       this.hashtagContinuationData = null
       this.videos = []
       this.apiUsed = 'local'
+      this.pageNumber = 1
       this.getHashtag()
     }
   },
@@ -57,14 +60,18 @@ export default defineComponent({
       if (this.backendFallback || this.backendPreference === 'local') {
         await this.getLocalHashtag(hashtag)
       } else {
-        this.getInvidiousHashtag(hashtag)
+        await this.getInvidiousHashtag(hashtag)
       }
       document.title = `${this.hashtag} - ${packageDetails.productName}`
     },
-    getInvidiousHashtag: function(hashtag) {
+
+    getInvidiousHashtag: async function(hashtag, page) {
+      const videos = await getHashtagInvidious(hashtag, page)
       this.hashtag = '#' + hashtag
-      this.apiUsed = 'Invidious'
       this.isLoading = false
+      this.apiUsed = 'invidious'
+      this.videos = this.videos.concat(videos)
+      this.pageNumber += 1
     },
 
     getLocalHashtag: async function(hashtag) {
@@ -94,6 +101,9 @@ export default defineComponent({
     handleFetchMore: function() {
       if (this.apiUsed === 'local') {
         this.getLocalHashtagMore()
+      } else if (this.apiUsed === 'invidious') {
+        console.error('inv more')
+        this.getInvidiousHashtag(this.hashtag.substring(1), this.pageNumber)
       }
     }
   }

src/renderer/views/Hashtag/Hashtag.vue

@@ -11,27 +11,18 @@
           class="elementList"
         >
           <ft-element-list
-            v-if="backendFallback || backendPreference === 'local' && videos.length > 0"
+            v-if="videos.length > 0"
             :data="videos"
           />
           <ft-flex-box
-            v-else-if="backendFallback || backendPreference === 'local' && videos.length === 0"
+            v-else-if="videos.length === 0"
           >
             <p
               class="message"
             >
               {{ $t("Hashtag.This hashtag does not currently have any videos") }}
             </p>
           </ft-flex-box>
-          <ft-flex-box
-            v-else
-          >
-            <p
-              class="message"
-            >
-              {{ $t("Hashtag.You can only view hashtag pages through the Local API") }}
-            </p>
-          </ft-flex-box>
         </div>
         <div
           v-if="showFetchMoreButton"

static/locales/en-US.yaml

@@ -879,7 +879,6 @@ Hashtag:
   Hashtag: Hashtag
   This hashtag does not currently have any videos: This hashtag does not currently
       have any videos
-  You can only view hashtag pages through the Local API: You can only view hashtag pages through the Local API
 Yes: Yes
 No: No
 Ok: Ok