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.

2.65x

Quality

70%

Does it follow best practices?

Impact

85%

2.65x

Average score across 3 eval scenarios

Securityby

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./plugins/AI-Agents-Safe-Coding-Skills/skills/angular-ui-patterns/SKILL.md

The canonical home for this skill is angular-ui-patterns in sickn33/agentic-awesome-skills

Quality

Content

57%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 content is a rich, actionable Angular UI pattern catalog with strong concrete code examples, but it is held back by redundancy between the main sections and the Anti-Patterns section and by the absence of any progressive disclosure into reference files. Tightening the repetition and splitting long sections into referenced files would lift the lower-scoring dimensions.

Suggestions

Collapse or trim the Anti-Patterns section so it cross-references the already-shown CORRECT examples instead of restating them, reducing token redundancy.

Move the larger reference-style sections (e.g., Form Patterns, Dialog/Modal Patterns) into separate files under references/ and link to them one level deep from SKILL.md.

Add an explicit validate-fix-retry loop (e.g., for the error-state retry flow or optimistic-update rollback) to strengthen workflow_clarity beyond a checklist.

Dimension	Reasoning	Score
Conciseness	The body assumes Claude knows Angular and avoids concept padding, but the Anti-Patterns section re-derives the loading, error, and button patterns already shown earlier, adding noticeable repetition that could be tightened.	3 / 5
Actionability	Provides abundant copy-paste-ready Angular code (signals, @if/@for/@defer, inject(), full component examples) covering loading, error, empty, button, form, and dialog cases, with only minor gaps where app-* components and services are assumed.	4 / 5
Workflow Clarity	A loading decision tree, an ordered error-handling hierarchy, and a UI State Checklist supply sequence and a checkpoint, but there are no explicit validate->fix->retry feedback loops for the patterns described.	3 / 5
Progressive Disclosure	Section headers and tables give reasonable structure, but no bundle files exist and all ~500 lines are inlined; content like forms and dialogs could be offloaded to one-level-deep references.	3 / 5
	Total	13 / 20 Passed

Description

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

The description is well-constructed, clearly stating both the capability domain and explicit use-when triggers in third person with natural terminology. It is comprehensive on completeness and only slightly short of the top anchors on specificity and trigger-term coverage.

Dimension	Reasoning	Score
Specificity	Names several concrete capability areas — 'loading states, error handling, and data display' — but frames them as domains rather than discrete actions, leaving minor coverage gaps short of the comprehensive anchor.	4 / 5
Completeness	Clearly answers 'what' ('Modern Angular UI patterns for loading states, error handling, and data display') and explicitly answers 'when' with concrete trigger phrases ('Use when building UI components, handling async data, or managing component states').	5 / 5
Trigger Term Quality	'building UI components, handling async data, or managing component states' are natural phrases users say when building Angular UI, with good keyword coverage though a few synonyms are missing.	4 / 5
Distinctiveness Conflict Risk	Scoped specifically to Angular UI patterns with distinct triggers; minor overlap risk with the related 'angular-state-management' skill it references.	4 / 5
	Total	17 / 20 Passed

Validation

87%

Warnings & errors only

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

Validation — 14 / 16 Passed

Validation for skill structure

Criteria	Description	Result
skill_md_line_count	SKILL.md is long (513 lines); consider splitting into references/ and linking	Warning
frontmatter_unknown_keys	Unknown frontmatter key(s) found; consider removing or moving to metadata	Warning

	Total	14 / 16 Passed

Repository: administrakt0r/AI-Agents-Safe-Coding-Skills
Path: plugins/AI-Agents-Safe-Coding-Skills/skills/angular-ui-patterns/SKILL.md
Commit: 900c504

Reviewed: 2 hours ago

Table of Contents

Discovery Implementation Validation

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.