@poolse/react 1.1.0 → 2.0.0

package/CHANGELOG.md

@@ -4,6 +4,27 @@ All notable changes to `@poolse/react` are documented here. Format follows
 [Keep a Changelog](https://keepachangelog.com/en/1.1.0/); versions follow
 [semver](https://semver.org).
 
+## [2.0.0] — 2026-06-03
+
+Lockstep release with `@poolse/sdk@2.0.0` and `@poolse/react-ui@2.0.0`.
+
+### Breaking
+
+- **`useUser(externalId)`** — was `useUser(userId)`. The hook now
+  consumes the tenant's own user id. Pass the value from
+  `message.sender_external_id`, `membership.external_id`, or any
+  other external_id-shaped field on the wire.
+- **`useTyping(conversationId).typing`** now returns `Set<externalId>`
+  (was `Set<userId>`). Same for `usePresence(conversationId).online`.
+- **`useMembers(conversationId).removeMember(externalId)`** — was
+  `removeMember(userId)`. The hook translates external_id → user_id
+  internally; the DELETE endpoint still takes user_id but you don't
+  see it.
+
+### Migration
+
+See `MIGRATING.md` at the repo root.
+
 ## [1.1.0] — 2026-06-02
 
 Lockstep release with `@poolse/sdk@1.1.0` and `@poolse/react-ui@1.1.0`.

package/README.md

@@ -2,6 +2,8 @@
 
 React hooks for [poolse](https://poolse.dev). Wraps the [`@poolse/sdk`](https://www.npmjs.com/package/@poolse/sdk) client in a provider + a hook per resource — `useMessages`, `useThread`, `useReactions`, `useTyping`, `usePresence`, `useMembers`, `useAttachmentUpload`, and so on. No UI. If you want components, see [`@poolse/react-ui`](https://www.npmjs.com/package/@poolse/react-ui).
 
+> **⚠️ Upgrading from 1.x?** See [MIGRATING.md](https://github.com/poolse-hq/js-sdk/blob/main/MIGRATING.md). `useUser`, `useTyping`, `usePresence`, and `useMembers().removeMember` all key by your `external_id` now instead of poolse uuids.
+
 ## Install
 
 ```bash

package/dist/index.cjs

@@ -269,11 +269,14 @@ function useMembers(conversationId) {
     [chat, conversationId]
   );
   const removeMember = react.useCallback(
-    async (userId) => {
+    async (externalId) => {
       const snapshot = membersRef.current;
-      setMembers((prev) => prev.filter((m) => m.user_id !== userId));
+      const target = snapshot.find((m) => m.external_id === externalId);
+      if (!target) return;
+      const targetUserId = target.user_id;
+      setMembers((prev) => prev.filter((m) => m.external_id !== externalId));
       try {
-        await chat.conversations.one(conversationId).removeMember(userId);
+        await chat.conversations.one(conversationId).removeMember(targetUserId);
       } catch (err) {
         setMembers(snapshot);
         throw err;
@@ -294,6 +297,8 @@ function useMessages(conversationId) {
   const oldestSequenceRef = react.useRef(null);
   const meIdRef = react.useRef(me?.id ?? null);
   meIdRef.current = me?.id ?? null;
+  const meExternalIdRef = react.useRef(me?.external_id ?? null);
+  meExternalIdRef.current = me?.external_id ?? null;
   react.useEffect(() => {
     let cancelled = false;
     setLoading(true);
@@ -378,6 +383,7 @@ function useMessages(conversationId) {
         // here would briefly flash the row on the "other" side until
         // the realtime echo replaced it with the canonical row.
         sender_id: meIdRef.current,
+        sender_external_id: meExternalIdRef.current,
         type: attrs.type ?? "text",
         body: attrs.body ?? null,
         reply_to_id: attrs.reply_to_id ?? null,
@@ -615,6 +621,7 @@ function useThread(conversationId, rootMessageId) {
         tenant_id: "",
         conversation_id: conversationId,
         sender_id: null,
+        sender_external_id: null,
         type: attrs.type ?? "text",
         body: attrs.body ?? null,
         reply_to_id: rootMessageId,
@@ -712,26 +719,30 @@ function useTyping(conversationId) {
   const { me } = useMe();
   const [typing, setTyping] = react.useState(/* @__PURE__ */ new Set());
   const lastPingRef = react.useRef(0);
-  const meIdRef = react.useRef(me?.id ?? null);
-  meIdRef.current = me?.id ?? null;
+  const meExtRef = react.useRef(me?.external_id ?? null);
+  meExtRef.current = me?.external_id ?? null;
   react.useEffect(() => {
     setTyping(/* @__PURE__ */ new Set());
     const conv = chat.realtime.conversation(conversationId);
     const offStart = conv.onTypingStart((evt) => {
-      if (meIdRef.current && evt.user_id === meIdRef.current) return;
+      const ext = evt.external_id;
+      if (!ext) return;
+      if (meExtRef.current && ext === meExtRef.current) return;
       setTyping((prev) => {
-        if (prev.has(evt.user_id)) return prev;
+        if (prev.has(ext)) return prev;
         const next = new Set(prev);
-        next.add(evt.user_id);
+        next.add(ext);
         return next;
       });
     });
     const offStop = conv.onTypingStop((evt) => {
-      if (meIdRef.current && evt.user_id === meIdRef.current) return;
+      const ext = evt.external_id;
+      if (!ext) return;
+      if (meExtRef.current && ext === meExtRef.current) return;
       setTyping((prev) => {
-        if (!prev.has(evt.user_id)) return prev;
+        if (!prev.has(ext)) return prev;
         const next = new Set(prev);
-        next.delete(evt.user_id);
+        next.delete(ext);
         return next;
       });
     });
@@ -748,6 +759,14 @@ function useTyping(conversationId) {
   }, [chat, conversationId]);
   return { typing, signalTyping };
 }
+function externalIdsFrom(state) {
+  const out = [];
+  for (const presence of Object.values(state)) {
+    const meta = presence?.metas?.[0];
+    if (meta?.external_id) out.push(meta.external_id);
+  }
+  return out;
+}
 function usePresence(conversationId) {
   const chat = usePoolse();
   const [online, setOnline] = react.useState(/* @__PURE__ */ new Set());
@@ -756,13 +775,13 @@ function usePresence(conversationId) {
     if (!conversationId) return;
     const conv = chat.realtime.conversation(conversationId);
     const applyState = (state) => {
-      setOnline(new Set(Object.keys(state)));
+      setOnline(new Set(externalIdsFrom(state)));
     };
     const applyDiff = (diff) => {
       setOnline((prev) => {
         const next = new Set(prev);
-        if (diff.joins) Object.keys(diff.joins).forEach((id) => next.add(id));
-        if (diff.leaves) Object.keys(diff.leaves).forEach((id) => next.delete(id));
+        if (diff.joins) externalIdsFrom(diff.joins).forEach((ext) => next.add(ext));
+        if (diff.leaves) externalIdsFrom(diff.leaves).forEach((ext) => next.delete(ext));
         return next;
       });
     };
@@ -919,32 +938,32 @@ function useAttachmentUrl(attachmentId) {
   return { url, loading, error };
 }
 var EMPTY = { profile: null, loading: false };
-function useUser(userId) {
+function useUser(externalId) {
   const chat = usePoolse();
   const [state, setState] = react.useState(() => {
-    if (!userId) return EMPTY;
-    const cached = chat.users.peek(userId);
+    if (!externalId) return EMPTY;
+    const cached = chat.users.peek(externalId);
     if (cached === void 0) return { profile: null, loading: true };
     return { profile: cached, loading: false };
   });
   react.useEffect(() => {
-    if (!userId) {
+    if (!externalId) {
       setState(EMPTY);
       return;
     }
     const apply = () => {
-      const cached = chat.users.peek(userId);
+      const cached = chat.users.peek(externalId);
       if (cached === void 0) {
         setState({ profile: null, loading: true });
-        void chat.users.get(userId);
+        void chat.users.get(externalId);
       } else {
         setState({ profile: cached, loading: false });
       }
     };
-    const off = chat.users.subscribe(userId, apply);
+    const off = chat.users.subscribe(externalId, apply);
     apply();
     return off;
-  }, [chat, userId]);
+  }, [chat, externalId]);
   return state;
 }