Clean up skills UI and unify scheduled tasks iconography - #319
Merged
Conversation
Platform skills store `icon` as a Lucide icon name (`panels-top-left`, `file-text`, `monitor`), but three surfaces rendered that string as raw text inside a 36px chip, so slugs spilled across the card, the agent's skills list, and the skill detail header. Add a SkillIcon that resolves the stored value: a Lucide name renders the real glyph, an emoji renders as a glyph, and anything unrecognised falls back to the Zap mark, so a slug can never reach the layout again. Tidy the skills grid card while there: the icon, title, and description share one aligned row; the boxed ghost "Available to..." button becomes a quiet inline row; the hover lift gives way to a flat border/tint hover matching the tools view; tags truncate; the empty state adopts the house dashed-border pattern; cards are keyboard-reachable with a focus ring. Skills now read as Zap rather than Sparkles across the agent section nav, the Customize tab, both empty states, and the runtime skills note. Sparkles stays on credits, the copilot badge, and the composer's Auto chip, which are not skills. Tasks become "Scheduled tasks" with a single ClipboardClock icon across the sidebar, collapsed rail, agent section nav, global search, landing sidebar, page header, create tooltip, detail back link, and copilot scope label. That icon postdates the pinned lucide-react 0.474, so it is inlined from Lucide's own path data with LucideProps and drops into every `icon:` slot unchanged. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Why
Platform skills store
iconas a Lucide icon name (panels-top-left,file-text,monitor), but three surfaces rendered that string as raw text inside a 36px chip — so slugs spilled across the skills grid, the agent's skills list, and the skill detail header.What changed
Icon resolution. New
SkillIconresolves the stored value properly: a Lucide name renders the real glyph, an emoji renders as a glyph, and anything unrecognised falls back to the Zap mark. A slug can never reach the layout again.Skills card cleanup. Icon, title, and description now share one aligned row instead of the icon floating above. The chunky grey "Available to…" ghost button becomes a quiet inline row. The hover lift (
-translate-y+ shadow) gives way to a flat border/tint hover matching the tools view. Tags truncate, the empty state adopts the house dashed-border pattern, and cards are keyboard-reachable with a proper focus ring.Sparkles → Zap for skills across the agent section nav, the Customize tab, both empty states, and the runtime skills note. Sparkles intentionally stays on credits, the copilot badge, and the composer's "Auto" chip — those aren't skills.
Tasks → "Scheduled tasks" with a single
ClipboardClockicon across the sidebar, collapsed rail, agent section nav, global search (nav item + result group + row icon), landing sidebar, page header, create-button tooltip, task detail back link, and the copilot scope label.Note on the icon
ClipboardClockpostdates the pinned lucide-react 0.474 (it landed around 0.511). Rather than bump the icon library across the whole app, it's inlined from Lucide's own path data usingLucideProps, so it's structurally identical to a real Lucide icon and drops into everyicon:slot unchanged.Verification
tsc --noEmitclean on both the main- and staging-based branchesnext buildpasses (only pre-existingnext-auth/joseEdge-runtime warnings)next linton changed files shows only pre-existingno-explicit-anywarnings🤖 Generated with Claude Code