@seed-design/cli 0.0.3 → 1.1.0

package/src/tests/resolve-dependencies.test.ts

@@ -0,0 +1,424 @@
+import { describe, it, expect } from "vitest";
+import { resolveDependencies } from "../utils/resolve-dependencies";
+import type { PublicRegistry } from "@/src/schema";
+
+describe("resolveDependencies", () => {
+  it("should resolve a simple item without dependencies", () => {
+    const publicRegistries: PublicRegistry[] = [
+      {
+        id: "ui",
+        items: [
+          {
+            id: "button",
+            description: "Button component",
+            snippets: [{ path: "button.tsx" }],
+          },
+        ],
+      },
+    ];
+
+    const result = resolveDependencies({
+      selectedItemKeys: ["ui:button"],
+      publicRegistries,
+    });
+
+    expect(result.registryItemsToAdd).toHaveLength(1);
+    expect(result.registryItemsToAdd[0]).toEqual({
+      registryId: "ui",
+      items: [
+        {
+          id: "button",
+          description: "Button component",
+          snippets: [{ path: "button.tsx" }],
+        },
+      ],
+    });
+    expect(result.npmDependenciesToAdd.size).toBe(0);
+  });
+
+  it("should resolve npm dependencies", () => {
+    const publicRegistries: PublicRegistry[] = [
+      {
+        id: "ui",
+        items: [
+          {
+            id: "tabs",
+            description: "Tabs component",
+            snippets: [{ path: "tabs.tsx" }],
+            dependencies: ["@seed-design/react-tabs", "clsx"],
+          },
+        ],
+      },
+    ];
+
+    const result = resolveDependencies({
+      selectedItemKeys: ["ui:tabs"],
+      publicRegistries,
+    });
+
+    expect(result.npmDependenciesToAdd.size).toBe(2);
+    expect(result.npmDependenciesToAdd.has("@seed-design/react-tabs")).toBe(true);
+    expect(result.npmDependenciesToAdd.has("clsx")).toBe(true);
+  });
+
+  it("should resolve inner dependencies recursively", () => {
+    const publicRegistries: PublicRegistry[] = [
+      {
+        id: "ui",
+        items: [
+          {
+            id: "dialog",
+            description: "Dialog component",
+            snippets: [{ path: "dialog.tsx" }],
+            innerDependencies: [
+              {
+                registryId: "breeze",
+                itemIds: ["animate-number"],
+              },
+            ],
+          },
+        ],
+      },
+      {
+        id: "breeze",
+        items: [
+          {
+            id: "animate-number",
+            description: "Animate number utility",
+            snippets: [{ path: "animate-number.ts" }],
+            dependencies: ["framer-motion"],
+          },
+        ],
+      },
+    ];
+
+    const result = resolveDependencies({
+      selectedItemKeys: ["ui:dialog"],
+      publicRegistries,
+    });
+
+    expect(result.registryItemsToAdd).toHaveLength(2);
+    expect(result.registryItemsToAdd).toEqual([
+      {
+        registryId: "ui",
+        items: [
+          {
+            id: "dialog",
+            description: "Dialog component",
+            snippets: [{ path: "dialog.tsx" }],
+            innerDependencies: [
+              {
+                registryId: "breeze",
+                itemIds: ["animate-number"],
+              },
+            ],
+          },
+        ],
+      },
+      {
+        registryId: "breeze",
+        items: [
+          {
+            id: "animate-number",
+            description: "Animate number utility",
+            snippets: [{ path: "animate-number.ts" }],
+            dependencies: ["framer-motion"],
+          },
+        ],
+      },
+    ]);
+    expect(result.npmDependenciesToAdd.size).toBe(1);
+    expect(result.npmDependenciesToAdd.has("framer-motion")).toBe(true);
+  });
+
+  it("should handle multiple selected items", () => {
+    const publicRegistries: PublicRegistry[] = [
+      {
+        id: "ui",
+        items: [
+          {
+            id: "button",
+            description: "Button component",
+            snippets: [{ path: "button.tsx" }],
+          },
+          {
+            id: "chip",
+            description: "Chip component",
+            snippets: [{ path: "chip.tsx" }],
+          },
+        ],
+      },
+    ];
+
+    const result = resolveDependencies({
+      selectedItemKeys: ["ui:button", "ui:chip"],
+      publicRegistries,
+    });
+
+    expect(result.registryItemsToAdd).toHaveLength(1);
+    expect(result.registryItemsToAdd[0].registryId).toBe("ui");
+    expect(result.registryItemsToAdd[0].items).toHaveLength(2);
+    expect(result.registryItemsToAdd[0].items.map((i) => i.id)).toEqual(["button", "chip"]);
+  });
+
+  it("should prevent duplicate items", () => {
+    const publicRegistries: PublicRegistry[] = [
+      {
+        id: "ui",
+        items: [
+          {
+            id: "dialog",
+            description: "Dialog component",
+            snippets: [{ path: "dialog.tsx" }],
+            innerDependencies: [
+              {
+                registryId: "ui",
+                itemIds: ["button"],
+              },
+            ],
+          },
+          {
+            id: "button",
+            description: "Button component",
+            snippets: [{ path: "button.tsx" }],
+          },
+        ],
+      },
+    ];
+
+    // Select both dialog and button, but button is already a dependency of dialog
+    const result = resolveDependencies({
+      selectedItemKeys: ["ui:dialog", "ui:button"],
+      publicRegistries,
+    });
+
+    expect(result.registryItemsToAdd).toHaveLength(1);
+    expect(result.registryItemsToAdd[0].items).toHaveLength(2);
+    // Button should appear only once
+    const buttonCount = result.registryItemsToAdd[0].items.filter((i) => i.id === "button").length;
+    expect(buttonCount).toBe(1);
+  });
+
+  it("should handle nested inner dependencies", () => {
+    const publicRegistries: PublicRegistry[] = [
+      {
+        id: "ui",
+        items: [
+          {
+            id: "complex",
+            description: "Complex component",
+            snippets: [{ path: "complex.tsx" }],
+            innerDependencies: [
+              {
+                registryId: "ui",
+                itemIds: ["dialog"],
+              },
+            ],
+          },
+          {
+            id: "dialog",
+            description: "Dialog component",
+            snippets: [{ path: "dialog.tsx" }],
+            innerDependencies: [
+              {
+                registryId: "breeze",
+                itemIds: ["animate"],
+              },
+            ],
+          },
+        ],
+      },
+      {
+        id: "breeze",
+        items: [
+          {
+            id: "animate",
+            description: "Animate utility",
+            snippets: [{ path: "animate.ts" }],
+            innerDependencies: [
+              {
+                registryId: "lib",
+                itemIds: ["utils"],
+              },
+            ],
+          },
+        ],
+      },
+      {
+        id: "lib",
+        items: [
+          {
+            id: "utils",
+            description: "Utility functions",
+            snippets: [{ path: "utils.ts" }],
+            dependencies: ["lodash"],
+          },
+        ],
+      },
+    ];
+
+    const result = resolveDependencies({
+      selectedItemKeys: ["ui:complex"],
+      publicRegistries,
+    });
+
+    expect(result.registryItemsToAdd).toHaveLength(3);
+    expect(result.registryItemsToAdd.map((r) => r.registryId)).toEqual(["ui", "breeze", "lib"]);
+    expect(result.npmDependenciesToAdd.size).toBe(1);
+    expect(result.npmDependenciesToAdd.has("lodash")).toBe(true);
+  });
+
+  it("should throw error for invalid snippet format", () => {
+    const publicRegistries: PublicRegistry[] = [];
+
+    expect(() =>
+      resolveDependencies({
+        selectedItemKeys: ["invalid-format"],
+        publicRegistries,
+      }),
+    ).toThrowError('Invalid snippet format: "invalid-format"');
+  });
+
+  it("should throw error for non-existent snippet", () => {
+    const publicRegistries: PublicRegistry[] = [
+      {
+        id: "ui",
+        items: [],
+      },
+    ];
+
+    expect(() =>
+      resolveDependencies({
+        selectedItemKeys: ["ui:non-existent"],
+        publicRegistries,
+      }),
+    ).toThrowError('Cannot find snippet: "ui:non-existent"');
+  });
+
+  it("should throw error for missing inner dependency", () => {
+    const publicRegistries: PublicRegistry[] = [
+      {
+        id: "ui",
+        items: [
+          {
+            id: "broken",
+            description: "Broken component",
+            snippets: [{ path: "broken.tsx" }],
+            innerDependencies: [
+              {
+                registryId: "breeze",
+                itemIds: ["missing"],
+              },
+            ],
+          },
+        ],
+      },
+      {
+        id: "breeze",
+        items: [],
+      },
+    ];
+
+    expect(() =>
+      resolveDependencies({
+        selectedItemKeys: ["ui:broken"],
+        publicRegistries,
+      }),
+    ).toThrowError("Cannot find dependency item: breeze:missing");
+  });
+
+  it("should handle multiple registries with multiple items", () => {
+    const publicRegistries: PublicRegistry[] = [
+      {
+        id: "ui",
+        items: [
+          {
+            id: "button",
+            description: "Button component",
+            snippets: [{ path: "button.tsx" }],
+            dependencies: ["clsx"],
+          },
+          {
+            id: "chip",
+            description: "Chip component",
+            snippets: [{ path: "chip.tsx" }],
+          },
+        ],
+      },
+      {
+        id: "breeze",
+        items: [
+          {
+            id: "animate",
+            description: "Animate utility",
+            snippets: [{ path: "animate.ts" }],
+            dependencies: ["framer-motion"],
+          },
+        ],
+      },
+    ];
+
+    const result = resolveDependencies({
+      selectedItemKeys: ["ui:button", "breeze:animate", "ui:chip"],
+      publicRegistries,
+    });
+
+    expect(result.registryItemsToAdd).toHaveLength(2);
+
+    const uiRegistry = result.registryItemsToAdd.find((r) => r.registryId === "ui");
+    expect(uiRegistry?.items).toHaveLength(2);
+    expect(uiRegistry?.items.map((i) => i.id)).toEqual(["button", "chip"]);
+
+    const breezeRegistry = result.registryItemsToAdd.find((r) => r.registryId === "breeze");
+    expect(breezeRegistry?.items).toHaveLength(1);
+    expect(breezeRegistry?.items[0].id).toBe("animate");
+
+    expect(result.npmDependenciesToAdd.size).toBe(2);
+    expect(result.npmDependenciesToAdd.has("clsx")).toBe(true);
+    expect(result.npmDependenciesToAdd.has("framer-motion")).toBe(true);
+  });
+
+  it("should collect all npm dependencies from nested dependencies", () => {
+    const publicRegistries: PublicRegistry[] = [
+      {
+        id: "ui",
+        items: [
+          {
+            id: "rich",
+            description: "Rich component",
+            snippets: [{ path: "rich.tsx" }],
+            dependencies: ["react-hook-form"],
+            innerDependencies: [
+              {
+                registryId: "ui",
+                itemIds: ["field", "label"],
+              },
+            ],
+          },
+          {
+            id: "field",
+            description: "Field component",
+            snippets: [{ path: "field.tsx" }],
+            dependencies: ["clsx", "tailwind-merge"],
+          },
+          {
+            id: "label",
+            description: "Label component",
+            snippets: [{ path: "label.tsx" }],
+            dependencies: ["clsx"],
+          },
+        ],
+      },
+    ];
+
+    const result = resolveDependencies({
+      selectedItemKeys: ["ui:rich"],
+      publicRegistries,
+    });
+
+    expect(result.npmDependenciesToAdd.size).toBe(3);
+    expect(result.npmDependenciesToAdd.has("react-hook-form")).toBe(true);
+    expect(result.npmDependenciesToAdd.has("clsx")).toBe(true);
+    expect(result.npmDependenciesToAdd.has("tailwind-merge")).toBe(true);
+  });
+});

package/src/utils/analytics.ts

@@ -0,0 +1,119 @@
+import { randomUUID } from "node:crypto";
+import * as p from "@clack/prompts";
+import { getConfig } from "./get-config";
+
+const EVENT_PREFIX = "seed_cli";
+
+interface TrackOptions {
+  event: string;
+  properties?: Record<string, unknown>;
+}
+
+/**
+ * 텔레메트리 활성화 여부를 확인합니다.
+ * 우선순위:
+ * 1. 환경 변수 DISABLE_TELEMETRY
+ * 2. 환경 변수 SEED_DISABLE_TELEMETRY
+ * 3. seed-design.json의 telemetry 설정
+ * 4. 기본값 true (Opt-out)
+ */
+async function isTelemetryEnabled(cwd: string): Promise<boolean> {
+  // 1. 환경 변수 체크
+  if (process.env.DISABLE_TELEMETRY === "true") return false;
+  if (process.env.SEED_DISABLE_TELEMETRY === "true") return false;
+
+  // 2. seed-design.json 체크
+  try {
+    const config = await getConfig(cwd);
+    if (config?.telemetry === false) return false;
+  } catch {
+    // 설정 파일이 없거나 읽기 실패 시 기본값 사용
+  }
+
+  // 3. 기본값
+  return true;
+}
+
+/**
+ * 익명 세션 ID를 생성합니다.
+ * 각 CLI 실행마다 새로운 UUID가 생성됩니다.
+ */
+function generateSessionId(): string {
+  return randomUUID();
+}
+
+// 세션당 한 번만 생성
+const sessionId = generateSessionId();
+
+// 세션당 한 번만 메시지 표시
+let hasShownMessage = false;
+
+/**
+ * PostHog에 이벤트를 전송합니다.
+ */
+async function track(cwd: string, { event, properties = {} }: TrackOptions): Promise<void> {
+  const enabled = await isTelemetryEnabled(cwd);
+
+  if (!enabled) {
+    return;
+  }
+
+  const fullEvent = `${EVENT_PREFIX}.${event}`;
+
+  // Dev 모드: 콘솔에만 출력
+  if (process.env.NODE_ENV === "dev") {
+    console.log(`📊 [Telemetry] ${fullEvent}`, properties);
+    return;
+  }
+
+  // 사용자에게 텔레메트리 수집 중임을 알림 (세션당 한 번만)
+  if (!hasShownMessage) {
+    p.log.info(
+      "📊 사용 데이터 수집 중 (비활성화: seed-design.json 또는 DISABLE_TELEMETRY 환경 변수)",
+    );
+    hasShownMessage = true;
+  }
+
+  // PostHog API 호출 (fire-and-forget)
+  try {
+    if (!process.env.POSTHOG_HOST || !process.env.POSTHOG_API_KEY) {
+      console.warn("[Analytics] Missing POSTHOG_HOST or POSTHOG_API_KEY");
+      return;
+    }
+
+    const url = `${process.env.POSTHOG_HOST}/capture`;
+    const headers = {
+      "Content-Type": "application/json",
+    };
+
+    const payload = {
+      api_key: process.env.POSTHOG_API_KEY,
+      event: fullEvent,
+      distinct_id: sessionId,
+      properties: {
+        ...properties,
+        $process_person_profile: false,
+      },
+      timestamp: new Date().toISOString(),
+    };
+    // 5초 타임아웃 설정
+    const controller = new AbortController();
+    const timeout = setTimeout(() => controller.abort(), 5000);
+    try {
+      await fetch(url, {
+        method: "POST",
+        headers,
+        body: JSON.stringify(payload),
+        signal: controller.signal,
+      });
+    } finally {
+      clearTimeout(timeout);
+    }
+  } catch {
+    // 에러 발생 시 조용히 무시 (CLI 블로킹 방지)
+  }
+}
+
+export const analytics = {
+  track,
+};

package/src/utils/fetch.ts

@@ -0,0 +1,122 @@
+import type { PublicRegistry } from "@/src/schema";
+
+import * as p from "@clack/prompts";
+import {
+  type PublicRegistryItem,
+  publicRegistrySchema,
+  publicRegistryItemSchema,
+  type PublicAvailableRegistries,
+  publicAvailableRegistriesSchema,
+} from "@/src/schema";
+
+export async function fetchAvailableRegistries({
+  baseUrl,
+}: {
+  baseUrl: string;
+}): Promise<PublicAvailableRegistries> {
+  // TODO: make this file public
+  const response = await fetch(`${baseUrl}/__registry__/index.json`);
+
+  if (!response.ok)
+    throw new Error(`Failed to fetch registries: ${response.status} ${response.statusText}`);
+
+  const registries = await response.json();
+  const {
+    success,
+    data: parsedRegistries,
+    error,
+  } = publicAvailableRegistriesSchema.safeParse(registries);
+
+  if (!success) throw new Error(`Failed to parse registries: ${error?.message}`);
+
+  return parsedRegistries;
+}
+
+export async function fetchRegistry({
+  baseUrl,
+  registryId,
+}: {
+  baseUrl: string;
+  registryId: PublicRegistry["id"];
+}): Promise<PublicRegistry> {
+  const response = await fetch(`${baseUrl}/__registry__/${registryId}/index.json`);
+
+  if (!response.ok)
+    throw new Error(
+      `Failed to fetch ${registryId} registry: ${response.status} ${response.statusText}`,
+    );
+
+  const index = await response.json();
+  const { success, data: parsedIndex, error } = publicRegistrySchema.safeParse(index);
+
+  if (!success) throw new Error(`Failed to parse ${registryId} registry: ${error?.message}`);
+
+  return parsedIndex;
+}
+
+async function fetchRegistryItem({
+  baseUrl,
+  registryId,
+  registryItemId,
+}: {
+  baseUrl: string;
+  registryId: PublicRegistry["id"];
+  registryItemId: PublicRegistryItem["id"];
+}): Promise<PublicRegistryItem> {
+  const response = await fetch(`${baseUrl}/__registry__/${registryId}/${registryItemId}.json`);
+
+  if (!response.ok) {
+    throw new Error(`Failed to fetch ${registryItemId}: ${response.status} ${response.statusText}`);
+  }
+
+  const item = await response.json();
+  const { success, data: parsedItem, error } = publicRegistryItemSchema.safeParse(item);
+
+  if (!success) {
+    throw new Error(`Failed to parse ${registryItemId}: ${error?.message}`);
+  }
+
+  return parsedItem;
+}
+
+export async function fetchRegistryItems({
+  baseUrl,
+  registryId,
+  registryItemIds,
+}: {
+  baseUrl: string;
+  registryId: PublicRegistry["id"];
+  registryItemIds: PublicRegistryItem["id"][];
+}): Promise<PublicRegistryItem[]> {
+  return await Promise.all(
+    registryItemIds.map(async (itemId) => {
+      try {
+        return await fetchRegistryItem({ baseUrl, registryId, registryItemId: itemId });
+      } catch (error) {
+        // show available registry items in the registry
+        const response = await fetch(`${baseUrl}/__registry__/${registryId}/index.json`);
+
+        if (!response.ok)
+          throw new Error(
+            `${registryId} 레지스트리를 가져오지 못했어요: ${response.status} ${response.statusText}`,
+          );
+
+        const index = await response.json();
+        const { success, data: parsedIndex } = publicRegistrySchema.safeParse(index);
+
+        // fatal, should not happen
+        if (!success) throw new Error(`Failed to parse registry index for ${registryId}`);
+
+        p.log.error(`${itemId} 스니펫이 ${registryId} 레지스트리에 없어요.`);
+        p.log.info(
+          `${registryId} 레지스트리에 존재하는 스니펫:\n${parsedIndex.items
+            .map((component) => component.id)
+            .join("\n")}`,
+        );
+
+        // so fetchRegistryItems also can throw
+        throw error;
+      }
+    }),
+  );
+}