Thoughts and Suggestions for 2.11's Navigation Tree

General
1

Hey team,

I had a few thoughts and suggestions for Nav Tree in SilverBullet 2.11. I’d love to build on these myself, but I’ve got limited time and limited development experience so I thought I’d share what I’ve noted here and if it’s anything useful, then heck yeah!

Firstly, the new Navigation Tree is awesome, looks and feels great to use. It feels true to what SilverBullet is and it works well. A few things of note for this:

  • I noticed on https://silverbullet.md/ that different items have different icons. How do we implement this in our own spaces? Is this done via Frontmatter?
  • In Firefox (I haven’t done much testing here), the scrollbar for the Nav Tree slightly obfuscates the Edit/Delete icons on the right of the list item, is it worth implementing a small margin on the right?
  • Currently, it doesn’t look like Context Menu’s work on the Nav Tree. It’d be great for workflow to be able to right-click > new window, or middle-click for a new tab.

Then, I had some feature suggestions for the Tree too, not sure what the best way to implement these would be:

  • Page priority:
    • A default priority could be modified via CONFIG
    • Per page priority could be set in Frontmatter
    • When rendering the Nav Tree, per directory, pages are listed in ascending priority before alphabetical.
  • Hide from Nav Tree:
    • Method for hiding a page/directory from the Nav Tree, possibly as a specific tag on the page.
    • Could be used for archival purposes
    • Hides from ‘Pages’ but not from ‘All’
  • Favourite Pages:
    • Could be specified with a tag on the page
    • Adds the page (not moves like the priority suggestion) to a ‘Favourites’ at the top of the Nav Tree
  • Collapse/Expand All toggle button:
    • In using the Nav Tree, occasionally I find myself ever so slightly lost, even if it’s only for a moment, being able to quickly collapse all the expanded directories then narrow in on what I’m after would be great.

All of this is just food for thought, hopefully these suggestions can be helpful in some way.

Thanks everyone, especially Zef, for making SilverBullet possible. It’s made a genuine improvement in how I organise my life and I appreciate all of you. Cheers!

2

The code for this is at Website :slight_smile: I can't answer your other points unfortunately but it might be worth raising a bug or feature request on GitHub.

3

Some things are already there: Page%20Decorations

4

I am simultaneously stoked that this is the case and also slightly embarrassed that I didn't find this before posting... :sweat_smile: I appreciate the patience and nudge in the right direction.

image
image177×422 8.93 KB

I am a very happy camper now, cheers!

5

I'll also add this in case anyone else also fails to read the docs like I did and stumbles across this thread instead.

To organise the pages like I have above, I've just added this to the top of the page ('Games' in this example):

---
tags: games
pageDecoration:
  icon: crosshair
  tree:
    priority: 820
---

Priority is 0 by default, so if you specify a priority higher than 0, the page will go above all the pages that don't have a specified priority, whilst pages with a negative priority will go below (for CONFIG, I set priority to -100).

As for icons, I just matched the name to a Feather icon that suited the page, here https://feathericons.com/, but it looks like you can also use your own svg's.

6

Is there a way currently to make priority/sorting in the NavTree by last modified? Hopefully in the future, sorting method can be chosen in the UI.

7

Also, unfortunately, the NavTree is laggy/unresponsive when there's a lot of notes. I tried one space with 5000 and another with 20000. Both are very laggy when using NavTree.

8

I like that my navtree follows the directory structure -- does the code in Website for icon customization work if I just want to change the icons for the folders and their "children" (but let it continue to auto-assemble the hierarchy) or does it require me to list everything out like in the example?