chore(react/note_icon): reintroduce setting the icon

This commit is contained in:
Elian Doran
2025-08-21 15:21:32 +03:00
parent b1449eebf3
commit 9d54503ef7
2 changed files with 21 additions and 11 deletions

View File

@@ -18,13 +18,6 @@ export default class NoteIconWidget extends NoteContextAwareWidget {
doRender() { doRender() {
this.$icon = this.$widget.find("button.note-icon"); this.$icon = this.$widget.find("button.note-icon");
this.$iconList = this.$widget.find(".icon-list"); 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">) { async entitiesReloadedEvent({ loadResults }: EventData<"entitiesReloaded">) {

View File

@@ -7,6 +7,8 @@ import server from "../services/server";
import type { Category, Icon } from "./icon_list"; import type { Category, Icon } from "./icon_list";
import FormTextBox from "./react/FormTextBox"; import FormTextBox from "./react/FormTextBox";
import FormSelect from "./react/FormSelect"; import FormSelect from "./react/FormSelect";
import FNote from "../entities/fnote";
import attributes from "../services/attributes";
interface IconToCountCache { interface IconToCountCache {
iconClassToCountMap: Record<string, number>; iconClassToCountMap: Record<string, number>;
@@ -45,12 +47,12 @@ export default function NoteIcon() {
hideToggleArrow hideToggleArrow
disabled={viewScope?.viewMode !== "default"} disabled={viewScope?.viewMode !== "default"}
> >
<NoteIconList /> <NoteIconList note={note} />
</Dropdown> </Dropdown>
) )
} }
function NoteIconList() { function NoteIconList({ note }: { note: FNote }) {
const searchBoxRef = useRef<HTMLInputElement>(null); const searchBoxRef = useRef<HTMLInputElement>(null);
const [ search, setSearch ] = useState<string>(); const [ search, setSearch ] = useState<string>();
const [ categoryId, setCategoryId ] = useState<string>("0"); const [ categoryId, setCategoryId ] = useState<string>("0");
@@ -124,7 +126,22 @@ function NoteIconList() {
/> />
</div> </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}) => ( {(iconData?.icons ?? []).map(({className, name}) => (
<span class={`bx ${className}`} title={name} /> <span class={`bx ${className}`} title={name} />
))} ))}