liveblocks-best-practiceslisted
Use this skill when building, debugging, or answering questions about Liveblocks. Liveblocks gives you the building blocks and infrastructure to enable people and AI to work together inside your app, powering realtime collaboration. Liveblocks features include collaboration, rooms, organizations, workspaces, comments, composer, threads, notifications, multiplayer, conflict resolution, realtime presence, avatar stacks, AI collaborators, AI agents, text editors, Tiptap, BlockNote, Lexical, React Flow, Chat SDK. Common components include AiChat, Thread, InboxNotification, Composer, Toolbar (for Lexical Tiptap), FloatingToolbar, FloatingComposer, FloatingThreads, AnchoredThreads. Common hooks include useThreads, useStorage, useMutation, useOthers, useInboxNotifications, useAiChats. Common issues are related to authentication (ID tokens vs access tokens), permissions, room limits, connection errors, user info.
nateruze/ghost_ai · ★ 0 · AI & Automation · score 65
Install: claude install-skill nateruze/ghost_ai
# Liveblocks best practices
## When to use this skill
Use this skill when implementing features using any Liveblocks packages, for
example [`@liveblocks/react`](https://www.npmjs.com/package/@liveblocks/react)
or [`@liveblocks/node`](https://www.npmjs.com/package/@liveblocks/node). This
could be related to features like realtime multiplayer, commenting,
notifications, cursors, avatar stacks, AI, and more. This also includes
technologies like Liveblocks Storage, Yjs, Tiptap, BlockNote, Lexical, React
Flow, tldraw, and more.
## Quick reference
A number of reference files are available in the `references/` directory. You
must read the list below, and load relevant files as needed. For example,
`add-user-information` is available in the `references/add-user-information.md`
file.
## References
- `add-user-information`: Add user information to your application, such as
name, avatar, color, and more. Users will no longer be anonymous. Useful for
displaying user info in comments, comments mention suggestions, notifications,
cursors, avatar stacks.
- `ai-as-a-collaborator`: Use agentic workflows to allow AI to collaborate like
a human inside your Liveblocks application.
- `ai-chats-with-tools-knowledge-components`: Set up and troubleshoot chats with
RAG, knowledge, custom components, tool calling, custom models. Different to
AI as a collaborator, as it is NOT workflow based.
- `auth-endpoint-callback`: Use a callback function to authenticate users,
instead of passi