use-truapi
Chat

useChatRooms

Rooms the product participates in, as a live list

useChatRooms subscribes to the host's chat list. data is a ChatRoom[]; each entry carries the roomId and how the product participates in it (participatingAs is "RoomHost" or "Bot"). The list updates live as rooms are registered.

The result is seeded with an empty array, so it settles immediately instead of staying pending until the first push. Any number of components can mount the hook; they share one watch against the host, which is dropped when the last consumer unmounts.

Chat is host-only. Running standalone the subscription fails and the result flips to the error state with HostUnavailableError (the last data, here the empty seed, is retained on data).

Usage

import { useChatRooms } from "@use-truapi/react";

function RoomList() {
  const { data: rooms, error } = useChatRooms();

  if (error) return <p>Chat unavailable: {error.message}</p>;
  if (!rooms?.length) return <p>No rooms yet.</p>;

  return (
    <ul>
      {rooms.map((room) => (
        <li key={room.roomId}>
          {room.roomId} (as {room.participatingAs})
        </li>
      ))}
    </ul>
  );
}
<script setup lang="ts">
import { useChatRooms } from "@use-truapi/vue";

const { data: rooms, error } = useChatRooms();
</script>

<template>
  <p v-if="error">Chat unavailable: {{ error.message }}</p>
  <p v-else-if="!rooms?.length">No rooms yet.</p>
  <ul v-else>
    <li v-for="room in rooms" :key="room.roomId">
      {{ room.roomId }} (as {{ room.participatingAs }})
    </li>
  </ul>
</template>

Values are pushed, not polled. There is nothing to refetch; fresh lists arrive on their own.

See also

API reference

React

function useChatRooms(options?): UseQueryResult<ChatRoom[], Error>;

Rooms the product participates in, live.

Parameters

ParameterType
options?{ query?: QueryOptions<ChatRoom[]>; }
options.query?QueryOptions<ChatRoom[]>

Returns

UseQueryResult<ChatRoom[], Error>

Vue

function useChatRooms(options?): QueryResult<ChatRoom[]>;

Rooms the product participates in, live.

Parameters

ParameterType
options?{ query?: QueryOptions<ChatRoom[]>; }
options.query?QueryOptions<ChatRoom[]>

Returns

QueryResult<ChatRoom[]>

On this page