diff --git a/apps/client/src/widgets/note_icon.ts.bak b/apps/client/src/widgets/note_icon.ts.bak deleted file mode 100644 index c7b3a6aa5..000000000 --- a/apps/client/src/widgets/note_icon.ts.bak +++ /dev/null @@ -1,50 +0,0 @@ -import { t } from "../services/i18n.js"; -import NoteContextAwareWidget from "./note_context_aware_widget.js"; -import attributeService from "../services/attributes.js"; -import server from "../services/server.js"; -import type FNote from "../entities/fnote.js"; -import type { EventData } from "../components/app_context.js"; -import type { Icon } from "./icon_list.js"; -import { Dropdown } from "bootstrap"; - -export default class NoteIconWidget extends NoteContextAwareWidget { - - private dropdown!: bootstrap.Dropdown; - private $icon!: JQuery; - private $iconList!: JQuery; - private $iconCategory!: JQuery; - private $iconSearch!: JQuery; - - doRender() { - this.$icon = this.$widget.find("button.note-icon"); - this.$iconList = this.$widget.find(".icon-list"); - } - - async renderDropdown() { - this.$iconList.empty(); - - if (this.getIconLabels().length > 0) { - this.$iconList.append( - $(`
`).append( - $(``).on("click", () => - this.getIconLabels().forEach((label) => { - if (this.noteId) { - attributeService.removeAttributeById(this.noteId, label.attributeId); - } - }) - ) - ) - ); - } - - - this.$iconSearch.focus(); - } - - getIconLabels() { - if (!this.note) { - return []; - } - return this.note.getOwnedLabels().filter((label) => ["workspaceIconClass", "iconClass"].includes(label.name)); - } -} diff --git a/apps/client/src/widgets/note_icon.tsx b/apps/client/src/widgets/note_icon.tsx index 3eaeaaced..d991bc0e9 100644 --- a/apps/client/src/widgets/note_icon.tsx +++ b/apps/client/src/widgets/note_icon.tsx @@ -2,13 +2,14 @@ import Dropdown from "./react/Dropdown"; import "./note_icon.css"; import { t } from "i18next"; import { useNoteContext, useNoteLabel } from "./react/hooks"; -import { useCallback, useEffect, useRef, useState } from "preact/hooks"; +import { useEffect, useRef, useState } from "preact/hooks"; 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"; +import Button from "./react/Button"; interface IconToCountCache { iconClassToCountMap: Record; @@ -140,6 +141,22 @@ function NoteIconList({ note }: { note: FNote }) { } }} > + {getIconLabels(note).length > 0 && ( +
+
+ )} + {(iconData?.icons ?? []).map(({className, name}) => ( ))} @@ -155,4 +172,13 @@ async function getIconToCountMap() { } return (await iconToCountCache).iconClassToCountMap; +} + +function getIconLabels(note: FNote) { + if (!note) { + return []; + } + return note.getOwnedLabels() + .filter((label) => ["workspaceIconClass", "iconClass"] + .includes(label.name)); } \ No newline at end of file