84 lines
2.7 KiB
JavaScript
84 lines
2.7 KiB
JavaScript
import { useEffect, useState } from "react";
|
|
import SocketIO from "socket.io-client";
|
|
import { auth } from "../../firebase/firebase.utils";
|
|
|
|
const useSocket = (bodyshop) => {
|
|
const [socket, setSocket] = useState(null);
|
|
const [clientId, setClientId] = useState(null);
|
|
const [token, setToken] = useState(null);
|
|
|
|
useEffect(() => {
|
|
// Listener for token changes
|
|
const unsubscribe = auth.onIdTokenChanged(async (user) => {
|
|
if (user) {
|
|
const newToken = await user.getIdToken();
|
|
setToken(newToken);
|
|
} else {
|
|
setToken(null);
|
|
}
|
|
});
|
|
|
|
// Clean up the listener on unmount
|
|
return () => unsubscribe();
|
|
}, []);
|
|
|
|
useEffect(() => {
|
|
if (bodyshop && bodyshop.id && token) {
|
|
const endpoint = import.meta.env.PROD ? import.meta.env.VITE_APP_AXIOS_BASE_API_URL : "";
|
|
|
|
const socketInstance = SocketIO(endpoint, {
|
|
path: "/wss",
|
|
withCredentials: true,
|
|
auth: { token }, // Use the current token
|
|
reconnectionAttempts: Infinity,
|
|
reconnectionDelay: 2000,
|
|
reconnectionDelayMax: 10000
|
|
});
|
|
|
|
setSocket(socketInstance);
|
|
|
|
const handleBodyshopMessage = (message) => {
|
|
console.log(`Received message for bodyshop ${bodyshop.id}:`, message);
|
|
};
|
|
|
|
const handleConnect = () => {
|
|
console.log("Socket connected:", socketInstance.id);
|
|
socketInstance.emit("join-bodyshop-room", bodyshop.id);
|
|
setClientId(socketInstance.id);
|
|
};
|
|
|
|
const handleReconnect = (attempt) => {
|
|
console.log(`Socket reconnected after ${attempt} attempts`);
|
|
};
|
|
|
|
const handleConnectionError = (err) => {
|
|
console.error("Socket connection error:", err);
|
|
};
|
|
|
|
const handleDisconnect = () => {
|
|
console.log("Socket disconnected");
|
|
};
|
|
|
|
socketInstance.on("connect", handleConnect);
|
|
socketInstance.on("reconnect", handleReconnect);
|
|
socketInstance.on("connect_error", handleConnectionError);
|
|
socketInstance.on("disconnect", handleDisconnect);
|
|
socketInstance.on("bodyshop-message", handleBodyshopMessage);
|
|
|
|
return () => {
|
|
socketInstance.emit("leave-bodyshop-room", bodyshop.id);
|
|
socketInstance.off("connect", handleConnect);
|
|
socketInstance.off("reconnect", handleReconnect);
|
|
socketInstance.off("connect_error", handleConnectionError);
|
|
socketInstance.off("disconnect", handleDisconnect);
|
|
socketInstance.off("bodyshop-message", handleBodyshopMessage);
|
|
socketInstance.disconnect();
|
|
};
|
|
}
|
|
}, [bodyshop, token]); // Include 'token' in dependencies to re-run effect when it changes
|
|
|
|
return { socket, clientId };
|
|
};
|
|
|
|
export default useSocket;
|