cometchat-astro-patterns
Ground truth:
@cometchat/chat-uikit-react@^6(+@cometchat/calls-sdk-javascript@^5) — installed package types +ui-kit/react. Official docs: https://www.cometchat.com/docs/ui-kit/react/overview · Docs MCP:claude mcp add --transport http cometchat-docs https://www.cometchat.com/docs/mcp(or fetch the URL directly without MCP). Verify symbols against the installed package/source before relying on them.
Purpose
This skill teaches Claude how to integrate CometChat into an Astro project using React islands. Astro is a static-first framework -- most of the page is HTML rendered at build time. Interactive React components run as isolated "islands" in the browser. CometChat components are React islands that must use client:only="react" to bypass server rendering entirely.
Read these companion skills first:
cometchat-core-- initialization, login, CSS, provider pattern, anti-patternscometchat-components-- component catalog and composition patternscometchat-placement-- WHERE to put chat (route, modal, drawer, embedded)
1. Project detection
A project uses Astro when package.json has astro as a dependency. CometChat integration also requires the React integration: