Add for-you view wiring

components/sidebar.html

@@ -40,14 +40,14 @@
           </button>
         </div>
         <nav class="sidebar-nav" aria-label="Primary">
-          <a href="#view=most-recent-videos" class="sidebar-nav-link" title="Recent">
+          <a href="#view=for-you" class="sidebar-nav-link" title="For You">
             <img
               src="assets/svg/recent-icon.svg"
               alt=""
               aria-hidden="true"
               class="sidebar-icon"
             />
-            <span class="sidebar-text">Recent</span>
+            <span class="sidebar-text">For You</span>
           </a>
           <a href="#view=explore" class="sidebar-nav-link" title="Explore">
             <img

js/viewManager.js

@@ -92,6 +92,20 @@ export const viewInitRegistry = {
       refreshApp.forceRefreshAllProfiles();
     }
   },
+  "for-you": () => {
+    const app = getApplication();
+    if (app && typeof app.loadVideos === "function") {
+      if (typeof app.mountVideoListView === "function") {
+        app.mountVideoListView();
+      }
+      app.loadVideos();
+    }
+    // Force profile updates after the new view is in place.
+    const refreshApp = getApplication();
+    if (refreshApp && typeof refreshApp.forceRefreshAllProfiles === "function") {
+      refreshApp.forceRefreshAllProfiles();
+    }
+  },
   explore: () => {
     devLogger.log("Explore view loaded.");
   },

views/for-you.html

@@ -0,0 +1,17 @@
+<!-- views/for-you.html -->
+<section data-ds="new">
+  <h2 class="mb-4 text-xl font-semibold text-text">For You</h2>
+
+  <div id="recentVideoTags" 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">
+        <span
+          class="status-spinner status-spinner--inline"
+          aria-hidden="true"
+        ></span>
+        <span class="sidebar-loading-text">Loading for you…</span>
+      </div>
+    </div>
+  </div>
+</section>