From 0cba323091f467024d85dcdbcc4378782d21a0ab Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 9 Jun 2025 18:47:02 +0300
Subject: [PATCH] feat(share): display icons in note tree

---
 apps/server/src/becca/entities/bnote.ts       |  2 +-
 apps/server/src/share/shaca/entities/snote.ts | 28 +++++++++++++++++++
 .../share-theme/src/templates/tree_item.ejs   |  2 +-
 3 files changed, 30 insertions(+), 2 deletions(-)

diff --git a/apps/server/src/becca/entities/bnote.ts b/apps/server/src/becca/entities/bnote.ts
index fe394c4d7..419c9bdfe 100644
--- a/apps/server/src/becca/entities/bnote.ts
+++ b/apps/server/src/becca/entities/bnote.ts
@@ -28,7 +28,7 @@ const LABEL = "label";
 const RELATION = "relation";
 
 // TODO: Deduplicate with fnote
-const NOTE_TYPE_ICONS = {
+export const NOTE_TYPE_ICONS = {
     file: "bx bx-file",
     image: "bx bx-image",
     code: "bx bx-code",
diff --git a/apps/server/src/share/shaca/entities/snote.ts b/apps/server/src/share/shaca/entities/snote.ts
index 6b192b57e..19dbd463e 100644
--- a/apps/server/src/share/shaca/entities/snote.ts
+++ b/apps/server/src/share/shaca/entities/snote.ts
@@ -9,6 +9,7 @@ import type SAttachment from "./sattachment.js";
 import type SAttribute from "./sattribute.js";
 import type SBranch from "./sbranch.js";
 import type { SNoteRow } from "./rows.js";
+import { NOTE_TYPE_ICONS } from "../../../becca/entities/bnote.js";
 
 const LABEL = "label";
 const RELATION = "relation";
@@ -530,6 +531,33 @@ class SNote extends AbstractShacaEntity {
             childNoteIds: this.children.map((child) => child.noteId)
         };
     }
+
+    getIcon() {
+        const iconClassLabels = this.getLabels("iconClass");
+
+        if (iconClassLabels && iconClassLabels.length > 0) {
+            return iconClassLabels[0].value;
+        } else if (this.noteId === "root") {
+            return "bx bx-home-alt-2";
+        }
+        if (this.noteId === "_share") {
+            return "bx bx-share-alt";
+        } else if (this.type === "text") {
+            if (this.isFolder()) {
+                return "bx bx-folder";
+            } else {
+                return "bx bx-note";
+            }
+        } else if (this.type === "code" && this.mime.startsWith("text/x-sql")) {
+            return "bx bx-data";
+        } else {
+            return NOTE_TYPE_ICONS[this.type];
+        }
+    }
+
+    isFolder() {
+        return this.getChildBranches().length > 0;
+    }
 }
 
 export default SNote;
diff --git a/packages/share-theme/src/templates/tree_item.ejs b/packages/share-theme/src/templates/tree_item.ejs
index 54788d058..08ba57d45 100644
--- a/packages/share-theme/src/templates/tree_item.ejs
+++ b/packages/share-theme/src/templates/tree_item.ejs
@@ -8,7 +8,7 @@ const target = isExternalLink ? ` target="_blank" rel="noopener noreferrer"` : "
     <% if (note.noteId !== subRoot.note.noteId) { %>
     <a class="<%= linkClass %>" href="<%= linkHref %>"<%= target %>>
         <% if (note.hasVisibleChildren()) { %><button class="collapse-button" aria-label="Expand"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="svg-icon right-triangle"><path d="M3 8L12 17L21 8"></path></svg></button><% } %>
-        <span><%= note.title %></span>
+        <span><i class="<%= note.getIcon() %>"></i> <%= note.title %></span>
     </a>
 <% } %>