nextjs-client-cookie-pattern

Pattern for client components calling server actions to set cookies in Next.js. Covers the two-file pattern of a client component with user interaction (onClick, form submission) that calls a server action to modify cookies. Use when building features like authentication, preferences, or session management where client-side triggers need to set/modify server-side cookies.

Quality

79%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./.agents/skills/nextjs-client-cookie-pattern/SKILL.md

Quality

Content

71%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 highly actionable with complete, executable TypeScript examples and a clear implementation checklist. Its weaknesses are verbosity from redundant examples and conceptual explanations, and a monolithic structure that inlines material a progressive-disclosure design would split into reference files.

Suggestions

Collapse the three near-identical Real-World Examples into one canonical example plus a short table of variations, and trim the 'Why Two Files?' and 'Why This Pattern?' Q&A which restate concepts Claude already knows.

Move the detailed examples, common variations, and route-handler alternative into files under references/ and link to them one level deep so SKILL.md stays an overview.

Add an explicit verification checkpoint to the Quick Checklist (e.g. confirm the cookie is set in the browser and readable from a server component) to lift workflow clarity.

Dimension	Reasoning	Score
Conciseness	The body is mostly efficient executable code, but includes unnecessary explanations Claude already knows ('Client components run in the browser, and modern browsers restrict cookie manipulation for security', 'Why not use a Route Handler...') and three near-identical real-world examples that restate the same two-file pattern, so it could be tightened; not 2 because the core code earns its place, not 4 due to the repeated examples and conceptual prose.	3 / 5
Actionability	Multiple copy-paste-ready TypeScript snippets cover the common cases (theme toggle, cookie banner, language selector, form submission, redirect, reading cookies), fully matching the 5 anchor for executable coverage.	5 / 5
Workflow Clarity	The 'Quick Checklist' provides a clear, ordered sequence for implementing the pattern, but there are no explicit validation or error-recovery checkpoints; this is acceptable for a non-destructive pattern skill yet keeps it at 4 rather than 5.	4 / 5
Progressive Disclosure	Headers organize the ~390-line file well, but all detailed material (three full examples, common variations, route-handler alternative, reading-cookies section) is inlined with no bundle files or one-level-deep references, so content that could live in separate reference files is inline; this matches the 3 anchor and is below 4 because the SKILL.md acts as the detailed material rather than an overview.	3 / 5
	Total	15 / 20 Passed

Description

87%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 specific, uses third-person voice, and clearly answers both what the skill does and when to use it with concrete trigger phrases. It carves out a distinct niche with low conflict risk.

Dimension	Reasoning	Score
Specificity	Quotes 'client components calling server actions to set cookies' and 'client component with user interaction (onClick, form submission) that calls a server action to modify cookies' name the domain and several concrete actions, but coverage is centered on a single pattern rather than comprehensive, so it sits at 4 rather than 5.	4 / 5
Completeness	It explicitly answers both what ('Pattern for client components calling server actions to set cookies... two-file pattern...') and when ('Use when building features like authentication, preferences, or session management where client-side triggers need to set/modify server-side cookies'), matching the 5 anchor.	5 / 5
Trigger Term Quality	Natural terms like 'set cookies in Next.js', 'onClick', 'form submission', 'authentication', 'preferences', and 'session management' are present and user-likely, but a few synonyms (e.g. session tokens, user settings) and extensions are missing, placing it just below 5.	4 / 5
Distinctiveness Conflict Risk	The Next.js client-component-plus-server-action cookie niche is specific with distinct triggers and minimal overlap with other skills, matching the 5 anchor for a clear niche.	5 / 5
	Total	18 / 20 Passed

Validation

93%

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 — 15 / 16 Passed

Validation for skill structure

Criteria	Description	Result
allowed_tools_field	'allowed-tools' contains unusual tool name(s)	Warning

	Total	15 / 16 Passed

Repository: AzizBelhassan/timeverse
Path: .agents/skills/nextjs-client-cookie-pattern/SKILL.md
Commit: 9dc2cb4

Reviewed: ~16 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.