@fluid-app/fluid-cli-theme-dev 0.1.21 → 0.1.23

package/src/theme/dev-server/proxy.ts

@@ -1,125 +0,0 @@
-import https from "node:https";
-import type { IncomingMessage, ServerResponse } from "node:http";
-import { injectHotReload } from "./hot-reload.js";
-import { getAuthToken } from "@fluid-app/fluid-cli";
-
-const HOP_BY_HOP = new Set([
-  "connection",
-  "keep-alive",
-  "proxy-authenticate",
-  "proxy-authorization",
-  "te",
-  "trailer",
-  "transfer-encoding",
-  "upgrade",
-  "content-security-policy",
-]);
-
-export interface ProxyOptions {
-  company: string;
-  themeId: number;
-  reloadMode: "full-page" | "off";
-  pendingFiles?: () => Array<{ relativePath: string; read: () => string }>;
-}
-
-export async function proxyRequest(
-  req: IncomingMessage,
-  res: ServerResponse,
-  opts: ProxyOptions,
-): Promise<void> {
-  const companyHost = `${opts.company}.fluid.app`;
-
-  const headers: Record<string, string> = {};
-  for (const [k, v] of Object.entries(req.headers)) {
-    if (!HOP_BY_HOP.has(k.toLowerCase()) && typeof v === "string") {
-      headers[k] = v;
-    }
-  }
-  headers["host"] = companyHost;
-  headers["x-fluid-theme"] = String(opts.themeId);
-  headers["user-agent"] = "Fluid CLI";
-  headers["accept-encoding"] = "identity";
-
-  const url = new URL(req.url ?? "/", `http://${req.headers.host}`);
-  url.searchParams.set("_fd", "0");
-  url.searchParams.set("pb", "0");
-
-  const pending = opts.pendingFiles?.() ?? [];
-  const isGet = req.method === "GET" || req.method === "HEAD";
-  let method = req.method ?? "GET";
-  let body: string | Buffer | undefined;
-
-  if (pending.length > 0 && isGet) {
-    method = "POST";
-    const params = new URLSearchParams();
-    params.set("_method", req.method ?? "GET");
-    for (const f of pending) {
-      params.set(`replace_templates[${f.relativePath}]`, f.read());
-    }
-    const token = getAuthToken();
-    if (token) headers["authorization"] = `Bearer ${token}`;
-    headers["content-type"] = "application/x-www-form-urlencoded";
-    body = params.toString();
-    headers["content-length"] = String(Buffer.byteLength(body));
-  } else if (!isGet) {
-    body = await readBody(req);
-    if (body.length > 0) {
-      headers["content-length"] = String(body.length);
-    }
-  }
-
-  return new Promise((resolve, reject) => {
-    const options: https.RequestOptions = {
-      hostname: companyHost,
-      port: 443,
-      path: url.pathname + (url.search || ""),
-      method,
-      headers,
-    };
-
-    const proxyReq = https.request(options, (proxyRes) => {
-      const contentType = proxyRes.headers["content-type"] ?? "";
-      const isHtml = contentType.includes("text/html");
-
-      const responseHeaders: Record<string, string | string[]> = {};
-      for (const [k, v] of Object.entries(proxyRes.headers)) {
-        if (!HOP_BY_HOP.has(k.toLowerCase()) && v !== undefined) {
-          responseHeaders[k] = v as string | string[];
-        }
-      }
-
-      if (isHtml) {
-        const chunks: Buffer[] = [];
-        proxyRes.on("data", (chunk: Buffer) => chunks.push(chunk));
-        proxyRes.on("end", () => {
-          let html = Buffer.concat(chunks).toString("utf-8");
-          html = injectHotReload(html, opts.reloadMode);
-          responseHeaders["content-length"] = String(Buffer.byteLength(html));
-          res.writeHead(proxyRes.statusCode ?? 200, responseHeaders);
-          res.end(html);
-          resolve();
-        });
-      } else {
-        res.writeHead(proxyRes.statusCode ?? 200, responseHeaders);
-        proxyRes.pipe(res);
-        proxyRes.on("end", resolve);
-      }
-    });
-
-    proxyReq.on("error", (err) => {
-      reject(err);
-    });
-
-    if (body) proxyReq.write(body);
-    proxyReq.end();
-  });
-}
-
-function readBody(req: IncomingMessage): Promise<Buffer> {
-  return new Promise((resolve, reject) => {
-    const chunks: Buffer[] = [];
-    req.on("data", (chunk: Buffer) => chunks.push(chunk));
-    req.on("end", () => resolve(Buffer.concat(chunks)));
-    req.on("error", reject);
-  });
-}

package/src/theme/dev-server/sse.ts

@@ -1,43 +0,0 @@
-import type { ServerResponse } from "node:http";
-
-export class SSEStream {
-  private responses = new Set<ServerResponse>();
-
-  add(res: ServerResponse): void {
-    res.writeHead(200, {
-      "Content-Type": "text/event-stream",
-      "Cache-Control": "no-cache",
-      Connection: "keep-alive",
-      "Access-Control-Allow-Origin": "*",
-    });
-    res.write(":\n\n");
-    this.responses.add(res);
-    res.on("close", () => this.responses.delete(res));
-  }
-
-  broadcast(data: string): void {
-    const payload = `data: ${data}\n\n`;
-    for (const res of this.responses) {
-      try {
-        res.write(payload);
-      } catch {
-        this.responses.delete(res);
-      }
-    }
-  }
-
-  close(): void {
-    for (const res of this.responses) {
-      try {
-        res.end();
-      } catch {
-        // ignore
-      }
-    }
-    this.responses.clear();
-  }
-
-  get size(): number {
-    return this.responses.size;
-  }
-}

package/src/theme/dev-server/watcher.ts

@@ -1,54 +0,0 @@
-import { relative } from "node:path";
-import chokidar from "chokidar";
-import type { ThemeRoot } from "../root.js";
-import type { ThemeFile } from "../file.js";
-
-export type FileChangeHandler = (
-  modified: ThemeFile[],
-  added: ThemeFile[],
-  removed: ThemeFile[],
-) => Promise<void>;
-
-export function watchTheme(
-  root: ThemeRoot,
-  handler: FileChangeHandler,
-): () => Promise<void> {
-  const watcher = chokidar.watch(root.root, {
-    ignoreInitial: true,
-    ignored: (filePath: string) => {
-      if (filePath.includes("node_modules")) return true;
-      try {
-        const rel = relative(root.root, filePath);
-        const basename = rel.split(/[\\/]/).pop() ?? "";
-        return basename.startsWith(".") || root.ignore.ignore(rel);
-      } catch {
-        return false;
-      }
-    },
-    persistent: true,
-    awaitWriteFinish: { stabilityThreshold: 50, pollInterval: 10 },
-  });
-
-  let pending = Promise.resolve();
-  const enqueue = (fn: () => Promise<void>) => {
-    pending = pending.then(fn).catch(() => {});
-  };
-
-  watcher.on("change", (filePath) => {
-    const rel = relative(root.root, filePath);
-    if (root.ignore.ignore(rel)) return;
-    enqueue(() => handler([root.file(filePath)], [], []));
-  });
-
-  watcher.on("add", (filePath) => {
-    const rel = relative(root.root, filePath);
-    if (root.ignore.ignore(rel)) return;
-    enqueue(() => handler([], [root.file(filePath)], []));
-  });
-
-  watcher.on("unlink", (filePath) => {
-    enqueue(() => handler([], [], [root.file(filePath)]));
-  });
-
-  return () => watcher.close();
-}

package/src/theme/file.ts

@@ -1,104 +0,0 @@
-import {
-  readFileSync,
-  writeFileSync,
-  mkdirSync,
-  existsSync,
-  statSync,
-} from "node:fs";
-import { extname, basename, relative, dirname } from "node:path";
-import { createHash } from "node:crypto";
-import { mimeTypeFor, type MimeType } from "./mime-type.js";
-import {
-  validateSchemaText,
-  type Diagnostic,
-  type BlocksSchemaType,
-} from "@fluid-app/theme-schema";
-
-// Top-level theme folders that are not page templates. Everything else at the
-// top level (home_page, product, page, footer, navbar, …) is a page template.
-const NON_TEMPLATE_DIRS = new Set([
-  "sections",
-  "blocks",
-  "components",
-  "layouts",
-  "config",
-  "assets",
-  "locales",
-]);
-
-export class ThemeFile {
-  readonly absolutePath: string;
-  readonly relativePath: string;
-  readonly mime: MimeType;
-
-  constructor(absolutePath: string, root: string) {
-    this.absolutePath = absolutePath;
-    this.relativePath = relative(root, absolutePath);
-    this.mime = mimeTypeFor(extname(absolutePath).toLowerCase());
-  }
-
-  get name(): string {
-    return basename(this.absolutePath);
-  }
-
-  get isText(): boolean {
-    return this.mime.isText;
-  }
-
-  get isLiquid(): boolean {
-    return this.absolutePath.endsWith(".liquid");
-  }
-
-  get isJson(): boolean {
-    return this.absolutePath.endsWith(".json");
-  }
-
-  get exists(): boolean {
-    return existsSync(this.absolutePath);
-  }
-
-  read(): string {
-    return readFileSync(this.absolutePath, "utf-8");
-  }
-
-  readBinary(): Buffer {
-    return readFileSync(this.absolutePath);
-  }
-
-  write(content: string | Buffer): void {
-    mkdirSync(dirname(this.absolutePath), { recursive: true });
-    if (typeof content === "string") {
-      writeFileSync(this.absolutePath, content, "utf-8");
-    } else {
-      writeFileSync(this.absolutePath, content);
-    }
-  }
-
-  checksum(): string {
-    const content = this.isText ? this.read() : this.readBinary();
-    return createHash("sha256").update(content).digest("hex");
-  }
-
-  size(): number {
-    return statSync(this.absolutePath).size;
-  }
-
-  get isTemplate(): boolean {
-    // Page templates (home_page, product, footer, navbar, …) live in top-level
-    // page-type folders and expect blocks as objects. The reserved categories
-    // below either expect blocks as arrays (sections, blocks, components) or
-    // carry no block schema (layouts, config, assets, locales).
-    const parts = this.relativePath.split(/[/\\]/);
-    return parts.length >= 2 && !NON_TEMPLATE_DIRS.has(parts[0]!);
-  }
-
-  validateSchema(): Diagnostic[] {
-    if (!this.isLiquid) return [];
-
-    const blocksSchemaType: BlocksSchemaType = this.isTemplate
-      ? "object"
-      : "array";
-
-    return validateSchemaText(this.read(), { blocksSchemaType });
-  }
-}

package/src/theme/fluid-ignore.ts

@@ -1,64 +0,0 @@
-import { readFileSync, existsSync } from "node:fs";
-import { join, basename } from "node:path";
-
-const IGNORE_FILE = ".fluidignore";
-
-interface Pattern {
-  negated: boolean;
-  pattern: string;
-}
-
-export class FluidIgnore {
-  private patterns: Pattern[];
-
-  constructor(root: string) {
-    this.patterns = this.parse(join(root, IGNORE_FILE));
-  }
-
-  ignore(relativePath: string): boolean {
-    let result = false;
-    for (const { negated, pattern } of this.patterns) {
-      if (this.match(pattern, relativePath)) {
-        result = !negated;
-      }
-    }
-    return result;
-  }
-
-  private parse(filePath: string): Pattern[] {
-    if (!existsSync(filePath)) return [];
-    return readFileSync(filePath, "utf-8")
-      .split("\n")
-      .map((l) => l.trim())
-      .filter((l) => l && !l.startsWith("#"))
-      .map((l) => {
-        const negated = l.startsWith("!");
-        let pattern = negated ? l.slice(1) : l;
-        if (pattern.startsWith("/")) pattern = pattern.slice(1);
-        return { negated, pattern };
-      });
-  }
-
-  private match(pattern: string, path: string): boolean {
-    if (pattern.endsWith("/")) {
-      return path.startsWith(pattern) || path === pattern.slice(0, -1);
-    }
-    if (pattern.includes("/")) {
-      return this.fnmatch(pattern, path);
-    }
-    return this.fnmatch(pattern, path) || this.fnmatch(pattern, basename(path));
-  }
-
-  private fnmatch(pattern: string, str: string): boolean {
-    const re = pattern
-      .split("**")
-      .map((p) =>
-        p
-          .replace(/[.+^${}()|[\]\\]/g, "\\$&")
-          .replace(/\*/g, "[^/]*")
-          .replace(/\?/g, "[^/]"),
-      )
-      .join(".*");
-    return new RegExp(`^${re}$`).test(str);
-  }
-}

package/src/theme/mime-type.ts

@@ -1,45 +0,0 @@
-const TEXT_TYPES: Record<string, string> = {
-  ".liquid": "text/x-liquid",
-  ".json": "application/json",
-  ".css": "text/css",
-  ".js": "application/javascript",
-  ".html": "text/html",
-  ".txt": "text/plain",
-  ".md": "text/markdown",
-  ".svg": "image/svg+xml",
-};
-
-const BINARY_TYPES: Record<string, string> = {
-  ".png": "image/png",
-  ".jpg": "image/jpeg",
-  ".jpeg": "image/jpeg",
-  ".gif": "image/gif",
-  ".webp": "image/webp",
-  ".ico": "image/x-icon",
-  ".woff": "font/woff",
-  ".woff2": "font/woff2",
-  ".ttf": "font/ttf",
-  ".eot": "application/vnd.ms-fontobject",
-  ".otf": "font/otf",
-  ".pdf": "application/pdf",
-  ".zip": "application/zip",
-  ".mp4": "video/mp4",
-  ".webm": "video/webm",
-  ".mp3": "audio/mpeg",
-  ".wav": "audio/wav",
-};
-
-export interface MimeType {
-  name: string;
-  isText: boolean;
-}
-
-export function mimeTypeFor(ext: string): MimeType {
-  const text = TEXT_TYPES[ext];
-  if (text) return { name: text, isText: true };
-
-  const binary = BINARY_TYPES[ext];
-  if (binary) return { name: binary, isText: false };
-
-  return { name: "application/octet-stream", isText: false };
-}

package/src/theme/root.ts

@@ -1,54 +0,0 @@
-import { readdirSync, statSync } from "node:fs";
-import { isAbsolute, join, resolve } from "node:path";
-import { ThemeFile } from "./file.js";
-import { FluidIgnore } from "./fluid-ignore.js";
-
-const THEME_MARKERS = ["templates", "assets", "config"];
-
-export class ThemeRoot {
-  readonly root: string;
-  readonly ignore: FluidIgnore;
-
-  constructor(root: string) {
-    this.root = resolve(root);
-    this.ignore = new FluidIgnore(this.root);
-  }
-
-  isValid(): boolean {
-    return THEME_MARKERS.some((m) => {
-      try {
-        return statSync(join(this.root, m)).isDirectory();
-      } catch {
-        return false;
-      }
-    });
-  }
-
-  files(): ThemeFile[] {
-    return this.glob(this.root).filter(
-      (f) => !this.ignore.ignore(f.relativePath),
-    );
-  }
-
-  file(pathOrFile: string | ThemeFile): ThemeFile {
-    if (pathOrFile instanceof ThemeFile) return pathOrFile;
-    const abs = isAbsolute(pathOrFile)
-      ? pathOrFile
-      : join(this.root, pathOrFile);
-    return new ThemeFile(abs, this.root);
-  }
-
-  private glob(dir: string): ThemeFile[] {
-    const results: ThemeFile[] = [];
-    for (const entry of readdirSync(dir, { withFileTypes: true })) {
-      if (entry.name.startsWith(".")) continue;
-      const full = join(dir, entry.name);
-      if (entry.isDirectory()) {
-        results.push(...this.glob(full));
-      } else if (entry.isFile()) {
-        results.push(new ThemeFile(full, this.root));
-      }
-    }
-    return results;
-  }
-}