> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify.com/ably/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Presence

The presence feature of a chat room enables online users to advertise to others that they are online. Use this feature to build online status indicators to display who is online in a chat room.

## Subscribe to Presence

<Tabs>
  <Tab name="JavaScript">
    <Code>
      ```javascript theme={null}
      const { unsubscribe } = room.presence.subscribe((event) => {
        console.log(`Presence event ${event.type} from ${event.member.clientId}`);
      });
      ```
    </Code>
  </Tab>

  <Tab name="React">
    <Code>
      ```react theme={null}
      import { usePresenceListener } from '@ably/chat/react';

      const MyComponent = () => {
        const { presenceData, error } = usePresenceListener({
          listener: (event) => {
            console.log('Presence event: ', event);
          },
        });

        return (
          <div>
            <p>Presence data:</p>
            {presenceData.map((presence) => (
              <li key={presence.clientId}>{presence.clientId}</li>
            ))}
          </div>
        );
      };
      ```
    </Code>
  </Tab>

  <Tab name="Swift">
    <Code>
      ```swift theme={null}
      let presenceSubscription = room.presence.subscribe()
      for await event in presenceSubscription {
          print("Presence event `\(event.type)` from `\(event.member.clientId)`")
      }
      ```
    </Code>
  </Tab>

  <Tab name="Android / Kotlin">
    <Code>
      ```android theme={null}
      import com.ably.chat.Room
      import com.ably.chat.extensions.compose.collectAsPresenceMembers

      @Composable
      fun PresenceComponent(room: Room) {
        val presenceMembers by room.collectAsPresenceMembers()

        Text("Present members: ${presenceMembers.size}")
        presenceMembers.forEach { member ->
          Text("${member.clientId} is present")
        }
      }
      ```
    </Code>
  </Tab>
</Tabs>

## Set User Presence

Users can enter and leave the presence set of a room to indicate when they are online or offline.

<Tabs>
  <Tab name="JavaScript">
    <Code>
      ```javascript theme={null}
      await room.presence.enter({ status: 'available' });
      await room.presence.update({ status: 'busy' });
      await room.presence.leave({ status: 'Be back later!' });
      ```
    </Code>
  </Tab>

  <Tab name="React">
    <Code>
      ```react theme={null}
      import { usePresence } from '@ably/chat/react';

      const MyComponent = () => {
        const presenceParams = {
          initialData: { status: 'Online' },
        };

        const { myPresenceState, update } = usePresence(presenceParams);

        return (
          <div>
            <div>Presence status: {myPresenceState.present ? 'Online' : 'Offline'}</div>
            <button onClick={() => update({ status: 'Away' })}>Set Away</button>
          </div>
        );
      };
      ```
    </Code>
  </Tab>

  <Tab name="Swift">
    <Code>
      ```swift theme={null}
      try await room.presence.enter(withData: ["status": "Online"])
      try await room.presence.update(withData: ["status": "Busy"])
      try await room.presence.leave(withData: ["status": "Be back later!"])
      ```
    </Code>
  </Tab>

  <Tab name="Android / Kotlin">
    <Code>
      ```android theme={null}
      import com.ably.chat.json.*

      room.presence.enter(
          jsonObject {
              put("status", "Online")
          },
      )

      room.presence.update(
          jsonObject {
              put("status", "Busy")
          },
      )

      room.presence.leave(
          jsonObject {
              put("status", "Be back later!")
          },
      )
      ```
    </Code>
  </Tab>
</Tabs>

## Retrieve the Presence Set

<Tabs>
  <Tab name="JavaScript">
    <Code>
      ```javascript theme={null}
      const presentMembers = await room.presence.get();
      const presentMember = await room.presence.get({ clientId: 'clemons123' });
      const isPresent = await room.presence.isUserPresent('clemons123');
      ```
    </Code>
  </Tab>

  <Tab name="Swift">
    <Code>
      ```swift theme={null}
      let presentMembers = try await room.presence.get()
      let presentMember = try await room.presence.get(withParams: .init(clientID: "clemons123"))
      let isPresent = try await room.presence.isUserPresent(withClientID: "clemons123")
      ```
    </Code>
  </Tab>

  <Tab name="Android / Kotlin">
    <Code>
      ```android theme={null}
      val presentMembers = room.presence.get()
      val presentMember = room.presence.get(clientId = "clemons123")
      val isPresent = room.presence.isUserPresent("client-id")
      ```
    </Code>
  </Tab>
</Tabs>

## Next Steps

* Learn about [typing indicators](/docs/chat/rooms/typing-indicators)
* Explore [room reactions](/docs/chat/rooms/reactions)
* Understand [room occupancy](/docs/chat/rooms/occupancy)
