Skip to content

Improve tag search and selection UX - #146

Open
arqueon wants to merge 6 commits into
linkwarden:mainfrom
arqueon:agent/tag-selector-ux
Open

Improve tag search and selection UX#146
arqueon wants to merge 6 commits into
linkwarden:mainfrom
arqueon:agent/tag-selector-ux

Conversation

@arqueon

@arqueon arqueon commented Jul 27, 2026

Copy link
Copy Markdown

What changed

  • keep the tag selector visible without opening More Options
  • open a full-height tag picker inside the extension popup so search and long lists remain usable
  • keep the picker open and preserve its scroll position while toggling multiple tags
  • render selected tags as removable chips
  • show the selected tag names in the closed trigger and update them live in the picker header
  • clear the search field and return the list to the top after selecting a highlighted tag with Enter
  • normalize and rank exact, prefix, word-prefix, and substring matches
  • keep overlapping tags selectable as separate values
  • offer an explicit create action whenever there is no normalized exact match, even when partial matches exist
  • debounce server searches, cancel stale requests, and preserve paginated loading
  • defer new-tag creation until the bookmark is saved, avoiding orphan tags
  • add focused unit tests for matching, creation, deduplication, and selection behavior

Why

The current selector makes multi-tag workflows cumbersome and handles partial overlaps ambiguously. For example, an existing artificial intelligence tag should not prevent users from selecting or creating artificial, and searching for artificial should retain every matching tag rather than collapsing them into one choice.

The existing paginated API already supports server-side tag search. This change builds on it instead of caching an incomplete local tag list.

User impact

Users can search, create, select, review, and remove several tags without repeatedly reopening the selector. Selected names remain visible both while the picker is open and after it closes. Pressing Enter on a highlighted result immediately prepares the field for the next tag search. Exact duplicates are prevented case-insensitively after whitespace normalization, while distinct overlapping names remain available.

The full-height picker avoids Radix popover collision and repositioning problems in Chrome's narrow extension viewport.

Validation

  • npm test — 9 tests passed
  • npx tsc --noEmit
  • npm run build
  • targeted ESLint on all changed TypeScript and test files
  • manual Chrome Beta QA with a large tag list, consecutive selections, typo correction, normalized duplicate prevention, and closing a pending tag without creating an orphan
  • live self-hosted Linkwarden QA: the tag was created atomically with the saved link, the association was verified, and both test records were removed afterward

Related: linkwarden/linkwarden#1239, linkwarden/linkwarden#1573, linkwarden/linkwarden#1604

@arqueon
arqueon marked this pull request as ready for review July 27, 2026 23:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant