CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

data-client-react

Use @data-client/react hooks for data fetching, mutations, and rendering - useSuspense, useFetch, useQuery, useCache, useLive, useDLE, useSubscription, useController, DataProvider, AsyncBoundary, useLoading, useDebounce. Use when reading/rendering remote data, triggering mutations, doing optimistic updates, real-time subscriptions, or wiring Suspense/error boundaries in React.

76

Quality

96%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide
SecuritybySnyk

Passed

No findings from the security scan

SKILL.md
Quality
Evals
Security

Quality

Content

93%Weight 40%Scale 1-5

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

An exemplary reference-style skill body: dense, executable code examples with wire-level comments, decision tables for hook and controller action selection, and a clean one-level-deep reference structure where every link resolves. The only gap is the absence of inline multi-step validation/feedback checkpoints, which is largely mitigated by routing debugging workflows to the dedicated devtools-debugging reference.

DimensionReasoningScore

Conciseness

The body is code-first and lean: comments do double duty by documenting the wire request ("// GET https://jsonplaceholder.typicode.com/todos/5"), and the prose bullets carry only non-obvious guidance ("`undefined` from `useCache`... means 'not loaded yet', not 'doesn't exist'"). Nothing re-explains React or data-fetching basics Claude already knows; the "Before React 19" clause is a necessary version conditional, not padded dating.

5 / 5

Actionability

Every section is copy-paste-ready executable TypeScript covering the common cases: reads, live subscriptions, parallel fetch with React.use(), all mutation shapes (ctrl.fetch for PUT/PATCH/DELETE, getList.unshift/push, getPage pagination), useLoading, useDebounce, AsyncBoundary, and Query aggregations — plus a decision table mapping refresh intents to exact ctrl.* calls.

5 / 5

Workflow Clarity

Task routing is clear: hook-selection semantics (useCache/useQuery vs useSuspense/useDLE), waterfall-avoidance sequencing ("load 2+ endpoints with useFetch"), a refresh-vs-invalidate decision table, and explicit delegation to sibling skills ("apply the skill 'data-client-rest'"). It falls short of anchor 5 because no explicit multi-step workflow with inline validation or error-recovery checkpoints is present — those live in the referenced devtools-debugging file rather than in the body.

4 / 5

Progressive Disclosure

A well-structured overview with inline links at point of use (AsyncBoundary, Controller, devtools-debugging) plus a cataloged References section giving one-line descriptions of every file; all 22 referenced paths resolve to real files, and reference files only cross-link siblings within the same directory, keeping disclosure one level deep and easy to navigate.

5 / 5

Total

19

/

20

Passed

Description

96%Weight 40%Scale 1-5

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

A strong description: it names the library's complete hook surface, pairs concrete capabilities with an explicit multi-trigger "Use when" clause, and stays third-person and unpadded. The only weakness is that its "when" triggers describe generic React data tasks rather than ones unique to @data-client/react, leaving minor conflict risk against other React data-fetching skills.

DimensionReasoningScore

Specificity

The description enumerates the full hook surface ("useSuspense, useFetch, useQuery, useCache, useLive, useDLE, useSubscription, useController, DataProvider, AsyncBoundary, useLoading, useDebounce") tied to concrete actions ("data fetching, mutations, and rendering"), giving comprehensive coverage with no gaps.

5 / 5

Completeness

It explicitly answers both "what" (the hook list and the actions they perform) and "when" via a concrete "Use when..." clause with five distinct trigger scenarios, matching the anchor-5 reference example structure.

5 / 5

Trigger Term Quality

"reading/rendering remote data, triggering mutations, doing optimistic updates, real-time subscriptions, or wiring Suspense/error boundaries in React" covers the natural phrases a user would say in this domain, including synonyms like "remote data" and "real-time subscriptions". No commonly-used trigger phrasing is missing.

5 / 5

Distinctiveness Conflict Risk

Naming @data-client/react and its specific hooks carves a clear niche, but the trigger phrases ("reading/rendering remote data... in React") are generic to any React data library, creating minor overlap risk with closely related skills like a React Query/SWR equivalent. It is more distinct than anchor 3 ("could still overlap with similar skills") because the package and hook names disambiguate once read.

4 / 5

Total

19

/

20

Passed

Validation

100%

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository

reactive/data-client

Path

.agents/skills/data-client-react/SKILL.md

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.