@syra.fm/sdk 0.4.0 → 0.5.0

package/src/live/hooks/useRoomUsers.ts

@@ -0,0 +1,52 @@
+import { useEffect, useRef, useCallback } from 'react';
+import { useAuth } from '@oxyhq/services';
+import { useLiveConfig } from '../context/LiveConfigContext';
+import type { UserEntity } from '../types';
+
+export function useRoomUsers(userIds: string[]) {
+  const { oxyServices } = useAuth();
+  const { ensureUserById } = useLiveConfig();
+  const resolvedRef = useRef<Set<string>>(new Set());
+
+  const loader = useCallback(
+    async (id: string) => {
+      if (!oxyServices) return null;
+      try {
+        return await oxyServices.getUserById(id);
+      } catch {
+        return null;
+      }
+    },
+    [oxyServices]
+  );
+
+  useEffect(() => {
+    if (!userIds.length || !oxyServices) return;
+    for (const id of userIds) {
+      if (!id || resolvedRef.current.has(id)) continue;
+      resolvedRef.current.add(id);
+      ensureUserById(id, loader).catch(() => {});
+    }
+  }, [userIds.join(','), oxyServices, ensureUserById, loader]);
+}
+
+export function getDisplayName(userProfile: UserEntity | undefined, userId: string, isCurrentUser?: boolean): string {
+  if (isCurrentUser) return 'You';
+  // The user source is always an Oxy user DTO (resolved via `oxyServices.getUserById`
+  // in `useRoomUsers` → `ensureUserById`), so `name.displayName` is the canonical,
+  // API-owned display string and is rendered directly. The `userId` slice is a
+  // not-yet-resolved loading fallback, NOT a name recompute.
+  if (!userProfile) return userId.slice(0, 10);
+  const name = userProfile.name;
+  if (typeof name === 'object' && name?.displayName) return name.displayName;
+  return userId.slice(0, 10);
+}
+
+export function getAvatarUrl(
+  userProfile: UserEntity | undefined,
+  oxyServices: unknown,
+  getCachedFileDownloadUrlSync: (oxyServices: unknown, fileId: string, variant?: string) => string
+): string | undefined {
+  if (!userProfile?.avatar || !oxyServices) return undefined;
+  return getCachedFileDownloadUrlSync(oxyServices, userProfile.avatar, 'thumb');
+}

package/src/live/index.ts

@@ -0,0 +1,92 @@
+// Types
+export type {
+  Room,
+  RoomParticipant,
+  Recording,
+  House,
+  HouseMember,
+  Series,
+  SeriesEpisode,
+  Recurrence,
+  RoomTemplate,
+  RoomAttachment,
+  RoomAttachmentData,
+  ParticipantsUpdateData,
+  MuteUpdateData,
+  SpeakerRequestData,
+  RecordingStateData,
+  StreamInfo,
+  UserEntity,
+  LiveTheme,
+  HttpRequestConfig,
+  HttpClient,
+  FileDownloadService,
+} from './types';
+
+// Validation
+export {
+  ZRoom,
+  ZRoomParticipant,
+  ZHouse,
+  ZHouseMember,
+  ZSeries,
+  ZRecurrence,
+  ZRoomTemplate,
+  ZSeriesEpisode,
+  ZRoomAttachment,
+  ZStartStreamResponse,
+  ZGenerateStreamKeyResponse,
+  ZStreamInfo,
+  ZRecording,
+  validateRoom,
+  validateRooms,
+  validateHouse,
+  validateSeries,
+  validateRecording,
+  validateRecordings,
+} from './validation';
+
+// Context
+export {
+  LiveConfigProvider,
+  useLiveConfig,
+  type LiveConfig,
+  type LiveConfigInternal,
+} from './context/LiveConfigContext';
+export { LiveRoomProvider, useLiveRoom } from './context/LiveRoomContext';
+
+// Services
+export {
+  createRoomsService,
+  type RoomsServiceInstance,
+  type CreateRoomData,
+  type PodcastResult,
+  type EpisodeListItem,
+} from './services/spacesService';
+export { RoomSocketService } from './services/spaceSocketService';
+export {
+  createGetRoomToken,
+  type GetRoomTokenFn,
+} from './services/livekitService';
+
+// Hooks
+export { useRoomConnection } from './hooks/useRoomConnection';
+export { useRoomAudio } from './hooks/useRoomAudio';
+export { useRoomUsers, getDisplayName, getAvatarUrl } from './hooks/useRoomUsers';
+export { useRoomManager } from './hooks/useRoomManager';
+export { useActiveSpeakers } from './hooks/useActiveSpeakers';
+
+// Components
+export { RoomCard } from './components/RoomCard';
+export { LiveRoomSheet } from './components/LiveRoomSheet';
+export { MiniRoomBar, MINI_BAR_HEIGHT } from './components/MiniRoomBar';
+export { StreamConfigModal } from './components/StreamConfigModal';
+export { StreamConfigPanel } from './components/StreamConfigPanel';
+export { InsightsPanel } from './components/InsightsPanel';
+export { CreateRoomSheet, type CreateRoomSheetRef, type CreateRoomFormState } from './components/CreateRoomSheet';
+export { RecordingsPanel } from './components/RecordingsPanel';
+export { RecordingCard } from './components/RecordingCard';
+
+// Assets
+export { LiveRoomsIcon, LiveRoomsIconActive } from './assets/icons/spaces-icon';
+export { SyraIcon, SyraIconActive } from './assets/icons/syra-icon';

package/src/live/services/livekitService.ts

@@ -0,0 +1,11 @@
+import type { HttpClient } from '../types';
+
+export type GetRoomTokenFn = (roomId: string) => Promise<{ token: string; url: string }>;
+
+export function createGetRoomToken(httpClient: Pick<HttpClient, 'post'>): GetRoomTokenFn {
+  return async function getRoomToken(roomId: string): Promise<{ token: string; url: string }> {
+    const res = await httpClient.post(`/rooms/${roomId}/token`);
+    const { token, url } = res;
+    return { token: String(token), url: String(url) };
+  };
+}

package/src/live/services/spaceSocketService.ts

@@ -0,0 +1,136 @@
+import { io, Socket } from 'socket.io-client';
+import type { RoomParticipant, ParticipantsUpdateData, MuteUpdateData, SpeakerRequestData } from '../types';
+
+type SimpleRoomCallback = (data: { roomId: string; timestamp?: string }) => void;
+
+export class RoomSocketService {
+  private socket: Socket | null = null;
+  private _isConnected = false;
+  private socketUrl: string;
+
+  constructor(socketUrl: string) {
+    this.socketUrl = socketUrl;
+  }
+
+  get isConnected(): boolean {
+    return this._isConnected;
+  }
+
+  connect(userId: string, token?: string): void {
+    if (this.socket?.connected) return;
+
+    // Clean up any existing disconnected/failed socket before creating a new one
+    if (this.socket) {
+      this.socket.removeAllListeners();
+      this.socket.disconnect();
+      this.socket = null;
+    }
+
+    const baseUrl = this.socketUrl || 'ws://localhost:3000';
+
+    this.socket = io(`${baseUrl}/rooms`, {
+      transports: ['websocket', 'polling'],
+      auth: { token, userId },
+      autoConnect: true,
+      reconnection: true,
+      reconnectionAttempts: 10,
+      reconnectionDelay: 1000,
+    });
+
+    this.socket.on('connect', () => { this._isConnected = true; });
+    this.socket.on('disconnect', () => { this._isConnected = false; });
+    this.socket.on('connect_error', (err) => {
+      console.warn('Room socket connect error:', err.message);
+    });
+  }
+
+  disconnect(): void {
+    if (this.socket) {
+      this.socket.removeAllListeners();
+      this.socket.disconnect();
+      this.socket = null;
+      this._isConnected = false;
+    }
+  }
+
+  joinRoom(roomId: string, callback?: (res: { success: boolean; participants?: RoomParticipant[]; myRole?: string; error?: string }) => void): void {
+    this.socket?.emit('room:join', { roomId }, callback);
+  }
+
+  leaveRoom(roomId: string): void { this.socket?.emit('room:leave', { roomId }); }
+  setMute(roomId: string, isMuted: boolean): void { this.socket?.emit('audio:mute', { roomId, isMuted }); }
+  requestToSpeak(roomId: string): void { this.socket?.emit('speaker:request', { roomId }); }
+  approveSpeaker(roomId: string, targetUserId: string): void { this.socket?.emit('speaker:approve', { roomId, targetUserId }); }
+  denySpeaker(roomId: string, targetUserId: string): void { this.socket?.emit('speaker:deny', { roomId, targetUserId }); }
+  removeSpeaker(roomId: string, targetUserId: string): void { this.socket?.emit('speaker:remove', { roomId, targetUserId }); }
+
+  onParticipantsUpdate(cb: (data: ParticipantsUpdateData) => void): () => void {
+    this.socket?.on('room:participants:update', cb);
+    return () => { this.socket?.off('room:participants:update', cb); };
+  }
+
+  onParticipantMute(cb: (data: MuteUpdateData) => void): () => void {
+    this.socket?.on('room:participant:mute', cb);
+    return () => { this.socket?.off('room:participant:mute', cb); };
+  }
+
+  onSpeakerRequestReceived(cb: (data: SpeakerRequestData) => void): () => void {
+    this.socket?.on('speaker:request:received', cb);
+    return () => { this.socket?.off('speaker:request:received', cb); };
+  }
+
+  onSpeakerApproved(cb: SimpleRoomCallback): () => void {
+    this.socket?.on('speaker:approved', cb);
+    return () => { this.socket?.off('speaker:approved', cb); };
+  }
+
+  onSpeakerDenied(cb: SimpleRoomCallback): () => void {
+    this.socket?.on('speaker:denied', cb);
+    return () => { this.socket?.off('speaker:denied', cb); };
+  }
+
+  onSpeakerRemoved(cb: SimpleRoomCallback): () => void {
+    this.socket?.on('speaker:removed', cb);
+    return () => { this.socket?.off('speaker:removed', cb); };
+  }
+
+  onRoomStarted(cb: SimpleRoomCallback): () => void {
+    this.socket?.on('room:started', cb);
+    return () => { this.socket?.off('room:started', cb); };
+  }
+
+  onRoomEnded(cb: SimpleRoomCallback): () => void {
+    this.socket?.on('room:ended', cb);
+    return () => { this.socket?.off('room:ended', cb); };
+  }
+
+  onUserJoined(cb: (data: { userId: string; role: string; roomId: string }) => void): () => void {
+    this.socket?.on('room:user:joined', cb);
+    return () => { this.socket?.off('room:user:joined', cb); };
+  }
+
+  onUserLeft(cb: (data: { userId: string; roomId: string }) => void): () => void {
+    this.socket?.on('room:user:left', cb);
+    return () => { this.socket?.off('room:user:left', cb); };
+  }
+
+  onStreamStarted(cb: (data: { roomId: string; title?: string; image?: string; description?: string; startedAt?: string; durationSec?: number; timestamp: string }) => void): () => void {
+    this.socket?.on('room:stream:started', cb);
+    return () => { this.socket?.off('room:stream:started', cb); };
+  }
+
+  onStreamStopped(cb: (data: { roomId: string; timestamp: string }) => void): () => void {
+    this.socket?.on('room:stream:stopped', cb);
+    return () => { this.socket?.off('room:stream:stopped', cb); };
+  }
+
+  onRecordingStarted(cb: (data: { roomId: string; recordingId: string; timestamp: string }) => void): () => void {
+    this.socket?.on('room:recording:started', cb);
+    return () => { this.socket?.off('room:recording:started', cb); };
+  }
+
+  onRecordingStopped(cb: (data: { roomId: string; recordingId?: string; reason?: string; timestamp: string }) => void): () => void {
+    this.socket?.on('room:recording:stopped', cb);
+    return () => { this.socket?.off('room:recording:stopped', cb); };
+  }
+}