Creates route-scoped React and Astro components that own their own data fetching.
npx skills add https://github.com/gabriellst/codm --skill component-gabriellst
Please help me install this Agent Skill. Skill: component Source: https://github.com/gabriellst/codm/tree/main/.claude/skills/component Command: npx skills add https://github.com/gabriellst/codm --skill component-gabriellst
High-intent search queries and answers about installing and using this skill.
Use getRouteApi to read search params via routeApi.useSearch(), then call the SDK query hook inside the component. The route never passes data as props; React Query deduplicates identical requests across components.
Apply the rule: am I rendered N times in a .map()? If yes, the component is a leaf and receives a single item as a prop while the parent owns the list query. Leaves may own mutations but should not re-fetch the item they received.
No. Astro frontmatter runs at build or SSR time, so hooks like useState or useQuery never execute there. Move the interactive piece into a .tsx React island and mount it from the .astro file with a client directive such as client:visible.
client:load ships JavaScript during initial page load and suits critical above-the-fold interactivity. client:visible defers hydration until the island scrolls into view and is the default choice for below-the-fold widgets like forms or carousels.
Use the primitive skill for reusable design system components, the route skill for new pages, the form skill for validated forms, and the store skill for Zustand state management. This skill covers route-specific components and dialog shells only.
DavidTejuSeparate Prisma types in Next.js client components to avoid node:module errors.
epamStandardize Playwright e2e tests for ai-dial-chat with fixtures and page objects.
NoyoucringeReview and write n8n UI copy against terminology and tone guidelines.
FlintmereGenerate a reusable UI primitive spec with TSX sketch, props API, variants, states, accessibility, and tokens.
