feat: add event listeners for player, sound, and user events in SocketProvider

src/contexts/SocketContext.tsx

@@ -2,7 +2,7 @@ import React, { createContext, useContext, useEffect, useState, useCallback } fr
 import { io, Socket } from 'socket.io-client'
 import { toast } from 'sonner'
 import { useAuth } from './AuthContext'
-import { authEvents, AUTH_EVENTS } from '../lib/events'
+import { authEvents, AUTH_EVENTS, soundEvents, SOUND_EVENTS, userEvents, USER_EVENTS, playerEvents, PLAYER_EVENTS } from '../lib/events'
 
 interface SocketContextType {
   socket: Socket | null
@@ -64,6 +64,21 @@ export function SocketProvider({ children }: SocketProviderProps) {
       })
     })
 
+    // Listen for player events and emit them locally
+    newSocket.on('player_state', (data) => {
+      playerEvents.emit(PLAYER_EVENTS.PLAYER_STATE, data)
+    })
+
+    // Listen for sound events and emit them locally
+    newSocket.on('sound_played', (data) => {
+      soundEvents.emit(SOUND_EVENTS.SOUND_PLAYED, data)
+    })
+
+    // Listen for user events and emit them locally
+    newSocket.on('user_credits_changed', (data) => {
+      userEvents.emit(USER_EVENTS.USER_CREDITS_CHANGED, data)
+    })
+
     return newSocket
   }, [user])
 
@@ -92,6 +107,7 @@ export function SocketProvider({ children }: SocketProviderProps) {
     }
   }, [handleTokenRefresh])
 
+
   // Initial socket connection
   useEffect(() => {
     if (loading) return

src/lib/events.ts

@@ -33,6 +33,9 @@ class EventEmitter {
 }
 
 export const authEvents = new EventEmitter()
+export const playerEvents = new EventEmitter()
+export const soundEvents = new EventEmitter()
+export const userEvents = new EventEmitter()
 
 // Auth event types
 export const AUTH_EVENTS = {
@@ -40,4 +43,19 @@ export const AUTH_EVENTS = {
   TOKEN_EXPIRED: 'token_expired',
   LOGIN_SUCCESS: 'login_success',
   LOGOUT: 'logout',
+} as const
+
+// Player event types
+export const PLAYER_EVENTS = {
+  PLAYER_STATE: 'player_state',
+} as const
+
+// Sound event types
+export const SOUND_EVENTS = {
+  SOUND_PLAYED: 'sound_played',
+} as const
+
+// User event types
+export const USER_EVENTS = {
+  USER_CREDITS_CHANGED: 'user_credits_changed',
 } as const