@upstart.gg/sdk 0.0.96 → 0.0.97

package/package.json

@@ -1,10 +1,11 @@
 {
   "name": "@upstart.gg/sdk",
-  "version": "0.0.96",
+  "version": "0.0.97",
   "type": "module",
   "files": [
     "dist",
-    "env.d.ts"
+    "env.d.ts",
+    "src"
   ],
   "sideEffects": true,
   "exports": {
@@ -22,11 +23,6 @@
     "./cli/*": {
       "import": "./dist/node/cli/*.js"
     },
-    "./env.d.ts": {
-      "types": "./env.d.ts",
-      "require": "./env.d.ts",
-      "import": "./env.d.ts"
-    },
     "./*": {
       "types": "./dist/shared/*.d.ts",
       "import": "./dist/shared/*.js"
@@ -55,6 +51,7 @@
     "http-errors-enhanced": "2.0.8",
     "immer": "10.1.1",
     "import-meta-resolve": "4.1.0",
+    "json-schema-default": "1.0.2",
     "lodash-es": "4.17.21",
     "nanoid": "5.0.7",
     "open": "10.1.0",
@@ -67,12 +64,12 @@
     "usehooks-ts": "3.1.0",
     "zundo": "2.3.0",
     "zustand": "4.5.5",
-    "@upstart.gg/style-system": "0.0.96"
+    "@upstart.gg/style-system": "0.0.97"
   },
   "peerDependencies": {
     "react": "18.3.0-canary-3d9b20132-20240124",
     "react-dom": "18.3.0-canary-3d9b20132-20240124",
-    "@upstart.gg/style-system": "0.0.96"
+    "@upstart.gg/style-system": "0.0.97"
   },
   "devDependencies": {
     "@cloudflare/workers-types": "4.20240806.0",
@@ -81,10 +78,11 @@
     "@types/debug": "4.1.12",
     "@types/express": "^4.17.21",
     "@types/lodash-es": "4.17.12",
-    "@types/node": "^20.14.10",
+    "@types/node": "^22.15.30",
     "@types/react": "18.3.3",
     "@types/react-dom": "^18.3.0",
     "@types/sortablejs": "1.15.8",
+    "@typescript/native-preview": "7.0.0-dev.20250607.1",
     "@vitejs/plugin-react": "^4.3.4",
     "concurrently": "8.2.2",
     "express": "^4.21.2",
@@ -103,7 +101,9 @@
   },
   "scripts": {
     "build": "tsup",
-    "build:types": "tsc --emitDeclarationOnly --declaration --declarationMap",
+    "build:watch": "tsup --watch",
+    "build:types": "tsc --extendedDiagnostics --emitDeclarationOnly --declaration --declarationMap",
+    "build:types-go": "tsgo --extendedDiagnostics --emitDeclarationOnly --declaration --declarationMap",
     "dev": "NODE_OPTIONS='--max-old-space-size=12384' tsup --watch",
     "sizetest": "pnpm build && du -sh dist",
     "lint": "biome check --write . && tsc --noEmit",

package/src/node/cli/api.ts

@@ -0,0 +1,101 @@
+import { logger } from "../shared/logger";
+import { API_BASE_URL } from "./constants";
+import { accessStore } from "./store";
+
+type SuccessResponseWrapper<T> = {
+  isSuccess: true;
+  isError: false;
+  status: number;
+  statusText: string;
+  data: T;
+};
+
+type ErrorResponseWrapper<E> = {
+  isSuccess: false;
+  isError: true;
+  status: number;
+  statusText: string;
+  data: E;
+};
+
+type ResponseWrapper<T, E> = SuccessResponseWrapper<T> | ErrorResponseWrapper<E>;
+
+type CommonResponseType = {
+  success: boolean;
+};
+
+/**
+ *
+ * @param pathOrUrl
+ * @param data
+ * @returns
+ */
+export async function post<
+  ResponseType extends CommonResponseType = CommonResponseType,
+  ErrorType = { error: string; error_description?: string },
+>(path: string, data: Record<string, unknown> | URLSearchParams, headers: Record<string, string> = {}) {
+  if (accessStore.get("access_token")) {
+    headers.Authorization = `Bearer ${accessStore.get("access_token")}`;
+  }
+  const response = await fetch(toURL(path), {
+    method: "POST",
+    headers: {
+      "Content-Type":
+        data instanceof URLSearchParams ? "application/x-www-form-urlencoded" : "application/json",
+      ...headers,
+    },
+    body: data instanceof URLSearchParams ? data : JSON.stringify(data),
+  }).catch((error) => {
+    logger.error(`Fatal Error requesting API: ${error.message} (${error.cause.code})`);
+    logger.error(`Please check your internet connection and try again, or retry later.`);
+    process.exit(1);
+  });
+
+  return formatResponse<ResponseType, ErrorType>(response);
+}
+
+export async function get<ResponseType = unknown, ErrorType = { error: string; error_description?: string }>(
+  path: string,
+  headers: Record<string, string> = {},
+) {
+  if (accessStore.get("access_token")) {
+    headers.Authorization = `Bearer ${accessStore.get("access_token")}`;
+  }
+  const response = await fetch(toURL(path), { headers, method: "GET" }).catch((error) => {
+    logger.error(`Fatal Error requesting API: ${error.message} (${error.cause.code})`);
+    logger.error(`Please check your internet connection and try again, or retry later.`);
+    process.exit(1);
+  });
+  return formatResponse<ResponseType, ErrorType>(response);
+}
+
+function toURL(path: string) {
+  const apiBaseURL = new URL(API_BASE_URL.endsWith("/") ? API_BASE_URL : `${API_BASE_URL}/`);
+  return new URL(path, apiBaseURL);
+}
+
+async function formatResponse<SuccessType, ErrorType>(
+  response: Response,
+): Promise<ResponseWrapper<SuccessType, ErrorType>> {
+  const data = response.headers.get("content-type")?.startsWith("application/json")
+    ? ((await response.json()) as ResponseType)
+    : ((await response.text()) as ResponseType);
+
+  if (response.ok) {
+    return {
+      isSuccess: true,
+      isError: false,
+      status: response.status,
+      statusText: response.statusText,
+      data: data as SuccessType,
+    };
+  } else {
+    return {
+      isSuccess: false,
+      isError: true,
+      status: response.status,
+      statusText: response.statusText,
+      data: data as ErrorType,
+    };
+  }
+}

package/src/node/cli/commands/cmd-build.ts

@@ -0,0 +1,64 @@
+import { build } from "vite";
+import path, { resolve } from "node:path";
+import { fileURLToPath } from "node:url";
+import { sync as rmSync } from "rimraf";
+import type { CommandArgOpts, BuildOptions, CommonOptions } from "../types";
+
+const __dirname = fileURLToPath(new URL(".", import.meta.url));
+const configFile = resolve(__dirname, "../builder/vite-config.js");
+const serverEntryFile = resolve(__dirname, "../builder/vite-entry-server.js");
+
+export async function buildTemplate({ options, logger }: CommandArgOpts<CommonOptions & BuildOptions>) {
+  logger.info("Building template...\n");
+
+  if (options.clean) {
+    rmSync(path.join(process.cwd(), "dist"));
+  }
+
+  let mode = "production";
+
+  if (options.ssr === "local") {
+    mode = "development";
+    process.env.NODE_ENV = mode;
+  }
+
+  if (options.ssr) {
+    // 1. client build
+    await build({
+      configFile,
+      customLogger: logger,
+      mode,
+      logLevel: options.logLevel,
+      clearScreen: options.clearScreen,
+      build: {
+        ssrManifest: true,
+        emptyOutDir: true,
+      },
+    });
+
+    // 2. server build
+    await build({
+      configFile,
+      customLogger: logger,
+      mode,
+      logLevel: options.logLevel,
+      clearScreen: options.clearScreen,
+      ssr: {
+        target: "webworker",
+      },
+      build: {
+        ssr: serverEntryFile,
+      },
+    });
+  } else {
+    await build({
+      configFile,
+      customLogger: logger,
+      logLevel: options.logLevel,
+      clearScreen: options.clearScreen,
+      build: {
+        emptyOutDir: true,
+      },
+    });
+  }
+}

package/src/node/cli/commands/login/cmd-login.ts

@@ -0,0 +1,111 @@
+import chalk from "chalk";
+import { confirm } from "@inquirer/prompts";
+import open from "open";
+import { CLI_LOGIN_CLIENT_ID, OAUTH_ENDPOINT_DEVICE_CODE, OAUTH_ENDPOINT_TOKEN } from "../../constants";
+import { post } from "../../api";
+import type { Logger } from "~/node/shared/logger";
+import type { CommandArgOpts, CommonOptions } from "../../types";
+import { accessStore } from "../../store";
+
+export async function pollForLogin(deviceCode: string, logger: Logger) {
+  while (true) {
+    const body = new URLSearchParams({
+      grant_type: "device_code",
+      device_code: deviceCode,
+      client_id: CLI_LOGIN_CLIENT_ID,
+    });
+    const tokenResponse = await post<DeviceCodeTokenSuccessResponse, DeviceCodeTokenErrorResponse>(
+      OAUTH_ENDPOINT_TOKEN,
+      body,
+    );
+    const { data, isSuccess } = tokenResponse;
+
+    if (isSuccess) {
+      return data;
+    }
+
+    if (data.error === "authorization_pending") {
+      await new Promise((resolve) => setTimeout(resolve, 5000));
+    } else {
+      // other error handling
+      logger.error(`Error while polling for login: ${data.error_description ?? data.error}`);
+      return false;
+    }
+  }
+}
+
+export async function login({ options, logger }: CommandArgOpts<CommonOptions>) {
+  logger.info(`Logging in to Enpage...\n`);
+
+  const { isError, data } = await post<DeviceCodeResponse>(OAUTH_ENDPOINT_DEVICE_CODE, {
+    client_id: CLI_LOGIN_CLIENT_ID,
+    scope: "profile,templates:publish",
+  });
+
+  if (isError) {
+    logger.error("Failed to get device code. Please try again.");
+    logger.error(`Error: ${data.error_description ?? data.error}`);
+    process.exit(1);
+  }
+
+  const { verification_uri, device_code } = data;
+
+  const confirmed = await confirm({
+    message: `Would you like to open the login page in your browser?`,
+    default: true,
+  }).catch((e) => {
+    process.exit(0);
+  });
+
+  if (confirmed) {
+    open(verification_uri);
+  } else {
+    logger.info(`\nPlease visit the following URL to login:\n  ${verification_uri}\n`);
+  }
+
+  logger.info(chalk.gray("\nWaiting for login...\n"));
+
+  const loginData = await pollForLogin(device_code, logger);
+
+  if (!loginData) {
+    logger.error("Login failed. Please try again.");
+    process.exit(1);
+  }
+
+  // Store the access token info
+  accessStore.set({
+    ...loginData,
+    ...(loginData.expires_in ? { expires_at: Date.now() + loginData.expires_in * 1000 } : {}),
+  });
+
+  logger.info("Login successful!\n");
+  process.exitCode = 0;
+}
+
+type DeviceCodeResponse = {
+  success: true;
+  device_code: string;
+  user_code: string;
+  verification_uri: string;
+  verification_uri_complete?: string; // Optional as per RFC 8628
+  expires_in: number;
+  interval?: number; // Optional as per RFC 8628
+};
+
+// Union type for the response
+
+type DeviceCodeTokenSuccessResponse = {
+  success: true;
+  access_token: string;
+  token_type: string;
+  expires_in?: number;
+  refresh_token?: string;
+  scope?: string;
+};
+
+// Error response type for token request
+type DeviceCodeTokenErrorResponse = {
+  error: "authorization_pending" | "slow_down" | "access_denied" | "expired_token" | string;
+  error_description?: string;
+  error_uri?: string;
+};

package/src/node/cli/commands/logout/cmd-logout.ts

@@ -0,0 +1,11 @@
+import type { CommandArgOpts, CommonOptions } from "../../types";
+import { accessStore } from "../../store";
+
+export async function logout({ options, logger }: CommandArgOpts<CommonOptions>) {
+  logger.info(`Logging out fom Enpage...`);
+
+  accessStore.clear();
+
+  logger.info("Done.\n");
+  process.exit(0);
+}

package/src/node/cli/commands/publish/cmd-publish.ts

@@ -0,0 +1,135 @@
+import { resolve } from "node:path";
+import { existsSync, readFileSync, writeFileSync } from "node:fs";
+import chalk from "chalk";
+import type { CommandArgOpts } from "../../types";
+import { formatAPIError, getPackageManager } from "../../utils";
+import { getTokenOrThrow } from "../../store";
+import { uploadTemplate } from "./uploader";
+import path from "node:path";
+import { post } from "../../api";
+import { API_ENDPOINT_REGISTER_TEMPLATE } from "../../constants";
+import { loadConfigFromJsFile, validateTemplateConfig } from "~/node/shared/config";
+import { isLoggedIn } from "../../is-logged-in";
+
+export async function publish({ options, args, logger }: CommandArgOpts) {
+  // check if user is logged in
+  if (!(await isLoggedIn(true))) {
+    const pkgCmd = getPackageManager();
+    logger.error(
+      `  ${chalk.redBright("Error")}: User token not found. Please run ${chalk.cyan(`${pkgCmd} run enpage:login`)} to authenticate or set the ${chalk.cyan("ENPAGE_API_TOKEN")} environment variable.\n`,
+    );
+    process.exit(1);
+  }
+
+  const templateDir = args.length
+    ? path.isAbsolute(args[0])
+      ? args[0]
+      : resolve(process.cwd(), args[0])
+    : process.cwd();
+
+  if (!existsSync(templateDir)) {
+    logger.error(`  Template directory not found: ${templateDir}. Aborting.\n`);
+    process.exit(1);
+  }
+
+  const distDir =
+    args.length > 1
+      ? path.isAbsolute(args[1])
+        ? args[1]
+        : resolve(process.cwd(), args[1])
+      : resolve(templateDir, "dist");
+
+  if (!existsSync(distDir)) {
+    logger.error(
+      `  Dist directory not found: ${distDir}.\n  Please run 'build' before publishing. Aborting.\n`,
+    );
+    process.exit(1);
+  }
+
+  // check if enpage.config.js and package.json exist in the current directory
+  // if not, exit with an error
+  if (!existsSync(resolve(templateDir, "enpage.config.js"))) {
+    logger.error(
+      `  ${chalk.redBright("Error")}: file enpage.config.js not found in ${templateDir}. Aborting.\n`,
+    );
+    process.exit(1);
+  }
+
+  // load manifest from both enpage.config.js and package.json
+  // manifest.json is used to store the template ID for future updates
+  const config = await loadConfigFromJsFile(resolve(templateDir, "enpage.config.js"), logger);
+
+  validateTemplateConfig(config, logger);
+
+  const token = getTokenOrThrow();
+  const pkgLocation = getPackageLocation(templateDir);
+
+  if (!pkgLocation) {
+    logger.error(`  ${chalk.redBright("Error")}: package.json file not found in ${templateDir}. Aborting.\n`);
+    process.exit(1);
+  }
+
+  // load package.json to get the template ID (if it exists)
+  const pkg = await getPackageJsonContents(pkgLocation);
+
+  if (!pkg) {
+    logger.error(
+      `  ${chalk.redBright("Error")}: cannot read/parse package.json file in ${templateDir}. Aborting.\n`,
+    );
+    process.exit(1);
+  }
+
+  if (!pkg.enpage?.id) {
+    // call API to create a new template
+    const { data, isError, status } = await post<{ success: true; template: { id: string } }>(
+      API_ENDPOINT_REGISTER_TEMPLATE,
+      {}, // todo: fill with template data
+    );
+    if (isError) {
+      logger.error(`  ${chalk.redBright("Error")}: Cannot register template: ${formatAPIError(data)}\n`);
+      process.exit(1);
+    }
+    pkg.enpage ??= {};
+    pkg.enpage.id = data.template.id;
+
+    // save the template ID to package.json
+    try {
+      if (!options.dryRun) writeFileSync(pkgLocation, JSON.stringify(pkg, null, 2));
+    } catch (e) {
+      logger.error(
+        `  ${chalk.redBright("Error")}: Cannot update template id in package.json file located in ${templateDir}. Aborting.\n`,
+      );
+      process.exit(1);
+    }
+  }
+
+  const templateId = pkg.enpage.id;
+
+  // submit template to Enpage
+  logger.info(`Submitting template to Enpage...\n`);
+
+  const uploadResults = await uploadTemplate(templateId, templateDir, token, options.dryRun);
+
+  if (!uploadResults.success) {
+    logger.error("\nUpload failed. See details above.\n");
+    process.exit(1);
+  }
+
+  logger.success(`Template ${templateId} published.\n`);
+}
+
+function getPackageLocation(templateDir: string) {
+  return existsSync(resolve(templateDir, "package.json"))
+    ? resolve(templateDir, "package.json")
+    : existsSync(resolve(templateDir, "template-package.json"))
+      ? resolve(templateDir, "template-package.json")
+      : false;
+}
+
+function getPackageJsonContents(pkgJsonPath: string) {
+  try {
+    return JSON.parse(readFileSync(pkgJsonPath, "utf-8"));
+  } catch (e) {
+    return null;
+  }
+}