Tones/contexts/WebSocketContext.js

50 lines
1.3 KiB
JavaScript

import React, { createContext, useEffect, useRef, useState } from 'react';
export const WebSocketContext = createContext(null);
export const WebSocketProvider = ({ children }) => {
const ws = useRef(null);
const [isConnected, setIsConnected] = useState(false);
const [lastMessage, setLastMessage] = useState(null);
useEffect(() => {
ws.current = new WebSocket('wss://your-websocket-server.com');
ws.current.onopen = () => {
console.log('✅ WebSocket connected');
setIsConnected(true);
};
ws.current.onmessage = (e) => {
console.log('📩 Message received:', e.data);
setLastMessage(e.data);
};
ws.current.onerror = (e) => {
console.error('❌ WebSocket error:', e.message);
};
ws.current.onclose = (e) => {
console.log('🔌 WebSocket closed:', e.code, e.reason);
setIsConnected(false);
};
return () => {
ws.current?.close();
};
}, []);
const sendMessage = (msg) => {
if (ws.current?.readyState === WebSocket.OPEN) {
ws.current.send(JSON.stringify(msg));
} else {
console.warn('⚠️ WebSocket is not open. Message not sent.');
}
};
return (
<WebSocketContext.Provider value={{ sendMessage, lastMessage, isConnected }}>
{children}
</WebSocketContext.Provider>
);
};