sunpeak 0.6.7 → 0.7.10

package/README.md

@@ -15,7 +15,7 @@
 [![TypeScript](https://img.shields.io/badge/TypeScript-5.6-blue?style=flat-square&logo=typescript)](https://www.typescriptlang.org/)
 [![React](https://img.shields.io/badge/React-19-blue?style=flat-square&logo=react)](https://reactjs.org/)
 
-The MCP App framework.
+The ChatGPT App framework.
 
 Quickstart, build, test, and ship your ChatGPT App locally!
 
@@ -49,11 +49,11 @@ To add sunpeak to an existing project, refer to the [documentation](https://docs
 
 sunpeak is an npm package consisting of:
 
-1. **The `sunpeak` library** (`./src`). An npm package for running & testing MCP Apps. This standalone library contains:
+1. **The `sunpeak` library** (`./src`). An npm package for running & testing ChatGPT Apps. This standalone library contains:
    1. Runtime APIs - Strongly typed, multi-platform APIs for interacting with the ChatGPT runtime, architected to support future platforms (Gemini, Claude).
    2. ChatGPT simulator - React component replicating ChatGPT's runtime.
    3. MCP server - Mock data MCP server for testing local Resources in the real ChatGPT.
-2. **The `sunpeak` framework** (`./template`). An end-to-end framework MCP Apps, from quickstart to shipped. This templated npm package includes:
+2. **The `sunpeak` framework** (`./template`). An end-to-end framework for ChatGPT Apps, from quickstart to shipped. This templated npm package includes:
    1. Project scaffold - Complete development setup with build, test, and mcp tooling.
    2. UI components - Production-ready components following ChatGPT design guidelines and using OpenAI apps-sdk-ui React components.
    3. CLI utility (`./bin`) - Commands for working with the sunpeak framework.

package/bin/commands/build.mjs

@@ -23,7 +23,7 @@ export async function build(projectRoot = process.cwd()) {
   const isTemplate = path.basename(projectRoot) === 'template';
   const parentSrc = path.resolve(projectRoot, '../src');
 
-  const distDir = path.join(projectRoot, 'dist/chatgpt');
+  const distDir = path.join(projectRoot, 'dist');
   const buildDir = path.join(projectRoot, 'dist/build-output');
   const tempDir = path.join(projectRoot, '.tmp');
   const resourcesDir = path.join(projectRoot, 'src/resources');
@@ -194,9 +194,9 @@ export async function build(projectRoot = process.cwd()) {
     }
   }
 
-  // Now copy all files from build-output to dist/chatgpt
-  console.log('\nCopying built files to dist/chatgpt...');
-  resourceFiles.forEach(({ output, buildOutDir }) => {
+  // Now copy all files from build-output to dist/
+  console.log('\nCopying built files to dist/...');
+  for (const { output, buildOutDir } of resourceFiles) {
     const builtFile = path.join(buildOutDir, output);
     const destFile = path.join(distDir, output);
 
@@ -212,7 +212,24 @@ export async function build(projectRoot = process.cwd()) {
       }
       process.exit(1);
     }
-  });
+  }
+
+  // Generate resource metadata JSON files with URIs
+  console.log('\nGenerating resource metadata JSON files...');
+  const timestamp = Date.now().toString(36);
+  for (const { componentFile } of resourceFiles) {
+    const kebabName = componentFile.replace('-resource', '');
+    const srcJson = path.join(resourcesDir, `${componentFile}.json`);
+    const destJson = path.join(distDir, `${kebabName}.json`);
+
+    if (existsSync(srcJson)) {
+      const meta = JSON.parse(readFileSync(srcJson, 'utf-8'));
+      // Generate URI using resource name and build timestamp
+      meta.uri = `ui://${meta.name}-${timestamp}`;
+      writeFileSync(destJson, JSON.stringify(meta, null, 2));
+      console.log(`✓ Generated ${kebabName}.json (uri: ${meta.uri})`);
+    }
+  }
 
   // Clean up temp and build directories
   if (existsSync(tempDir)) {

package/bin/commands/deploy.mjs

@@ -0,0 +1,125 @@
+#!/usr/bin/env node
+import { join } from 'path';
+import { push, findResources } from './push.mjs';
+
+/**
+ * Deploy command - same as push but with tag="prod"
+ * @param {string} projectRoot - Project root directory
+ * @param {Object} options - Command options (same as push, but tag defaults to "prod")
+ */
+export async function deploy(projectRoot = process.cwd(), options = {}) {
+  // Handle help flag
+  if (options.help) {
+    console.log(`
+sunpeak deploy - Push resources to production (push with "prod" tag)
+
+Usage:
+  sunpeak deploy [file] [options]
+
+Options:
+  -r, --repository <owner/repo>  Repository name (defaults to git remote origin)
+  -t, --tag <name>               Additional tag(s) to assign (always includes "prod")
+  -h, --help                     Show this help message
+
+Arguments:
+  file                           Optional JS file to deploy (e.g., dist/carousel.js)
+                                 If not provided, looks for resources in current
+                                 directory first, then falls back to dist/
+
+Examples:
+  sunpeak deploy                     Push all resources with "prod" tag
+  sunpeak deploy dist/carousel.js    Deploy a single resource
+  sunpeak deploy -r myorg/my-app     Deploy to "myorg/my-app" repository
+  sunpeak deploy -t v1.0              Deploy with "prod" and "v1.0" tags
+
+This command is equivalent to: sunpeak push --tag prod
+`);
+    return;
+  }
+
+  // Always include "prod" tag, supplemented by any additional tags
+  const additionalTags = options.tags?.filter((t) => t !== 'prod') ?? [];
+  const deployOptions = {
+    ...options,
+    tags: ['prod', ...additionalTags],
+  };
+
+  console.log('Deploying to production...');
+  console.log();
+
+  // If no specific file provided, check current directory first, then dist/
+  if (!deployOptions.file) {
+    const cwdResources = findResources(projectRoot);
+    if (cwdResources.length > 0) {
+      // Found resources in current directory, push each one
+      for (const resource of cwdResources) {
+        await push(projectRoot, { ...deployOptions, file: resource.jsPath });
+      }
+      return;
+    }
+    // Fall back to dist/ directory (handled by push)
+  }
+
+  await push(projectRoot, deployOptions);
+}
+
+/**
+ * Parse command line arguments
+ */
+function parseArgs(args) {
+  const options = { tags: [] };
+  let i = 0;
+
+  while (i < args.length) {
+    const arg = args[i];
+
+    if (arg === '--repository' || arg === '-r') {
+      options.repository = args[++i];
+    } else if (arg === '--tag' || arg === '-t') {
+      options.tags.push(args[++i]);
+    } else if (arg === '--help' || arg === '-h') {
+      console.log(`
+sunpeak deploy - Deploy resources to production (push with "prod" tag)
+
+Usage:
+  sunpeak deploy [file] [options]
+
+Options:
+  -r, --repository <owner/repo>  Repository name (defaults to git remote origin)
+  -t, --tag <name>               Additional tag(s) to assign (always includes "prod")
+  -h, --help                     Show this help message
+
+Arguments:
+  file                           Optional JS file to deploy (e.g., dist/carousel.js)
+                                 If not provided, looks for resources in current
+                                 directory first, then falls back to dist/
+
+Examples:
+  sunpeak deploy                     Deploy all resources with "prod" tag
+  sunpeak deploy dist/carousel.js    Deploy a single resource
+  sunpeak deploy -r myorg/my-app     Deploy to "myorg/my-app" repository
+  sunpeak deploy -t v1.0              Deploy with "prod" and "v1.0" tags
+
+This command is equivalent to: sunpeak push --tag prod
+`);
+      process.exit(0);
+    } else if (!arg.startsWith('-')) {
+      // Positional argument - treat as file path
+      options.file = arg;
+    }
+
+    i++;
+  }
+
+  return options;
+}
+
+// Allow running directly
+if (import.meta.url === `file://${process.argv[1]}`) {
+  const args = process.argv.slice(2);
+  const options = parseArgs(args);
+  deploy(process.cwd(), options).catch((error) => {
+    console.error('Error:', error.message);
+    process.exit(1);
+  });
+}

package/bin/commands/login.mjs

@@ -0,0 +1,217 @@
+#!/usr/bin/env node
+import { existsSync, mkdirSync, writeFileSync, readFileSync } from 'fs';
+import { join } from 'path';
+import { homedir, platform } from 'os';
+import { exec } from 'child_process';
+
+const SUNPEAK_API_URL = process.env.SUNPEAK_API_URL || 'https://app.sunpeak.ai';
+const CREDENTIALS_DIR = join(homedir(), '.sunpeak');
+const CREDENTIALS_FILE = join(CREDENTIALS_DIR, 'credentials.json');
+
+// Polling configuration
+const POLL_INTERVAL_MS = 2500; // 2.5 seconds between polls.
+const MAX_POLL_DURATION_MS = 2 * 60 * 1000; // 2 minutes max.
+
+/**
+ * Load existing credentials if present
+ */
+function loadCredentials() {
+  if (!existsSync(CREDENTIALS_FILE)) {
+    return null;
+  }
+  try {
+    return JSON.parse(readFileSync(CREDENTIALS_FILE, 'utf-8'));
+  } catch {
+    return null;
+  }
+}
+
+/**
+ * Save credentials to disk
+ */
+function saveCredentials(credentials) {
+  if (!existsSync(CREDENTIALS_DIR)) {
+    mkdirSync(CREDENTIALS_DIR, { recursive: true, mode: 0o700 });
+  }
+  writeFileSync(CREDENTIALS_FILE, JSON.stringify(credentials, null, 2), { mode: 0o600 });
+}
+
+/**
+ * Request a device code from the authorization server
+ */
+async function requestDeviceCode() {
+  const response = await fetch(`${SUNPEAK_API_URL}/oauth/device_authorization`, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+  });
+
+  if (!response.ok) {
+    const text = await response.text();
+    throw new Error(`Failed to request device code: ${response.status} ${text}`);
+  }
+
+  return response.json();
+}
+
+/**
+ * Poll for the access token
+ */
+async function pollForToken(deviceCode) {
+  const startTime = Date.now();
+
+  while (Date.now() - startTime < MAX_POLL_DURATION_MS) {
+    let response;
+    try {
+      response = await fetch(`${SUNPEAK_API_URL}/oauth/token`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
+        body: new URLSearchParams({
+          grant_type: 'urn:ietf:params:oauth:grant-type:device_code',
+          device_code: deviceCode,
+        }),
+      });
+    } catch (err) {
+      // Network error - wait and retry
+      await sleep(POLL_INTERVAL_MS);
+      continue;
+    }
+
+    let data;
+    let responseText;
+    try {
+      responseText = await response.text();
+      data = JSON.parse(responseText);
+    } catch {
+      // Non-JSON response - this is unexpected, throw with details
+      throw new Error(
+        `Server returned unexpected response (${response.status}): ${responseText?.slice(0, 200) || 'empty response'}`
+      );
+    }
+
+    if (response.ok && data.access_token) {
+      return data;
+    }
+
+    // Handle standard OAuth 2.0 device flow errors (expected during polling)
+    if (data.error === 'authorization_pending') {
+      // User hasn't authorized yet, keep polling
+      await sleep(POLL_INTERVAL_MS);
+      continue;
+    }
+
+    if (data.error === 'slow_down') {
+      // Server asking us to slow down, increase interval
+      await sleep(POLL_INTERVAL_MS * 2);
+      continue;
+    }
+
+    if (data.error === 'access_denied') {
+      throw new Error('Authorization denied by user');
+    }
+
+    if (data.error === 'expired_token') {
+      throw new Error('Device code expired. Please try again.');
+    }
+
+    // If response was OK but no access_token, something is wrong with the response
+    if (response.ok) {
+      throw new Error('Invalid token response from server');
+    }
+
+    // Unknown error - include status code for debugging
+    const errorMessage = data.error_description || data.error || 'Unknown error';
+    throw new Error(`Authorization failed (${response.status}): ${errorMessage}`);
+  }
+
+  throw new Error('Authorization timed out. Please try again.');
+}
+
+function sleep(ms) {
+  return new Promise((resolve) => setTimeout(resolve, ms));
+}
+
+/**
+ * Open a URL in the default browser
+ * Returns true if successful, false otherwise
+ */
+function openBrowser(url) {
+  return new Promise((resolve) => {
+    const os = platform();
+    let command;
+
+    // Platform-specific commands to open URLs
+    if (os === 'darwin') {
+      command = `open "${url}"`;
+    } else if (os === 'win32') {
+      command = `start "" "${url}"`;
+    } else {
+      // Linux and other Unix-like systems
+      command = `xdg-open "${url}"`;
+    }
+
+    exec(command, (error) => {
+      resolve(!error);
+    });
+  });
+}
+
+/**
+ * Main login command
+ */
+export async function login() {
+  // Check if already logged in
+  const existing = loadCredentials();
+  if (existing?.access_token) {
+    console.log('Already logged in. Run "sunpeak logout" first to switch accounts.');
+    return;
+  }
+
+  console.log('Starting device authorization flow...\n');
+
+  // Step 1: Request device code
+  const deviceAuth = await requestDeviceCode();
+
+  // Step 2: Open browser and display instructions
+  // Prefer verification_uri_complete which has the code pre-filled
+  const authUrl =
+    deviceAuth.verification_uri_complete ||
+    `${deviceAuth.verification_uri}?user_code=${encodeURIComponent(deviceAuth.user_code)}`;
+
+  const browserOpened = await openBrowser(authUrl);
+
+  if (browserOpened) {
+    console.log('Opening browser for authentication...\n');
+    console.log(`If the browser didn't open, visit: ${deviceAuth.verification_uri}`);
+    console.log(`And enter code: ${deviceAuth.user_code}`);
+  } else {
+    console.log('To complete login, please:');
+    console.log(`  1. Visit: ${deviceAuth.verification_uri}`);
+    console.log(`  2. Enter code: ${deviceAuth.user_code}`);
+  }
+  console.log('\nWaiting for authorization...');
+
+  // Step 3: Poll for token
+  const tokenResponse = await pollForToken(deviceAuth.device_code);
+
+  // Step 4: Save credentials
+  const credentials = {
+    access_token: tokenResponse.access_token,
+    token_type: tokenResponse.token_type || 'Bearer',
+    expires_at: tokenResponse.expires_in
+      ? Date.now() + tokenResponse.expires_in * 1000
+      : null,
+    created_at: Date.now(),
+  };
+
+  saveCredentials(credentials);
+
+  console.log('\n✓ Successfully logged in to Sunpeak!');
+}
+
+// Allow running directly
+if (import.meta.url === `file://${process.argv[1]}`) {
+  login().catch((error) => {
+    console.error('Error:', error.message);
+    process.exit(1);
+  });
+}

package/bin/commands/logout.mjs

@@ -0,0 +1,87 @@
+#!/usr/bin/env node
+import { existsSync, readFileSync, unlinkSync } from 'fs';
+import { join } from 'path';
+import { homedir } from 'os';
+
+const SUNPEAK_API_URL = process.env.SUNPEAK_API_URL || 'https://app.sunpeak.ai';
+const CREDENTIALS_DIR = join(homedir(), '.sunpeak');
+const CREDENTIALS_FILE = join(CREDENTIALS_DIR, 'credentials.json');
+
+/**
+ * Load existing credentials if present
+ */
+function loadCredentials() {
+  if (!existsSync(CREDENTIALS_FILE)) {
+    return null;
+  }
+  try {
+    return JSON.parse(readFileSync(CREDENTIALS_FILE, 'utf-8'));
+  } catch {
+    return null;
+  }
+}
+
+/**
+ * Delete credentials file
+ */
+function deleteCredentials() {
+  if (existsSync(CREDENTIALS_FILE)) {
+    unlinkSync(CREDENTIALS_FILE);
+  }
+}
+
+/**
+ * Revoke the access token on the server
+ */
+async function revokeToken(accessToken) {
+  try {
+    const response = await fetch(`${SUNPEAK_API_URL}/oauth/revoke`, {
+      method: 'POST',
+      headers: {
+        Authorization: `Bearer ${accessToken}`,
+        'Content-Type': 'application/json',
+      },
+    });
+
+    // 200 OK means success, but we also accept other success codes
+    return response.ok;
+  } catch {
+    // Network error - token may still be valid on server
+    // but we'll clean up locally anyway
+    return false;
+  }
+}
+
+/**
+ * Main logout command
+ */
+export async function logout() {
+  const credentials = loadCredentials();
+
+  if (!credentials?.access_token) {
+    console.log('Not logged in.');
+    return;
+  }
+
+  console.log('Logging out...');
+
+  // Revoke token on server
+  const revoked = await revokeToken(credentials.access_token);
+
+  // Always delete local credentials regardless of revocation result
+  deleteCredentials();
+
+  if (revoked) {
+    console.log('✓ Successfully logged out of Sunpeak.');
+  } else {
+    console.log('✓ Logged out locally. (Server token revocation may have failed)');
+  }
+}
+
+// Allow running directly
+if (import.meta.url === `file://${process.argv[1]}`) {
+  logout().catch((error) => {
+    console.error('Error:', error.message);
+    process.exit(1);
+  });
+}