@symbo.ls/sdk 2.34.35 → 3.1.1

package/dist/esm/services/SocketIOService.js

@@ -0,0 +1,467 @@
+// src/services/SocketIOService.js
+import { connect, send, disconnect } from "@symbo.ls/socket/client.js";
+
+// src/services/BaseService.js
+var BaseService = class {
+  constructor({ context, options } = {}) {
+    this._context = context || {};
+    this._options = options || {};
+    this._ready = false;
+    this._error = null;
+  }
+  // Initialize service
+  init() {
+    throw new Error("init() must be implemented by service");
+  }
+  // Update context
+  updateContext(context) {
+    this._context = { ...this._context, ...context };
+  }
+  // Get service status
+  getStatus() {
+    return {
+      ready: this._ready,
+      error: this._error,
+      context: { ...this._context }
+    };
+  }
+  // Check if service is ready
+  isReady() {
+    return this._ready;
+  }
+  // Protected helper methods
+  _setReady(ready = true) {
+    this._ready = ready;
+    this._error = null;
+  }
+  _setError(error) {
+    this._ready = false;
+    this._error = error;
+  }
+  _requireAuth() {
+    if (!this._context.authToken) {
+      throw new Error("Authentication required");
+    }
+  }
+  _requireReady() {
+    if (!this.isReady()) {
+      throw new Error("Service not initialized");
+    }
+  }
+};
+
+// src/services/SocketIOService.js
+import * as utils from "@domql/utils";
+import { router } from "@symbo.ls/router";
+
+// src/config/environment.js
+var CONFIG = {
+  // Common defaults for all environments
+  common: {
+    // NOTE: Google client id for google auth, need to configure URLs for each environment in Google console
+    googleClientId: "686286207466-bvd2fqs31rlm64fgich7rtpnc8ns2tqg.apps.googleusercontent.com",
+    // Feature toggles that apply across all environments by default
+    features: {
+      newUserOnboarding: true,
+      betaFeatures: false
+    }
+  },
+  // Environment-specific configurations
+  local: {
+    baseUrl: "http://localhost:3000",
+    // For symstory api
+    socketUrl: "http://localhost:8080",
+    // For socket api
+    routerUrl: "http://localhost:3090",
+    // For router api
+    apiUrl: "http://localhost:13335",
+    // For server api
+    basedEnv: "development",
+    // For based api
+    basedProject: "platform-v2",
+    // For based api
+    basedOrg: "symbols",
+    // For based api
+    githubClientId: "Ov23liHxyWFBxS8f1gnF",
+    // For github api
+    // Environment-specific feature toggles (override common)
+    features: {
+      betaFeatures: true
+      // Enable beta features in local dev
+    }
+  },
+  development: {
+    baseUrl: "https://story.symbo.ls",
+    socketUrl: "https://socket.symbols.app",
+    routerUrl: "https://router.symbols.app",
+    apiUrl: "https://api.symbols.app",
+    basedEnv: "development",
+    basedProject: "platform-v2",
+    basedOrg: "symbols",
+    githubClientId: "Ov23liHxyWFBxS8f1gnF"
+  },
+  staging: {
+    baseUrl: "https://staging.story.symbo.ls",
+    socketUrl: "https://staging.socket.symbols.app",
+    routerUrl: "https://staging.router.symbols.app",
+    apiUrl: "https://staging.api.symbols.app",
+    basedEnv: "staging",
+    basedProject: "platform-v2",
+    basedOrg: "symbols",
+    githubClientId: "Ov23ligwZDQVD0VfuWNa"
+  },
+  production: {
+    baseUrl: "https://story.symbo.ls",
+    socketUrl: "https://socket.symbols.app",
+    routerUrl: "https://router.symbols.app",
+    apiUrl: "https://api.symbols.app",
+    basedEnv: "production",
+    basedProject: "platform-v2",
+    basedOrg: "symbols",
+    githubClientId: "Ov23liFAlOEIXtX3dBtR"
+  }
+};
+var getEnvironment = () => {
+  const env = process.env.SYMBOLS_APP_ENV || "" || "development";
+  if (!CONFIG[env]) {
+    console.warn(`Unknown environment "${env}", falling back to development`);
+    return "development";
+  }
+  return env;
+};
+var getConfig = () => {
+  try {
+    const env = getEnvironment();
+    const envConfig = { ...CONFIG.common, ...CONFIG[env] };
+    const finalConfig = {
+      ...envConfig,
+      baseUrl: process.env.SYMBOLS_APP_BASE_URL || envConfig.baseUrl,
+      socketUrl: process.env.SYMBOLS_APP_SOCKET_URL || envConfig.socketUrl,
+      routerUrl: process.env.SYMBOLS_APP_ROUTER_URL || envConfig.routerUrl,
+      apiUrl: process.env.SYMBOLS_APP_API_URL || envConfig.apiUrl,
+      basedEnv: process.env.SYMBOLS_APP_BASED_ENV || envConfig.basedEnv,
+      basedProject: process.env.SYMBOLS_APP_BASED_PROJECT || envConfig.basedProject,
+      basedOrg: process.env.SYMBOLS_APP_BASED_ORG || envConfig.basedOrg,
+      githubClientId: process.env.SYMBOLS_APP_GITHUB_CLIENT_ID || envConfig.githubClientId,
+      isDevelopment: env === "development" || env === "local",
+      isStaging: env === "staging",
+      isProduction: env === "production"
+    };
+    const requiredFields = [
+      "baseUrl",
+      "socketUrl",
+      "apiUrl",
+      "basedEnv",
+      "basedProject",
+      "basedOrg",
+      "githubClientId",
+      "googleClientId"
+    ];
+    const missingFields = requiredFields.filter((field) => !finalConfig[field]);
+    if (missingFields.length > 0) {
+      console.error(
+        `Missing required configuration: ${missingFields.join(", ")}`
+      );
+    }
+    if (finalConfig.isDevelopment) {
+      console.log(
+        "environment in SDK:",
+        env,
+        "",
+        process.env.SYMBOLS_APP_ENV
+      );
+      console.log(finalConfig);
+    }
+    return finalConfig;
+  } catch (error) {
+    console.error("Failed to load environment configuration:", error);
+    return {
+      baseUrl: "https://story.symbo.ls",
+      socketUrl: "https://socket.symbols.app",
+      routerUrl: "https://router.symbols.app",
+      apiUrl: "https://api.symbols.app",
+      basedEnv: "development",
+      basedProject: "platform-v2",
+      basedOrg: "symbols",
+      githubClientId: "Ov23liHxyWFBxS8f1gnF"
+    };
+  }
+};
+var environment_default = getConfig();
+
+// src/services/SocketIOService.js
+var { deepStringify, deepDestringify, isString } = utils.default || utils;
+var SocketService = class extends BaseService {
+  constructor(config) {
+    super(config);
+    this._socket = null;
+    this._reconnectAttempts = 0;
+    this._maxReconnectAttempts = (config == null ? void 0 : config.maxReconnectAttempts) || 5;
+    this._reconnectDelay = (config == null ? void 0 : config.reconnectDelay) || 1e3;
+    this._handlers = /* @__PURE__ */ new Map();
+    this._sessionId = Math.random();
+    this._ignoreSync = [
+      "userId",
+      "username",
+      "usersName",
+      "email",
+      "projects",
+      "feedbacks",
+      "userRoles",
+      "loading",
+      "appKey",
+      "projectName",
+      "followingUser",
+      "activeProject",
+      "user",
+      "sessionId",
+      "clients"
+    ];
+  }
+  init() {
+    try {
+      const { _context, _options } = this;
+      const socketUrl = environment_default.socketUrl || _options.socketUrl || "https://socket.symbols.app/";
+      if (!socketUrl) {
+        throw new Error("Socket URL is required");
+      }
+      this._info = {
+        config: {
+          url: socketUrl,
+          hasToken: Boolean(_context.authToken),
+          status: "initializing"
+        }
+      };
+      this._setReady();
+    } catch (error) {
+      this._setError(error);
+      throw error;
+    }
+  }
+  connect() {
+    var _a, _b, _c, _d, _e, _f, _g;
+    try {
+      if (this._socket && ["connected", "connecting"].includes((_b = (_a = this._info) == null ? void 0 : _a.config) == null ? void 0 : _b.status)) {
+        console.warn(
+          "Socket connection already exists:",
+          (_d = (_c = this._info) == null ? void 0 : _c.config) == null ? void 0 : _d.status
+        );
+        return true;
+      }
+      const { _context } = this;
+      if (!_context.appKey) {
+        throw new Error("App key is required");
+      }
+      this._updateStatus("connecting");
+      const config = {
+        source: "platform",
+        userId: (_e = _context.user) == null ? void 0 : _e.id,
+        socketUrl: this._info.config.url,
+        location: window.location.host,
+        onChange: this._handleMessage.bind(this),
+        sessionId: this._sessionId,
+        usersName: (_f = _context.user) == null ? void 0 : _f.name,
+        route: window.location.pathname,
+        onDisconnect: this._handleDisconnect.bind(this)
+      };
+      if (this._socket) {
+        this.destroy();
+      }
+      this._socket = connect(_context.appKey, config);
+      this._updateStatus("connected");
+      if (environment_default.isDevelopment) {
+        console.log("Socket connection established:", {
+          appKey: _context.appKey,
+          userId: (_g = _context.user) == null ? void 0 : _g.id,
+          sessionId: this._sessionId,
+          url: this._info.config.url
+        });
+      }
+      return true;
+    } catch (error) {
+      this._updateStatus("failed");
+      console.error("Socket connection failed:", error);
+      throw new Error(`Socket connection failed: ${error.message}`);
+    }
+  }
+  send(type, data, opts = {}) {
+    var _a, _b;
+    this._requireReady();
+    if (!this._socket) {
+      throw new Error("Socket is not connected");
+    }
+    const payload = {
+      sessionId: this._sessionId,
+      userId: (_a = this._context.user) == null ? void 0 : _a.id,
+      usersName: (_b = this._context.user) == null ? void 0 : _b.name,
+      ...data
+    };
+    send.call(
+      this._socket,
+      type,
+      opts.preventDeepStringify ? payload : deepStringify(payload)
+    );
+  }
+  _handleMessage(event, data) {
+    try {
+      const d = isString(data) ? deepDestringify(JSON.parse(data)) : data;
+      if (this._sessionId === d.sessionId) {
+        return;
+      }
+      const handlers = this._handlers.get(event);
+      if (handlers) {
+        handlers.forEach((handler) => handler(d));
+      }
+      switch (event) {
+        case "change":
+          this._handleChangeEvent(d);
+          break;
+        case "clients":
+          this._handleClientsEvent(d);
+          break;
+        case "route":
+          this._handleRouteEvent(d);
+          break;
+        default:
+          break;
+      }
+    } catch (error) {
+      this._setError(new Error(`Failed to handle message: ${error.message}`));
+    }
+  }
+  _handleChangeEvent(data) {
+    var _a, _b, _c;
+    if (data.canvas) {
+      const { clients } = data.canvas;
+      const [firstClientKey] = Object.keys(clients);
+      const monaco = clients && clients[firstClientKey] && clients[firstClientKey].monaco;
+      if (monaco) {
+        const Canvas = this._context.element && this._context.element.getCanvas();
+        if (Canvas) {
+          Canvas.Chosen.EditorPanels.update({}, { forceMonacoUpdate: true });
+        }
+      }
+      return;
+    }
+    const componentUpdates = ((_a = data.schema) == null ? void 0 : _a.components) || ((_b = data.schema) == null ? void 0 : _b.pages);
+    if (window.location.pathname.includes("/canvas") && componentUpdates) {
+      for (const updatedComponent in componentUpdates) {
+        if (Object.hasOwn(componentUpdates, updatedComponent)) {
+          (_c = this._context.element) == null ? void 0 : _c.updateComponentOnCanvas(updatedComponent);
+        }
+      }
+    }
+  }
+  _handleClientsEvent(data) {
+    const { root } = Object.getPrototypeOf(this._context.state);
+    root.replace(
+      { clients: data },
+      {
+        fromSync: true,
+        preventUpdate: ["Iframe"],
+        preventModalUpdate: true,
+        preventStateUpdateListener: true,
+        execStateFunction: true
+      }
+    );
+  }
+  _handleRouteEvent(data) {
+    const { element } = this._context;
+    const { state } = this._context;
+    if (data.userId && data.type === "routeChanged") {
+      const isModalOpen = this.getWindow("modal");
+      const isFollowing = state.followingUser === data.userId;
+      const isRouteSyncEnabled = element.getUserSettings("presentMode") && data.userId === state.userId;
+      if ((isFollowing || isRouteSyncEnabled) && !isModalOpen) {
+        router(
+          data.route,
+          element.__ref.root,
+          {},
+          {
+            fromSync: true,
+            updateStateOptions: {
+              fromSync: true,
+              preventStateUpdateListener: 1
+              // !isModalRoute(data.route, element)
+            }
+          }
+        );
+      }
+    } else if (data.reload) {
+      window.location.reload();
+    } else if (data.route && data.type === "routeForced") {
+      router(
+        data.route,
+        element.__ref.root,
+        {},
+        {
+          fromSync: true,
+          updateStateOptions: {
+            fromSync: true
+          }
+        }
+      );
+    } else if (data.componentKey) {
+      if (!element.getData("components")[data.componentKey]) {
+        return;
+      }
+      element.activateSelected(data.componentKey);
+    }
+  }
+  _handleDisconnect() {
+    this._updateStatus("disconnected");
+    this._handleReconnect();
+  }
+  _handleReconnect() {
+    if (this._reconnectAttempts < this._maxReconnectAttempts) {
+      this._reconnectAttempts++;
+      this._updateStatus("reconnecting");
+      setTimeout(() => {
+        this.connect().then(() => {
+          this._reconnectAttempts = 0;
+        }).catch(() => {
+          this._handleReconnect();
+        });
+      }, this._reconnectDelay * this._reconnectAttempts);
+    } else {
+      this._updateStatus("failed");
+      this._setError(new Error("Max reconnection attempts reached"));
+    }
+  }
+  _updateStatus(status) {
+    this._info = {
+      ...this._info,
+      config: {
+        ...this._info.config,
+        status
+      }
+    };
+  }
+  destroy() {
+    if (this._socket) {
+      disconnect.call(this._socket);
+      this._socket = null;
+    }
+    this._handlers.clear();
+    this._setReady(false);
+  }
+  reconnect() {
+    this.destroy();
+    this.connect();
+  }
+  _checkRequiredContext() {
+    var _a, _b;
+    return Boolean(
+      ((_a = this._context) == null ? void 0 : _a.appKey) && ((_b = this._context) == null ? void 0 : _b.authToken) && this._socket
+    );
+  }
+  isReady() {
+    if (this._checkRequiredContext()) {
+      this._setReady(true);
+    }
+    return this._ready;
+  }
+};
+export {
+  SocketService
+};

package/dist/esm/services/SocketService.js

@@ -0,0 +1,191 @@
+// src/services/BaseService.js
+var BaseService = class {
+  constructor({ context, options } = {}) {
+    this._context = context || {};
+    this._options = options || {};
+    this._ready = false;
+    this._error = null;
+  }
+  // Initialize service
+  init() {
+    throw new Error("init() must be implemented by service");
+  }
+  // Update context
+  updateContext(context) {
+    this._context = { ...this._context, ...context };
+  }
+  // Get service status
+  getStatus() {
+    return {
+      ready: this._ready,
+      error: this._error,
+      context: { ...this._context }
+    };
+  }
+  // Check if service is ready
+  isReady() {
+    return this._ready;
+  }
+  // Protected helper methods
+  _setReady(ready = true) {
+    this._ready = ready;
+    this._error = null;
+  }
+  _setError(error) {
+    this._ready = false;
+    this._error = error;
+  }
+  _requireAuth() {
+    if (!this._context.authToken) {
+      throw new Error("Authentication required");
+    }
+  }
+  _requireReady() {
+    if (!this.isReady()) {
+      throw new Error("Service not initialized");
+    }
+  }
+};
+
+// src/services/SocketService.js
+var SocketService = class extends BaseService {
+  constructor(config) {
+    super(config);
+    this._socket = null;
+    this._reconnectAttempts = 0;
+    this._maxReconnectAttempts = (config == null ? void 0 : config.maxReconnectAttempts) || 5;
+    this._reconnectDelay = (config == null ? void 0 : config.reconnectDelay) || 1e3;
+    this._handlers = /* @__PURE__ */ new Map();
+  }
+  async init({ context, options }) {
+    try {
+      this._context = context;
+      this._options = options;
+      const { authToken } = context;
+      const { socketUrl } = context.socket || {};
+      if (!socketUrl) {
+        throw new Error("Socket URL is required");
+      }
+      this._info = {
+        config: {
+          url: socketUrl,
+          hasToken: Boolean(authToken),
+          status: "initializing"
+        }
+      };
+      await this.connect();
+      this._setReady();
+    } catch (error) {
+      this._setError(error);
+      throw error;
+    }
+  }
+  connect() {
+    try {
+      const { socketUrl, authToken } = this._context.socket || {};
+      this._socket = new window.WebSocket(socketUrl);
+      this._socket.onopen = () => {
+        this._reconnectAttempts = 0;
+        this._updateStatus("connected");
+        if (authToken) {
+          this.send("auth", { token: authToken });
+        }
+      };
+      this._socket.onclose = () => {
+        this._updateStatus("disconnected");
+        this._handleReconnect();
+      };
+      this._socket.onerror = (error) => {
+        this._updateStatus("error");
+        this._setError(error);
+      };
+      this._socket.onmessage = (event) => {
+        this._handleMessage(event.data);
+      };
+    } catch (error) {
+      throw new Error(`Socket connection failed: ${error.message}`);
+    }
+  }
+  // Send message to socket server
+  send(type, data) {
+    this._requireReady();
+    if (!this._socket || this._socket.readyState !== window.WebSocket.OPEN) {
+      throw new Error("Socket is not connected");
+    }
+    this._socket.send(JSON.stringify({ type, data }));
+  }
+  // Subscribe to socket events
+  subscribe(type, handler) {
+    if (!this._handlers.has(type)) {
+      this._handlers.set(type, /* @__PURE__ */ new Set());
+    }
+    this._handlers.get(type).add(handler);
+    return () => {
+      const handlers = this._handlers.get(type);
+      if (handlers) {
+        handlers.delete(handler);
+        if (handlers.size === 0) {
+          this._handlers.delete(type);
+        }
+      }
+    };
+  }
+  subscribeChannel(type, handler) {
+    return this.subscribe(type, handler);
+  }
+  // Private methods
+  _handleMessage(rawData) {
+    try {
+      const { type, data } = JSON.parse(rawData);
+      const handlers = this._handlers.get(type);
+      if (handlers) {
+        handlers.forEach((handler) => handler(data));
+      }
+    } catch (error) {
+      this._setError(new Error(`Failed to handle message: ${error.message}`));
+    }
+  }
+  _handleReconnect() {
+    if (this._reconnectAttempts < this._maxReconnectAttempts) {
+      this._reconnectAttempts++;
+      this._updateStatus("reconnecting");
+      setTimeout(() => {
+        this.connect();
+      }, this._reconnectDelay * this._reconnectAttempts);
+    } else {
+      this._updateStatus("failed");
+      this._setError(new Error("Max reconnection attempts reached"));
+    }
+  }
+  _updateStatus(status) {
+    this._info = {
+      ...this._info,
+      config: {
+        ...this._info.config,
+        status
+      }
+    };
+  }
+  // Cleanup
+  destroy() {
+    if (this._socket) {
+      this._socket.close();
+      this._socket = null;
+    }
+    this._handlers.clear();
+    this._setReady(false);
+  }
+  _checkRequiredContext() {
+    const { socket } = this._context;
+    return Boolean((socket == null ? void 0 : socket.socketUrl) && this._socket);
+  }
+  isReady() {
+    if (this._checkRequiredContext()) {
+      this._setReady(true);
+    }
+    return this._ready;
+  }
+};
+export {
+  SocketService
+};