Files
supabase/apps/ui-library/content/docs/react/realtime-avatar-stack.mdx
T
Ivan Vasilov a81d056d79 feat: Extra components for UI Library (#34363)
* Fix the v0 button. Add some more docs. (+13 squashed commits)
Squashed commits:
[cc5954779e] Add success state to the forgot-password form.
[258bfb1015] Simplify the tanstack auth block.
[1ba5c223d9] Add missing pages to the nextjs auth.
[b842e4acec] Fix the env vars in the React client.
[2a2bcc5356] Fix the command URL.
[a26a2d36c2] Add a tanstack block for password-based auth.
[d68881f0d5] Fix the tanstack client.
[1fd2e16d96] Add missing deps to satisfy TS build.
[9797d745df] Various fixes.
[3e9b676e99] Fix the registryBlock component.
[540a5d600b] Set the supabase project for testing.
[3eba892c92] Regenerate the llms.txt file.
[bf526a0ecb] Regenerate the registry files.

* Add current user avatar.

* Add RealtimeAvatarStack.

* Use the fields which are populated by Auth.

* Regenerate the registry files.

* Fix the imports.

* Rebuild the registry files. Add a github login to the supabase config.

* Minor fixes for the components.

* Minor fix to the avatar stack.

* Remove peekCode, show showCode prop to component preview.

* Add examples for avatar stack and current user avatar.

* Use the new generatenames function in the cursors.

* Add documentation for avatar stack and avatar.

* Switch the profile images.

* Fix a type error.

* More fixes.
2025-03-27 17:41:31 +01:00

22 lines
626 B
Plaintext

---
title: Realtime Avatar Stack
description: Avatar stack in realtime
---
<ComponentPreview name="realtime-avatar-stack-demo" showCode={false} />
## Installation
<BlockItem
name="realtime-avatar-stack-react"
description="Renders a stack of avatars which are connected via Supabase Realtime"
/>
## Folder structure
<RegistryBlock itemName="realtime-avatar-stack-react" />
## Usage
The `RealtimeAvatarStack` renders stacked avatars which are connected to Supabase Realtime. Specifically, it uses the Presence feature. You can use this to show currently online users in a chatroom, game session or collaborative app.