Hooks de mensajería para React
Muestra conversaciones e hilos con suscripciones ligadas a la sesión.
Esta referencia detallada de la API se mantiene en inglés y sigue el código del SDK enlazado. Los ejemplos con variables de aplicación requieren tu firmante, claves, almacenamiento o interfaz.
Layer 3 — React (/react)
Hooks built on useSyncExternalStore. Concurrent-mode safe; no double-renders.
tsx
import {
useDMSession,
useConversations,
useThread,
useUnreadCount,
useUnreadCounts,
} from "@nostr-wot/dm/react";
function Inbox({ myPubkey, signer, relays }) {
const { session, sendDM } = useDMSession({ signer, relays });
const conversations = useConversations(myPubkey);
const unreads = useUnreadCounts(myPubkey);
return conversations.map((c) => (
<Row
key={c.partnerPubkey}
preview={c.preview}
lastAt={c.lastMessageAt}
unread={unreads[c.partnerPubkey] ?? 0}
/>
));
}
function Thread({ myPubkey, partnerPubkey }) {
const messages = useThread(myPubkey, partnerPubkey);
const unread = useUnreadCount(myPubkey, partnerPubkey);
return <ChatLog messages={messages} unread={unread} />;
}useDMSession auto-subscribes to the inbox on mount and tears down on unmount. The returned sendDM is a stable callback bound to the session.
Types
ts
type DMMessage = {
id: string;
fromPubkey: string;
partnerPubkey: string;
content: string;
createdAt: number; // unix seconds
scheme: "nip04" | "nip17";
raw?: NostrEvent;
};
type DMConversation = {
partnerPubkey: string;
lastMessageAt: number;
preview: string;
messageCount: number;
};
interface DMStorage {
load(myPubkey: string): Promise<Record<string, DMMessage[]>>;
save(myPubkey: string, conversations: Record<string, DMMessage[]>): Promise<void>;
}