CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

angular-ui-patterns

Modern Angular UI patterns for loading states, error handling, and data display. Use when building UI components, handling async data, or managing component states.

Quality

68%

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

Fix and improve this skill with Tessl

tessl review fix ./skills/angular-ui-patterns/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

47%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.

The body is a thin, clean pointer to a real one-level-deep reference, which is efficient and well-structured for progressive disclosure. However, it contains zero task-level substance: no pattern, code snippet, step sequence, or concrete validation checkpoint is inline, so nothing is actionable until the full guide is opened.

Suggestions

Inline one canonical quick-start pattern (e.g., the loading/error/empty/data decision order as a short code block) so the skill is actionable before opening the reference.

Replace the circular "When to Use" sentence with a concrete section map of references/detailed-guide.md (loading states / error handling / data display) so "load the relevant sections" becomes navigable.

Add an explicit step sequence (read guide → select pattern → apply → validate) that names the concrete validation checkpoint from the guide instead of the abstract "treat its validation requirements as mandatory".

DimensionReasoningScore

Conciseness

The body is lean with no concept explanations and no padding, but "This skill is applicable to execute the workflow or actions described in the overview" is circular filler that earns no tokens. Efficient with minor trims possible, so anchor 4 rather than 5.

4 / 5

Actionability

The only concrete directives are "Read [the detailed guide](references/detailed-guide.md) before executing this skill" and a reading policy ("For focused work, load the relevant sections; for end-to-end work, read the guide completely"); no task-level steps, code, commands, or pattern examples appear in the body. Above anchor 1 because it does instruct with a real, verified path, but the specific steps to execute are entirely missing, matching anchor 2.

2 / 5

Workflow Clarity

Only a rough two-step sequence exists (read the guide, then execute per its procedure), and validation is mandated only in the abstract ("Treat its safety, prerequisites, and validation requirements as mandatory") with no concrete checkpoints. Not a 1 because a sequence and a validation mandate are present, but steps are poorly defined, matching anchor 2.

2 / 5

Progressive Disclosure

The single reference is one level deep, well-signaled, and verified to exist (references/detailed-guide.md, 523 lines with section headers), with guidance on reading fully vs. by section. Not a 5 because the body offers no section map of the guide (so "load the relevant sections" is not navigable) and the "When to Use" section is circular boilerplate.

4 / 5

Total

12

/

20

Passed

Description

75%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, third-person description that clearly answers what and when with a specific Angular niche. Its main weakness is that the trigger terms and capability list stay at the category level, missing the concrete vocabulary (skeleton, spinner, empty state, retry) users would naturally say.

DimensionReasoningScore

Specificity

"loading states, error handling, and data display" plus "handling async data" and "managing component states" name several specific capability areas in the Angular domain, but they are topic nouns rather than concrete actions (no skeletons, retry, empty states, or optimistic updates). Falls between anchors 3 and 4, noticeably above the midpoint.

4 / 5

Completeness

Both parts are present: what ("Modern Angular UI patterns for loading states, error handling, and data display") and an explicit when ("Use when building UI components..."). Not a 5 because the when-clause triggers are generic ("building UI components" is broad) rather than concrete phrases like "loading spinner" or "error state".

4 / 5

Trigger Term Quality

"building UI components, handling async data, or managing component states" plus "Angular" and "loading" are natural user phrases, but common variations like "spinner", "skeleton", "empty state", or "error message" are missing. Good coverage with a few natural terms absent, so not a 5.

4 / 5

Distinctiveness Conflict Risk

The Angular + async-state niche is mostly distinct, but "building UI components" and "managing component states" overlap with general frontend or component-library skills. Minor overlap risk with closely related skills matches anchor 4; the triggers are not distinct enough for a 5.

4 / 5

Total

16

/

20

Passed

Validation

93%

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

Validation — 15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

frontmatter_unknown_keys

Unknown frontmatter key(s) found; consider removing or moving to metadata

Warning

Total

15

/

16

Passed

Repository

sickn33/agentic-awesome-skills

Path

skills/angular-ui-patterns/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.