diff --git a/apps/client/src/translations/en/translation.json b/apps/client/src/translations/en/translation.json index e8b08e341..a50688874 100644 --- a/apps/client/src/translations/en/translation.json +++ b/apps/client/src/translations/en/translation.json @@ -771,7 +771,8 @@ "filter": "Filter", "filter-none": "All icons", "filter-default": "Default icons", - "icon_tooltip": "{{name}}\nIcon pack: {{iconPack}}" + "icon_tooltip": "{{name}}\nIcon pack: {{iconPack}}", + "no_results": "No icons found." }, "basic_properties": { "note_type": "Note type", diff --git a/apps/client/src/widgets/note_icon.css b/apps/client/src/widgets/note_icon.css index 8a739626d..4ed6df648 100644 --- a/apps/client/src/widgets/note_icon.css +++ b/apps/client/src/widgets/note_icon.css @@ -72,6 +72,14 @@ div.note-icon-widget { height: 1em; } +.note-icon-widget { + .no-results { + padding: 20px; + text-align: center; + color: var(--muted-text-color); + } +} + body.experimental-feature-new-layout { .note-icon-widget button.note-icon { --input-focus-outline-color: var(--note-icon-hover-background-color); diff --git a/apps/client/src/widgets/note_icon.tsx b/apps/client/src/widgets/note_icon.tsx index 782d95072..ea81aae70 100644 --- a/apps/client/src/widgets/note_icon.tsx +++ b/apps/client/src/widgets/note_icon.tsx @@ -174,13 +174,17 @@ function NoteIconList({ note, dropdownRef }: { dropdownRef?.current?.hide(); }} > - {(iconData?.icons ?? []).map(({ id, terms, iconPack }) => ( - - ))} + {iconData?.icons?.length ? ( + (iconData?.icons ?? []).map(({ id, terms, iconPack }) => ( + + )) + ) : ( +
{t("note_icon.no_results")}
+ )} );