ai-sdk-ui
Build React chat interfaces with Vercel AI SDK v6. Covers useChat/useCompletion/useObject hooks, message parts structure, tool approval workflows, and 18 UI error solutions. Prevents documented issues with React Strict Mode, concurrent requests, stale closures, and tool approval edge cases. Use when: implementing AI chat UIs, migrating v5→v6, troubleshooting "useChat failed to parse stream", "stale body values", "React maximum update depth", "Cannot read properties of undefined (reading 'state')", or tool approval workflow errors.
84
Does it follow best practices?
If you maintain this skill, you can automatically optimize it using the tessl CLI to improve its score:
npx tessl skill review --optimize ./path/to/skillValidation for skill structure
Discovery
100%Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.
This is an excellent skill description that excels across all dimensions. It provides specific capabilities (hooks, error solutions, workflow coverage), includes highly searchable trigger terms including exact error messages users would encounter, explicitly states when to use it, and carves out a distinct niche around Vercel AI SDK v6 React integration.
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | Lists multiple specific concrete actions: 'useChat/useCompletion/useObject hooks, message parts structure, tool approval workflows, and 18 UI error solutions' plus specific issues it prevents like 'React Strict Mode, concurrent requests, stale closures'. | 3 / 3 |
Completeness | Clearly answers both what (build React chat interfaces, covers specific hooks and solutions) AND when with explicit 'Use when:' clause listing implementation scenarios, migration path, and specific error messages as triggers. | 3 / 3 |
Trigger Term Quality | Excellent coverage of natural terms users would search for: 'React chat interfaces', 'Vercel AI SDK v6', 'useChat', specific error messages like 'useChat failed to parse stream', 'stale body values', 'React maximum update depth', and 'tool approval workflow errors'. | 3 / 3 |
Distinctiveness Conflict Risk | Highly distinctive with clear niche: specifically Vercel AI SDK v6, React chat UIs, and named error messages. Unlikely to conflict with generic React or chat skills due to the specific SDK version and error message triggers. | 3 / 3 |
Total | 12 / 12 Passed |
Implementation
72%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
This is a strong, actionable skill with excellent code examples and good progressive disclosure structure. The main weaknesses are some verbosity in explanatory sections (deprecation notices, 'when to use' guidance) and missing explicit validation workflows for migration and debugging processes. The error documentation is comprehensive but could benefit from a systematic troubleshooting checklist.
Suggestions
Trim the 'When to Use This Skill' section - Claude can infer appropriate usage from the content itself
Add a validation checklist for v4→v5 migration (e.g., '1. Update imports ✓ 2. Test sendMessage ✓ 3. Verify streaming ✓')
Condense the useAssistant deprecation notice to 1-2 lines with a link to migration guidance
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The skill is mostly efficient with good code examples, but includes some unnecessary context like explaining what message parts are, version history details, and the 'When to Use This Skill' section that Claude could infer. The deprecation notice for useAssistant is verbose. | 2 / 3 |
Actionability | Excellent executable code examples throughout - all snippets are copy-paste ready with proper imports, complete function signatures, and real-world patterns. The v4→v5 migration shows clear before/after comparisons with working code. | 3 / 3 |
Workflow Clarity | Individual code patterns are clear, but multi-step workflows like migration or debugging lack explicit validation checkpoints. The error solutions section lists fixes but doesn't provide a systematic debugging workflow with verification steps. | 2 / 3 |
Progressive Disclosure | Well-structured with clear overview sections and explicit references to external files (references/top-ui-errors.md, references/streaming-patterns.md, templates/). Navigation is one level deep with clearly signaled links to official docs and internal references. | 3 / 3 |
Total | 10 / 12 Passed |
Validation
75%Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.
Validation — 12 / 16 Passed
Validation for skill structure
| Criteria | Description | Result |
|---|---|---|
skill_md_line_count | SKILL.md is long (558 lines); consider splitting into references/ and linking | Warning |
metadata_version | 'metadata' field is not a dictionary | Warning |
license_field | 'license' field is missing | Warning |
frontmatter_unknown_keys | Unknown frontmatter key(s) found; consider removing or moving to metadata | Warning |
Total | 12 / 16 Passed | |
- Reviewed
Table of Contents
Is this your skill?
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.