From 9d54503ef7b5876ad70cfbee37164e6b3ea75c88 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Thu, 21 Aug 2025 15:21:32 +0300
Subject: [PATCH] chore(react/note_icon): reintroduce setting the icon

---
 apps/client/src/widgets/note_icon.ts.bak |  9 +--------
 apps/client/src/widgets/note_icon.tsx    | 23 ++++++++++++++++++++---
 2 files changed, 21 insertions(+), 11 deletions(-)

diff --git a/apps/client/src/widgets/note_icon.ts.bak b/apps/client/src/widgets/note_icon.ts.bak
index 785d1e4b5..bc201ccc1 100644
--- a/apps/client/src/widgets/note_icon.ts.bak
+++ b/apps/client/src/widgets/note_icon.ts.bak
@@ -18,15 +18,8 @@ export default class NoteIconWidget extends NoteContextAwareWidget {
     doRender() {
         this.$icon = this.$widget.find("button.note-icon");
         this.$iconList = this.$widget.find(".icon-list");
-        this.$iconList.on("click", "span", async (e) => {
-            const clazz = $(e.target).attr("class");
-
-            if (this.noteId && this.note) {
-                await attributeService.setLabel(this.noteId, this.note.hasOwnedLabel("workspace") ? "workspaceIconClass" : "iconClass", clazz);
-            }
-        });
     }
-    
+
     async entitiesReloadedEvent({ loadResults }: EventData<"entitiesReloaded">) {
         if (this.noteId && loadResults.isNoteReloaded(this.noteId)) {
             this.refresh();
diff --git a/apps/client/src/widgets/note_icon.tsx b/apps/client/src/widgets/note_icon.tsx
index 7a605c4b8..3f6e8b191 100644
--- a/apps/client/src/widgets/note_icon.tsx
+++ b/apps/client/src/widgets/note_icon.tsx
@@ -7,6 +7,8 @@ import server from "../services/server";
 import type { Category, Icon } from "./icon_list";
 import FormTextBox from "./react/FormTextBox";
 import FormSelect from "./react/FormSelect";
+import FNote from "../entities/fnote";
+import attributes from "../services/attributes";
 
 interface IconToCountCache {
     iconClassToCountMap: Record<string, number>;
@@ -45,12 +47,12 @@ export default function NoteIcon() {
             hideToggleArrow
             disabled={viewScope?.viewMode !== "default"}
         >
-            <NoteIconList />
+            <NoteIconList note={note} />
         </Dropdown>
     )
 }
 
-function NoteIconList() {
+function NoteIconList({ note }: { note: FNote }) {
     const searchBoxRef = useRef<HTMLInputElement>(null);
     const [ search, setSearch ] = useState<string>();
     const [ categoryId, setCategoryId ] = useState<string>("0");
@@ -124,7 +126,22 @@ function NoteIconList() {
                 />
             </div>
 
-            <div class="icon-list">
+            <div
+                class="icon-list"
+                onClick={(e) => {
+                    const clickedTarget = e.target as HTMLElement;
+                    
+                    if (!clickedTarget.classList.contains("bx")) {
+                        return;
+                    }
+
+                    const iconClass = Array.from(clickedTarget.classList.values()).join(" ");
+                    if (note) {
+                        const attributeToSet = note.hasOwnedLabel("workspace") ? "workspaceIconClass" : "iconClass";
+                        attributes.setLabel(note.noteId, attributeToSet, iconClass);
+                    }
+                }}
+            >
                 {(iconData?.icons ?? []).map(({className, name}) => (
                     <span class={`bx ${className}`} title={name} />
                 ))}