From 8ad39b5cf6bc46a60643c32ee8c4a0d5b7c34e53 Mon Sep 17 00:00:00 2001
From: thePR0M3TH3AN <53631862+PR0M3TH3AN@users.noreply.github.com>
Date: Mon, 6 Oct 2025 20:06:43 -0400
Subject: [PATCH] Default sidebar to collapsed state by default

---
 .../iframe_forms/iframe-application-form.html |  2 +-
 .../iframe_forms/iframe-bug-fix-form.html     |  2 +-
 .../iframe-content-appeals-form.html          |  2 +-
 .../iframe_forms/iframe-feedback-form.html    |  2 +-
 .../iframe_forms/iframe-request-form.html     |  2 +-
 components/sidebar.html                       | 12 ++++---
 config/asset-version.js                       |  2 +-
 index.html                                    | 30 ++++++++---------
 js/index.js                                   | 32 +++++++++++++++----
 9 files changed, 55 insertions(+), 31 deletions(-)

diff --git a/components/iframe_forms/iframe-application-form.html b/components/iframe_forms/iframe-application-form.html
index 00096a6d..380f40e2 100644
--- a/components/iframe_forms/iframe-application-form.html
+++ b/components/iframe_forms/iframe-application-form.html
@@ -4,7 +4,7 @@
     <meta charset="utf-8" />
     <title>bitvid Whitelist Application Form</title>
     <!-- Link to your main stylesheet -->
-    <link rel="stylesheet" href="../../css/style.css?v=2024.10.20" />
+    <link rel="stylesheet" href="../../css/style.css?v=2024.10.22" />
     <style>
       /* Override for form page to match modal field styling */
 
diff --git a/components/iframe_forms/iframe-bug-fix-form.html b/components/iframe_forms/iframe-bug-fix-form.html
index e7cc9159..deb20533 100644
--- a/components/iframe_forms/iframe-bug-fix-form.html
+++ b/components/iframe_forms/iframe-bug-fix-form.html
@@ -4,7 +4,7 @@
     <meta charset="utf-8" />
     <title>bitvid Bug Report Form</title>
     <!-- Link to your main stylesheet -->
-    <link rel="stylesheet" href="../../css/style.css?v=2024.10.20" />
+    <link rel="stylesheet" href="../../css/style.css?v=2024.10.22" />
     <style>
       /* Override for form page to match modal field styling */
 
diff --git a/components/iframe_forms/iframe-content-appeals-form.html b/components/iframe_forms/iframe-content-appeals-form.html
index 2ab87e78..0c36a83c 100644
--- a/components/iframe_forms/iframe-content-appeals-form.html
+++ b/components/iframe_forms/iframe-content-appeals-form.html
@@ -4,7 +4,7 @@
     <meta charset="utf-8" />
     <title>bitvid Content Appeals Form</title>
     <!-- Link to your main stylesheet -->
-    <link rel="stylesheet" href="../../css/style.css?v=2024.10.20" />
+    <link rel="stylesheet" href="../../css/style.css?v=2024.10.22" />
     <style>
       /* Override for form page to match modal field styling */
 
diff --git a/components/iframe_forms/iframe-feedback-form.html b/components/iframe_forms/iframe-feedback-form.html
index 694a09be..36805194 100644
--- a/components/iframe_forms/iframe-feedback-form.html
+++ b/components/iframe_forms/iframe-feedback-form.html
@@ -4,7 +4,7 @@
     <meta charset="utf-8" />
     <title>bitvid General Feedback Form</title>
     <!-- Link to your main stylesheet -->
-    <link rel="stylesheet" href="../../css/style.css?v=2024.10.20" />
+    <link rel="stylesheet" href="../../css/style.css?v=2024.10.22" />
     <style>
       /* Override for form page to match modal field styling */
 
diff --git a/components/iframe_forms/iframe-request-form.html b/components/iframe_forms/iframe-request-form.html
index 7235df4c..cdf3e6ae 100644
--- a/components/iframe_forms/iframe-request-form.html
+++ b/components/iframe_forms/iframe-request-form.html
@@ -4,7 +4,7 @@
     <meta charset="utf-8" />
     <title>bitvid Feature Request Form</title>
     <!-- Link to your main stylesheet -->
-    <link rel="stylesheet" href="../../css/style.css?v=2024.10.20" />
+    <link rel="stylesheet" href="../../css/style.css?v=2024.10.22" />
     <style>
       /* Override for form page to match modal field styling */
 
diff --git a/components/sidebar.html b/components/sidebar.html
index b8d847b8..c1200a34 100644
--- a/components/sidebar.html
+++ b/components/sidebar.html
@@ -3,7 +3,11 @@
   helper classes after the initial animation to avoid flashes each time we
   re-render navigation links.
 -->
-<aside id="sidebar" class="fade-in fade-in-delay-100" data-state="expanded">
+<aside
+  id="sidebar"
+  class="fade-in fade-in-delay-100 sidebar-collapsed"
+  data-state="collapsed"
+>
   <div class="sidebar__inner">
     <div class="sidebar-scroll">
       <!-- Primary navigation -->
@@ -14,9 +18,9 @@
             type="button"
             class="sidebar-collapse-toggle"
             aria-controls="sidebar"
-            aria-expanded="true"
-            aria-label="Collapse sidebar"
-            title="Collapse sidebar"
+            aria-expanded="false"
+            aria-label="Expand sidebar"
+            title="Expand sidebar"
           >
             <svg
               data-sidebar-chevron
diff --git a/config/asset-version.js b/config/asset-version.js
index 0929d166..05edddf3 100644
--- a/config/asset-version.js
+++ b/config/asset-version.js
@@ -1 +1 @@
-export const ASSET_VERSION = "2024.10.20";
+export const ASSET_VERSION = "2024.10.22";
diff --git a/index.html b/index.html
index 7fe0ad7a..924a971b 100644
--- a/index.html
+++ b/index.html
@@ -50,12 +50,12 @@
       so browsers pick up the latest sidebar markup and styling without
       hard-refreshing around CDN caches.
     -->
-    <script src="js/tracking.js?v=2024.10.20" defer></script>
-    <link href="css/tailwind.generated.css?v=2024.10.20" rel="stylesheet" />
-    <link href="css/style.css?v=2024.10.20" rel="stylesheet" />
-    <link href="css/markdown.css?v=2024.10.20" rel="stylesheet" />
+    <script src="js/tracking.js?v=2024.10.22" defer></script>
+    <link href="css/tailwind.generated.css?v=2024.10.22" rel="stylesheet" />
+    <link href="css/style.css?v=2024.10.22" rel="stylesheet" />
+    <link href="css/markdown.css?v=2024.10.22" rel="stylesheet" />
   </head>
-  <body>
+  <body class="sidebar-collapsed">
     <!--
       SIDEBAR CONTAINER:
       The <aside id="sidebar"> inside handles visibility.
@@ -211,16 +211,16 @@
 
     <!-- Additional Scripts -->
     <!-- Bootstraps nostr-tools before other modules rely on nostrToolsReady -->
-      <script type="module" src="js/nostrToolsBootstrap.js?v=2024.10.20"></script>
-      <script type="module" src="js/config.js?v=2024.10.20"></script>
-      <script type="module" src="js/lists.js?v=2024.10.20"></script>
-      <script type="module" src="js/accessControl.js?v=2024.10.20"></script>
-      <script type="module" src="js/webtorrent.js?v=2024.10.20"></script>
-      <script type="module" src="js/nostr.js?v=2024.10.20"></script>
-    <script type="module" src="js/viewManager.js?v=2024.10.20"></script>
-    <script type="module" src="js/bootstrap.js?v=2024.10.20"></script>
-    <script type="module" src="js/disclaimer.js?v=2024.10.20"></script>
-    <script type="module" src="js/index.js?v=2024.10.20"></script>
+      <script type="module" src="js/nostrToolsBootstrap.js?v=2024.10.22"></script>
+      <script type="module" src="js/config.js?v=2024.10.22"></script>
+      <script type="module" src="js/lists.js?v=2024.10.22"></script>
+      <script type="module" src="js/accessControl.js?v=2024.10.22"></script>
+      <script type="module" src="js/webtorrent.js?v=2024.10.22"></script>
+      <script type="module" src="js/nostr.js?v=2024.10.22"></script>
+    <script type="module" src="js/viewManager.js?v=2024.10.22"></script>
+    <script type="module" src="js/bootstrap.js?v=2024.10.22"></script>
+    <script type="module" src="js/disclaimer.js?v=2024.10.22"></script>
+    <script type="module" src="js/index.js?v=2024.10.22"></script>
     <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js"></script>
   </body>
diff --git a/js/index.js b/js/index.js
index ac5de0f5..b3d63d7b 100644
--- a/js/index.js
+++ b/js/index.js
@@ -189,14 +189,21 @@ async function bootstrapInterface() {
   const SIDEBAR_COLLAPSED_STORAGE_KEY = "sidebarCollapsed";
   const SIDEBAR_WIDTH_EXPANDED = "16rem";
   const SIDEBAR_WIDTH_COLLAPSED = "4rem";
-  let isSidebarCollapsed = false;
+  const DEFAULT_SIDEBAR_COLLAPSED = true;
+  let isSidebarCollapsed = DEFAULT_SIDEBAR_COLLAPSED;
+  let isFooterDropupExpanded = false;
+  let syncFooterDropupFn = null;
 
   const readStoredSidebarCollapsed = () => {
     try {
-      return localStorage.getItem(SIDEBAR_COLLAPSED_STORAGE_KEY) === "true";
+      const storedValue = localStorage.getItem(SIDEBAR_COLLAPSED_STORAGE_KEY);
+      if (storedValue === null) {
+        return DEFAULT_SIDEBAR_COLLAPSED;
+      }
+      return storedValue === "true";
     } catch (error) {
       console.warn("Unable to read sidebar collapse state from storage:", error);
-      return false;
+      return DEFAULT_SIDEBAR_COLLAPSED;
     }
   };
 
@@ -246,6 +253,14 @@ async function bootstrapInterface() {
       collapseToggle.setAttribute("aria-label", actionLabel);
       collapseToggle.setAttribute("title", actionLabel);
     }
+
+    if (
+      collapsed &&
+      isFooterDropupExpanded &&
+      typeof syncFooterDropupFn === "function"
+    ) {
+      syncFooterDropupFn(false);
+    }
   };
 
   const syncSidebarDensityToViewport = (isDesktopViewport) => {
@@ -362,7 +377,7 @@ async function bootstrapInterface() {
   if (footerDropdownButton && footerLinksContainer) {
     const sidebarFooter = footerDropdownButton.closest(".sidebar-footer");
 
-    const syncFooterDropup = (expanded) => {
+    syncFooterDropupFn = (expanded) => {
       const nextState = expanded ? "expanded" : "collapsed";
       const actionLabel = expanded ? "Show fewer sidebar links" : "Show more sidebar links";
 
@@ -390,6 +405,7 @@ async function bootstrapInterface() {
       if (sidebarFooter instanceof HTMLElement) {
         sidebarFooter.dataset.footerState = nextState;
       }
+      isFooterDropupExpanded = expanded;
     };
 
     footerDropdownButton.addEventListener("click", (event) => {
@@ -403,11 +419,15 @@ async function bootstrapInterface() {
         persistSidebarCollapsed(nextCollapsed);
       }
 
-      syncFooterDropup(!expanded);
+      if (typeof syncFooterDropupFn === "function") {
+        syncFooterDropupFn(!expanded);
+      }
     });
 
     const initialExpanded = footerDropdownButton.getAttribute("aria-expanded") === "true";
-    syncFooterDropup(initialExpanded);
+    if (typeof syncFooterDropupFn === "function") {
+      syncFooterDropupFn(initialExpanded);
+    }
   }
 
   try {