From c94d45b8cc7829f84f9aead4520ccd6bcc83567c Mon Sep 17 00:00:00 2001
From: status-im-auto <auto@status.im>
Date: Mon, 22 Dec 2025 15:45:58 +0000
Subject: [PATCH] Update documentation

---
 build.json           | 10 ++++----
 custom.css           | 13 +++++++---
 scripts/rfc-index.js | 58 ++++++++++++++++++++++++++++++++++++--------
 3 files changed, 63 insertions(+), 18 deletions(-)

diff --git a/build.json b/build.json
index f1d7cee..b181dc8 100644
--- a/build.json
+++ b/build.json
@@ -1,15 +1,15 @@
 {
-    "timestamp": "2025-12-22T15:08:27Z",
+    "timestamp": "2025-12-22T15:45:56Z",
     "git": {
-        "commit": "d893a1085dc3b38ab2c833f9e97cc003e7f9037b",
+        "commit": "b417dd8e340fa9f0b4645af4f0efa673b8a1ffa1",
         "branch": "origin/develop",
         "url": "git@github.com:vacp2p/rfc-index.git"
     },
     "build": {
-        "id": "630",
-        "number": "630",
+        "id": "631",
+        "number": "631",
         "name": "website/dev-rfc.vac.dev",
         "slave": "linux-01",
-        "url": "https://ci.infra.status.im/job/website/job/dev-rfc.vac.dev/630/"
+        "url": "https://ci.infra.status.im/job/website/job/dev-rfc.vac.dev/631/"
     }
 }
\ No newline at end of file
diff --git a/custom.css b/custom.css
index 338f06e..e65aa96 100644
--- a/custom.css
+++ b/custom.css
@@ -307,7 +307,8 @@ main h1 {
     text-decoration: none;
 }
 
-.chapter-item > .chapter-link-wrapper > a {
+.chapter-item > .chapter-link-wrapper > a,
+.chapter-item > a {
     display: flex;
     align-items: center;
     gap: 0.4rem;
@@ -321,7 +322,8 @@ main h1 {
     transition: transform 0.15s ease;
 }
 
-.chapter-item:not(.collapsed) > a .section-toggle::before {
+.chapter-item:not(.collapsed) > a .section-toggle::before,
+.chapter-item:not(.collapsed) > .chapter-link-wrapper > a .section-toggle::before {
     transform: rotate(90deg);
 }
 
@@ -329,6 +331,11 @@ main h1 {
     display: none;
 }
 
-.chapter-item.collapsed > .chapter-link-wrapper > a .section-toggle::before {
+.chapter-item.collapsed + li.section-container > ol.section {
+    display: none;
+}
+
+.chapter-item.collapsed > .chapter-link-wrapper > a .section-toggle::before,
+.chapter-item.collapsed > a .section-toggle::before {
     transform: rotate(0deg);
 }
diff --git a/scripts/rfc-index.js b/scripts/rfc-index.js
index 4f49140..75c40c4 100644
--- a/scripts/rfc-index.js
+++ b/scripts/rfc-index.js
@@ -23,9 +23,17 @@
     menuTitle.dataset.linked = "true";
   }
 
-  document.addEventListener("DOMContentLoaded", linkMenuTitle);
+  function onReady(fn) {
+    if (document.readyState === "loading") {
+      document.addEventListener("DOMContentLoaded", fn, { once: true });
+    } else {
+      fn();
+    }
+  }
 
-  document.addEventListener("DOMContentLoaded", () => {
+  onReady(linkMenuTitle);
+
+  onReady(() => {
     const printLink = document.querySelector("a[href$='print.html']");
     if (!printLink) return;
     printLink.addEventListener("click", (event) => {
@@ -34,13 +42,31 @@
     });
   });
 
+  function getSectionInfo(item) {
+    const direct = item.querySelector(":scope > ol.section");
+    if (direct) {
+      return { section: direct, container: item, isSibling: false };
+    }
+
+    const sibling = item.nextElementSibling;
+    if (sibling && sibling.tagName === "LI") {
+      const siblingSection = sibling.querySelector(":scope > ol.section");
+      if (siblingSection) {
+        sibling.classList.add("section-container");
+        return { section: siblingSection, container: sibling, isSibling: true };
+      }
+    }
+
+    return null;
+  }
+
   function initSidebarCollapsible(root) {
     if (!root) return;
     const items = root.querySelectorAll("li.chapter-item");
     items.forEach((item) => {
-      const section = item.querySelector(":scope > ol.section");
-      const link = item.querySelector(":scope > .chapter-link-wrapper > a");
-      if (!section || !link) return;
+      const sectionInfo = getSectionInfo(item);
+      const link = item.querySelector(":scope > a, :scope > .chapter-link-wrapper > a");
+      if (!sectionInfo || !link) return;
 
       if (!link.querySelector(".section-toggle")) {
         const toggle = document.createElement("span");
@@ -55,15 +81,18 @@
         link.prepend(toggle);
       }
 
-      const hasActive = item.querySelector(".active");
-      if (!hasActive) {
-        item.classList.add("collapsed");
+      if (item.dataset.collapsibleInit !== "true") {
+        const hasActive = link.classList.contains("active");
+        const hasActiveInSection = !!sectionInfo.section.querySelector(".active");
+        item.classList.toggle("collapsed", !(hasActive || hasActiveInSection));
+        item.dataset.collapsibleInit = "true";
       }
     });
   }
 
   function bindSidebarCollapsible() {
-    const sidebar = document.querySelector("#mdbook-sidebar .sidebar-scrollbox");
+    const sidebar = document.querySelector("#mdbook-sidebar .sidebar-scrollbox")
+      || document.querySelector("#sidebar .sidebar-scrollbox");
     if (sidebar) {
       initSidebarCollapsible(sidebar);
     }
@@ -82,10 +111,19 @@
     }
   }
 
-  document.addEventListener("DOMContentLoaded", () => {
+  function observeSidebar() {
+    const target = document.querySelector("#mdbook-sidebar") || document.querySelector("#sidebar");
+    if (!target) return;
+    const observer = new MutationObserver(() => bindSidebarCollapsible());
+    observer.observe(target, { childList: true, subtree: true });
+    setTimeout(() => observer.disconnect(), 1500);
+  }
+
+  onReady(() => {
     bindSidebarCollapsible();
     // toc.js may inject the sidebar after load
     setTimeout(bindSidebarCollapsible, 100);
+    observeSidebar();
   });
 
   const searchInput = document.getElementById("rfc-search");