Skip to content

Icons: extends icon data + improved search#22436

Open
nielslyngsoe wants to merge 11 commits intomainfrom
v17/feature/extend-icon-data
Open

Icons: extends icon data + improved search#22436
nielslyngsoe wants to merge 11 commits intomainfrom
v17/feature/extend-icon-data

Conversation

@nielslyngsoe
Copy link
Copy Markdown
Member

@nielslyngsoe nielslyngsoe commented Apr 10, 2026

Extended icons data
Embeds data from Lucide and Thesaurus(earlier community package. Which have been approved to get merged into the core)

Search Logic:
This improves the search logic of the Icon Picker to handle that extra data.

Result
Enables this amount of results from a Search, where previously search would only provide exact matches with the icon alias.
image

Copilot AI review requested due to automatic review settings April 10, 2026 20:42
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR enriches the backoffice icon registry with thesaurus-style metadata (keywords, groups, related icons) and updates the Icon Picker’s search to take advantage of that extra data via tokenized substring matching plus fuzzy matching.

Changes:

  • Added Levenshtein distance/similarity utilities (with tests) and exported them via the core string utils barrel.
  • Extended UmbIconDefinition and the generated icon registry data to include keywords, groups, and related.
  • Implemented a new searchIcons() function for ranked icon searching (incl. fuzzy matching + related icon expansion) and wired it into the icon picker with debounced @input handling.

Reviewed changes

Copilot reviewed 10 out of 12 changed files in this pull request and generated 2 comments.

Show a summary per file
File Description
src/Umbraco.Web.UI.Client/src/packages/core/utils/string/levenshtein/levenshtein.function.ts Adds Levenshtein distance + normalized similarity utilities.
src/Umbraco.Web.UI.Client/src/packages/core/utils/string/levenshtein/levenshtein.function.test.ts Unit tests for Levenshtein distance/similarity.
src/Umbraco.Web.UI.Client/src/packages/core/utils/string/levenshtein/index.ts Barrel export for Levenshtein utilities.
src/Umbraco.Web.UI.Client/src/packages/core/utils/string/index.ts Exposes Levenshtein utilities via string utils barrel.
src/Umbraco.Web.UI.Client/src/packages/core/icon-registry/types.ts Extends icon definition type with keywords, groups, related.
src/Umbraco.Web.UI.Client/src/packages/core/icon-registry/icons.ts Populates icon registry entries with keywords/groups/related metadata.
src/Umbraco.Web.UI.Client/src/packages/core/icon-registry/icon-picker-modal/icon-search.function.ts Implements ranked search (substring + fuzzy) and related icon expansion.
src/Umbraco.Web.UI.Client/src/packages/core/icon-registry/icon-picker-modal/icon-search.function.test.ts Unit tests for the new icon search behavior.
src/Umbraco.Web.UI.Client/src/packages/core/icon-registry/icon-picker-modal/icon-picker-modal.element.ts Switches to debounced search using searchIcons() on @input.
src/Umbraco.Web.UI.Client/devops/icons/todo_implement_this_data_thesaurus.json Removes now-obsolete thesaurus TODO JSON file.
src/Umbraco.Web.UI.Client/devops/icons/index.js Updates icon generation to include keywords/groups/related in generated icons.ts.

@claude
Copy link
Copy Markdown

claude bot commented Apr 10, 2026

PR Review

Target: origin/main · Based on commit: c16799331058599b524eba4eb39f549cc8f36c85
Skipped: 1 noise file (todo_implement_this_data_thesaurus.json — deleted data placeholder) out of 12 total

Extends UmbIconDefinition with optional keywords, groups, and related metadata fields; backfills the icon dictionary with that data; adds a Levenshtein string-distance utility to core utils; and replaces the icon picker's simple name-substring filter with a tiered fuzzy search that also surfaces related icons.

  • Modified public API: UmbIconDefinition (@umbraco-cms/backoffice/icon) — three optional fields added (keywords, groups, related). New exports added to @umbraco-cms/backoffice/utils: levenshteinDistance, levenshteinSimilarity.
  • Other changes: Icon picker search now returns fuzzy-matched results ordered by relevance and appends related icons after primary matches; previously it was a simple name-substring filter. End users will see improved search results and more icon suggestions.

Suggestions

  • icon-search.function.ts:65: groupTokens variable name is misleading — these are full group strings, not individual word tokens. See inline comment.
  • icon-search.function.ts:73: Group strings in the fuzzy-matching pass are not tokenized, so multi-word groups (e.g. "item media") don't benefit from typo-tolerant matching. Tier 1 substring checks cover the no-typo case, so this is low-impact. See inline comment for a one-liner fix.

Approved with Suggestions for improvement

Good to go — solid implementation with good test coverage. The suggestions are genuinely minor; the search logic is correct and the breaking-change analysis is clean (all changes are additive). Please do a manual sanity check of the icon picker search UX before merging.

@claude claude bot added category/ux User experience category/ui User interface labels Apr 10, 2026
@nielslyngsoe nielslyngsoe marked this pull request as draft April 13, 2026 09:06
@nielslyngsoe nielslyngsoe marked this pull request as ready for review April 13, 2026 14:46
@nielslyngsoe nielslyngsoe enabled auto-merge (squash) April 13, 2026 17:21
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area/frontend category/ui User interface category/ux User experience

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants