this is a pain in the ass

hooks/useRTC.ts

@@ -0,0 +1,54 @@
+import { useEffect, useState } from 'react';
+import RTCPeer from '@/lib/RTCPeer';
+
+import type { UseSocket } from '@/hooks/useSocket';
+
+import type {} from '@/types';
+
+// interface UseSocketProps {
+// 	gameID: string;
+// 	setGameData: (gameUpdate: GameUpdate) => void;
+// 	setNoGame: (noGame: boolean) => void;
+// }
+
+const channelName = 'tilt';
+
+export default function useRTC({
+	ready,
+	registerAnsweredReceiver,
+	registerOfferredReceiver,
+	rtcAnswer: sendAnswer,
+	rtcOffer: sendOffer,
+}: UseSocket) {
+	const [peers, setPeers] = useState<RTCPeer[]>([]);
+
+	const answerHandler = (answer: RTCSessionDescriptionInit) => {
+		console.log('[useRTC] answer received', answer);
+		console.log('[useRTC] peers:', peers.length);
+		const peer = peers[0];
+		console.log('peer:', peer);
+		peer.onAnswer(answer);
+	};
+
+	const offerHandler = (offer: RTCSessionDescriptionInit) => {
+		console.log('[useRTC] offer received', offer);
+		setPeers((peers) => {
+			peers.push(new RTCPeer({ channelName, offer, sendAnswer, sendOffer }));
+			return peers;
+		});
+	};
+
+	useEffect(() => {
+		if (ready) {
+			console.log('-=-= SETTING THINGS UP =-=-');
+			registerAnsweredReceiver(answerHandler);
+			registerOfferredReceiver(offerHandler);
+
+			setPeers([new RTCPeer({ channelName, sendAnswer, sendOffer })]);
+		}
+	}, [ready]);
+
+	return {
+		count: peers.length,
+	};
+}