From f0edb03105ffc7a18f6a3b4dda58f311a3a2c0d3 Mon Sep 17 00:00:00 2001
From: Henk Verlinde <henk@ventizo.com>
Date: Thu, 20 Jan 2022 15:37:15 +0100
Subject: [PATCH] feat: add auto collapsibile multi level section menu

---
 config/_default/params.toml             | 11 ++++-
 layouts/partials/sidebar/docs-menu.html | 66 ++++++++++++++++++++++++-
 2 files changed, 74 insertions(+), 3 deletions(-)

diff --git a/config/_default/params.toml b/config/_default/params.toml
index dcbc7bd..d1708ca 100644
--- a/config/_default/params.toml
+++ b/config/_default/params.toml
@@ -74,6 +74,10 @@ docsRepoBranch = "master"
 editPage = false
 lastMod = false
 
+
+mainSections = ["docs"]
+
+
 [options]
   lazySizes = true
   clipBoard = true
@@ -84,6 +88,11 @@ lastMod = false
   breadCrumb = true
   highLight = true
   kaTex = false
-  collapsibleSidebar = true
   multilingualMode = false
   docsVersioning = false
+
+[menu]
+
+  [menu.section]
+    auto = false
+    collapsibleSidebar = false
diff --git a/layouts/partials/sidebar/docs-menu.html b/layouts/partials/sidebar/docs-menu.html
index 316de10..2d73be4 100644
--- a/layouts/partials/sidebar/docs-menu.html
+++ b/layouts/partials/sidebar/docs-menu.html
@@ -1,4 +1,65 @@
-{{ if .Site.Params.options.collapsibleSidebar -}}
+{{ if and .Site.Params.menu.section.auto .Site.Params.menu.section.collapsibleSidebar -}}
+  <!-- Auto collapsibile section menu, multi level -->
+  <ul class="list-unstyled collapsible-sidebar">
+    {{ $currentPage := . -}}
+    {{ range (where .Site.Sections "Type" "in" site.Params.mainSections) }}
+      {{ range .Sections.Reverse }}
+        {{ $active := in $currentPage.RelPermalink .RelPermalink }}
+        <li class="mb-1">
+          <button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ md5 .Title }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
+            {{ .Title }}
+          </button>
+          <div class="collapse{{ if $active }} show{{ end }}" id="section-{{ md5 .Title }}">
+            <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
+              {{ range .Pages }}
+                {{ if .IsNode }}
+                  {{ $active := in $currentPage.RelPermalink .RelPermalink }}
+                  <li class="my-1 ms-3">
+                    <button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ md5 .Title }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
+                      {{ .Title }}
+                    </button>
+                    <div class="collapse{{ if $active }} show{{ end }}" id="section-{{ md5 .Title }}">
+                      <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
+                        {{ range .Pages }}
+                          {{ if .IsNode }}
+                            {{ $active := in $currentPage.RelPermalink .RelPermalink }}
+                            <li class="my-1 ms-3">
+                              <button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ md5 .Title }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
+                                {{ .Title }}
+                              </button>
+                              <div class="collapse{{ if $active }} show{{ end }}" id="section-{{ md5 .Title }}">
+                                <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
+                                  {{ range .Pages }}
+                                    {{ $active := in $currentPage.RelPermalink .RelPermalink }}
+                                    <li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .Permalink }}">{{ .Title }}</a></li>
+                                  {{ end }}
+                                </ul>
+                              </div>
+                            </li>
+                          {{ else }}
+                            {{ $active := in $currentPage.RelPermalink .RelPermalink }}
+                            <li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .Permalink }}">{{ .Title }}</a></li>
+                          {{ end }}
+                        {{ end }}
+                      </ul>
+                    </div>
+                  </li>
+                {{ else }}
+                  {{ $active := in $currentPage.RelPermalink .RelPermalink }}
+                  <li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .Permalink }}">{{ .Title }}</a></li>
+                {{ end }}
+              {{ end }}
+            </ul>
+          </div>
+        </li>
+      {{ end }}
+    {{ end }}
+  </ul>
+{{ else if and .Site.Params.menu.section.auto (not .Site.Params.menu.section.collapsibleSidebar) -}}
+  <!-- Auto default section menu, single level -->
+
+{{ else if and (not .Site.Params.menu.section.auto) .Site.Params.menu.section.collapsibleSidebar -}}
+  <!-- Manual collapsibile section menu, multi level -->
   <ul class="list-unstyled collapsible-sidebar">
     {{ $currentPage := . -}}
     {{ range $index, $element := .Site.Menus.docs -}}
@@ -60,7 +121,8 @@
       </li>
     {{ end -}}
   </ul>
-{{ else -}}
+{{ else if and (not .Site.Params.menu.section.auto) (not .Site.Params.menu.section.collapsibleSidebar) -}}
+  <!-- Manual default section menu, single level -->
   {{ $currentPage := . -}}
   {{ range .Site.Menus.docs -}}
     <h3 class="h6 text-uppercase">{{ .Name }}</h3>