Y-codemirror.next WebSocket is not defined

Good afternoon all, I am trying to setup y-codemirror.next and I have followed the demo and am receiving this odd error relating to WebSockets. I am using google chrome as well. When I spam refresh on the page it states that there is already a Yjs Doc connected to a room, then spits out a reference error that has to do with a WebSocket not being defined. This is being made with next JS and the following code is located within a NextPage component

Here is a link with the images of my errors that I am experiencing

https://imgur.com/a/MfivHpA

Are you doing this in the render function of the next.js page, or in an effect? It looks like the code is being executed on the server, which would explain the WebSocket not defined error.