@tomo-inc/oidc-auth 0.0.3

package/CHANGELOG.md

@@ -0,0 +1,3 @@
+# @tomo-inc/oidc-auth
+
+## 0.0.1

package/README.md

@@ -0,0 +1,39 @@
+# @tomo-inc/oidc-auth
+
+## quick start
+
+### 1. set config, get api
+
+link1: [how to config x]()
+link2: [hot to config google]()
+
+```
+const config = {
+  xClientId,
+  googleClientId,
+  tomoStage: "dev" | "pre" | "prod",
+};
+
+const { loginByGoogle, loginByX, loginByEmail } = OidcAuth(config);
+```
+
+### 2. get oidcToken(google/x)
+
+```
+const oidcToken = await loginByGoogle();
+const oidcToken = await loginByX();
+```
+
+### 3. get oidcToken(email)
+
+```
+const oidcTokenPart1 = await loginByEmail("test@test.com");
+const oidcTokenPart2 = "${oidcTokenPart2}"; //input by user, from email conent
+const oidcToken = `${oidcTokenPart1}${oidcTokenPart2}`;
+```
+
+## todo
+
+1. more login method
+2. relay remove
+3. webpage performance

package/package.json

@@ -0,0 +1,35 @@
+{
+  "name": "@tomo-inc/oidc-auth",
+  "version": "0.0.3",
+  "author": "tomo.inc",
+  "license": "MIT",
+  "private": false,
+  "type": "module",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "dependencies": {
+    "@cubist-labs/cubesigner-sdk": "0.4.98-0",
+    "@tomo-inc/cubist-sig-sdk": "1.1.0",
+    "@tomo-inc/wallet-utils": "0.0.3"
+  },
+  "devDependencies": {
+    "@types/crypto-js": "^4.2.2",
+    "@types/node": "^20.0.0",
+    "@types/supertest": "^2.0.12",
+    "supertest": "^6.3.0",
+    "tsup": "^8.0.0",
+    "tsx": "^4.19.2",
+    "typescript": "^5.0.0",
+    "@vitest/browser": "^3.2.4",
+    "playwright": "^1.44.1",
+    "vitest": "^3.2.4"
+  }
+}

package/project.json

@@ -0,0 +1,59 @@
+{
+  "name": "oidc-auth",
+  "sourceRoot": "packages/oidc-auth/src",
+  "projectType": "library",
+  "targets": {
+    "build": {
+      "executor": "nx:run-commands",
+      "outputs": ["{projectRoot}/dist"],
+      "options": {
+        "command": "tsup src/index.ts --format esm,cjs --dts --treeshake",
+        "cwd": "packages/oidc-auth"
+      }
+    },
+    "dev": {
+      "executor": "nx:run-commands",
+      "options": {
+        "command": "tsup src/index.ts --format esm,cjs --watch --dts",
+        "cwd": "packages/oidc-auth"
+      }
+    },
+    "lint": {
+      "executor": "nx:run-commands",
+      "options": {
+        "command": "eslint src/**/*.ts",
+        "cwd": "packages/oidc-auth"
+      }
+    },
+    "lint:fix": {
+      "executor": "nx:run-commands",
+      "options": {
+        "command": "eslint src/**/*.ts --fix",
+        "cwd": "packages/oidc-auth"
+      }
+    },
+    "format": {
+      "executor": "nx:run-commands",
+      "options": {
+        "command": "prettier --write \"src/**/*.{ts,tsx}\"",
+        "cwd": "packages/oidc-auth"
+      }
+    },
+    "test": {
+      "executor": "nx:run-commands",
+      "outputs": ["{projectRoot}/coverage"],
+      "options": {
+        "command": "vitest run",
+        "cwd": "packages/oidc-auth"
+      }
+    },
+    "test:watch": {
+      "executor": "nx:run-commands",
+      "options": {
+        "command": "vitest",
+        "cwd": "packages/oidc-auth"
+      }
+    }
+  },
+  "tags": ["npm:private", "scope:oidc-auth", "type:library"]
+}

package/src/const.ts

@@ -0,0 +1,12 @@
+export const RelayMessageTypes = {
+  googleAuth: "tomo-google-authorized",
+  xAuth: "tomo-twitter-authorized",
+  kakaoAuth: "tomo-kakao-authorized",
+  telegramAuth: "tomo-telegram-authorized",
+};
+
+export const EmailCodeLifeTime = 60; // 60 seconds
+
+export type LoginType = "google" | "x" | "email";
+
+export type EmailLoginResult = { partialOidcToken: string; lifeTime: number };

package/src/index.ts

@@ -0,0 +1,156 @@
+import { envs } from "@cubist-labs/cubesigner-sdk";
+import { emailLogin } from "@tomo-inc/cubist-sig-sdk";
+import { CubeOrgIds, CubeStage, CubeStages, isEmail, RelayOrigins, TomoStage } from "@tomo-inc/wallet-utils";
+
+import { EmailCodeLifeTime, EmailLoginResult, LoginType, RelayMessageTypes } from "./const";
+import { openWindow } from "./utils";
+
+export type { EmailLoginResult, LoginType };
+
+interface Config {
+  tomoStage: TomoStage;
+  xClientId: string;
+  googleClientId: string;
+}
+
+export const OidcAuth = ({ tomoStage, xClientId, googleClientId }: Config) => {
+  const relayOrigin = RelayOrigins[tomoStage];
+  if (!relayOrigin) {
+    throw new Error("Invalid tomo stage");
+  }
+  const xRedirectUri = `${relayOrigin}/x/loader`;
+  const googleRedirectUri = `${relayOrigin}/google`;
+
+  const cubeStage = CubeStages[tomoStage] as CubeStage;
+
+  const cubeOrgId = CubeOrgIds[tomoStage];
+  if (!cubeOrgId) {
+    throw new Error("Invalid cube stage");
+  }
+  const cubeEnv = envs[cubeStage] || envs.gamma;
+  const googleOauth2Token = `https://accounts.google.com/o/oauth2/v2/auth`;
+
+  const waitForOidcToken = (popup: Window | null, timeoutMs: number = 120_000): Promise<string> => {
+    return new Promise((resolve, reject) => {
+      if (!popup) {
+        reject(new Error("Popup window is null"));
+        return;
+      }
+
+      const timeout = setTimeout(() => {
+        popup.close();
+        reject(new Error("Login timeout"));
+      }, timeoutMs);
+
+      const messageHandler = async (event: MessageEvent) => {
+        if (event.origin !== relayOrigin) {
+          return;
+        }
+        if (event.data.action !== "login") {
+          return;
+        }
+
+        const { data, type } = event.data;
+        let oidcToken = "";
+
+        try {
+          if (type === RelayMessageTypes.googleAuth) {
+            oidcToken = data.code;
+          } else if (type === RelayMessageTypes.xAuth) {
+            oidcToken = data?.oidcToken || "";
+          }
+
+          if (oidcToken) {
+            clearTimeout(timeout);
+            window.removeEventListener("message", messageHandler);
+            popup.close();
+            resolve(oidcToken);
+          }
+        } catch (error) {
+          clearTimeout(timeout);
+          window.removeEventListener("message", messageHandler);
+          popup.close();
+          reject(error);
+        }
+      };
+
+      window.addEventListener("message", messageHandler);
+
+      // Check if popup is closed manually
+      const checkClosed = setInterval(() => {
+        if (popup.closed) {
+          clearTimeout(timeout);
+          clearInterval(checkClosed);
+          window.removeEventListener("message", messageHandler);
+          reject(new Error("Login cancelled by user"));
+        }
+      }, 400);
+    });
+  };
+
+  const loginByGoogle = async (): Promise<string> => {
+    const origin = window.location.origin;
+    const stateParam = JSON.stringify({ origin, action: "login", loadImg: "" });
+
+    const params = {
+      client_id: googleClientId,
+      state: encodeURIComponent(stateParam),
+      redirect_uri: googleRedirectUri,
+      response_type: "id_token",
+      scope: "openid",
+      access_type: "offline",
+      nonce: Date.now().toString(),
+      prompt: "select_account",
+    };
+
+    const url = `${googleOauth2Token}?${new URLSearchParams(params).toString()}`;
+
+    const popup = openWindow({
+      url,
+      name: "Google login",
+    });
+
+    if (!popup) {
+      throw new Error("Failed to open popup");
+    }
+
+    return await waitForOidcToken(popup);
+  };
+
+  const loginByX = async (): Promise<string> => {
+    //load_img
+    const origin = window.location.origin;
+    const params = {
+      target: origin,
+      tomoStage,
+      eventId: Date.now().toString(),
+      action: "login",
+      clientId: xClientId,
+    };
+    const url = `${xRedirectUri}?${new URLSearchParams(params).toString()}`;
+    const popup = openWindow({
+      url,
+      name: "X login",
+    });
+
+    if (!popup) {
+      throw new Error("Failed to open popup");
+    }
+
+    return await waitForOidcToken(popup);
+  };
+
+  const loginByEmail = async (email: string): Promise<EmailLoginResult> => {
+    if (!isEmail(email)) {
+      throw new Error("Invalid email");
+    }
+    const partialOidcToken = await emailLogin(email, cubeEnv, cubeOrgId);
+    return { partialOidcToken, lifeTime: EmailCodeLifeTime };
+  };
+
+  return {
+    loginByGoogle,
+    loginByX,
+    loginByEmail,
+  };
+};

package/src/utils.ts

@@ -0,0 +1,35 @@
+export const isMobile = () => {
+  return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
+};
+
+interface OpenWindow {
+  url: string;
+  name?: string;
+  width?: number;
+  height?: number;
+}
+
+export const openWindow = ({ url, name, width, height }: OpenWindow): Window | null => {
+  const top = (window.innerHeight - (height || 400)) / 2 + window.screenY;
+  const left = (window.innerWidth - (width || 400)) / 2 + window.screenX;
+
+  try {
+    const relyWindow = window.open(
+      url,
+      name,
+      `dialog=yes,top=${top}px,left=${left},width=${width !== undefined ? width : 400}px,height=${height !== undefined ? height : 600}px`,
+    );
+
+    // Fallback to iframe modal if:
+    // 1. window.open is blocked by browser
+    // 2. iOS Safari requires user interaction for window.open
+    if (!relyWindow) {
+      return null;
+    }
+
+    return relyWindow;
+  } catch (error) {
+    console.error("Failed to open window:", error);
+    return null;
+  }
+};

package/tsconfig.json

@@ -0,0 +1,7 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "baseUrl": "./src"
+  },
+  "include": ["src"]
+}

package/tsup.config.ts

@@ -0,0 +1,18 @@
+import { defineConfig } from "tsup";
+
+export default defineConfig({
+  entry: ["src/index.ts"],
+  format: ["esm", "cjs"],
+  dts: true,
+  treeshake: true,
+  clean: true,
+  platform: "browser",
+  minify: true,
+  splitting: false,
+  external: ["@cubist-labs/cubesigner-sdk", "@tomo-inc/cubist-sig-sdk"],
+  outExtension({ format }) {
+    return {
+      js: format === "esm" ? ".js" : ".cjs",
+    };
+  },
+});