CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

create-react-component

Use when: creating a new Relay-connected React component, defining a GraphQL fragment, or wiring a component to a query

68

Quality

85%

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

86%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 efficient, actionable skill body with a complete Relay component example and a clearly sequenced four-step procedure. The main gaps are the vague file-location placeholder in Step 1 and the absence of any validation step confirming the Relay compiler output or the component's correctness.

Suggestions

Replace the 'Location: opencti-platform/opencti-front/src/private/components/...' ellipsis with concrete file-naming guidance (e.g., the component name and co-located fragment file convention) so Step 1 is fully executable.

Add a validation checkpoint after Step 3, e.g. run a typecheck ('yarn typecheck' or 'tsc --noEmit') to confirm the generated fragment types compile, and note the fix-and-retry loop if compilation fails.

Clarify how to invoke the Codebase Pattern Finder agent in Step 0 (e.g., the exact agent prompt or search terms), since the step currently assumes the reader already knows the mechanism.

DimensionReasoningScore

Conciseness

The body is lean with zero padding: terse prerequisites, one complete executable code block, and a single command — no explanations of concepts Claude already knows and nothing to trim.

5 / 5

Actionability

Provides a complete copy-paste-ready TSX example, a concrete command ('yarn relay'), and real directory paths, but Step 1's 'Location: ...' uses a literal ellipsis placeholder and offers no concrete file-naming guidance.

4 / 5

Workflow Clarity

Steps 0–3 are clearly sequenced and 'yarn relay' acts as a generation checkpoint, but there is no verification that types compiled correctly or that the component renders — matching 'clear sequence with minor validation gaps' rather than the explicit feedback-loop anchor.

4 / 5

Progressive Disclosure

The skill is short with no bundle files and no need for external references, and the content is cleanly organized into Prerequisites and numbered Procedure sections, which satisfies the simple-skill exception for a top score.

5 / 5

Total

18

/

20

Passed

Description

78%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 concise, trigger-first description with explicit 'Use when' guidance and concrete Relay/GraphQL action verbs. It is highly distinctive and free of fluff; the only weakness is that the 'what' is implied by the trigger list rather than stated separately, and a few natural synonyms (e.g., useFragment, Relay hooks) are absent.

DimensionReasoningScore

Specificity

Lists three concrete actions ('creating a new Relay-connected React component, defining a GraphQL fragment, or wiring a component to a query') but omits supporting actions like running the Relay compiler, matching the 'several specific actions with minor gaps' anchor rather than comprehensive coverage.

4 / 5

Completeness

An explicit 'Use when:' clause with concrete triggers is present, and the enumerated actions imply the 'what', but the 'what' is not independently stated — matching the anchor where both are present yet one is less explicit.

4 / 5

Trigger Term Quality

Natural keywords users would say ('React component', 'GraphQL fragment', 'Relay', 'query') are present, but common variations like 'useFragment', 'Relay hooks', or 'fragment colocation' are missing, so coverage is good rather than comprehensive.

4 / 5

Distinctiveness Conflict Risk

'Relay-connected' and 'GraphQL fragment' carve a clear niche distinct from generic React-component skills, leaving only trivial overlap risk, which matches the 'clear niche with distinct triggers; minimal conflict risk' anchor.

5 / 5

Total

17

/

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

OpenCTI-Platform/opencti

Path

.github/skills/create-react-component/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.