refactor(websocket): update websocket server to yrs-warp

api/docker-compose.yml

@@ -1,4 +1,3 @@
-version: "3"
 services:
   reearth-flow-api:
     image: reearth/reearth-flow:latest

api/internal/app/app.go

@@ -55,6 +55,7 @@ func initEcho(ctx context.Context, cfg *ServerConfig) *echo.Echo {
 
 	// auth config
 	authConfig := cfg.Config.JWTProviders()
+
 	log.Infof("auth: config: %#v", authConfig)
 	authMiddleware := echo.WrapMiddleware(lo.Must(appx.AuthMiddleware(authConfig, adapter.ContextAuthInfo, true)))
 
@@ -94,6 +95,9 @@ func initEcho(ctx context.Context, cfg *ServerConfig) *echo.Echo {
 	apiPrivate.Use(authMiddleware, attachOpMiddleware(cfg))
 	apiPrivate.POST("/graphql", GraphqlAPI(cfg.Config.GraphQL, gqldev))
 	apiPrivate.POST("/signup", Signup())
+	apiPrivate.POST("/verify/ws-token", func(c echo.Context) error {
+		return c.JSON(http.StatusOK, echo.Map{"authorized": true})
+	})
 
 	if !cfg.Config.AuthSrv.Disabled {
 		apiPrivate.POST("/signup/verify", StartSignupVerify())

ui/src/lib/yjs/useYjsSetup.ts

@@ -3,6 +3,7 @@
 import { WebsocketProvider } from "y-websocket";
 import * as Y from "yjs";
 
+import { useAuth } from "@flow/lib/auth";
 import { config } from "@flow/config";
 import { DEFAULT_ENTRY_GRAPH_ID } from "@flow/global-constants";
 
@@ -13,6 +14,7 @@
   const { projectId }: { projectId: string } = useParams({
     strict: false,
   });
+  const { getAccessToken } = useAuth();
 
   const [undoManager, setUndoManager] = useState<Y.UndoManager | null>(null);
 
@@ -31,11 +33,18 @@
     let yWebSocketProvider: WebsocketProvider | null = null;
 
     if (workflowId && websocket && projectId) {
-      yWebSocketProvider = new WebsocketProvider(
-        websocket,
-        `${projectId}:${workflowId}`,
-        yDoc,
-      );
+      (async () => {
+        const token = await getAccessToken();
+        yWebSocketProvider = new WebsocketProvider(
+          websocket,
+          `${projectId}:${workflowId}`,
+          yDoc,
+          {
+            params: {
+              token,
+            },
+          },
+        );
 
       yWebSocketProvider.once("sync", () => {
         if (yWorkflows.length === 0) {
@@ -48,8 +57,9 @@
           });
         }
 
-        setIsSynced(true); // Mark as synced
-      });
+          setIsSynced(true); // Mark as synced
+        });
+      })();
     }
 
     // Initial state setup
@@ -63,7 +73,7 @@
     return () => {
       yWebSocketProvider?.destroy(); // Cleanup on unmount
     };
-  }, [projectId, workflowId]);
+  }, [projectId, workflowId, getAccessToken]);
 
   const { yDoc, yWorkflows, undoTrackerActionWrapper } = state || {};
 

websocket/.env-sample

@@ -0,0 +1,8 @@
+REEARTH_FLOW_REDIS_URL=redis://redis:6379
+REEARTH_FLOW_REDIS_TTL=3600
+REEARTH_FLOW_GCS_BUCKET_NAME=yrs-dev
+REEARTH_FLOW_GCS_ENDPOINT=http://fake-gcs:4443
+REEARTH_FLOW_AUTH_URL=http://localhost:8080/api/verify/ws-token
+REEARTH_FLOW_AUTH_TIMEOUT_MS=5000
+REEARTH_FLOW_APP_ENV=development
+REEARTH_FLOW_ORIGINS=http://localhost:3000,https://flow.test.reearth.dev,https://*.netlify.app 

websocket/.gitignore

@@ -1,18 +1,2 @@
-# Generated by Cargo
-# will have compiled files and executables
-debug/
-target/
-
-# These are backup files generated by rustfmt
-**/*.rs.bk
-
-# MSVC Windows builds of rustc generate these, which store debugging information
-*.pdb
-
-out/
-out.json
-.idea
-.vscode
-.idea
-local_storage/
-.DS_Store
+/target/
+/output/