Handling when app cannot connect to server via websockets?

I have a browser based video editing tool and one of the main issues I face is using websockets to stream information to the app in realtime. Some examples of why websockets are useful.

  • Automatic subtitles (transcription job can take 30s+ so we need to stream the results back asynchronously)
  • Rendering a video and getting progress streamed back to the client
  • Any long running task, by having a websocket we can defer

The app works great, but every so often for whatever reason some clients cannot connect to the websocket server -- still investigating this. Some of the reasons, adblock seems to disable sockets, Brave browser has some issues with sockets, firewalls, etc.

I am wondering as a courtesy for the user, if the sockets fail to connect, should they receive a toast, or a modal, or some sort of notification letting them know the socket is not working and it may be due to the following, firewall etc?

Basically blocking the service until they fix the issue with some guidance? I am finding currently users who run into this issue will try to transcribe audio and itll get stuck because it never gets a response.

What is the optimal way of handling these network issues so the user can troubleshoot and not have a horrible experience?