Refactor/ts sockets (#210)

* refactor(ts): create socket subscription service
* refactor(ts-sockets): useSubscription hook
* refactor(ts-sockets): extract colour selection to utility

client/src/common/context/socketContext.tsx

@@ -1,4 +1,3 @@
-// @ts-nocheck
 import { createContext, ReactNode, useContext, useEffect, useState } from 'react';
 import { serverURL } from 'common/api/apiConstants';
 import io, { Socket } from 'socket.io-client';
@@ -26,7 +25,7 @@ export const useSocket = () => {
 };
 
 function SocketProvider({ children }: SocketProviderProps) {
-  const [socket, setSocket] = useState(null);
+  const [socket, setSocket] = useState<Socket | null>(null);
 
   useEffect(() => {
     const socketInstance = io(serverURL, { transports: ["websocket"] });