From 5807f6913f0a07a36995422079c12a236177e939 Mon Sep 17 00:00:00 2001
From: Sridhar Ratnakumar <3998+srid@users.noreply.github.com>
Date: Wed, 27 Dec 2023 14:20:17 -0500
Subject: [PATCH] Folgezettel-aware sidebar + new configurable 'default' layout
 (#483)

- **BACKWARDS INCOMPATIBLE** A new HTML template layout "default" (unifies and) replaces both "book" and "note" layout.
  - Sidebar tree is now computed from the folgezettel graph, which is a superset of the folder hierarchy. The index page's tree inherits the same.
  - The semantics of `folder-folgezettel` is now applied in inverse (see docs)
---
 docs/guide/folgezettel.md                     | 41 ++++++++++
 docs/guide/html-template.md                   |  6 +-
 docs/guide/html-template/breadcrumbs.md       | 13 +++
 docs/guide/html-template/neuron-layout.md     | 32 ++++++--
 docs/guide/html-template/search.md            |  3 +-
 docs/guide/html-template/sidebar.md           | 12 ++-
 docs/guide/html-template/uptree.md            | 32 ++------
 docs/guide/markdown.md                        |  3 +
 emanote/CHANGELOG.md                          |  3 +
 emanote/default/index.yaml                    | 26 +++---
 emanote/default/templates/base.tpl            |  2 +-
 .../components/note-uptree-recurse.tpl        |  8 +-
 .../templates/components/sidebar-tree.tpl     | 46 ++++++-----
 .../default/templates/components/sidebar.tpl  |  2 +-
 emanote/default/templates/layouts/book.tpl    | 25 ------
 emanote/default/templates/layouts/default.tpl | 71 ++++++++++++++++
 emanote/default/templates/layouts/note.tpl    | 31 -------
 emanote/emanote.cabal                         |  3 +-
 emanote/src/Emanote.hs                        | 12 ++-
 emanote/src/Emanote/Model/Graph.hs            | 81 +++++++++++++++----
 emanote/src/Emanote/Model/Note.hs             |  6 +-
 emanote/src/Emanote/Model/Type.hs             | 15 ++--
 emanote/src/Emanote/View/Template.hs          | 36 ++++++---
 23 files changed, 336 insertions(+), 173 deletions(-)
 create mode 100644 docs/guide/folgezettel.md
 create mode 100644 docs/guide/html-template/breadcrumbs.md
 delete mode 100644 emanote/default/templates/layouts/book.tpl
 create mode 100644 emanote/default/templates/layouts/default.tpl
 delete mode 100644 emanote/default/templates/layouts/note.tpl

diff --git a/docs/guide/folgezettel.md b/docs/guide/folgezettel.md
new file mode 100644
index 000000000..536a3f982
--- /dev/null
+++ b/docs/guide/folgezettel.md
@@ -0,0 +1,41 @@
+---
+slug: folgezettel
+---
+
+# Folgezettel links
+
+Wikilinks can be of special type called a "folgezettel". They are created with a special variation of emanote link syntax.
+
+Conceptually, a [folgezettel](https://neuron.zettel.page/folgezettel-heterarchy) link can be thought of as an arrow from a parent note to a descendent note.
+
+## Syntax
+
+```markdown
+## A folgezettel link from another page to this one:
+
+Here is the #[[source-note]]
+
+## A folgezettel link from this page to another one:
+
+Here is the [[target-note]]#
+```
+
+{#folder}
+## Folder notes
+
+By default, Emanote includes any directories in your note's path as vertices in the folgezettel graph. This makes the folder note a folgezettel parent of the child note. The contents of a folder, likewise, become folgezetten children of the folder note. For eg., in `foo/bar/qux.md`, "foo" is a folgezettel parent of "bar", and "bar" is a folgezettel parent of "qux".
+
+>[!note]
+> The top-level root folder is not considered a folgezettel by default, unless you specify it (as shown below). This is to support the use-case of the user having a *flat list* of notes *without* subdirectories, but connected through [[folgezettel]].
+
+This behavior can be configured. To turn it off on a per-folder basis, set the corresponding flag in [[yaml-config|your configuration]] to `false` as shown here:
+
+```yaml
+emanote:
+  # Whether to automatically treat the contents of this 
+  # folder note as its folgezettel children
+  folder-folgezettel: false
+```
+
+>[!tip]
+> Put this configuration in `foo.md` if you want to disable folder folgezettel for just that folder `foo/`. Put it in `foo.yaml` if you want to disable it for `foo/` and all subfolders under it recursively. Put it in top-level `index.yaml` to disable it for all folders. See [[yaml-config]] for more details.
\ No newline at end of file
diff --git a/docs/guide/html-template.md b/docs/guide/html-template.md
index 5d8cb0022..4b1685885 100644
--- a/docs/guide/html-template.md
+++ b/docs/guide/html-template.md
@@ -4,12 +4,12 @@ Unlike [[neuron|Neuron]], Emanote's generated HTML can be **completely** customi
 
 The default HTML templates are stored in the [[layer|default layer]], which can you override either totally or in subset. 
 
-## Layouts
+## Default Layout
 
-Emanote includes two builtin layouts, called `book` (the default) and [[neuron-layout|`note`]], but you can also write your own HTML layout from scratch, as long as you specify that template in [[yaml-config]] for the notes in question. For eg., [`templates/home.tpl`](https://github.com/srid/srid/blob/master/content/templates/home.tpl) is how https://srid.ca homepage is generated, because its [`index.md`](https://raw.githubusercontent.com/srid/srid/master/index.md) specifies this template as `template.name` in its YAML frontmatter (which could also be `index.yaml`).
+Emanote includes a default layout that includes a [[sidebar]], but can be customized to mimic [[neuron-layout]]. You may also write your own HTML layout from scratch, as long as you specify that template in [[yaml-config]] for the notes in question. For eg., [`templates/home.tpl`](https://github.com/srid/srid/blob/master/templates/home.tpl) is how https://srid.ca homepage is generated, because its [`index.md`](https://raw.githubusercontent.com/srid/srid/master/index.md) specifies this template as `template.name` in its YAML frontmatter (which could also be `index.yaml`).
 
 ## Features
 
 ```query
 children:.
-```
\ No newline at end of file
+```
diff --git a/docs/guide/html-template/breadcrumbs.md b/docs/guide/html-template/breadcrumbs.md
new file mode 100644
index 000000000..074cf1845
--- /dev/null
+++ b/docs/guide/html-template/breadcrumbs.md
@@ -0,0 +1,13 @@
+---
+slug: breadcrumbs
+---
+
+
+# Breadcrumbs
+
+On mobile view, [breadcrumbs] are displayed at the top. The path of the crumbs is determined from the filesystem path of the associated source file. Breadcrumbs can be disabled in [[yaml-config]]; see [[neuron-layout]] for an example.
+
+>[!warning] Folgezettel
+> Breadcrumbs do not use [[folgezettel]].
+
+[breadcrumbs]: https://en.wikipedia.org/wiki/Breadcrumb_navigation
\ No newline at end of file
diff --git a/docs/guide/html-template/neuron-layout.md b/docs/guide/html-template/neuron-layout.md
index 1c836d7bb..3ca5881b4 100644
--- a/docs/guide/html-template/neuron-layout.md
+++ b/docs/guide/html-template/neuron-layout.md
@@ -1,18 +1,40 @@
 ---
 template:
-  name: /templates/layouts/note
+  uptree: 
+    enable: true
+  sidebar: 
+    enable: false
+  breadcrumbs: 
+    enable: false
+  base:
+    containerClass: container mx-auto max-w-prose
 ---
 
 # Neuron-like layout
 
-Emanote comes with two built-in [[html-template|HTML template]] layouts. The default layout is called "book", but you may select the "note" layout (which mimics [Neuron](https://neuron.zettel.page/)) by adding the following to your [[yaml-config|index.yaml]],
+Emanote's builtin [[html-template|HTML template]] layout can be configured to toggle UX features on or off. The default configuration includes [[sidebar]] and [[breadcrumbs]] but hides the [[uptree]]. To mimic the layout used by [Neuron](https://neuron.zettel.page/), turn off sidebar and breadcrumbs while enabling the uptree. Add this to your [[yaml-config]]:
 
 ```yml
 template:
-  name: /templates/layouts/note
+  uptree: 
+    enable: true
+  sidebar: 
+    enable: false
+  breadcrumbs: 
+    enable: false
+  base:
+    containerClass: container mx-auto max-w-prose
 ```
 
-The "note" layout includes the [[uptree]] of Neuron based on folgezettel links as well as directory layout. Note that all top-level notes are automatically made a folgezettel branch of the root note (index), such that the "home" link appears on top in the uplink tree of all notes. 
+This includes the [[uptree]] of Neuron based on folgezettel links as well as directory layout. Note that all top-level notes are automatically made a folgezettel branch of the root note (index), such that the "home" link appears on top in the uplink tree of all notes. 
 
 > [!tip] Demo
-> As a demo, the very page you are viewing is rendered using the "note" layout (whilst leaving the rest of the site to use the default "book" layout.)
+> As a demo, the very page you are viewing is rendered using this template configuration (whilst leaving the rest of the site to use the default configuration)
+
+## In lieu of sidebar
+
+In the absence of [[sidebar]], you may use the [[query|folgezettel children query]] to show the children of the current note. Example below:
+
+```query
+children:.
+```
\ No newline at end of file
diff --git a/docs/guide/html-template/search.md b/docs/guide/html-template/search.md
index f724863dd..16e4ca236 100644
--- a/docs/guide/html-template/search.md
+++ b/docs/guide/html-template/search.md
@@ -8,7 +8,8 @@ Emanote provides client-side full-text search using [Stork](https://stork-search
 You can trigger search input in one of the following ways:
 
 - Press `Ctrl+K` (or `⌘K` on macOS).
-- Click the lens icon on the sidebar (if using the 'book' [[html-template|template layout]]) or top-right corner (if using [[neuron-layout]]).
+- Click the lens icon on the sidebar 
+  - If the sidebar is disabled (eg.: you are on [[neuron-layout]]), the search lens icon will be on the top-right corner.
 
 ## Including frontmatter in the search index
 
diff --git a/docs/guide/html-template/sidebar.md b/docs/guide/html-template/sidebar.md
index e95a9802d..aa90615bb 100644
--- a/docs/guide/html-template/sidebar.md
+++ b/docs/guide/html-template/sidebar.md
@@ -1,9 +1,19 @@
 # Sidebar
 
-In [[html-template|the `book` template]], the sidebar is rendered on the left side. The sidebar tree is determined from the directory layout of the [[markdown|Markdown]] or [[orgmode|Org]] files.
+In [[html-template|the default template]], the sidebar is rendered on the left side. The sidebar tree is determined from [[folgezettel|folgezettel heterarchy]].
 
 - The sidebar tree is collapsed by default. But this can be disabled by setting `template.sidebar.collapsed` to `false` in [[yaml-config]]
 - The ordering of children in the tree is determined in the following order (this is also the order in which [[query]] results are rendered by default):
   1. if `template.sidebar.folders-first` is set to `true` (default `false`), directories are put before single notes, respecting the other order criteria. Otherwise, directories and notes will be interleaved.
   2. If the `order` [[yaml-config|frontmatter]] metadata exists, use that as the primary sort key.
   3. If the note has a H1 title, use that as the secondary sort key; otherwise, use the note filename as the secondary sort key.
+
+## Disabling the sidebar
+
+In [[yaml-config]],
+
+```yaml
+template:
+  sidebar:
+    enable: false
+```
\ No newline at end of file
diff --git a/docs/guide/html-template/uptree.md b/docs/guide/html-template/uptree.md
index 9105bb27e..f55a3dfba 100644
--- a/docs/guide/html-template/uptree.md
+++ b/docs/guide/html-template/uptree.md
@@ -1,34 +1,18 @@
 # Uplink tree
 
-The _uplink tree_ or "uptree"[^neuron] is a feature available in #[[neuron-layout|the `note` template]], which visualizes hierarchical relationships between notes as a graph at the top of the page.
+The _uplink tree_ or "uptree"[^neuron] is a feature available in #[[html-template]], which visualizes hierarchical relationships between notes as a graph at the top of the page.
 
 [^neuron]: This feature was inspired by an equivalent feature [from Neuron](https://neuron.zettel.page/uplink-tree).
 
-These relationships are called by _folgezettel links_ and created with a special variation of emanote link syntax.
+These relationships are called by [[folgezettel]].
 
-Conceptually, a [folgezettel](https://neuron.zettel.page/folgezettel-heterarchy) link can be thought of as an arrow from a parent note to a descendent note.
-
-## Syntax
-
-```markdown
-## A folgezettel link from another page to this one:
-
-Here is the #[[source-note]]
-
-## A folgezettel link from this page to another one:
-
-Here is the [[target-note]]#
-```
-
-## Folder nodes
-
-By default, Emanote also includes any directories in your note's path as vertices in the uptree graph.
-
-This behavior can be configured. To turn off the implicit folder nodes, set to `false` the corresponding flag in [[yaml-config|your configuration]] as shown here:
+To enable the uptree, add the following to your [[yaml-config]]:
 
 ```yaml
-emanote:
-  # Whether to automatically treat folder notes as a folgezettel parent of its contents
-  folder-folgezettel: false
+template:
+  sidebar:
+    enable: false
 ```
 
+>[!tip] See also 
+> #[[neuron-layout]].
diff --git a/docs/guide/markdown.md b/docs/guide/markdown.md
index e002dbd85..286b178e2 100644
--- a/docs/guide/markdown.md
+++ b/docs/guide/markdown.md
@@ -17,6 +17,9 @@ you can specify a custom title as `[[neuron|Moving off neuron]]` which renders a
 
 Broken links render differently, for example: [[Foo bar]] (if a wiki-link) or [Foo bar](foo-bar.md) (if a regular Markdown link).
 
+>[!tip] Folgezettel
+> See [[folgezettel]] for a special type of wiki-link used to define the [[sidebar]] (and [[uptree]]) heirarchy.
+
 ### Anchors 
 
 Wiki-links [do not yet](https://github.com/srid/emanote/discussions/105) support anchor links, but they work for regular links ([example link](./markdown.md#lists)).
diff --git a/emanote/CHANGELOG.md b/emanote/CHANGELOG.md
index 88156c023..900a4164c 100644
--- a/emanote/CHANGELOG.md
+++ b/emanote/CHANGELOG.md
@@ -6,6 +6,9 @@
   - Obsidian-style callouts ([\#466](https://github.com/srid/emanote/pull/466))
   - `emanote run --no-ws` option to disable WebSocket monitoring. This is useful for using Emanote to serve the HTML site directly on the internet, without needing to statically generate it.
   - Add query syntax for listing folgezetten children & parents ([\#476](https://github.com/srid/emanote/pull/476))
+  - **BACKWARDS INCOMPATIBLE** A new HTML template layout "default" (unifies and) replaces both "book" and "note" layout. ([\#483](https://github.com/srid/emanote/pull/483))
+    - Sidebar tree is now computed from the folgezettel graph, which is a superset of the folder hierarchy. The index page's tree inherits the same.
+    - The semantics of `folder-folgezettel` is now applied in inverse (see docs)
 
 ## 1.2.0.0 (2023-08-24)
 
diff --git a/emanote/default/index.yaml b/emanote/default/index.yaml
index 6585be5d4..f9f6f7b72 100644
--- a/emanote/default/index.yaml
+++ b/emanote/default/index.yaml
@@ -11,22 +11,18 @@ tags: []
 # TODO: How to design this when generating RSS feeds?
 template:
   # Which template to use to render notes. The filepath without the .tpl extension.
-  name: /templates/layouts/book
-  # Layout specific settings
-  layout:
-    # For base.tpl
-    base:
-      # The class to apply for <body> element when using base.tpl (used by note and book layouts)
-      bodyClass: bg-gray-400 overflow-y-scroll
-    note:
-      containerClass: container mx-auto max-w-prose
-    book:
-      containerClass: container mx-auto
+  name: /templates/layouts/default
+  # Base settings for our default layout.
+  base:
+    # The class to apply for <body> element when
+    bodyClass: bg-gray-400 overflow-y-scroll
+    containerClass: container mx-auto
   error:
     containerClass: container mx-auto max-w-prose
   uptree:
+    enable: false
     # Class to apply for uptree's nodes
-    nodeClass: text-gray-900
+    nodeClass: text-gray-900 hover:bg-${theme}-500 hover:text-white cursor-pointer
   # List of available colors: https://v2.tailwindcss.com/docs/customizing-colors#default-color-palette
   theme: blue
   # Value of the <base> tag.
@@ -35,11 +31,14 @@ template:
   urlStrategy: direct
   iconUrl: ${ema:homeUrl}favicon.svg
   sidebar:
+    enable: true
     # Whether this node in the sidebar tree should remain collapsed by default
     # (unless a route in it is active)
     collapsed: true
     # Weather this node should put folders before single notes
     folders-first: false
+  breadcrumbs:
+    enable: true
   stork:
     # https://stork-search.net/docs/config-ref#frontmatter_handling
     frontmatter-handling: omit
@@ -138,4 +137,5 @@ js:
 
 emanote:
   # Whether to automatically treat folder notes as a folgezettel parent of its contents
-  folder-folgezettel: true
+  # By default, all but top-level folders are treated as folgezettel parents.
+  # folder-folgezettel: true
diff --git a/emanote/default/templates/base.tpl b/emanote/default/templates/base.tpl
index 829ae0b71..08da8ba1a 100644
--- a/emanote/default/templates/base.tpl
+++ b/emanote/default/templates/base.tpl
@@ -128,7 +128,7 @@
 <!-- DoNotFormat -->
 <bind tag="theme"><ema:metadata><value var="template.theme" /></ema:metadata></bind>
 <bind tag="iconSize">w-4 h-4 flex-shrink-0</bind>
-<bind tag="bodyClass"><ema:metadata><value var="template.layout.base.bodyClass" /></ema:metadata></bind>
+<bind tag="bodyClass"><ema:metadata><value var="template.base.bodyClass" /></ema:metadata></bind>
 <!-- DoNotFormat -->
 
 <body class="${bodyClass}">
diff --git a/emanote/default/templates/components/note-uptree-recurse.tpl b/emanote/default/templates/components/note-uptree-recurse.tpl
index f9431ebbd..456190fc0 100644
--- a/emanote/default/templates/components/note-uptree-recurse.tpl
+++ b/emanote/default/templates/components/note-uptree-recurse.tpl
@@ -1,10 +1,10 @@
 <li>
 
-  <div class="${nodeClass} forest-link">
-    <a href="${node:url}">
+  <a href="${node:url}">
+    <div class="${nodeClass} forest-link">
       <node:text />
-    </a>
-  </div>
+    </div>
+  </a>
 
   <tree:open>
     <ul>
diff --git a/emanote/default/templates/components/sidebar-tree.tpl b/emanote/default/templates/components/sidebar-tree.tpl
index 8241616ae..230b19938 100644
--- a/emanote/default/templates/components/sidebar-tree.tpl
+++ b/emanote/default/templates/components/sidebar-tree.tpl
@@ -1,32 +1,30 @@
 <!-- Variable bindings for this tree-->
+<bind tag="link-class">hover:bg-${theme}-200</bind>
 <node:active>
-  <bind tag="link-class">font-bold text-${theme}-600 hover:underline</bind>
+  <bind tag="link-class">mavenLinkBold bg-${theme}-100 hover:bg-${theme}-200</bind>
   <else />
-  <tree:open>
-    <has-children>
-      <bind tag="link-class">font-bold hover:underline</bind>
-      <else />
-      <bind tag="link-class">hover:underline</bind>
-    </has-children>
-    <else />
-    <bind tag="link-class">hover:underline</bind>
-  </tree:open>
+  <node:activeTree>
+    <has-current-route>
+      <bind tag="link-class">mavenLinkBold hover:bg-${theme}-200</bind>
+    </has-current-route>
+  </node:activeTree>
 </node:active>
 
 <has-children>
   <bind tag="icon">
     <tree:open>
-      <svg xmlns="http://www.w3.org/2000/svg" class="${iconSize} inline text-gray-700"
-        viewBox="0 0 20 20" fill="currentColor">
+      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"
+        class="${iconSize} inline text-gray-700" fill="currentColor">
         <path fill-rule="evenodd"
-          d="M2 6a2 2 0 012-2h4l2 2h4a2 2 0 012 2v1H8a3 3 0 00-3 3v1.5a1.5 1.5 0 01-3 0V6z"
+          d="M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25Zm3 10.5a.75.75 0 0 0 0-1.5H9a.75.75 0 0 0 0 1.5h6Z"
           clip-rule="evenodd" />
-        <path d="M6 12a2 2 0 012-2h8a2 2 0 012 2v2a2 2 0 01-2 2H2h2a2 2 0 002-2v-2z" />
       </svg>
       <else />
       <svg xmlns="http://www.w3.org/2000/svg" class="${iconSize} inline text-gray-500"
-        viewBox="0 0 20 20" fill="currentColor">
-        <path d="M2 6a2 2 0 012-2h5l2 2h5a2 2 0 012 2v6a2 2 0 01-2 2H4a2 2 0 01-2-2V6z" />
+        viewBox="0 0 24 24" fill="currentColor">
+        <path fill-rule="evenodd"
+          d="M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25ZM12.75 9a.75.75 0 0 0-1.5 0v2.25H9a.75.75 0 0 0 0 1.5h2.25V15a.75.75 0 0 0 1.5 0v-2.25H15a.75.75 0 0 0 0-1.5h-2.25V9Z"
+          clip-rule="evenodd" />
       </svg>
     </tree:open>
   </bind>
@@ -54,8 +52,20 @@
 <div class="pl-2">
   <!-- Node's rootLabel-->
   <div class="flex items-center my-2 space-x-2 justify-left">
-    <icon />
-    <a class="${link-class} truncate" title="${node:text}" href="${node:url}">
+    <span>
+      <tree:open>
+        <icon />
+        <else />
+        <has-children>
+          <a href="${node:url}" title="View folgezettel children">
+            <icon />
+          </a>
+          <else />
+          <icon />
+        </has-children>
+      </tree:open>
+    </span>
+    <a class="${link-class} rounded px-1.5 truncate" title="${node:text}" href="${node:url}">
       <node:text />
     </a>
     <tree:open>
diff --git a/emanote/default/templates/components/sidebar.tpl b/emanote/default/templates/components/sidebar.tpl
index aeefc377c..1d14acd63 100644
--- a/emanote/default/templates/components/sidebar.tpl
+++ b/emanote/default/templates/components/sidebar.tpl
@@ -1,5 +1,5 @@
 <nav id="sidebar"
-  class="flex-shrink hidden leading-relaxed md:block md:sticky md:top-0 md:h-full md:w-48 xl:w-64">
+  class="flex-shrink hidden leading-relaxed md:block md:sticky md:top-0 md:h-screen md:overflow-y-auto md:w-48 xl:w-64">
   <div class="px-2 py-2 text-gray-800">
     <div id="indexing-links" class="flex flex-row float-right p-2 space-x-2 text-gray-500">
       <a href="${ema:tagIndexUrl}" title="View tags">
diff --git a/emanote/default/templates/layouts/book.tpl b/emanote/default/templates/layouts/book.tpl
deleted file mode 100644
index cc1927d5c..000000000
--- a/emanote/default/templates/layouts/book.tpl
+++ /dev/null
@@ -1,25 +0,0 @@
-<!-- DoNotFormat -->
-<bind tag="containerClass"><ema:metadata><value var="template.layout.book.containerClass" /></ema:metadata></bind>
-<!-- DoNotFormat -->
-
-<apply template="base">
-  <bind tag="head-main">
-  </bind>
-  <bind tag="body-main">
-    <div class="${containerClass}">
-      <div class="md:mt-8">
-        <apply template="components/breadcrumbs" />
-
-        <div id="container"
-          class="flex flex-nowrap flex-col md:flex-row bg-gray-50 md:shadow-2xl md:mb-8">
-          <!-- Sidebar column -->
-          <apply template="components/sidebar" />
-          <!-- Main body column -->
-          <apply template="components/body" />
-        </div>
-      </div>
-
-      <apply template="components/footer" />
-    </div>
-  </bind>
-</apply>
\ No newline at end of file
diff --git a/emanote/default/templates/layouts/default.tpl b/emanote/default/templates/layouts/default.tpl
new file mode 100644
index 000000000..3b82e239b
--- /dev/null
+++ b/emanote/default/templates/layouts/default.tpl
@@ -0,0 +1,71 @@
+<!-- DoNotFormat -->
+<bind tag="containerClass"><ema:metadata><value var="template.base.containerClass" /></ema:metadata> <ema:has:sidebar>md:mt-8 <else/>mt-2 <ema:has:uptree>md:mt-4 <else/> md:mt-8 </ema:has:uptree> </ema:has:sidebar></bind>
+<!-- DoNotFormat -->
+
+<bind tag="storkSearchButtonTopRight">
+  <div class="absolute -top-6 right-1 md:right-0 flex flex-row items-center justify-center">
+    <a title="Search (Ctrl+K)" class="cursor-pointer" onclick="window.emanote.stork.toggleSearch()">
+      <apply template="components/stork/stork-icon" />
+    </a>
+  </div>
+</bind>
+
+
+<apply template="base">
+  <bind tag="head-main">
+    <style>
+      /* For use in sidebar.tpl, as we cannot achieve this in tailwind itself! */
+      #sidebar:hover {
+        width: auto;
+      }
+
+      /* md:min-w-48  */
+      @media (min-width: 768px) {
+        #sidebar {
+          min-width: 12rem;
+        }
+      }
+
+      /* xl:min-w-64  */
+      @media (min-width: 1280px) {
+        #sidebar {
+          min-width: 16rem;
+        }
+      }
+    </style>
+
+    <ema:has:uptree>
+      <link rel="stylesheet" href="${ema:emanoteStaticLayerUrl}/inverted-tree.css" />
+    </ema:has:uptree>
+  </bind>
+
+  <bind tag="body-main">
+    <div class="${containerClass}">
+      <ema:has:uptree>
+        <apply template="components/note-uptree" />
+      </ema:has:uptree>
+
+      <ema:has:breadcrumbs>
+        <apply template="components/breadcrumbs" />
+      </ema:has:breadcrumbs>
+
+      <ema:has:sidebar>
+        <div id="container"
+          class="flex flex-nowrap flex-col md:flex-row bg-gray-50 md:shadow-2xl md:mb-8">
+          <!-- Sidebar column -->
+          <apply template="components/sidebar" />
+          <!-- Main body column -->
+          <apply template="components/body" />
+        </div>
+        <else />
+        <div id="container" class="relative md:shadow-2xl md:mb-8">
+          <storkSearchButtonTopRight />
+          <!-- Main body column -->
+          <apply template="components/body" />
+        </div>
+      </ema:has:sidebar>
+
+      <apply template="components/footer" />
+    </div>
+  </bind>
+</apply>
\ No newline at end of file
diff --git a/emanote/default/templates/layouts/note.tpl b/emanote/default/templates/layouts/note.tpl
deleted file mode 100644
index daa731447..000000000
--- a/emanote/default/templates/layouts/note.tpl
+++ /dev/null
@@ -1,31 +0,0 @@
-<!-- DoNotFormat -->
-<bind tag="containerClass"><ema:metadata><value var="template.layout.note.containerClass" /></ema:metadata></bind>
-<!-- DoNotFormat -->
-
-<bind tag="storkSearchButtonTopRight">
-  <div class="absolute -top-6 right-1 md:right-0 flex flex-row items-center justify-center">
-    <a title="Search (Ctrl+K)" class="cursor-pointer" onclick="window.emanote.stork.toggleSearch()">
-      <apply template="components/stork/stork-icon" />
-    </a>
-  </div>
-</bind>
-
-<apply template="base">
-  <bind tag="head-main">
-    <link rel="stylesheet" href="${ema:emanoteStaticLayerUrl}/inverted-tree.css" />
-  </bind>
-  <bind tag="body-main">
-    <div class="${containerClass}">
-      <div class="mt-2 md:mt-4">
-        <apply template="components/note-uptree" />
-
-        <div id="container" class="relative md:shadow-2xl md:mb-8">
-          <storkSearchButtonTopRight />
-          <apply template="components/body" />
-        </div>
-
-        <apply template="components/footer" />
-      </div>
-    </div>
-  </bind>
-</apply>
\ No newline at end of file
diff --git a/emanote/emanote.cabal b/emanote/emanote.cabal
index 06911a6b3..b08e0e5e3 100644
--- a/emanote/emanote.cabal
+++ b/emanote/emanote.cabal
@@ -1,6 +1,6 @@
 cabal-version:      2.4
 name:               emanote
-version:            1.2.2.1
+version:            1.3.0.0
 license:            AGPL-3.0-only
 copyright:          2022 Sridhar Ratnakumar
 maintainer:         srid@srid.ca
@@ -132,7 +132,6 @@ common library-common
     , pandoc-lua-engine
     , pandoc-types
     , parsec
-    , path-tree              >=0.2
     , process-extras
     , profunctors
     , relude                 >=1.0
diff --git a/emanote/src/Emanote.hs b/emanote/src/Emanote.hs
index f091ef4bf..ebbb80493 100644
--- a/emanote/src/Emanote.hs
+++ b/emanote/src/Emanote.hs
@@ -22,6 +22,7 @@ import Ema (
 import Ema.CLI qualified
 import Ema.Dynamic (Dynamic (Dynamic))
 import Emanote.CLI qualified as CLI
+import Emanote.Model.Graph qualified as G
 import Emanote.Model.Link.Rel (ResolvedRelTarget (..))
 import Emanote.Model.Type (modelCompileTailwind)
 import Emanote.Model.Type qualified as Model
@@ -51,9 +52,18 @@ instance IsRoute SiteRoute where
 
 instance EmaSite SiteRoute where
   type SiteArg SiteRoute = EmanoteConfig
-  siteInput = emanoteSiteInput
+  siteInput cliAct cfg = do
+    model <- emanoteSiteInput cliAct cfg
+    pure $ model <&> modelUpdateCachedFields
   siteOutput = View.emanoteSiteOutput
 
+-- | Populate model fields that needs to be computed once per update.
+modelUpdateCachedFields :: Model.ModelEma -> Model.ModelEma
+modelUpdateCachedFields model =
+  model
+    & Model.modelFolgezettelTree
+    .~ G.folgezettelTreesFrom (unModelEma model) (Model.modelIndexRoute model)
+
 defaultEmanoteConfig :: CLI.Cli -> EmanoteConfig
 defaultEmanoteConfig cli =
   EmanoteConfig cli id defaultEmanotePandocRenderers False
diff --git a/emanote/src/Emanote/Model/Graph.hs b/emanote/src/Emanote/Model/Graph.hs
index a78850d87..80650b1b8 100644
--- a/emanote/src/Emanote/Model/Graph.hs
+++ b/emanote/src/Emanote/Model/Graph.hs
@@ -11,7 +11,8 @@ import Emanote.Model.Link.Rel qualified as Rel
 import Emanote.Model.Link.Resolve qualified as Resolve
 import Emanote.Model.Meta (lookupRouteMeta)
 import Emanote.Model.Note qualified as MN
-import Emanote.Model.Type (Model, modelNotes, modelRels, parentLmlRoute)
+import Emanote.Model.Note qualified as N
+import Emanote.Model.Type (Model, modelIndexRoute, modelNotes, modelRels, parentLmlRoute)
 import Emanote.Route qualified as R
 import Optics.Operators as Lens ((^.))
 import Relude hiding (empty)
@@ -48,11 +49,12 @@ folgezettelParentsFor model r = do
           guard $ folderFolgezettelEnabledFor model r
           parentLmlRoute model r
       folgezettelParents =
-        mconcat
-          [ folgezettelBacklinks
-          , folgezettelFrontlinks
-          , folgezettelFolder
-          ]
+        ordNub
+          $ mconcat
+            [ folgezettelBacklinks
+            , folgezettelFrontlinks
+            , folgezettelFolder
+            ]
    in folgezettelParents
   where
     isFolgezettel = \case
@@ -76,17 +78,22 @@ folgezettelChildrenFor model r = do
           & mapMaybe (lookupNoteByWikiLink model <=< selectFolgezettel . (^. Rel.relTo))
       -- Folders are automatically made a folgezettel
       folgezettelFolderChildren :: [R.LMLRoute] =
-        maybeToMonoid $ do
-          let folderR :: R.R 'R.Folder = R.withLmlRoute coerce r
-              notes = Ix.toList $ (model ^. modelNotes) @= folderR
-              rs = filter (folderFolgezettelEnabledFor model) $ notes <&> (^. MN.noteRoute)
-          pure rs
+        if folderFolgezettelEnabledFor model r
+          then
+            let isIndexRoute = r == modelIndexRoute model
+                parentR :: Maybe (R.R 'R.Folder) = if isIndexRoute then Nothing else Just (R.withLmlRoute coerce r)
+                allowed route = not isIndexRoute || (route /= r) -- Exclude index.md from being a children of itself
+                notes = Ix.toList $ (model ^. modelNotes) @= parentR
+                rs = notes <&> (^. MN.noteRoute) & filter allowed
+             in rs
+          else []
       folgezettelChildren =
-        mconcat
-          [ folgezettelBacklinks
-          , folgezettelFrontlinks
-          , folgezettelFolderChildren
-          ]
+        ordNub
+          $ mconcat
+            [ folgezettelBacklinks
+            , folgezettelFrontlinks
+            , folgezettelFolderChildren
+            ]
    in folgezettelChildren
   where
     isReverseFolgezettel = \case
@@ -99,9 +106,49 @@ folgezettelChildrenFor model r = do
       Rel.URTWikiLink (WL.WikiLinkBranch, wl) -> Just wl
       _ -> Nothing
 
+{- | Returns a tree of all folgezettel notes, starting from the given route.
+
+If a note has two parents, that note will be positioned in *both* the sub-trees.
+
+Cycles are discarded.
+
+Returns the tree, while considering unvisited (disconnected) notes as sibling trees.
+
+`fromRoute` node itself is ignored fro the returned tree.
+-}
+folgezettelTreesFrom :: Model -> R.LMLRoute -> Forest R.LMLRoute
+folgezettelTreesFrom model fromRoute =
+  snd $ usingState (mempty :: Forest R.LMLRoute) $ do
+    let loop fromR rs = do
+          let (tree@(Node _ children), unvisited) = usingState rs $ go Set.empty fromR
+          if fromR == fromRoute
+            then modify (<> children) -- ignore `fromRoute` itself
+            else modify (<> one tree)
+          case nonEmpty (Set.toList unvisited) of
+            Nothing -> pass
+            Just ne -> loop (head ne) unvisited
+    loop fromRoute allRoutes
+  where
+    allRoutes = Set.fromList $ fmap N._noteRoute $ Ix.toList $ model ^. modelNotes
+    -- Run in a state monad of unvisited routes, taking visited routes as argument.
+    go :: (MonadState (Set R.LMLRoute) m) => Set R.LMLRoute -> R.LMLRoute -> m (Tree R.LMLRoute)
+    go visitedRoutes route
+      | route `Set.member` visitedRoutes = do
+          modify $ Set.delete route
+          pure $ Node route []
+      | otherwise = do
+          modify $ Set.delete route
+          let children = folgezettelChildrenFor model route
+          cs <- go (Set.insert route visitedRoutes) `traverse` children
+          pure $ Node route cs
+
 folderFolgezettelEnabledFor :: Model -> R.LMLRoute -> Bool
 folderFolgezettelEnabledFor model r =
-  lookupRouteMeta True ("emanote" :| ["folder-folgezettel"]) r model
+  lookupRouteMeta defaultValue ("emanote" :| ["folder-folgezettel"]) r model
+  where
+    -- We don't treat the top-level folder as folgezettel, to support the "flat
+    -- list of notes" use case (popularized by original neuron).
+    defaultValue = r /= modelIndexRoute model
 
 lookupNoteByWikiLink :: Model -> WL.WikiLink -> Maybe R.LMLRoute
 lookupNoteByWikiLink model wl = do
diff --git a/emanote/src/Emanote/Model/Note.hs b/emanote/src/Emanote/Model/Note.hs
index cc4ea9846..316e61216 100644
--- a/emanote/src/Emanote/Model/Note.hs
+++ b/emanote/src/Emanote/Model/Note.hs
@@ -72,7 +72,7 @@ type NoteIxs =
    , -- Ancestor folder routes
      RAncestor
    , -- Parent folder
-     R 'R.Folder
+     Maybe (R 'R.Folder)
    , -- Tag
      HT.Tag
    , -- Alias route for this note. Can be "foo" or "foo/bar".
@@ -89,7 +89,7 @@ instance Indexable NoteIxs Note where
       (ixFun $ one . noteHtmlRoute)
       (ixFun $ maybeToList . noteXmlRoute)
       (ixFun noteAncestors)
-      (ixFun $ maybeToList . noteParent)
+      (ixFun $ one . noteParent)
       (ixFun noteTags)
       (ixFun $ maybeToList . noteSlug)
 
@@ -113,7 +113,7 @@ noteParent = R.withLmlRoute R.routeParent . _noteRoute
 
 hasChildNotes :: R 'Folder -> IxNote -> Bool
 hasChildNotes r =
-  not . Ix.null . Ix.getEQ r
+  not . Ix.null . Ix.getEQ (Just r)
 
 noteTags :: Note -> [HT.Tag]
 noteTags =
diff --git a/emanote/src/Emanote/Model/Type.hs b/emanote/src/Emanote/Model/Type.hs
index da01cb667..95450a45e 100644
--- a/emanote/src/Emanote/Model/Type.hs
+++ b/emanote/src/Emanote/Model/Type.hs
@@ -11,8 +11,7 @@ import Data.IxSet.Typed ((@=))
 import Data.IxSet.Typed qualified as Ix
 import Data.Map.Strict qualified as Map
 import Data.Time (UTCTime)
-import Data.Tree (Tree)
-import Data.Tree.Path qualified as PathTree
+import Data.Tree (Forest)
 import Data.UUID (UUID)
 import Ema.CLI qualified
 import Emanote.Model.Link.Rel (IxRel)
@@ -40,7 +39,6 @@ import Emanote.Route qualified as R
 import Emanote.Route.SiteRoute.Type (SiteRoute)
 import Emanote.Source.Loc (Loc)
 import Heist.Extra.TemplateState (TemplateState)
-import Network.URI.Slug (Slug)
 import Optics.Core (Prism')
 import Optics.Operators ((%~), (.~), (^.))
 import Optics.TH (makeLenses)
@@ -64,10 +62,11 @@ data ModelT encF = Model
   , _modelSData :: IxSData
   , _modelStaticFiles :: IxStaticFile
   , _modelTasks :: IxTask
-  , _modelNav :: [Tree Slug]
   -- ^ A tree (forest) of all notes, based on their folder hierarchy.
   , _modelHeistTemplate :: TemplateState
   , _modelStorkIndex :: Stork.IndexVar
+  , _modelFolgezettelTree :: Forest R.LMLRoute
+  -- ^ Folgezettel tree computed once for each update to model.
   }
   deriving stock (Generic)
 
@@ -96,8 +95,8 @@ withRoutePrism enc Model {..} =
    in Model {..}
 
 emptyModel :: Set Loc -> Ema.CLI.Action -> EmanotePandocRenderers Model LMLRoute -> Bool -> UUID -> Stork.IndexVar -> ModelEma
-emptyModel layers act ren ctw instanceId =
-  Model Status_Loading layers act (Const ()) ren ctw instanceId Ix.empty Ix.empty Ix.empty Ix.empty mempty mempty def
+emptyModel layers act ren ctw instanceId storkVar =
+  Model Status_Loading layers act (Const ()) ren ctw instanceId Ix.empty Ix.empty Ix.empty Ix.empty mempty def storkVar mempty
 
 modelReadyForView :: ModelT f -> ModelT f
 modelReadyForView =
@@ -119,8 +118,6 @@ modelInsertNote note =
     %~ updateIxMulti r (Rel.noteRels note)
       >>> modelTasks
     %~ updateIxMulti r (Task.noteTasks note)
-      >>> modelNav
-    %~ PathTree.treeInsertPath (R.withLmlRoute R.unRoute r)
   where
     r = note ^. N.noteRoute
 
@@ -179,8 +176,6 @@ modelDeleteNote k model =
     %~ deleteIxMulti k
       & modelTasks
     %~ deleteIxMulti k
-      & modelNav
-    %~ maybe (PathTree.treeDeletePath (R.withLmlRoute R.unRoute k)) (const id) mFolderR
   where
     -- If the note being deleted is $folder.md *and* folder/ has .md files, this
     -- will be `Just folderRoute`.
diff --git a/emanote/src/Emanote/View/Template.hs b/emanote/src/Emanote/View/Template.hs
index 724111f50..8d5433f23 100644
--- a/emanote/src/Emanote/View/Template.hs
+++ b/emanote/src/Emanote/View/Template.hs
@@ -3,10 +3,10 @@ module Emanote.View.Template (emanoteSiteOutput, render) where
 import Control.Monad.Logger (MonadLoggerIO)
 import Data.Aeson.Types qualified as Aeson
 import Data.List (partition)
-import Data.List.NonEmpty qualified as NE
 import Data.Map.Syntax ((##))
+import Data.Set qualified as Set
 import Data.Text qualified as T
-import Data.Tree.Path qualified as PathTree
+import Data.Tree qualified as Tree
 import Ema qualified
 import Emanote.Model (Model, ModelEma)
 import Emanote.Model qualified as M
@@ -158,6 +158,9 @@ renderLmlHtml model note = do
                   "context:body" ##
                     C.withInlineCtx bctx $ \ctx' ->
                       Splices.pandocSplice ctx' ctxDoc
+    -- Template flags
+    forM_ ["uptree", "breadcrumbs", "sidebar"] $ \flag ->
+      "ema:has:" <> flag ## Heist.ifElseISplice (Meta.lookupRouteMeta @Bool False ("template" :| [flag, "enable"]) r model)
     -- Sidebar navigation
     routeTreeSplice ctx (Just r) model
     "ema:breadcrumbs" ##
@@ -195,20 +198,24 @@ renderLmlHtml model note = do
         $ \ctx' ->
           Splices.pandocSplice ctx' (note ^. MN.noteDoc)
 
--- | If there is no 'current route', all sub-trees are marked as active/open.
+{- | Heist splice for the sidebar tree.
+
+If there is no 'current route', all sub-trees are marked as active/open.
+-}
 routeTreeSplice ::
   (Monad n) =>
   C.TemplateRenderCtx n ->
+  -- | Current route
   Maybe R.LMLRoute ->
   Model ->
   H.Splices (HI.Splice Identity)
-routeTreeSplice tCtx mr model = do
+routeTreeSplice tCtx mCurrentRoute model = do
   "ema:route-tree" ##
-    ( let tree = PathTree.treeDeleteChild "index" $ model ^. M.modelNav
+    ( let trees = model ^. M.modelFolgezettelTree
           getFoldersFirst tr =
             Meta.lookupRouteMeta @Bool False ("template" :| ["sidebar", "folders-first"]) tr model
           getOrder path children =
-            let tr = mkLmlRoute path
+            let tr = last path
                 isLeaf = null children
                 priority = if getFoldersFirst tr && isLeaf then 1 else 0 :: Int
              in ( priority
@@ -217,25 +224,28 @@ routeTreeSplice tCtx mr model = do
                 )
           getCollapsed tr =
             Meta.lookupRouteMeta @Bool True ("template" :| ["sidebar", "collapsed"]) tr model
-          mkLmlRoute =
-            M.resolveLmlRoute model . R.mkRouteFromSlugs
-          lmlRouteSlugs = R.withLmlRoute R.unRoute
-       in Splices.treeSplice getOrder tree $ \(mkLmlRoute -> nodeRoute) children -> do
+       in Splices.treeSplice getOrder trees $ \(last -> nodeRoute) children -> do
             "node:text" ## C.titleSplice tCtx $ M.modelLookupTitle nodeRoute model
             "node:url" ## HI.textSplice $ SR.siteRouteUrl model $ SR.lmlSiteRoute (R.LMLView_Html, nodeRoute)
-            let isActiveNode = Just nodeRoute == mr
+            let isActiveNode = Just nodeRoute == mCurrentRoute
                 isActiveTree =
                   -- Active tree checking is applicable only when there is an
                   -- active route (i.e., mr is a Just)
-                  flip (maybe True) mr $ \r ->
-                    toList (lmlRouteSlugs nodeRoute) `NE.isPrefixOf` lmlRouteSlugs r
+                  flip (maybe True) mCurrentRoute $ \r ->
+                    -- FIXME: Performance! (exponential complexity)
+                    let folgeAnc = Set.fromList $ concatMap Tree.flatten $ G.modelFolgezettelAncestorTree model r
+                        isFolgeAnc = Set.member nodeRoute folgeAnc
+                     in r == nodeRoute || isFolgeAnc
                 openTree =
                   isActiveTree -- Active tree is always open
                     || not (getCollapsed nodeRoute)
             "node:active" ## Heist.ifElseISplice isActiveNode
+            "node:activeTree" ## Heist.ifElseISplice isActiveTree
             "node:terminal" ## Heist.ifElseISplice (null children)
             "tree:childrenCount" ## HI.textSplice (show $ length children)
             "tree:open" ## Heist.ifElseISplice openTree
+            "has-current-route" ## Heist.ifElseISplice (isJust mCurrentRoute)
+            -- TODO: Add one for indicating this is *an* ancestor of the current route
     )
 
 lookupTemplateName :: (ConvertUtf8 Text b) => Aeson.Value -> b