feat: added optional REACT_APP_WS_SERVER_URL for forks usecases (#4889)

Co-authored-by: dwelle <luzar.david@gmail.com>

.env.development

@@ -5,4 +5,8 @@ REACT_APP_LIBRARY_URL=https://libraries.excalidraw.com
 REACT_APP_LIBRARY_BACKEND=https://us-central1-excalidraw-room-persistence.cloudfunctions.net/libraries
 
 REACT_APP_PORTAL_URL=http://localhost:3002
+# Fill to set socket server URL used for collaboration.
+# Meant for forks only: excalidraw.com uses custom REACT_APP_PORTAL_URL flow
+REACT_APP_WS_SERVER_URL=
+
 REACT_APP_FIREBASE_CONFIG='{"apiKey":"AIzaSyCMkxA60XIW8KbqMYL7edC4qT5l4qHX2h8","authDomain":"excalidraw-oss-dev.firebaseapp.com","projectId":"excalidraw-oss-dev","storageBucket":"excalidraw-oss-dev.appspot.com","messagingSenderId":"664559512677","appId":"1:664559512677:web:a385181f2928d328a7aa8c"}'

.env.production

@@ -5,6 +5,10 @@ REACT_APP_LIBRARY_URL=https://libraries.excalidraw.com
 REACT_APP_LIBRARY_BACKEND=https://us-central1-excalidraw-room-persistence.cloudfunctions.net/libraries
 
 REACT_APP_PORTAL_URL=https://portal.excalidraw.com
+# Fill to set socket server URL used for collaboration.
+# Meant for forks only: excalidraw.com uses custom REACT_APP_PORTAL_URL flow
+REACT_APP_WS_SERVER_URL=
+
 REACT_APP_FIREBASE_CONFIG='{"apiKey":"AIzaSyAd15pYlMci_xIp9ko6wkEsDzAAA0Dn0RU","authDomain":"excalidraw-room-persistence.firebaseapp.com","databaseURL":"https://excalidraw-room-persistence.firebaseio.com","projectId":"excalidraw-room-persistence","storageBucket":"excalidraw-room-persistence.appspot.com","messagingSenderId":"654800341332","appId":"1:654800341332:web:4a692de832b55bd57ce0c1"}'
 
 # production-only vars

src/excalidraw-app/collab/CollabWrapper.tsx

@@ -360,6 +360,7 @@ class CollabWrapper extends PureComponent<Props, CollabState> {
 
     try {
       const socketServerData = await getCollabServer();
+
       this.portal.socket = this.portal.open(
         socketIOClient(socketServerData.url, {
           transports: socketServerData.polling

src/excalidraw-app/data/index.ts

@@ -34,11 +34,20 @@ const generateRoomId = async () => {
  * Right now the reason why we resolve connection params (url, polling...)
  * from upstream is to allow changing the params immediately when needed without
  * having to wait for clients to update the SW.
+ *
+ * If REACT_APP_WS_SERVER_URL env is set, we use that instead (useful for forks)
  */
 export const getCollabServer = async (): Promise<{
   url: string;
   polling: boolean;
 }> => {
+  if (process.env.REACT_APP_WS_SERVER_URL) {
+    return {
+      url: process.env.REACT_APP_WS_SERVER_URL,
+      polling: true,
+    };
+  }
+
   try {
     const resp = await fetch(
       `${process.env.REACT_APP_PORTAL_URL}/collab-server`,