chat-realtime-and-presence

Implement real-time chat with presence status and notifications using Supabase Realtime.

Updated May 30, 2026
One-click install
npx skills add https://github.com/buitrankimlong/thongtincty --skill chat-realtime-and-presence
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: chat-realtime-and-presence
Source: https://github.com/buitrankimlong/thongtincty/tree/main/.claude/skills/chat-realtime-and-presence
Command: npx skills add https://github.com/buitrankimlong/thongtincty --skill chat-realtime-and-presence

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires supabase-js, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill provides a comprehensive set of real-time chat features, including typing indicators and presence status, enhancing user engagement and communication in chat applications.

Core Features & Use Cases

  • Realtime Inbox-Level Notifications: Receive instant notifications for new messages, with toast, bell, and badge notifications.
  • Room-Level Realtime Chat: Send and receive messages, update read receipts, and handle message deletions within a specific chat room.
  • Presence Status: Show typing indicators and online status to other chat participants.
  • Use Case: Integrate this Skill into your chat application to offer a seamless and interactive communication experience, ideal for team collaboration and social networking.

Quick Start

Run the chat-realtime-and-presence skill to enable real-time chat features in your application.

Frequently Asked Questions about chat-realtime-and-presence

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I implement real-time chat features with typing indicators and presence status in a web application?

Real-time chat features with typing indicators and presence status are implemented by handling PostgreSQL change events and tracking user presence. This approach updates UI components instantly, supporting inbox-level notifications and room-level message handling.

Does Supabase Realtime support room-level message handling and online status tracking?

Supabase Realtime supports room-level message handling and online status tracking by listening to PostgreSQL change events. It enables web applications to manage message deletions, read receipts, and live presence updates efficiently.

How do I add real-time inbox notifications to a chat application using PostgreSQL change events?

Real-time inbox notifications are added by subscribing to PostgreSQL change events through Supabase Realtime. This triggers instant UI updates for new messages, allowing you to display toast, bell, and badge notifications directly to users.

Can I handle message deletions and read receipts within a specific chat room using Supabase JS?

Supabase JS allows you to handle message deletions and update read receipts within a specific chat room. By processing real-time database events, the UI accurately reflects the current message state for all participants.

What is the best way to show typing indicators and online status to other chat participants?

The best way to show typing indicators and online status is by implementing presence tracking via Supabase Realtime. This broadcasts user state changes instantly, updating the UI to reflect active typing and online availability.

Why do I need Supabase Realtime for real-time chat features instead of standard HTTP requests?

Supabase Realtime is needed because standard HTTP requests cannot push PostgreSQL change events instantly. Supabase Realtime maintains persistent connections to update UI components immediately, ensuring seamless inbox notifications and presence status.