@dubsdotapp/expo 0.5.16 → 0.5.18

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dubsdotapp/expo",
-  "version": "0.5.16",
+  "version": "0.5.18",
   "description": "React Native SDK for the Dubs betting platform",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
@@ -24,20 +24,22 @@
     "build": "tsup",
     "typecheck": "tsc --noEmit",
     "dev": "tsup --watch",
-    "clean": "rm -rf dist"
+    "clean": "rm -rf dist",
+    "prepublishOnly": "npm run clean && npm run build"
   },
   "dependencies": {
     "bs58": "^5.0.0",
     "expo-crypto": "~14.0.0",
+    "socket.io-client": "^4.8.3",
     "tweetnacl": "^1.0.3"
   },
   "peerDependencies": {
     "@solana/web3.js": "^1.90.0",
     "expo-device": ">=6.0.0",
+    "expo-notifications": ">=0.28.0",
     "expo-secure-store": ">=13.0.0",
     "react": ">=18.0.0",
-    "react-native": ">=0.72.0",
-    "expo-notifications": ">=0.28.0"
+    "react-native": ">=0.72.0"
   },
   "peerDependenciesMeta": {
     "expo-secure-store": {

package/src/chat/hooks.ts

@@ -0,0 +1,320 @@
+import { useState, useCallback, useEffect, useRef } from 'react';
+import { useDubs } from '../provider';
+import { useChatContext } from './provider';
+import type {
+  ChatMessage,
+  OnlineUser,
+  ChatConnectionStatus,
+  Conversation,
+  DirectMessage,
+  FriendUser,
+  FriendRequest,
+  SendMessageParams,
+} from './types';
+
+// ── Connection ──
+
+/** Get the current chat connection status */
+export function useChatStatus(): ChatConnectionStatus {
+  return useChatContext().status;
+}
+
+// ── Global Chat ──
+
+/** Get global chat messages with refetch */
+export function useChatMessages(): {
+  messages: ChatMessage[];
+  loading: boolean;
+  refetch: () => Promise<void>;
+} {
+  const { messages, refreshMessages } = useChatContext();
+  const [loading, setLoading] = useState(false);
+
+  const refetch = useCallback(async () => {
+    setLoading(true);
+    await refreshMessages();
+    setLoading(false);
+  }, [refreshMessages]);
+
+  return { messages, loading, refetch };
+}
+
+/** Send a message to global chat (via socket for real-time, falls back to REST) */
+export function useSendMessage(): {
+  send: (params: SendMessageParams) => void;
+  sendViaREST: (params: { message: string; replyToId?: number }) => Promise<void>;
+} {
+  const { socket } = useChatContext();
+  const { client } = useDubs();
+
+  const send = useCallback(
+    (params: SendMessageParams) => {
+      socket.sendMessage(params);
+    },
+    [socket],
+  );
+
+  const sendViaREST = useCallback(
+    async (params: { message: string; replyToId?: number }) => {
+      await client.sendChatMessage(params);
+    },
+    [client],
+  );
+
+  return { send, sendViaREST };
+}
+
+/** Get online users and count */
+export function useOnlineUsers(): { users: OnlineUser[]; count: number } {
+  const { onlineUsers, onlineCount } = useChatContext();
+  return { users: onlineUsers, count: onlineCount };
+}
+
+/** Get unread notification count */
+export function useUnreadCount(): number {
+  return useChatContext().unreadCount;
+}
+
+// ── DMs ──
+
+/** Get DM conversations inbox */
+export function useConversations(): {
+  conversations: Conversation[];
+  loading: boolean;
+  refetch: () => Promise<void>;
+} {
+  const { conversations, refreshConversations } = useChatContext();
+  const [loading, setLoading] = useState(false);
+
+  const refetch = useCallback(async () => {
+    setLoading(true);
+    await refreshConversations();
+    setLoading(false);
+  }, [refreshConversations]);
+
+  return { conversations, loading, refetch };
+}
+
+/** Get DM thread with a specific user by wallet address */
+export function useDirectMessages(recipientWallet: string): {
+  messages: DirectMessage[];
+  loading: boolean;
+  otherUser: { id: number; username: string; avatar: string | null; walletAddress: string } | null;
+  send: (message: string) => void;
+  sendViaREST: (message: string) => Promise<void>;
+  markRead: () => void;
+  refetch: () => Promise<void>;
+} {
+  const { client } = useDubs();
+  const { socket, refreshConversations } = useChatContext();
+  const [messages, setMessages] = useState<DirectMessage[]>([]);
+  const [otherUser, setOtherUser] = useState<{ id: number; username: string; avatar: string | null; walletAddress: string } | null>(null);
+  const [loading, setLoading] = useState(true);
+
+  const refetch = useCallback(async () => {
+    try {
+      setLoading(true);
+      const res = await client.getConversation(recipientWallet);
+      setMessages(res.messages);
+      setOtherUser(res.otherUser);
+    } catch (err) {
+      console.error('[Dubs:useDirectMessages] Error loading:', err);
+    } finally {
+      setLoading(false);
+    }
+  }, [client, recipientWallet]);
+
+  // Load on mount and join DM room
+  useEffect(() => {
+    refetch();
+    socket.joinDM(recipientWallet);
+    return () => {
+      socket.leaveDM(recipientWallet);
+    };
+  }, [recipientWallet, refetch, socket]);
+
+  // Listen for new DMs via socket
+  const socketRef = useRef(socket);
+  socketRef.current = socket;
+
+  useEffect(() => {
+    const currentSocket = socketRef.current;
+    const prevListeners = (currentSocket as any).listeners;
+
+    // Augment listeners to catch DM messages for this conversation
+    const originalOnDMNew = prevListeners?.onDMNewMessage;
+    currentSocket.setListeners({
+      ...prevListeners,
+      onDMNewMessage: (msg: DirectMessage) => {
+        originalOnDMNew?.(msg);
+        // Check if this message belongs to our conversation
+        if (msg.senderWallet === recipientWallet || msg.isOwn) {
+          setMessages((prev) => {
+            if (prev.some((m) => m.id === msg.id)) return prev;
+            return [...prev, msg];
+          });
+        }
+      },
+      onDMMessageSent: (msg: DirectMessage) => {
+        setMessages((prev) => {
+          if (prev.some((m) => m.id === msg.id)) return prev;
+          return [...prev, { ...msg, isOwn: true }];
+        });
+      },
+    });
+  }, [recipientWallet]);
+
+  const send = useCallback(
+    (message: string) => {
+      socket.sendDM({ recipientWallet, message });
+    },
+    [socket, recipientWallet],
+  );
+
+  const sendViaREST = useCallback(
+    async (message: string) => {
+      await client.sendDirectMessage({ recipientWallet, message });
+      await refetch();
+      await refreshConversations();
+    },
+    [client, recipientWallet, refetch, refreshConversations],
+  );
+
+  const markRead = useCallback(() => {
+    socket.markDMRead(recipientWallet);
+  }, [socket, recipientWallet]);
+
+  return { messages, loading, otherUser, send, sendViaREST, markRead, refetch };
+}
+
+// ── Social ──
+
+/** Get friends list */
+export function useFriends(): {
+  friends: FriendUser[];
+  loading: boolean;
+  refetch: () => Promise<void>;
+} {
+  const { friends, refreshFriends } = useChatContext();
+  const [loading, setLoading] = useState(false);
+
+  const refetch = useCallback(async () => {
+    setLoading(true);
+    await refreshFriends();
+    setLoading(false);
+  }, [refreshFriends]);
+
+  return { friends, loading, refetch };
+}
+
+/** Get pending friend requests */
+export function useFriendRequests(): {
+  requests: FriendRequest[];
+  loading: boolean;
+  refetch: () => Promise<void>;
+} {
+  const { pendingRequests, refreshPendingRequests } = useChatContext();
+  const [loading, setLoading] = useState(false);
+
+  const refetch = useCallback(async () => {
+    setLoading(true);
+    await refreshPendingRequests();
+    setLoading(false);
+  }, [refreshPendingRequests]);
+
+  return { requests: pendingRequests, loading, refetch };
+}
+
+/** Search for users by username */
+export function useSearchUsers(): {
+  results: FriendUser[];
+  loading: boolean;
+  search: (query: string) => Promise<void>;
+  clear: () => void;
+} {
+  const { client } = useDubs();
+  const [results, setResults] = useState<FriendUser[]>([]);
+  const [loading, setLoading] = useState(false);
+
+  const search = useCallback(
+    async (query: string) => {
+      setLoading(true);
+      try {
+        const res = await client.searchUsers(query);
+        setResults(res.results);
+      } catch (err) {
+        console.error('[Dubs:useSearchUsers] Error:', err);
+      } finally {
+        setLoading(false);
+      }
+    },
+    [client],
+  );
+
+  const clear = useCallback(() => setResults([]), []);
+
+  return { results, loading, search, clear };
+}
+
+/** Send a friend request */
+export function useSendFriendRequest(): {
+  send: (targetUserId: number) => Promise<void>;
+  loading: boolean;
+} {
+  const { client } = useDubs();
+  const { refreshPendingRequests } = useChatContext();
+  const [loading, setLoading] = useState(false);
+
+  const send = useCallback(
+    async (targetUserId: number) => {
+      setLoading(true);
+      try {
+        await client.sendFriendRequest(targetUserId);
+      } finally {
+        setLoading(false);
+      }
+    },
+    [client, refreshPendingRequests],
+  );
+
+  return { send, loading };
+}
+
+/** Accept or reject a friend request */
+export function useRespondToFriendRequest(): {
+  accept: (requestId: number) => Promise<void>;
+  reject: (requestId: number) => Promise<void>;
+  loading: boolean;
+} {
+  const { client } = useDubs();
+  const { refreshFriends, refreshPendingRequests } = useChatContext();
+  const [loading, setLoading] = useState(false);
+
+  const accept = useCallback(
+    async (requestId: number) => {
+      setLoading(true);
+      try {
+        await client.acceptFriendRequest(requestId);
+        await Promise.all([refreshFriends(), refreshPendingRequests()]);
+      } finally {
+        setLoading(false);
+      }
+    },
+    [client, refreshFriends, refreshPendingRequests],
+  );
+
+  const reject = useCallback(
+    async (requestId: number) => {
+      setLoading(true);
+      try {
+        await client.rejectFriendRequest(requestId);
+        await refreshPendingRequests();
+      } finally {
+        setLoading(false);
+      }
+    },
+    [client, refreshPendingRequests],
+  );
+
+  return { accept, reject, loading };
+}

package/src/chat/index.ts

@@ -0,0 +1,40 @@
+// Provider
+export { ChatProvider, useChatContext } from './provider';
+export type { ChatProviderProps, ChatContextValue } from './provider';
+
+// Socket
+export { ChatSocket } from './socket';
+export type { ChatSocketConfig, ChatSocketListeners } from './socket';
+
+// Hooks
+export {
+  useChatStatus,
+  useChatMessages,
+  useSendMessage,
+  useOnlineUsers,
+  useUnreadCount,
+  useConversations,
+  useDirectMessages,
+  useFriends,
+  useFriendRequests,
+  useSearchUsers,
+  useSendFriendRequest,
+  useRespondToFriendRequest,
+} from './hooks';
+
+// Types
+export type {
+  ChatMessage,
+  ChatMention,
+  ChatPayment,
+  DirectMessage,
+  Conversation,
+  FriendUser,
+  FriendRequest,
+  OnlineUser,
+  TypingEvent,
+  ChatNotification,
+  ChatConnectionStatus,
+  SendMessageParams,
+  SendDMParams,
+} from './types';

package/src/chat/provider.tsx

@@ -0,0 +1,213 @@
+import React, { createContext, useContext, useEffect, useRef, useState, useCallback, useMemo } from 'react';
+import { AppState, type AppStateStatus } from 'react-native';
+import { useDubs } from '../provider';
+import { ChatSocket } from './socket';
+import type {
+  ChatMessage,
+  OnlineUser,
+  ChatConnectionStatus,
+  Conversation,
+  FriendUser,
+  FriendRequest,
+  DirectMessage,
+  ChatNotification,
+} from './types';
+
+export interface ChatContextValue {
+  /** The underlying socket manager */
+  socket: ChatSocket;
+  /** Connection status */
+  status: ChatConnectionStatus;
+  /** Global chat messages (newest last) */
+  messages: ChatMessage[];
+  /** Currently online users */
+  onlineUsers: OnlineUser[];
+  /** Online user count */
+  onlineCount: number;
+  /** Unread notification count */
+  unreadCount: number;
+  /** DM conversations */
+  conversations: Conversation[];
+  /** Friends list */
+  friends: FriendUser[];
+  /** Pending friend requests */
+  pendingRequests: FriendRequest[];
+  /** Reload messages from REST */
+  refreshMessages: () => Promise<void>;
+  /** Reload conversations from REST */
+  refreshConversations: () => Promise<void>;
+  /** Reload friends from REST */
+  refreshFriends: () => Promise<void>;
+  /** Reload pending friend requests from REST */
+  refreshPendingRequests: () => Promise<void>;
+}
+
+const ChatContext = createContext<ChatContextValue | null>(null);
+
+export interface ChatProviderProps {
+  children: React.ReactNode;
+  /** Set to false to disable auto-connect on mount. Default: true */
+  autoConnect?: boolean;
+}
+
+/**
+ * Provides chat, DM, and social context to child components.
+ * Must be rendered inside a <DubsProvider>.
+ */
+export function ChatProvider({ children, autoConnect = true }: ChatProviderProps) {
+  const { client } = useDubs();
+  const socketRef = useRef(new ChatSocket());
+
+  const [status, setStatus] = useState<ChatConnectionStatus>('disconnected');
+  const [messages, setMessages] = useState<ChatMessage[]>([]);
+  const [onlineUsers, setOnlineUsers] = useState<OnlineUser[]>([]);
+  const [onlineCount, setOnlineCount] = useState(0);
+  const [unreadCount, setUnreadCount] = useState(0);
+  const [conversations, setConversations] = useState<Conversation[]>([]);
+  const [friends, setFriends] = useState<FriendUser[]>([]);
+  const [pendingRequests, setPendingRequests] = useState<FriendRequest[]>([]);
+
+  // ── REST loaders ──
+
+  const refreshMessages = useCallback(async () => {
+    try {
+      const res = await client.getChatMessages({ limit: 30 });
+      // API returns newest-first — keep that order for inverted FlatList
+      setMessages(res.messages);
+    } catch (err) {
+      console.error('[Dubs:ChatProvider] Failed to load messages:', err);
+    }
+  }, [client]);
+
+  const refreshConversations = useCallback(async () => {
+    try {
+      const res = await client.getConversations();
+      setConversations(res.conversations);
+    } catch (_) {
+      // DM service may not be deployed yet — silent fail
+    }
+  }, [client]);
+
+  const refreshFriends = useCallback(async () => {
+    try {
+      const res = await client.getFriends();
+      setFriends(res.friends);
+    } catch (_) {
+      // Social service may not be deployed yet — silent fail
+    }
+  }, [client]);
+
+  const refreshPendingRequests = useCallback(async () => {
+    try {
+      const res = await client.getPendingFriendRequests();
+      setPendingRequests(res.requests);
+    } catch (_) {
+      // Social service may not be deployed yet — silent fail
+    }
+  }, [client]);
+
+  // ── Socket setup ──
+
+  useEffect(() => {
+    const token = client.getToken();
+    if (!autoConnect || !token) return;
+
+    const chatSocket = socketRef.current;
+
+    // Derive host from client baseUrl: strip /api/developer/v1
+    const baseUrl = (client as any).baseUrl as string;
+    const host = new URL(baseUrl).origin;
+
+    chatSocket.setListeners({
+      onConnectionChange: setStatus,
+      // Global chat
+      onNewMessage: (msg) => {
+        setMessages((prev) => {
+          // Deduplicate by id
+          if (prev.some((m) => m.id === msg.id)) return prev;
+          // Prepend — newest-first for inverted FlatList
+          return [msg, ...prev];
+        });
+      },
+      onOnlineUsers: setOnlineUsers,
+      onOnlineCount: setOnlineCount,
+      onUnreadCount: setUnreadCount,
+      // Notifications trigger conversation refresh
+      onDMNotification: () => {
+        refreshConversations();
+      },
+      onNotification: (n: ChatNotification) => {
+        setUnreadCount((prev) => prev + 1);
+        // Refresh relevant lists on social notifications
+        if (n.type === 'friend_request') refreshPendingRequests();
+        if (n.type === 'friend_request_accepted') refreshFriends();
+      },
+      onFriendRequestAccepted: () => refreshFriends(),
+      onFriendRemoved: () => refreshFriends(),
+    });
+
+    chatSocket.connect({ host, token });
+
+    // Load initial data — friends/social loaded silently (may not be deployed yet)
+    refreshMessages();
+    refreshFriends().catch(() => {});
+    refreshPendingRequests().catch(() => {});
+
+    return () => {
+      chatSocket.disconnect();
+    };
+  }, [client, autoConnect, refreshMessages, refreshConversations, refreshFriends, refreshPendingRequests]);
+
+  // ── Reconnect on app foreground ──
+
+  useEffect(() => {
+    const handleAppState = (nextState: AppStateStatus) => {
+      if (nextState === 'active') {
+        const chatSocket = socketRef.current;
+        if (!chatSocket.isConnected()) {
+          const token = client.getToken();
+          if (token) {
+            const baseUrl = (client as any).baseUrl as string;
+            const host = new URL(baseUrl).origin;
+            chatSocket.connect({ host, token });
+          }
+        }
+        // Refresh data to catch up on missed events
+        refreshMessages();
+      }
+    };
+
+    const sub = AppState.addEventListener('change', handleAppState);
+    return () => sub.remove();
+  }, [client, refreshMessages, refreshConversations]);
+
+  const value = useMemo<ChatContextValue>(
+    () => ({
+      socket: socketRef.current,
+      status,
+      messages,
+      onlineUsers,
+      onlineCount,
+      unreadCount,
+      conversations,
+      friends,
+      pendingRequests,
+      refreshMessages,
+      refreshConversations,
+      refreshFriends,
+      refreshPendingRequests,
+    }),
+    [status, messages, onlineUsers, onlineCount, unreadCount, conversations, friends, pendingRequests, refreshMessages, refreshConversations, refreshFriends, refreshPendingRequests],
+  );
+
+  return <ChatContext.Provider value={value}>{children}</ChatContext.Provider>;
+}
+
+/** Access the chat context. Must be used inside <ChatProvider>. */
+export function useChatContext(): ChatContextValue {
+  const ctx = useContext(ChatContext);
+  if (!ctx) {
+    throw new Error('useChatContext must be used inside a <ChatProvider>');
+  }
+  return ctx;
+}