Add hashtag helper bar to Explore tab and refactor ID

- Add `#videoListTags` container to `views/explore.html` to support the hashtag helper bar in the Explore view.
- Rename `#recentVideoTags` to `#videoListTags` in `views/most-recent-videos.html` for consistency across views.
- Update `js/ui/videoListViewController.js` and `js/app.js` to reference the new generic `#videoListTags` ID.
- Update `tests/ui/video-list-view-popular-tags.test.mjs` to reflect the ID change.

This enables the hashtag aggregation and interaction features (filtering, muting, following) on the Explore tab, reusing the existing `VideoListView` logic.

js/app.js

@@ -2821,7 +2821,7 @@ class Application {
 
     let tagsRoot = null;
     if (includeTags) {
-      tagsRoot = document.getElementById("recentVideoTags");
+      tagsRoot = document.getElementById("videoListTags");
     }
     this.videoListPopularTags = tagsRoot || null;
     if (typeof this.videoListView.setPopularTagsContainer === "function") {
@@ -2870,7 +2870,7 @@ class Application {
         : "Refreshing videos…";
 
     this.videoList = isElement(container) ? container : null;
-    const tagsRoot = document.getElementById("recentVideoTags");
+    const tagsRoot = document.getElementById("videoListTags");
     this.videoListPopularTags = isElement(tagsRoot) ? tagsRoot : null;
     if (typeof this.videoListView.setPopularTagsContainer === "function") {
       this.videoListView.setPopularTagsContainer(this.videoListPopularTags);

js/ui/videoListViewController.js

@@ -33,7 +33,7 @@ export default class VideoListViewController {
     if (this.isElement(popularTagsContainer)) {
       popularTags = popularTagsContainer;
     } else if (includeTags) {
-      popularTags = this.getElementById("recentVideoTags");
+      popularTags = this.getElementById("videoListTags");
     }
 
     if (typeof view.setPopularTagsContainer === "function") {
@@ -87,7 +87,7 @@ export default class VideoListViewController {
     if (this.isElement(popularTagsContainer)) {
       tagsRoot = popularTagsContainer;
     } else {
-      tagsRoot = this.getElementById("recentVideoTags");
+      tagsRoot = this.getElementById("videoListTags");
     }
     if (typeof view.setPopularTagsContainer === "function") {
       view.setPopularTagsContainer(this.isElement(tagsRoot) ? tagsRoot : null);

tests/ui/video-list-view-popular-tags.test.mjs

@@ -6,11 +6,11 @@ import { VideoListView } from "../../js/ui/views/VideoListView.js";
 
 function createViewDom() {
   const dom = new JSDOM(
-    "<!DOCTYPE html><body><section><div id=\"recentVideoTags\" hidden></div><div id=\"videoList\"></div></section></body>"
+    "<!DOCTYPE html><body><section><div id=\"videoListTags\" hidden></div><div id=\"videoList\"></div></section></body>"
   );
   const { document } = dom.window;
   const listRoot = document.getElementById("videoList");
-  const tagsRoot = document.getElementById("recentVideoTags");
+  const tagsRoot = document.getElementById("videoListTags");
 
   // Mock IntersectionObserver for VideoCard (both on window and global for module access)
   const MockIntersectionObserver = class IntersectionObserver {

views/explore.html

@@ -25,6 +25,7 @@
       </svg>
     </button>
   </div>
+  <div id="videoListTags" class="mb-4" hidden></div>
   <div id="videoList" class="bv-grid-video">
     <div class="sidebar-loading-wrapper" role="status" aria-live="polite">
       <div class="sidebar-loading-indicator">

views/most-recent-videos.html

@@ -28,7 +28,7 @@
   </div>
 
   <!-- Video List -->
-  <div id="recentVideoTags" class="mb-4" hidden></div>
+  <div id="videoListTags" class="mb-4" hidden></div>
   <div id="videoList" class="bv-grid-video">
     <div class="sidebar-loading-wrapper" role="status" aria-live="polite">
       <div class="sidebar-loading-indicator">