74 lines
1.8 KiB
JavaScript
74 lines
1.8 KiB
JavaScript
/**
|
|
* Socket Context
|
|
* Provides Socket.io connection to all components
|
|
*/
|
|
|
|
import React, { createContext, useContext, useEffect, useState } from 'react';
|
|
import { io } from 'socket.io-client';
|
|
|
|
const SocketContext = createContext(null);
|
|
|
|
export function SocketProvider({ children }) {
|
|
const [socket, setSocket] = useState(null);
|
|
const [connected, setConnected] = useState(false);
|
|
|
|
useEffect(() => {
|
|
const token = localStorage.getItem('token');
|
|
|
|
if (!token) {
|
|
console.log('No auth token, skipping socket connection');
|
|
return;
|
|
}
|
|
|
|
// Connect to Socket.io server
|
|
const socketInstance = io(import.meta.env.VITE_API_URL || 'http://localhost:3000', {
|
|
auth: {
|
|
token: token
|
|
},
|
|
reconnection: true,
|
|
reconnectionDelay: 1000,
|
|
reconnectionAttempts: 5
|
|
});
|
|
|
|
socketInstance.on('connect', () => {
|
|
console.log('✓ Connected to Socket.io server');
|
|
setConnected(true);
|
|
});
|
|
|
|
socketInstance.on('disconnect', () => {
|
|
console.log('✗ Disconnected from Socket.io server');
|
|
setConnected(false);
|
|
});
|
|
|
|
socketInstance.on('connect_error', (error) => {
|
|
console.error('Socket connection error:', error.message);
|
|
});
|
|
|
|
socketInstance.on('error', (error) => {
|
|
console.error('Socket error:', error);
|
|
});
|
|
|
|
setSocket(socketInstance);
|
|
|
|
// Cleanup on unmount
|
|
return () => {
|
|
if (socketInstance) {
|
|
socketInstance.disconnect();
|
|
}
|
|
};
|
|
}, []);
|
|
|
|
return (
|
|
<SocketContext.Provider value={{ socket, connected }}>
|
|
{children}
|
|
</SocketContext.Provider>
|
|
);
|
|
}
|
|
|
|
export function useSocket() {
|
|
const context = useContext(SocketContext);
|
|
if (context === undefined) {
|
|
throw new Error('useSocket must be used within SocketProvider');
|
|
}
|
|
return context;
|
|
}
|