@jxsuite/studio 0.35.0 → 0.36.0

package/src/services/ai-models.ts

@@ -11,6 +11,7 @@
  * @license MIT
  */
 
+import type { AiModelsResponse } from "@jxsuite/protocol";
 import { getPlatform } from "../platform";
 import { getBaseUrl, getOpenAiKey } from "./ai-settings";
 
@@ -20,10 +21,35 @@ export interface AiModel {
 }
 
 let cache: AiModel[] | null = null;
+let proxyConfigured = false;
+let proxyManaged = false;
+let proxyDefaultModel = "";
 
 /** Drop the cached model list (call after credentials/endpoint changes). */
 export function invalidateModelCache() {
   cache = null;
+  proxyConfigured = false;
+  proxyManaged = false;
+  proxyDefaultModel = "";
+}
+
+/**
+ * Whether the proxy reported itself configured on the last fetch — true when the backend holds
+ * credentials (managed platforms, OPENAI_API_KEY env), so the assistant works without a locally
+ * stored key.
+ */
+export function isProxyConfigured(): boolean {
+  return proxyConfigured;
+}
+
+/** Whether the platform manages AI credentials itself (cloud Workers AI). */
+export function isManagedProxy(): boolean {
+  return proxyManaged;
+}
+
+/** The proxy's preferred model id ("" when it does not declare one). */
+export function getProxyDefaultModel(): string {
+  return proxyDefaultModel;
 }
 
 /**
@@ -58,7 +84,10 @@ export async function fetchAvailableModels(
   if (!resp.ok) {
     throw new Error(`HTTP ${resp.status}`);
   }
-  const data = (await resp.json()) as { models?: { id: string; name?: string }[] };
+  const data = (await resp.json()) as Partial<AiModelsResponse>;
+  proxyConfigured = data.configured === true;
+  proxyManaged = data.managed === true;
+  proxyDefaultModel = data.defaultModel ?? "";
   cache = (data.models || []).map((m) => ({ id: m.id, name: m.name || m.id }));
   return cache;
 }

package/src/services/cf-settings.ts

@@ -0,0 +1,58 @@
+/// <reference lib="dom" />
+/**
+ * Cf-settings — local persistence for the Cloudflare publish connection on
+ * platforms without a hosted OAuth broker (dev server, desktop). The API
+ * token is stored like the AI key: localStorage first, mirrored through the
+ * platform settings backend where one exists. It only ever leaves the machine
+ * to the same-origin `/__studio/cf/proxy`, which forwards it as a bearer to
+ * api.cloudflare.com (not CORS-enabled, hence the proxy).
+ *
+ * @license MIT
+ */
+
+import { persistSettings } from "./settings-store";
+
+const TOKEN_STORAGE = "jx.cf.token";
+const ACCOUNT_STORAGE = "jx.cf.accountId";
+
+function read(key: string): string {
+  try {
+    return globalThis.localStorage?.getItem(key) ?? "";
+  } catch {
+    return "";
+  }
+}
+
+function write(key: string, value: string): void {
+  try {
+    const trimmed = (value || "").trim();
+    if (trimmed) {
+      globalThis.localStorage?.setItem(key, trimmed);
+    } else {
+      globalThis.localStorage?.removeItem(key);
+    }
+  } catch {
+    // Storage unavailable (private mode) — the connection just won't persist.
+  }
+  persistSettings();
+}
+
+/** The stored Cloudflare API token, or "" when not connected. */
+export function getCfToken(): string {
+  return read(TOKEN_STORAGE);
+}
+
+/** Persist (or clear, with a blank value) the Cloudflare API token. */
+export function setCfToken(token: string): void {
+  write(TOKEN_STORAGE, token);
+}
+
+/** The selected Cloudflare account id, or "" when none chosen yet. */
+export function getCfAccountId(): string {
+  return read(ACCOUNT_STORAGE);
+}
+
+/** Persist (or clear) the selected Cloudflare account id. */
+export function setCfAccountId(accountId: string): void {
+  write(ACCOUNT_STORAGE, accountId);
+}

package/src/services/settings-store.ts

@@ -14,7 +14,13 @@
 import { getPlatform, hasPlatform } from "../platform";
 
 /** The localStorage keys mirrored into the platform's user-settings store. */
-export const PERSISTED_SETTINGS_KEYS = ["jx.ai.openaiKey", "jx.ai.baseUrl", "jx.ai.model"] as const;
+export const PERSISTED_SETTINGS_KEYS = [
+  "jx.ai.openaiKey",
+  "jx.ai.baseUrl",
+  "jx.ai.model",
+  "jx.cf.token",
+  "jx.cf.accountId",
+] as const;
 
 /** Read a localStorage value defensively, treating unavailable/throwing storage as empty. */
 function readLocal(key: string): string {

package/src/studio.ts

@@ -126,6 +126,7 @@ import {
 } from "./panels/block-action-bar";
 import { initCssData } from "./panels/style-utils";
 import { initQuickSearch } from "./panels/quick-search";
+import { hydrateProjectList } from "./project-list";
 import { addRecentProject, hydrateRecentProjects, removeRecentProject } from "./recent-projects";
 import { hydrateSettings } from "./services/settings-store";
 import { initWelcome } from "./panels/welcome-screen";
@@ -744,6 +745,13 @@ void hydrateRecentProjects().then(() => {
   render();
 });
 
+// Hydrate the platform's project catalogue (dev server sites, cloud projects), then refresh the
+// Welcome screen, which reads it synchronously. No-op on platforms without listProjects.
+// oxlint-disable-next-line unicorn/prefer-top-level-await -- deliberate fire-and-forget: hydration must not block initial render
+void hydrateProjectList().then(() => {
+  render();
+});
+
 // Hydrate user settings (AI connection parameters) from the backend store, then re-render so
 // Key-gated surfaces (assistant gate, New Project Import/Agent tabs) see the stored key.
 // oxlint-disable-next-line unicorn/prefer-top-level-await -- deliberate fire-and-forget: hydration must not block initial render

package/src/types.ts

@@ -1,168 +1,58 @@
 /// <reference lib="dom" />
-import type {
-  JsonValue as SchemaJsonValue,
-  JxMutableNode,
-  JxPath,
-  ProjectConfig,
-} from "@jxsuite/schema/types";
-
-// ─── Git & Platform Types ───────────────────────────────────────────────────
-
-export interface GitFileStatus {
-  status: string;
-  path: string;
-  staged?: boolean;
-}
-
-export interface GitStatusResult {
-  branch: string;
-  files: GitFileStatus[];
-  ahead: number;
-  behind: number;
-  isRepo: boolean;
-  remotes: string[];
-}
-
-export interface GitBranchesResult {
-  current: string;
-  branches: string[];
-}
-
-export interface GitLogEntry {
-  hash: string;
-  message: string;
-  author: string;
-  date: string;
-}
-
-export interface ComponentSlotMeta {
-  name: string;
-  description?: string;
-  fallback?: (JxMutableNode | string)[];
-}
-
-export interface ComponentMeta {
-  tagName: string;
-  $id?: string | null;
-  path: string;
-  props?: { name: string; type?: string; default?: JsonValue; [k: string]: unknown }[];
-  slots?: ComponentSlotMeta[];
-  hasElements?: boolean;
-}
-
-export interface PackageInfo {
-  name: string;
-  version: string;
-  /** True when the dependency lives in `devDependencies` rather than `dependencies`. */
-  dev?: boolean;
-}
-
-/** A dependency with a newer version available, as reported by `bun outdated` / the npm registry. */
-export interface OutdatedInfo {
-  name: string;
-  /** The version range pinned in package.json (e.g. "^0.19.0"). */
-  current: string;
-  /** The newest published version. */
-  latest: string;
-  /** The newest version satisfying the current range, if known. */
-  wanted?: string;
-  dev?: boolean;
-}
-
-/** Result of a package mutation that runs `bun install` (install / set-versions). */
-export interface PackageOpResult {
-  ok: boolean;
-  /** Combined stdout/stderr from the bun invocation, surfaced to the user on failure. */
-  log?: string;
-}
-
-/** Desktop app/build info surfaced in the About screen. */
-export interface AppInfo {
-  version: string;
-  channel: string;
-  hash: string;
-  /** Human-readable update status (e.g. "Up to date", "Update available"), if known. */
-  updateStatus?: string;
-}
-
-export interface CodeServiceResult {
-  code?: string;
-  diagnostics?: unknown[];
-  [key: string]: unknown;
-}
-
-export interface DirEntry {
-  name: string;
-  path: string;
-  type: "file" | "directory";
-  size?: number;
-  modified?: string;
-}
+import type { JxMutableNode, JxPath, ProjectConfig } from "@jxsuite/schema/types";
 
-/** A filesystem change pushed from the backend (project-relative, forward-slashed path). */
-export interface FsEvent {
-  type: "add" | "change" | "unlink" | "addDir" | "unlinkDir";
-  path: string;
-  isDir: boolean;
-}
-
-/** Result of a rename, including the references rewritten across the project (refactor report). */
-export interface RenameResult {
-  ok: boolean;
-  from: string;
-  to: string;
-  isDir?: boolean;
-  references?: {
-    filesChanged: number;
-    refsUpdated: number;
-    files: { path: string; count: number }[];
-  };
-  errors?: { path: string; error: string }[];
-  tag?: { from: string; to: string; filesChanged: number; refsUpdated: number };
-  tagSkipped?: string;
-  error?: string;
-}
+// ─── Wire types (the Studio Backend Protocol) ───────────────────────────────
+/* The request/response shapes every backend serves live in @jxsuite/protocol;
+   re-exported here so existing `../types` imports keep working. */
 
-/** A starter template surfaced in the New Project picker (mirrors @jxsuite/starters StarterMeta). */
-export interface StarterInfo {
-  id: string;
-  name: string;
-  industry: string;
-  tagline: string;
-  description: string;
-  features: string[];
-  accent: string;
-  /** Preview image as a self-contained `data:` URI. */
-  thumbnail: string;
-}
+import type {
+  AppInfo,
+  CfConnection,
+  CodeServiceResult,
+  ComponentMeta,
+  DirEntry,
+  FsEvent,
+  GitBranchesResult,
+  GitLogEntry,
+  GitStatusResult,
+  ImportProgressEvent,
+  ImportSiteOptions,
+  OutdatedInfo,
+  PackageInfo,
+  PackageOpResult,
+  ProjectListEntry,
+  RecentProjectEntry,
+  RenameResult,
+  StarterInfo,
+} from "@jxsuite/protocol";
 
-/** A progress line from the AI-guided site import (mirrors @jxsuite/import ImportProgressEvent). */
-export interface ImportProgressEvent {
-  phase: string;
-  message: string;
-  current?: number;
-  total?: number;
-}
-
-/** Options for {@link StudioPlatform.importSite}. */
-export interface ImportSiteOptions {
-  /** The live site to clone; must be http(s). */
-  url: string;
-  /** Display name for the new project. */
-  name: string;
-  /** Destination directory (platform-interpreted: project-relative on the dev server). */
-  directory: string;
-  /** Max crawl depth; 0 = single page. */
-  depth: number;
-  /** Max pages to capture. */
-  maxPages: number;
-  /** Refine component/prop names with the LLM (requires a key). */
-  aiComponents: boolean;
-  /** OpenAI-compatible credentials, from the user's AI settings. */
-  apiKey?: string;
-  baseUrl?: string;
-  model?: string;
-}
+export type {
+  AiModelInfo,
+  AiModelsResponse,
+  AppInfo,
+  CfConnection,
+  CodeServiceResult,
+  ComponentMeta,
+  ComponentSlotMeta,
+  DirEntry,
+  ErrorBody,
+  FsEvent,
+  GitBranchesResult,
+  GitFileStatus,
+  GitLogEntry,
+  GitStatusResult,
+  ImportProgressEvent,
+  ImportSiteOptions,
+  JsonValue,
+  OutdatedInfo,
+  PackageInfo,
+  PackageOpResult,
+  ProjectListEntry,
+  PullRequestInfo,
+  RecentProjectEntry,
+  RenameResult,
+  StarterInfo,
+} from "@jxsuite/protocol";
 
 export interface StudioPlatform {
   id: string;
@@ -326,6 +216,42 @@ export interface StudioPlatform {
   getRecentProjects?: () => Promise<RecentProjectEntry[]>;
   /** Persist the full recent-projects list to the backend store. */
   saveRecentProjects?: (projects: RecentProjectEntry[]) => Promise<void>;
+  // ─── Project catalogue (platforms that can enumerate openable projects) ─────
+  /**
+   * Enumerate every project this platform can open — the dev server's sites under its root, a cloud
+   * platform's remote projects. Entry `root` values re-open through the same paths as recent
+   * projects (openRecentProject). Absent on desktop, where the OS file system is the catalogue and
+   * projects are found via the native picker instead.
+   */
+  listProjects?: () => Promise<ProjectListEntry[]>;
+  // ─── Identity & hosting connections (publish surface) ───────────────────────
+  /** The signed-in user's identity, when the platform has one (cloud). */
+  getUser?: () => Promise<{ login: string; name?: string; avatarUrl?: string } | null>;
+  /**
+   * Open a pull request for the current branch. Cloud platforms implement it against their session;
+   * local platforms omit it and Studio falls back to a direct GitHub API call with the user's
+   * stored token.
+   */
+  createPullRequest?: (opts: {
+    title: string;
+    body?: string;
+    head?: string;
+    base?: string;
+  }) => Promise<{ url: string; number: number }>;
+  /** Current Cloudflare connection state, when the platform can broker one. */
+  cfConnection?: () => Promise<CfConnection | null>;
+  /**
+   * Interactively connect a Cloudflare account (hosted OAuth on the cloud platform). Local
+   * platforms omit it — the publish UI collects an API token instead and verifies via
+   * cfConnection.
+   */
+  cfConnect?: () => Promise<CfConnection | null>;
+  /**
+   * Allowlisted Cloudflare API passthrough (accounts, Pages projects and deployments). The backend
+   * injects credentials — an OAuth token on the cloud platform, the user's pasted API token locally
+   * — so no secret ever rides in the request body.
+   */
+  cfApi?: (path: string, init?: { method?: string; body?: unknown }) => Promise<unknown>;
   // ─── User settings (backend-persisted; undefined on dev-server) ─────────────
   /**
    * Read the user-level settings map (e.g. the AI connection parameters) from a backend store
@@ -337,13 +263,6 @@ export interface StudioPlatform {
   saveSettings?: (settings: Record<string, string>) => Promise<void>;
 }
 
-/** A recently-opened project, keyed by its re-openable `root` (platform-specific). */
-export interface RecentProjectEntry {
-  name: string;
-  root: string;
-  timestamp: number;
-}
-
 // ─── Studio Types ───────────────────────────────────────────────────────────
 
 export interface CanvasPanel {
@@ -409,9 +328,3 @@ export interface ProjectState {
   projectDirs?: string[];
   [key: string]: unknown;
 }
-
-/**
- * A JSON document value, or `undefined` to signal property removal in the mutators. Re-uses the
- * schema's precise recursive JSON model.
- */
-export type JsonValue = SchemaJsonValue | undefined;