Enable 'Explore' sidebar link for logged-in users

This change ensures the 'Explore' link is visible in the sidebar when the user is logged in, and hidden when logged out, consistent with other authenticated routes like 'For You' and 'Subscriptions'.

- Updated `js/app.js` to handle `exploreLink` visibility in `applyAuthenticatedUiState` and `applyLoggedOutUiState`.
- Initialized `exploreLink` property in `js/ui/applicationBootstrap.js`.
- Updated `tests/app/hydrate-sidebar-navigation.test.mjs` to verify the behavior.

js/app.js

@@ -4061,6 +4061,11 @@ class Application {
     if (forYouLink) {
       forYouLink.classList.remove("hidden");
     }
+
+    const exploreLink = this.resolveExploreLink();
+    if (exploreLink) {
+      exploreLink.classList.remove("hidden");
+    }
   }
 
   applyLoggedOutUiState() {
@@ -4100,6 +4105,11 @@ class Application {
     if (forYouLink) {
       forYouLink.classList.add("hidden");
     }
+
+    const exploreLink = this.resolveExploreLink();
+    if (exploreLink) {
+      exploreLink.classList.add("hidden");
+    }
   }
 
   syncAuthUiState() {
@@ -4171,10 +4181,29 @@ class Application {
     return null;
   }
 
+  resolveExploreLink() {
+    if (
+      this.exploreLink instanceof HTMLElement &&
+      this.exploreLink.isConnected
+    ) {
+      return this.exploreLink;
+    }
+
+    const linkCandidate = document.getElementById("exploreLink");
+    if (linkCandidate instanceof HTMLElement) {
+      this.exploreLink = linkCandidate;
+      return this.exploreLink;
+    }
+
+    this.exploreLink = null;
+    return null;
+  }
+
   hydrateSidebarNavigation() {
     const chromeElements = this.refreshChromeElements();
     this.resolveSubscriptionsLink();
     this.resolveForYouLink();
+    this.resolveExploreLink();
 
     if (this.appChromeController) {
       if (typeof this.appChromeController.setElements === "function") {

js/ui/applicationBootstrap.js

@@ -657,6 +657,7 @@ export default class ApplicationBootstrap {
 
     app.subscriptionsLink = null;
     app.forYouLink = null;
+    app.exploreLink = null;
 
     app.notificationPortal = doc?.getElementById("notificationPortal") || null;
     app.errorContainer = doc?.getElementById("errorContainer") || null;

tests/app/hydrate-sidebar-navigation.test.mjs

@@ -18,6 +18,7 @@ const VIEW_HTML = `<!DOCTYPE html>
     </div>
     <a id="subscriptionsLink" class="hidden"></a>
     <a id="forYouLink" class="hidden"></a>
+    <a id="exploreLink" class="hidden"></a>
   </body>
 </html>`;
 
@@ -46,6 +47,7 @@ test("hydrateSidebarNavigation reveals chrome controls for authenticated viewers
     app.userStatus = window.document.getElementById("userStatus");
     app.userPubKey = window.document.getElementById("userPubKey");
     app.subscriptionsLink = null;
+    app.exploreLink = null;
     app.isUserLoggedIn = () => true;
     app.log = () => {};
     app.showError = () => {};
@@ -60,6 +62,7 @@ test("hydrateSidebarNavigation reveals chrome controls for authenticated viewers
     const logoutButton = window.document.getElementById("logoutButton");
     const subscriptionsLink = window.document.getElementById("subscriptionsLink");
     const forYouLink = window.document.getElementById("forYouLink");
+    const exploreLink = window.document.getElementById("exploreLink");
     const closeLoginButton = window.document.getElementById("closeLoginModal");
 
     assert.equal(app.uploadButton, uploadButton);
@@ -77,6 +80,7 @@ test("hydrateSidebarNavigation reveals chrome controls for authenticated viewers
     assert.equal(logoutButton.classList.contains("hidden"), false);
     assert.equal(subscriptionsLink.classList.contains("hidden"), false);
     assert.equal(forYouLink.classList.contains("hidden"), false);
+    assert.equal(exploreLink.classList.contains("hidden"), false);
 
     assert.ok(app.appChromeController.receivedElements);
     assert.equal(
@@ -123,6 +127,7 @@ test("hydrateSidebarNavigation hides chrome controls for logged-out viewers", ()
     app.userStatus = window.document.getElementById("userStatus");
     app.userPubKey = window.document.getElementById("userPubKey");
     app.subscriptionsLink = null;
+    app.exploreLink = null;
     app.isUserLoggedIn = () => false;
     app.log = () => {};
     app.showError = () => {};
@@ -137,6 +142,7 @@ test("hydrateSidebarNavigation hides chrome controls for logged-out viewers", ()
     const logoutButton = window.document.getElementById("logoutButton");
     const subscriptionsLink = window.document.getElementById("subscriptionsLink");
     const forYouLink = window.document.getElementById("forYouLink");
+    const exploreLink = window.document.getElementById("exploreLink");
     const closeLoginButton = window.document.getElementById("closeLoginModal");
 
     assert.equal(app.uploadButton, uploadButton);
@@ -154,6 +160,7 @@ test("hydrateSidebarNavigation hides chrome controls for logged-out viewers", ()
     assert.equal(logoutButton.classList.contains("hidden"), true);
     assert.equal(subscriptionsLink.classList.contains("hidden"), true);
     assert.equal(forYouLink.classList.contains("hidden"), true);
+    assert.equal(exploreLink.classList.contains("hidden"), true);
 
     assert.ok(app.appChromeController.receivedElements);
     assert.equal(