Use conversations

import { useConversations } from "@sublay/react-js";

function ConversationList() {
  const { conversations, loading, hasMore, loadMore, refresh } =
    useConversations({ types: ["direct", "group"] });

  return (
    <div>
      {conversations.map((convo) => (
        <div key={convo.id}>
          <strong>{convo.name ?? "Direct Message"}</strong>
          {convo.unreadCount > 0 && <span>{convo.unreadCount} unread</span>}
        </div>
      ))}
      {hasMore && (
        <button onClick={loadMore} disabled={loading}>
          Load more
        </button>
      )}
    </div>
  );
}