Three UX bugs in the icon picker:
1. Skeleton-forever on edit screens. The input was pre-filled with the
full CDN URL, the search query fired with that URL, and the DB only
stores bare filenames, so the response was always empty -> 15
skeletons, forever. Decouple the input display from the query:
initialize search to the committed value and only fire the query
when the user has actually typed something different.
2. Loading / error / no-results all looked identical (15 skeletons).
Split the render into four explicit branches: isError (with retry),
isLoading (skeletons, only on cold first load), results, no-results.
3. No relevance ranking and no SVG-first ordering. Add orderBy in the
icons router: relevance tier (exact > prefix > substring) -> SVG
first -> alphabetical. Patterns are bound as JS strings so the SQL
works across sqlite / postgresql / mysql without concat operator
differences.
Also add placeholderData: keepPreviousData so refetching during typing
doesn't flash the dropdown to skeletons, fix the upload pre-fill that
was leaking a local media URL into the search, drop the no-op
updateSelectedOptionIndex, and mark the file as a client component so
Next.js can render it from server-component routes.
Add common.iconPicker headerLoading / noResults / error keys to
en.json (other locales fall back to en until the next sync).
No ternaries in the changed files. Intended simplifications are marked
with ponytail: comments.